@pascal-app/viewer 0.1.11 → 0.1.13

package/dist/components/renderers/ceiling/ceiling-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ceiling-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/ceiling/ceiling-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAe,MAAM,kBAAkB,CAAA;AAoBhE,eAAO,MAAM,eAAe,GAAI,UAAU;IAAE,IAAI,EAAE,WAAW,CAAA;CAAE,4CAe9D,CAAA"}
+{"version":3,"file":"ceiling-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/ceiling/ceiling-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAe,MAAM,kBAAkB,CAAA;AAuChE,eAAO,MAAM,eAAe,GAAI,UAAU;IAAE,IAAI,EAAE,WAAW,CAAA;CAAE,4CAe9D,CAAA"}

package/dist/components/renderers/ceiling/ceiling-renderer.js

@@ -1,21 +1,35 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRegistry } from '@pascal-app/core';
 import { useRef } from 'react';
-import { faceDirection, float, mix } from 'three/tsl';
-import { DoubleSide, MeshStandardNodeMaterial } from 'three/webgpu';
+import { faceDirection, float, mix, positionWorld, smoothstep } from 'three/tsl';
+import { DoubleSide, MeshBasicNodeMaterial } from 'three/webgpu';
 import { useNodeEvents } from '../../../hooks/use-node-events';
 import { NodeRenderer } from '../node-renderer';
 // TSL material that renders differently based on face direction:
 // - Back face (looking up at ceiling from below): solid
 // - Front face (looking down at ceiling from above): 30% opacity
-const ceilingMaterial = new MeshStandardNodeMaterial({
-    color: 0xffffff,
+const ceilingMaterial = new MeshBasicNodeMaterial({
+    color: 0x999999,
     side: DoubleSide,
     transparent: true,
+    depthWrite: false,
 });
+// Create grid pattern based on local position
+const gridScale = 5; // Grid cells per meter (1 = 1m grid)
+const gridX = positionWorld.x.mul(gridScale).fract();
+const gridY = positionWorld.z.mul(gridScale).fract();
+// Create grid lines - they are at 0 and 1
+const lineWidth = 0.05; // Width of grid lines (0-1 range within cell)
+// Create visible lines at edges (near 0 and near 1)
+const lineX = smoothstep(lineWidth, 0, gridX).add(smoothstep(1.0 - lineWidth, 1.0, gridX));
+const lineY = smoothstep(lineWidth, 0, gridY).add(smoothstep(1.0 - lineWidth, 1.0, gridY));
+// Combine: if either X or Y is a line, show the line
+const gridPattern = lineX.max(lineY);
+// Grid lines at 0.8 opacity, spaces at 0.1 opacity
+const gridOpacity = mix(float(0.1), float(0.8), gridPattern);
 // faceDirection is 1.0 for front face, -1.0 for back face
-// We want: front face (top, looking down) = 0.3 opacity, back face (bottom, looking up) = 1.0 opacity
-ceilingMaterial.opacityNode = mix(float(1.0), float(0.3), faceDirection.greaterThan(0.0));
+// Front face (top, looking down): grid pattern, Back face (bottom, looking up): solid
+ceilingMaterial.opacityNode = mix(float(1.0), gridOpacity, faceDirection.greaterThan(0.0));
 export const CeilingRenderer = ({ node }) => {
     const ref = useRef(null);
     useRegistry(node.id, 'ceiling', ref);

package/dist/components/renderers/item/item-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"item-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/item/item-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,QAAQ,EAAyB,MAAM,kBAAkB,CAAA;AAkCvF,eAAO,MAAM,YAAY,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,4CAYxD,CAAA"}
+{"version":3,"file":"item-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/item/item-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,QAAQ,EAAyB,MAAM,kBAAkB,CAAA;AAoCvF,eAAO,MAAM,YAAY,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,4CAexD,CAAA"}

package/dist/components/renderers/item/item-renderer.js

@@ -1,11 +1,13 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRegistry, useScene } from '@pascal-app/core';
 import { Clone } from '@react-three/drei/core/Clone';
 import { useGLTF } from '@react-three/drei/core/Gltf';
 import { Suspense, useEffect, useMemo, useRef } from 'react';
+import { positionLocal, smoothstep, time } from 'three/tsl';
 import { DoubleSide, MeshStandardNodeMaterial } from 'three/webgpu';
-import { resolveCdnUrl } from '../../../lib/asset-url';
 import { useNodeEvents } from '../../../hooks/use-node-events';
+import { resolveCdnUrl } from '../../../lib/asset-url';
+import { NodeRenderer } from '../node-renderer';
 // Shared materials to avoid creating new instances for every mesh
 const defaultMaterial = new MeshStandardNodeMaterial({
     color: 0xffffff,
@@ -31,7 +33,19 @@ const getMaterialForOriginal = (original) => {
 export const ItemRenderer = ({ node }) => {
     const ref = useRef(null);
     useRegistry(node.id, node.type, ref);
-    return (_jsx("group", { position: node.position, rotation: node.rotation, ref: ref, visible: node.visible, children: _jsx(Suspense, { children: _jsx(ModelRenderer, { node: node }) }) }));
+    return (_jsxs("group", { position: node.position, rotation: node.rotation, ref: ref, visible: node.visible, children: [_jsx(Suspense, { fallback: _jsx(PreviewModel, { node: node }), children: _jsx(ModelRenderer, { node: node }) }), node.children?.map((childId) => (_jsx(NodeRenderer, { nodeId: childId }, childId)))] }));
+};
+const previewMaterial = new MeshStandardNodeMaterial({
+    color: '#cccccc',
+    roughness: 1,
+    metalness: 0,
+    depthTest: false,
+});
+const previewOpacity = smoothstep(0.42, 0.55, positionLocal.y.add(time.mul(-0.2)).mul(10).fract());
+previewMaterial.opacityNode = previewOpacity;
+previewMaterial.transparent = true;
+const PreviewModel = ({ node }) => {
+    return (_jsx("mesh", { "position-y": node.asset.dimensions[1] / 2, material: previewMaterial, children: _jsx("boxGeometry", { args: [node.asset.dimensions[0], node.asset.dimensions[1], node.asset.dimensions[2]] }) }));
 };
 const ModelRenderer = ({ node }) => {
     const { scene, nodes } = useGLTF(resolveCdnUrl(node.asset.src) || '');

package/dist/components/renderers/node-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"node-renderer.d.ts","sourceRoot":"","sources":["../../../src/components/renderers/node-renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,OAAO,EAAY,MAAM,kBAAkB,CAAA;AAazD,eAAO,MAAM,YAAY,GAAI,YAAY;IAAE,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,CAAA;CAAE,mDAoBjE,CAAA"}
+{"version":3,"file":"node-renderer.d.ts","sourceRoot":"","sources":["../../../src/components/renderers/node-renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,OAAO,EAAY,MAAM,kBAAkB,CAAA;AAczD,eAAO,MAAM,YAAY,GAAI,YAAY;IAAE,MAAM,EAAE,OAAO,CAAC,IAAI,CAAC,CAAA;CAAE,mDAqBjE,CAAA"}

package/dist/components/renderers/node-renderer.js

@@ -11,10 +11,11 @@ import { ScanRenderer } from './scan/scan-renderer';
 import { SiteRenderer } from './site/site-renderer';
 import { SlabRenderer } from './slab/slab-renderer';
 import { WallRenderer } from './wall/wall-renderer';
+import { WindowRenderer } from './window/window-renderer';
 import { ZoneRenderer } from './zone/zone-renderer';
 export const NodeRenderer = ({ nodeId }) => {
     const node = useScene((state) => state.nodes[nodeId]);
     if (!node)
         return null;
-    return (_jsxs(_Fragment, { children: [node.type === 'site' && _jsx(SiteRenderer, { node: node }), node.type === 'building' && _jsx(BuildingRenderer, { node: node }), node.type === 'ceiling' && _jsx(CeilingRenderer, { node: node }), node.type === 'level' && _jsx(LevelRenderer, { node: node }), node.type === 'item' && _jsx(ItemRenderer, { node: node }), node.type === 'slab' && _jsx(SlabRenderer, { node: node }), node.type === 'wall' && _jsx(WallRenderer, { node: node }), node.type === 'zone' && _jsx(ZoneRenderer, { node: node }), node.type === 'roof' && _jsx(RoofRenderer, { node: node }), node.type === 'scan' && _jsx(ScanRenderer, { node: node }), node.type === 'guide' && _jsx(GuideRenderer, { node: node })] }));
+    return (_jsxs(_Fragment, { children: [node.type === 'site' && _jsx(SiteRenderer, { node: node }), node.type === 'building' && _jsx(BuildingRenderer, { node: node }), node.type === 'ceiling' && _jsx(CeilingRenderer, { node: node }), node.type === 'level' && _jsx(LevelRenderer, { node: node }), node.type === 'item' && _jsx(ItemRenderer, { node: node }), node.type === 'slab' && _jsx(SlabRenderer, { node: node }), node.type === 'wall' && _jsx(WallRenderer, { node: node }), node.type === 'window' && _jsx(WindowRenderer, { node: node }), node.type === 'zone' && _jsx(ZoneRenderer, { node: node }), node.type === 'roof' && _jsx(RoofRenderer, { node: node }), node.type === 'scan' && _jsx(ScanRenderer, { node: node }), node.type === 'guide' && _jsx(GuideRenderer, { node: node })] }));
 };

package/dist/components/renderers/site/site-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"site-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/site/site-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAe,MAAM,kBAAkB,CAAA;AAgC7D,eAAO,MAAM,YAAY,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,mDAsExD,CAAA"}
+{"version":3,"file":"site-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/site/site-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAe,MAAM,kBAAkB,CAAA;AAiC7D,eAAO,MAAM,YAAY,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,mDAwFxD,CAAA"}

package/dist/components/renderers/site/site-renderer.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRegistry } from '@pascal-app/core';
+import { Html } from '@react-three/drei';
 import { useMemo, useRef } from 'react';
-import { BufferGeometry, DoubleSide, Float32BufferAttribute, Shape } from 'three';
+import { BufferGeometry, Float32BufferAttribute, Shape } from 'three';
 import { useNodeEvents } from '../../../hooks/use-node-events';
 import { NodeRenderer } from '../node-renderer';
 const Y_OFFSET = 0.01;
@@ -49,9 +50,22 @@ export const SiteRenderer = ({ node }) => {
             return null;
         return createBoundaryLineGeometry(node.polygon.points);
     }, [node?.polygon?.points]);
+    // Edge distances for labels
+    const edges = useMemo(() => {
+        const polygon = node?.polygon?.points ?? [];
+        if (polygon.length < 2)
+            return [];
+        return polygon.map(([x1, z1], i) => {
+            const [x2, z2] = polygon[(i + 1) % polygon.length];
+            const midX = (x1 + x2) / 2;
+            const midZ = (z1 + z2) / 2;
+            const dist = Math.sqrt((x2 - x1) ** 2 + (z2 - z1) ** 2);
+            return { midX, midZ, dist };
+        });
+    }, [node?.polygon?.points]);
     const handlers = useNodeEvents(node, 'site');
     if (!node || !floorShape || !lineGeometry) {
         return null;
     }
-    return (_jsxs("group", { ref: ref, ...handlers, children: [node.children.map((child) => (_jsx(NodeRenderer, { nodeId: typeof child === 'string' ? child : child.id }, typeof child === 'string' ? child : child.id))), _jsxs("mesh", { position: [0, Y_OFFSET - 0.005, 0], rotation: [-Math.PI / 2, 0, 0], children: [_jsx("shapeGeometry", { args: [floorShape] }), _jsx("meshBasicMaterial", { color: "#f59e0b", transparent: true, opacity: 0.05, side: DoubleSide, depthWrite: false })] }), _jsx("line", { geometry: lineGeometry, frustumCulled: false, renderOrder: 9, children: _jsx("lineBasicMaterial", { color: "#f59e0b", linewidth: 2, transparent: true, opacity: 0.6 }) })] }));
+    return (_jsxs("group", { ref: ref, ...handlers, children: [node.children.map((child) => (_jsx(NodeRenderer, { nodeId: typeof child === 'string' ? child : child.id }, typeof child === 'string' ? child : child.id))), _jsxs("mesh", { position: [0, Y_OFFSET - 0.005, 0], rotation: [-Math.PI / 2, 0, 0], receiveShadow: true, children: [_jsx("shapeGeometry", { args: [floorShape] }), _jsx("shadowMaterial", { transparent: true, opacity: 0.75 })] }), _jsx("line", { geometry: lineGeometry, frustumCulled: false, renderOrder: 9, children: _jsx("lineBasicMaterial", { color: "#f59e0b", linewidth: 2, transparent: true, opacity: 0.6 }) }), edges.map((edge, i) => (_jsx(Html, { center: true, position: [edge.midX, 0.5, edge.midZ], style: { pointerEvents: 'none', userSelect: 'none' }, zIndexRange: [10, 0], occlude: true, children: _jsxs("div", { className: "whitespace-nowrap rounded bg-black/75 px-1.5 py-0.5 font-mono text-white text-xs backdrop-blur-sm", children: [edge.dist.toFixed(2), "m"] }) }, `edge-${i}`)))] }));
 };

package/dist/components/renderers/window/window-renderer.d.ts

@@ -0,0 +1,5 @@
+import { type WindowNode } from '@pascal-app/core';
+export declare const WindowRenderer: ({ node }: {
+    node: WindowNode;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=window-renderer.d.ts.map

package/dist/components/renderers/window/window-renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"window-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/window/window-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAK/D,eAAO,MAAM,cAAc,GAAI,UAAU;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,4CAqB5D,CAAA"}

package/dist/components/renderers/window/window-renderer.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRegistry } from '@pascal-app/core';
+import { useRef } from 'react';
+import { useNodeEvents } from '../../../hooks/use-node-events';
+export const WindowRenderer = ({ node }) => {
+    const ref = useRef(null);
+    useRegistry(node.id, 'window', ref);
+    const handlers = useNodeEvents(node, 'window');
+    return (_jsxs("mesh", { ref: ref, castShadow: true, receiveShadow: true, visible: node.visible, position: node.position, rotation: node.rotation, ...handlers, children: [_jsx("boxGeometry", { args: [0, 0, 0] }), _jsx("meshStandardMaterial", { color: "#d1d5db" })] }));
+};

package/dist/components/renderers/zone/zone-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"zone-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/zone/zone-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAkG7D,eAAO,MAAM,YAAY,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,mDAmGxD,CAAA"}
+{"version":3,"file":"zone-renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/renderers/zone/zone-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAwG7D,eAAO,MAAM,YAAY,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,mDAoGxD,CAAA"}

package/dist/components/renderers/zone/zone-renderer.js

@@ -3,7 +3,7 @@ import { useRegistry } from '@pascal-app/core';
 import { Html } from '@react-three/drei';
 import { useMemo, useRef } from 'react';
 import { BufferGeometry, Color, DoubleSide, Float32BufferAttribute, Shape } from 'three';
-import { color, float, uv } from 'three/tsl';
+import { color, float, uniform, uv } from 'three/tsl';
 import { MeshBasicNodeMaterial } from 'three/webgpu';
 import { useNodeEvents } from '../../../hooks/use-node-events';
 const Y_OFFSET = 0.01;
@@ -16,15 +16,19 @@ const createWallGradientMaterial = (zoneColor) => {
     const baseColor = color(new Color(zoneColor));
     // Use UV y coordinate for vertical gradient (0 at bottom, 1 at top)
     const gradientT = uv().y;
+    const opacity = uniform(0);
     // Fade opacity from 0.6 at bottom to 0 at top
-    const opacity = float(0.6).mul(float(1).sub(gradientT));
+    const finalOpacity = float(0.6).mul(float(1).sub(gradientT)).mul(opacity);
     return new MeshBasicNodeMaterial({
         transparent: true,
         colorNode: baseColor,
-        opacityNode: opacity,
+        opacityNode: finalOpacity,
         side: DoubleSide,
         depthWrite: false,
         depthTest: false,
+        userData: {
+            uOpacity: opacity,
+        }
     });
 };
 /**
@@ -32,12 +36,15 @@ const createWallGradientMaterial = (zoneColor) => {
  */
 const createFloorMaterial = (zoneColor) => {
     const baseColor = color(new Color(zoneColor));
+    const opacity = uniform(0);
     return new MeshBasicNodeMaterial({
         transparent: true,
         colorNode: baseColor,
-        opacityNode: float(0.15),
+        opacityNode: float(0.25).mul(opacity),
         side: DoubleSide,
         depthWrite: false,
+        depthTest: false,
+        userData: { uOpacity: opacity }
     });
 };
 /**
@@ -142,7 +149,7 @@ export const ZoneRenderer = ({ node }) => {
     }
     return (_jsxs("group", { ref: ref, ...handlers, children: [_jsx(Html, { name: "label", position: [centroid[0], 1, centroid[1]], style: {
                     pointerEvents: 'none'
-                }, children: _jsx("div", { style: {
+                }, zIndexRange: [10, 0], children: _jsx("div", { style: {
                         transform: 'translate3d(-50%, -50%, 0)',
                         width: 'max-content',
                         color: 'white',
@@ -150,5 +157,5 @@ export const ZoneRenderer = ({ node }) => {
                         display: 'flex',
                         gap: '8px',
                         alignItems: 'center',
-                    }, children: node.name }) }), _jsx("mesh", { position: [0, Y_OFFSET, 0], rotation: [-Math.PI / 2, 0, 0], material: floorMaterial, children: _jsx("shapeGeometry", { args: [floorShape] }) }), _jsx("mesh", { geometry: wallGeometry, material: wallMaterial })] }));
+                    }, children: node.name }) }), _jsx("mesh", { position: [0, Y_OFFSET, 0], rotation: [-Math.PI / 2, 0, 0], material: floorMaterial, name: "floor", children: _jsx("shapeGeometry", { args: [floorShape] }) }), _jsx("mesh", { geometry: wallGeometry, material: wallMaterial, name: "walls" })] }));
 };

package/dist/components/viewer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/viewer/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAkB,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAA;AAC5E,OAAO,KAAK,KAAK,MAAM,cAAc,CAAA;AAWrC,OAAO,QAAQ,oBAAoB,CAAC;IAClC,UAAU,aAAc,SAAQ,kBAAkB,CAAC,OAAO,KAAK,CAAC;KAAG;CACpE;AAID,UAAU,WAAW;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,gBAAgB,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;CACxC;AAED,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA4CjC,CAAA;AAED,eAAe,MAAM,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/viewer/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAkB,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAA;AAC5E,OAAO,KAAK,KAAK,MAAM,cAAc,CAAA;AAYrC,OAAO,QAAQ,oBAAoB,CAAC;IAClC,UAAU,aAAc,SAAQ,kBAAkB,CAAC,OAAO,KAAK,CAAC;KAAG;CACpE;AAID,UAAU,WAAW;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,gBAAgB,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAA;CACxC;AAED,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA+CjC,CAAA;AAED,eAAe,MAAM,CAAA"}

package/dist/components/viewer/index.js

@@ -1,6 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CeilingSystem, ItemSystem, RoofSystem, SlabSystem, WallSystem } from '@pascal-app/core';
+import { CeilingSystem, ItemSystem, RoofSystem, SlabSystem, WallSystem, WindowSystem } from '@pascal-app/core';
 import { Bvh } from '@react-three/drei';
 import { Canvas, extend } from '@react-three/fiber';
 import * as THREE from 'three/webgpu';
@@ -8,6 +8,7 @@ import { GuideSystem } from '../../systems/guide/guide-system';
 import { LevelSystem } from '../../systems/level/level-system';
 import { ScanSystem } from '../../systems/scan/scan-system';
 import { WallCutout } from '../../systems/wall/wall-cutout';
+import { ZoneSystem } from '../../systems/zone/zone-system';
 import { SceneRenderer } from '../renderers/scene-renderer';
 import { Lights } from './lights';
 import PostProcessing from './post-processing';
@@ -15,7 +16,7 @@ import { SelectionManager } from './selection-manager';
 import { ViewerCamera } from './viewer-camera';
 extend(THREE);
 const Viewer = ({ children, selectionManager = 'default' }) => {
-    return (_jsxs(Canvas, { className: 'bg-[#fafafa]', gl: async (props) => {
+    return (_jsxs(Canvas, { dpr: [1, 1.5], className: 'bg-[#fafafa]', gl: async (props) => {
             const renderer = new THREE.WebGPURenderer(props);
             await renderer.init();
             renderer.toneMapping = THREE.ACESFilmicToneMapping;
@@ -24,6 +25,6 @@ const Viewer = ({ children, selectionManager = 'default' }) => {
         }, shadows: {
             type: THREE.PCFShadowMap,
             enabled: true,
-        }, camera: { position: [50, 50, 50], fov: 50 }, children: [_jsx("color", { attach: "background", args: ['#fafafa'] }), _jsx(ViewerCamera, {}), _jsx(Lights, {}), _jsx(Bvh, { children: _jsx(SceneRenderer, {}) }), _jsx(LevelSystem, {}), _jsx(GuideSystem, {}), _jsx(ScanSystem, {}), _jsx(WallCutout, {}), _jsx(CeilingSystem, {}), _jsx(ItemSystem, {}), _jsx(RoofSystem, {}), _jsx(SlabSystem, {}), _jsx(WallSystem, {}), _jsx(PostProcessing, {}), selectionManager === 'default' && _jsx(SelectionManager, {}), children] }));
+        }, camera: { position: [50, 50, 50], fov: 50 }, children: [_jsx("color", { attach: "background", args: ['#fafafa'] }), _jsx(ViewerCamera, {}), _jsx(Lights, {}), _jsx(Bvh, { children: _jsx(SceneRenderer, {}) }), _jsx(LevelSystem, {}), _jsx(GuideSystem, {}), _jsx(ScanSystem, {}), _jsx(WallCutout, {}), _jsx(CeilingSystem, {}), _jsx(ItemSystem, {}), _jsx(RoofSystem, {}), _jsx(SlabSystem, {}), _jsx(WallSystem, {}), _jsx(WindowSystem, {}), _jsx(ZoneSystem, {}), _jsx(PostProcessing, {}), selectionManager === 'default' && _jsx(SelectionManager, {}), children] }));
 };
 export default Viewer;

package/dist/components/viewer/post-processing.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"post-processing.d.ts","sourceRoot":"","sources":["../../../src/components/viewer/post-processing.tsx"],"names":[],"mappings":"AA0BA,eAAO,MAAM,WAAW;;;;;;;;;;;;;CAavB,CAAA;AAED,QAAA,MAAM,oBAAoB,YA8IzB,CAAA;AAED,eAAe,oBAAoB,CAAA"}
+{"version":3,"file":"post-processing.d.ts","sourceRoot":"","sources":["../../../src/components/viewer/post-processing.tsx"],"names":[],"mappings":"AA0BA,eAAO,MAAM,WAAW;;;;;;;;;;;;;CAavB,CAAA;AAED,QAAA,MAAM,oBAAoB,YAgJzB,CAAA;AAED,eAAe,oBAAoB,CAAA"}

package/dist/components/viewer/post-processing.js

@@ -12,8 +12,8 @@ export const SSGI_PARAMS = {
     enabled: true,
     sliceCount: 2,
     stepCount: 8,
-    radius: 2,
-    expFactor: 2,
+    radius: 1,
+    expFactor: 1.5,
     thickness: 0.5,
     backfaceLighting: 0.5,
     aoIntensity: 1.5,
@@ -70,8 +70,6 @@ const PostProcessingPasses = () => {
         const ao = giPass.a;
         // Composite: scene * AO + diffuse * GI
         const compositePass = vec4(add(scenePassColor.rgb.mul(ao), scenePassDiffuse.rgb.mul(gi)), scenePassColor.a);
-        // TRAA (Temporal Reprojection Anti-Aliasing)
-        const traaPass = traa(compositePass, scenePassDepth, scenePassVelocity, camera);
         function generateSelectedOutlinePass() {
             const edgeStrength = uniform(3);
             const edgeGlow = uniform(0);
@@ -116,10 +114,12 @@ const PostProcessingPasses = () => {
         const postProcessing = new PostProcessing(renderer);
         const selectedOutlinePass = generateSelectedOutlinePass();
         const hoverOutlinePass = generateHoverOutlinePass();
-        // Combine SSGI output with outlines
-        const finalOutput = SSGI_PARAMS.enabled
-            ? selectedOutlinePass.add(hoverOutlinePass).add(traaPass)
-            : selectedOutlinePass.add(hoverOutlinePass).add(scenePassColor);
+        // Combine composite with outlines BEFORE applying TRAA
+        const compositeWithOutlines = SSGI_PARAMS.enabled
+            ? vec4(add(compositePass.rgb, selectedOutlinePass.add(hoverOutlinePass)), compositePass.a)
+            : vec4(add(scenePassColor.rgb, selectedOutlinePass.add(hoverOutlinePass)), scenePassColor.a);
+        // TRAA (Temporal Reprojection Anti-Aliasing) - applied AFTER combining everything
+        const finalOutput = traa(compositeWithOutlines, scenePassDepth, scenePassVelocity, camera);
         postProcessing.outputNode = finalOutput;
         postProcessingRef.current = postProcessing;
         return () => {

package/dist/components/viewer/selection-manager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selection-manager.d.ts","sourceRoot":"","sources":["../../../src/components/viewer/selection-manager.tsx"],"names":[],"mappings":"AAkNA,eAAO,MAAM,gBAAgB,+CA0D5B,CAAA"}
+{"version":3,"file":"selection-manager.d.ts","sourceRoot":"","sources":["../../../src/components/viewer/selection-manager.tsx"],"names":[],"mappings":"AAkOA,eAAO,MAAM,gBAAgB,+CAoE5B,CAAA"}

package/dist/components/viewer/selection-manager.js

@@ -144,14 +144,16 @@ const getStrategy = () => {
             isValid: (node) => node.type === 'zone' && node.parentId === levelId,
         };
     }
-    // Zone selected -> can select/hover contents (walls, items, slabs, ceilings, roofs)
+    // Zone selected -> can select/hover contents (walls, items, slabs, ceilings, roofs, windows)
     return {
-        types: ['wall', 'item', 'slab', 'ceiling', 'roof'],
+        types: ['wall', 'item', 'slab', 'ceiling', 'roof', 'window'],
         handleClick: (node) => {
             const { selectedIds } = useViewer.getState().selection;
             // Toggle selection - if already selected, deselect; otherwise select
             if (selectedIds.includes(node.id)) {
-                useViewer.getState().setSelection({ selectedIds: selectedIds.filter((id) => id !== node.id) });
+                useViewer
+                    .getState()
+                    .setSelection({ selectedIds: selectedIds.filter((id) => id !== node.id) });
             }
             else {
                 useViewer.getState().setSelection({ selectedIds: [node.id] });
@@ -168,7 +170,7 @@ const getStrategy = () => {
             }
         },
         isValid: (node) => {
-            const validTypes = ['wall', 'item', 'slab', 'ceiling', 'roof'];
+            const validTypes = ['wall', 'item', 'slab', 'ceiling', 'roof', 'window'];
             if (!validTypes.includes(node.type))
                 return false;
             return isNodeInZone(node, levelId, zoneId);
@@ -210,7 +212,17 @@ export const SelectionManager = () => {
             useViewer.setState({ hoveredId: null });
         };
         // Subscribe to all node types
-        const allTypes = ['building', 'level', 'zone', 'wall', 'item', 'slab', 'ceiling', 'roof'];
+        const allTypes = [
+            'building',
+            'level',
+            'zone',
+            'wall',
+            'item',
+            'slab',
+            'ceiling',
+            'roof',
+            'window',
+        ];
         for (const type of allTypes) {
             emitter.on(`${type}:enter`, onEnter);
             emitter.on(`${type}:leave`, onLeave);
@@ -223,14 +235,16 @@ export const SelectionManager = () => {
                 emitter.off(`${type}:click`, onClick);
             }
         };
-    }, [selection]);
+    }, []);
     return (_jsxs(_Fragment, { children: [_jsx(PointerMissedHandler, { clickHandledRef: clickHandledRef }), _jsx(OutlinerSync, {})] }));
 };
-const PointerMissedHandler = ({ clickHandledRef }) => {
+const PointerMissedHandler = ({ clickHandledRef, }) => {
     const gl = useThree((s) => s.gl);
     useEffect(() => {
         const handleClick = (event) => {
             // Only handle left clicks
+            if (useViewer.getState().cameraDragging)
+                return;
             if (event.button !== 0)
                 return;
             // Use requestAnimationFrame to check after R3F event handlers

package/dist/hooks/use-node-events.d.ts

@@ -1,4 +1,4 @@
-import { type BuildingEvent, type BuildingNode, type CeilingEvent, type CeilingNode, type ItemEvent, type ItemNode, type LevelEvent, type LevelNode, type RoofEvent, type RoofNode, type SiteEvent, type SiteNode, type SlabEvent, type SlabNode, type WallEvent, type WallNode, type ZoneEvent, type ZoneNode } from '@pascal-app/core';
+import { type BuildingEvent, type BuildingNode, type CeilingEvent, type CeilingNode, type ItemEvent, type ItemNode, type LevelEvent, type LevelNode, type RoofEvent, type RoofNode, type SiteEvent, type SiteNode, type SlabEvent, type SlabNode, type WallEvent, type WallNode, type WindowEvent, type WindowNode, type ZoneEvent, type ZoneNode } from '@pascal-app/core';
 import type { ThreeEvent } from '@react-three/fiber';
 type NodeConfig = {
     site: {
@@ -37,6 +37,10 @@ type NodeConfig = {
         node: RoofNode;
         event: RoofEvent;
     };
+    window: {
+        node: WindowNode;
+        event: WindowEvent;
+    };
 };
 type NodeType = keyof NodeConfig;
 export declare function useNodeEvents<T extends NodeType>(node: NodeConfig[T]['node'], type: T): {

package/dist/hooks/use-node-events.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-node-events.d.ts","sourceRoot":"","sources":["../../src/hooks/use-node-events.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,YAAY,EACjB,KAAK,WAAW,EAGhB,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,QAAQ,EACd,MAAM,kBAAkB,CAAA;AACzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAEpD,KAAK,UAAU,GAAG;IAChB,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,QAAQ,EAAE;QAAE,IAAI,EAAE,YAAY,CAAC;QAAC,KAAK,EAAE,aAAa,CAAA;KAAE,CAAA;IACtD,KAAK,EAAE;QAAE,IAAI,EAAE,SAAS,CAAC;QAAC,KAAK,EAAE,UAAU,CAAA;KAAE,CAAA;IAC7C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,OAAO,EAAE;QAAE,IAAI,EAAE,WAAW,CAAC;QAAC,KAAK,EAAE,YAAY,CAAA;KAAE,CAAA;IACnD,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;CAC3C,CAAA;AAED,KAAK,QAAQ,GAAG,MAAM,UAAU,CAAA;AAEhC,wBAAgB,aAAa,CAAC,CAAC,SAAS,QAAQ,EAAE,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC;uBAiB/D,UAAU,CAAC,YAAY,CAAC;qBAI1B,UAAU,CAAC,YAAY,CAAC;iBAI5B,UAAU,CAAC,YAAY,CAAC;wBAIjB,UAAU,CAAC,YAAY,CAAC;wBACxB,UAAU,CAAC,YAAY,CAAC;uBACzB,UAAU,CAAC,YAAY,CAAC;uBACxB,UAAU,CAAC,YAAY,CAAC;uBACxB,UAAU,CAAC,YAAY,CAAC;EAE9C"}
+{"version":3,"file":"use-node-events.d.ts","sourceRoot":"","sources":["../../src/hooks/use-node-events.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,YAAY,EACjB,KAAK,YAAY,EACjB,KAAK,WAAW,EAGhB,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,QAAQ,EACb,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,QAAQ,EACd,MAAM,kBAAkB,CAAA;AACzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAGpD,KAAK,UAAU,GAAG;IAChB,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,QAAQ,EAAE;QAAE,IAAI,EAAE,YAAY,CAAC;QAAC,KAAK,EAAE,aAAa,CAAA;KAAE,CAAA;IACtD,KAAK,EAAE;QAAE,IAAI,EAAE,SAAS,CAAC;QAAC,KAAK,EAAE,UAAU,CAAA;KAAE,CAAA;IAC7C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,OAAO,EAAE;QAAE,IAAI,EAAE,WAAW,CAAC;QAAC,KAAK,EAAE,YAAY,CAAA;KAAE,CAAA;IACnD,IAAI,EAAE;QAAE,IAAI,EAAE,QAAQ,CAAC;QAAC,KAAK,EAAE,SAAS,CAAA;KAAE,CAAA;IAC1C,MAAM,EAAE;QAAE,IAAI,EAAE,UAAU,CAAC;QAAC,KAAK,EAAE,WAAW,CAAA;KAAE,CAAA;CACjD,CAAA;AAED,KAAK,QAAQ,GAAG,MAAM,UAAU,CAAA;AAEhC,wBAAgB,aAAa,CAAC,CAAC,SAAS,QAAQ,EAAE,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC;uBAiB/D,UAAU,CAAC,YAAY,CAAC;qBAK1B,UAAU,CAAC,YAAY,CAAC;iBAK5B,UAAU,CAAC,YAAY,CAAC;wBAKjB,UAAU,CAAC,YAAY,CAAC;wBAIxB,UAAU,CAAC,YAAY,CAAC;uBAIzB,UAAU,CAAC,YAAY,CAAC;uBAIxB,UAAU,CAAC,YAAY,CAAC;uBAIxB,UAAU,CAAC,YAAY,CAAC;EAK9C"}

package/dist/hooks/use-node-events.js

@@ -1,4 +1,5 @@
 import { emitter, } from '@pascal-app/core';
+import useViewer from '../store/use-viewer';
 export function useNodeEvents(node, type) {
     const emit = (suffix, e) => {
         const eventKey = `${type}:${suffix}`;
@@ -15,24 +16,50 @@ export function useNodeEvents(node, type) {
     };
     return {
         onPointerDown: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
             if (e.button !== 0)
                 return;
             emit('pointerdown', e);
         },
         onPointerUp: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
             if (e.button !== 0)
                 return;
             emit('pointerup', e);
         },
         onClick: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
             if (e.button !== 0)
                 return;
             emit('click', e);
         },
-        onPointerEnter: (e) => emit('enter', e),
-        onPointerLeave: (e) => emit('leave', e),
-        onPointerMove: (e) => emit('move', e),
-        onDoubleClick: (e) => emit('double-click', e),
-        onContextMenu: (e) => emit('context-menu', e),
+        onPointerEnter: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
+            emit('enter', e);
+        },
+        onPointerLeave: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
+            emit('leave', e);
+        },
+        onPointerMove: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
+            emit('move', e);
+        },
+        onDoubleClick: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
+            emit('double-click', e);
+        },
+        onContextMenu: (e) => {
+            if (useViewer.getState().cameraDragging)
+                return;
+            emit('context-menu', e);
+        },
     };
 }

package/dist/index.d.ts

@@ -1,5 +1,4 @@
 export { default as Viewer } from './components/viewer';
-export { useGridEvents } from './hooks/use-grid-events';
 export { default as useViewer } from './store/use-viewer';
 export { ASSETS_CDN_URL, resolveAssetUrl, resolveCdnUrl } from './lib/asset-url';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAA;AACvD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAA;AACvD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAA;AACzD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA"}

package/dist/index.js

@@ -1,4 +1,3 @@
 export { default as Viewer } from './components/viewer';
-export { useGridEvents } from './hooks/use-grid-events';
 export { default as useViewer } from './store/use-viewer';
 export { ASSETS_CDN_URL, resolveAssetUrl, resolveCdnUrl } from './lib/asset-url';

package/dist/store/use-viewer.d.ts

@@ -29,6 +29,8 @@ type ViewerState = {
     outliner: Outliner;
     exportScene: (() => Promise<void>) | null;
     setExportScene: (fn: (() => Promise<void>) | null) => void;
+    cameraDragging: boolean;
+    setCameraDragging: (dragging: boolean) => void;
 };
 declare const useViewer: import("zustand").UseBoundStore<import("zustand").StoreApi<ViewerState>>;
 export default useViewer;

package/dist/store/use-viewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-viewer.d.ts","sourceRoot":"","sources":["../../src/store/use-viewer.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,QAAQ,EACT,MAAM,kBAAkB,CAAC;AAC1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAItC,KAAK,aAAa,GAAG;IACnB,UAAU,EAAE,YAAY,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IACtC,OAAO,EAAE,SAAS,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAChC,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAC9B,WAAW,EAAE,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;CAC/B,CAAC;AAEF,KAAK,QAAQ,GAAG;IACd,eAAe,EAAE,QAAQ,EAAE,CAAC;IAC5B,cAAc,EAAE,QAAQ,EAAE,CAAC;CAC5B,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,SAAS,EAAE,aAAa,CAAA;IACxB,SAAS,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAChD,YAAY,EAAE,CAAC,EAAE,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,KAAK,IAAI,CAAA;IAEjE,UAAU,EAAE,aAAa,GAAG,cAAc,CAAA;IAC1C,aAAa,EAAE,CAAC,IAAI,EAAE,aAAa,GAAG,cAAc,KAAK,IAAI,CAAA;IAE7D,SAAS,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,GAAG,QAAQ,CAAA;IACrD,YAAY,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,GAAG,QAAQ,KAAK,IAAI,CAAA;IAExE,QAAQ,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,CAAA;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,KAAK,IAAI,CAAA;IAEtD,SAAS,EAAE,OAAO,CAAA;IAClB,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IAErC,UAAU,EAAE,OAAO,CAAA;IACnB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IAGtC,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,CAAA;IACvD,cAAc,EAAE,MAAM,IAAI,CAAA;IAE1B,QAAQ,EAAE,QAAQ,CAAA;IAGlB,WAAW,EAAE,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,CAAA;IACzC,cAAc,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,KAAK,IAAI,CAAA;CAC3D,CAAA;AAED,QAAA,MAAM,SAAS,0EAqDZ,CAAC;AAEJ,eAAe,SAAS,CAAC"}
+{"version":3,"file":"use-viewer.d.ts","sourceRoot":"","sources":["../../src/store/use-viewer.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,SAAS,EACT,QAAQ,EACT,MAAM,kBAAkB,CAAC;AAC1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAItC,KAAK,aAAa,GAAG;IACnB,UAAU,EAAE,YAAY,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IACtC,OAAO,EAAE,SAAS,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAChC,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAC9B,WAAW,EAAE,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;CAC/B,CAAC;AAEF,KAAK,QAAQ,GAAG;IACd,eAAe,EAAE,QAAQ,EAAE,CAAC;IAC5B,cAAc,EAAE,QAAQ,EAAE,CAAC;CAC5B,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,SAAS,EAAE,aAAa,CAAA;IACxB,SAAS,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAChD,YAAY,EAAE,CAAC,EAAE,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,IAAI,KAAK,IAAI,CAAA;IAEjE,UAAU,EAAE,aAAa,GAAG,cAAc,CAAA;IAC1C,aAAa,EAAE,CAAC,IAAI,EAAE,aAAa,GAAG,cAAc,KAAK,IAAI,CAAA;IAE7D,SAAS,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,GAAG,QAAQ,CAAA;IACrD,YAAY,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,GAAG,QAAQ,KAAK,IAAI,CAAA;IAExE,QAAQ,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,CAAA;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,KAAK,IAAI,CAAA;IAEtD,SAAS,EAAE,OAAO,CAAA;IAClB,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IAErC,UAAU,EAAE,OAAO,CAAA;IACnB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IAGtC,YAAY,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC,aAAa,CAAC,KAAK,IAAI,CAAA;IACvD,cAAc,EAAE,MAAM,IAAI,CAAA;IAE1B,QAAQ,EAAE,QAAQ,CAAA;IAGlB,WAAW,EAAE,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,CAAA;IACzC,cAAc,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,KAAK,IAAI,CAAA;IAE1D,cAAc,EAAE,OAAO,CAAA;IACvB,iBAAiB,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAA;CAC/C,CAAA;AAED,QAAA,MAAM,SAAS,0EAwDZ,CAAC;AAEJ,eAAe,SAAS,CAAC"}

package/dist/store/use-viewer.js

@@ -42,5 +42,7 @@ const useViewer = create()((set, get) => ({
     outliner: { selectedObjects: [], hoveredObjects: [] },
     exportScene: null,
     setExportScene: (fn) => set({ exportScene: fn }),
+    cameraDragging: false,
+    setCameraDragging: (dragging) => set({ cameraDragging: dragging }),
 }));
 export default useViewer;

package/dist/systems/zone/zone-system.d.ts

@@ -0,0 +1,2 @@
+export declare const ZoneSystem: () => null;
+//# sourceMappingURL=zone-system.d.ts.map

package/dist/systems/zone/zone-system.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"zone-system.d.ts","sourceRoot":"","sources":["../../../src/systems/zone/zone-system.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,UAAU,YA4DtB,CAAA"}

package/dist/systems/zone/zone-system.js

@@ -0,0 +1,57 @@
+import { sceneRegistry, useScene } from '@pascal-app/core';
+import { useFrame } from '@react-three/fiber';
+import { useRef } from 'react';
+import { MathUtils } from 'three';
+import useViewer from '../../store/use-viewer';
+const TRANSITION_DURATION = 400; // ms
+export const ZoneSystem = () => {
+    const lastHighlightedZoneRef = useRef(null);
+    const lastChangeTimeRef = useRef(0);
+    const isTransitioningRef = useRef(false);
+    useFrame(({ clock }, delta) => {
+        const hoveredId = useViewer.getState().hoveredId;
+        let highlightedZone = null;
+        if (hoveredId) {
+            const hoveredNode = useScene.getState().nodes[hoveredId];
+            if (hoveredNode?.type === 'zone') {
+                highlightedZone = hoveredId;
+            }
+        }
+        // Detect zone change
+        if (highlightedZone !== lastHighlightedZoneRef.current) {
+            lastHighlightedZoneRef.current = highlightedZone;
+            lastChangeTimeRef.current = clock.elapsedTime * 1000;
+            isTransitioningRef.current = true;
+        }
+        // Skip frame if not transitioning
+        if (!isTransitioningRef.current)
+            return;
+        const elapsed = clock.elapsedTime * 1000 - lastChangeTimeRef.current;
+        // Stop transitioning after duration
+        if (elapsed >= TRANSITION_DURATION) {
+            isTransitioningRef.current = false;
+        }
+        // Lerp speed: complete transition in ~400ms
+        const lerpSpeed = 10 * delta;
+        sceneRegistry.byType.zone.forEach((zoneId) => {
+            const zone = sceneRegistry.nodes.get(zoneId);
+            if (!zone)
+                return;
+            const isHighlighted = zoneId === highlightedZone;
+            const targetOpacity = isHighlighted ? 1 : 0;
+            const walls = zone.getObjectByName('walls');
+            if (walls) {
+                const material = walls.material;
+                const currentOpacity = material.userData.uOpacity.value;
+                material.userData.uOpacity.value = MathUtils.lerp(currentOpacity, targetOpacity, lerpSpeed);
+            }
+            const floor = zone.getObjectByName('floor');
+            if (floor) {
+                const material = floor.material;
+                const currentOpacity = material.userData.uOpacity.value;
+                material.userData.uOpacity.value = MathUtils.lerp(currentOpacity, targetOpacity, lerpSpeed);
+            }
+        });
+    });
+    return null;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pascal-app/viewer",
-  "version": "0.1.11",
+  "version": "0.1.13",
   "description": "3D viewer component for Pascal building editor",
   "type": "module",
   "main": "./dist/index.js",
@@ -49,8 +49,10 @@
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/your-username/pascal-editor.git",
+    "url": "https://github.com/pascalorg/editor.git",
     "directory": "packages/viewer"
   },
-  "license": "MIT"
+  "license": "MIT",
+  "homepage": "https://github.com/pascalorg/editor/tree/main/packages/viewer#readme",
+  "bugs": "https://github.com/pascalorg/editor/issues"
 }

package/dist/hooks/use-grid-events.d.ts

@@ -1,12 +0,0 @@
-import type { ThreeEvent } from "@react-three/fiber";
-export declare function useGridEvents(): {
-    onPointerDown: (e: ThreeEvent<PointerEvent>) => void;
-    onPointerUp: (e: ThreeEvent<PointerEvent>) => void;
-    onClick: (e: ThreeEvent<PointerEvent>) => void;
-    onPointerEnter: (e: ThreeEvent<PointerEvent>) => void;
-    onPointerLeave: (e: ThreeEvent<PointerEvent>) => void;
-    onPointerMove: (e: ThreeEvent<PointerEvent>) => void;
-    onDoubleClick: (e: ThreeEvent<PointerEvent>) => void;
-    onContextMenu: (e: ThreeEvent<PointerEvent>) => void;
-};
-//# sourceMappingURL=use-grid-events.d.ts.map

package/dist/hooks/use-grid-events.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-grid-events.d.ts","sourceRoot":"","sources":["../../src/hooks/use-grid-events.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,wBAAgB,aAAa;uBAYN,UAAU,CAAC,YAAY,CAAC;qBAI1B,UAAU,CAAC,YAAY,CAAC;iBAI5B,UAAU,CAAC,YAAY,CAAC;wBAIjB,UAAU,CAAC,YAAY,CAAC;wBACxB,UAAU,CAAC,YAAY,CAAC;uBACzB,UAAU,CAAC,YAAY,CAAC;uBACxB,UAAU,CAAC,YAAY,CAAC;uBACxB,UAAU,CAAC,YAAY,CAAC;EAE9C"}

package/dist/hooks/use-grid-events.js

@@ -1,33 +0,0 @@
-import { emitter } from "@pascal-app/core";
-export function useGridEvents() {
-    const emit = (suffix, e) => {
-        const eventKey = `grid:${suffix}`;
-        const payload = {
-            position: [e.point.x, e.point.y, e.point.z],
-            nativeEvent: e,
-        };
-        emitter.emit(eventKey, payload);
-    };
-    return {
-        onPointerDown: (e) => {
-            if (e.button !== 0)
-                return;
-            emit("pointerdown", e);
-        },
-        onPointerUp: (e) => {
-            if (e.button !== 0)
-                return;
-            emit("pointerup", e);
-        },
-        onClick: (e) => {
-            if (e.button !== 0)
-                return;
-            emit("click", e);
-        },
-        onPointerEnter: (e) => emit("enter", e),
-        onPointerLeave: (e) => emit("leave", e),
-        onPointerMove: (e) => emit("move", e),
-        onDoubleClick: (e) => emit("double-click", e),
-        onContextMenu: (e) => emit("context-menu", e),
-    };
-}