@pascal-app/nodes 1.0.4 → 1.0.6

package/dist/site/panel.js

@@ -140,7 +140,31 @@ export function SiteNodePanel() {
                                     setSuggestions([]);
                                 }, type: "button", children: [_jsx(MapPin, { className: "mt-0.5 size-3 shrink-0 text-muted-foreground" }), _jsx("span", { children: s.label ?? [s.line1, s.line2].filter(Boolean).join(', ') })] }) }, `${s.label}-${s.lat}-${s.lng}`))) })) : null, _jsx(ActionGroup, { children: _jsx(ActionButton, { disabled: busy, icon: _jsx(Search, { className: "size-4" }), label: busy ? 'Finding…' : 'Find parcel', onClick: findParcel }) }), status ? _jsx("p", { className: "text-muted-foreground text-xs", children: status }) : null] })) : null, node.parcel ? (_jsxs(PanelSection, { title: "Parcel", children: [_jsx(Row, { label: "APN", value: node.parcel.apn || '—' }), _jsx(Row, { label: "County", value: node.parcel.county || '—' }), _jsx(Row, { label: "Lot area", value: node.parcel.lotAreaSqFt
                             ? `${Math.round(node.parcel.lotAreaSqFt).toLocaleString()} sq ft`
-                            : '—' }), _jsx(Row, { label: "Source", value: node.parcel.layer || node.parcel.source || '—' }), node.parcel.notes?.length ? (_jsx("p", { className: "text-muted-foreground text-xs leading-snug", children: node.parcel.notes.join(' ') })) : null] })) : null, _jsxs(PanelSection, { title: "Setbacks", children: [setbackField('front', 'Front'), setbackField('side', 'Side'), setbackField('rear', 'Rear'), setbackField('left', 'Left (override)', true), setbackField('right', 'Right (override)', true), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Source / citation" }), _jsx("input", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", defaultValue: node.setbacksSource ?? '', onBlur: (event) => update({ setbacksSource: event.target.value || undefined }), placeholder: "e.g. Tampa LDC \u00A727-156" }, node.setbacksSource ?? '')] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Zone" }), _jsx("input", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", defaultValue: node.zone ?? '', onBlur: (event) => update({ zone: event.target.value || undefined }), placeholder: "e.g. RS-60" }, node.zone ?? '')] })] }), _jsxs(PanelSection, { title: "Terrain", children: [_jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Contour interval (site plan and 3D)" }), _jsxs("select", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", onChange: (event) => update({ contourIntervalIn: Number(event.target.value) }), value: String(node.contourIntervalIn ?? 12), children: [_jsx("option", { value: "0", children: "none" }), _jsx("option", { value: "6", children: "every 6 in" }), _jsx("option", { value: "12", children: "every 12 in" }), _jsx("option", { value: "24", children: "every 24 in" })] })] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { checked: node.contours3d ?? false, onChange: (event) => update({ contours3d: event.target.checked }), type: "checkbox" }), _jsx("span", { className: "text-muted-foreground", children: "Show the contour lines in 3D" })] }), node.terrainContours ? (_jsxs("p", { className: "text-muted-foreground text-xs", children: [node.terrainContours.lines.length, " surveyed lines at ", node.terrainContours.intervalFt, ' ', "ft (", node.terrainContours.datum, ") \u2014 ", node.terrainContours.source ?? 'survey'] })) : (_jsx("p", { className: "text-muted-foreground text-xs", children: "No surveyed lines \u2014 contours are drawn from the sculpted ground." }))] }), _jsxs(PanelSection, { title: "Orientation", children: [_jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Front (street) edge" }), _jsxs("select", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", onChange: (event) => update({
+                            : '—' }), _jsx(Row, { label: "Source", value: node.parcel.layer || node.parcel.source || '—' }), node.parcel.notes?.length ? (_jsx("p", { className: "text-muted-foreground text-xs leading-snug", children: node.parcel.notes.join(' ') })) : null] })) : null, _jsxs(PanelSection, { title: "Setbacks", children: [setbackField('front', 'Front'), setbackField('side', 'Side'), setbackField('rear', 'Rear'), setbackField('left', 'Left (override)', true), setbackField('right', 'Right (override)', true), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Source / citation" }), _jsx("input", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", defaultValue: node.setbacksSource ?? '', onBlur: (event) => update({ setbacksSource: event.target.value || undefined }), placeholder: "e.g. Tampa LDC \u00A727-156" }, node.setbacksSource ?? '')] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Zone" }), _jsx("input", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", defaultValue: node.zone ?? '', onBlur: (event) => update({ zone: event.target.value || undefined }), placeholder: "e.g. RS-60" }, node.zone ?? '')] })] }), _jsxs(PanelSection, { title: "Project look", children: [_jsx("p", { className: "text-muted-foreground text-xs", children: "Save the current lighting and display as this project's default. Personal display changes stay in this browser." }), _jsxs(ActionGroup, { children: [_jsx(ActionButton, { label: "Save current look", onClick: () => {
+                                    const viewer = useViewer.getState();
+                                    const look = viewer.sceneAppearance;
+                                    update({
+                                        presentation: {
+                                            ...node.presentation,
+                                            theme: viewer.sceneTheme,
+                                            exposure: look.toneMappingExposure,
+                                            shading: viewer.shading,
+                                            edges: viewer.edges,
+                                            shadows: viewer.shadows,
+                                            lighting: {
+                                                background: look.background,
+                                                backgroundSky: look.backgroundSky,
+                                                ground: look.ground,
+                                                ambient: look.ambient,
+                                                hemi: look.hemi,
+                                                lights: look.lights,
+                                                environment: look.environment,
+                                            },
+                                            postprocessing: look.postprocessing,
+                                        },
+                                    });
+                                    viewer.resetProjectLook();
+                                } }), _jsx(ActionButton, { label: "Use project look", onClick: () => useViewer.getState().resetProjectLook() })] })] }), _jsxs(PanelSection, { title: "Terrain", children: [_jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { checked: node.showGround !== false, onChange: (event) => update({ showGround: event.target.checked }), type: "checkbox" }), _jsx("span", { className: "text-muted-foreground", children: "Show ground" })] }), _jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Contour interval (site plan and 3D)" }), _jsxs("select", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", onChange: (event) => update({ contourIntervalIn: Number(event.target.value) }), value: String(node.contourIntervalIn ?? 12), children: [_jsx("option", { value: "0", children: "none" }), _jsx("option", { value: "6", children: "every 6 in" }), _jsx("option", { value: "12", children: "every 12 in" }), _jsx("option", { value: "24", children: "every 24 in" })] })] }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { checked: node.contours3d ?? false, onChange: (event) => update({ contours3d: event.target.checked }), type: "checkbox" }), _jsx("span", { className: "text-muted-foreground", children: "Show the contour lines in 3D" })] }), node.terrainContours ? (_jsxs("p", { className: "text-muted-foreground text-xs", children: [node.terrainContours.lines.length, " surveyed lines at ", node.terrainContours.intervalFt, ' ', "ft (", node.terrainContours.datum, ") \u2014 ", node.terrainContours.source ?? 'survey'] })) : (_jsx("p", { className: "text-muted-foreground text-xs", children: "No surveyed lines \u2014 contours are drawn from the sculpted ground." }))] }), _jsxs(PanelSection, { title: "Orientation", children: [_jsxs("label", { className: "space-y-1 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "Front (street) edge" }), _jsxs("select", { className: "w-full rounded-md border border-border/70 bg-background px-2 py-1.5 text-foreground", onChange: (event) => update({
                                     frontEdge: event.target.value === '' ? undefined : Number(event.target.value),
                                 }), value: node.frontEdge == null ? '' : String(node.frontEdge), children: [_jsx("option", { value: "", children: "Auto \u2014 most north-facing edge" }), edges.map((edge) => (_jsx("option", { value: String(edge.index), children: edge.label }, edge.index)))] })] }), _jsxs("label", { className: "flex items-center justify-between gap-3 text-sm", children: [_jsx("span", { className: "text-muted-foreground", children: "North rotation" }), _jsxs("span", { className: "flex items-center gap-1", children: [_jsx("input", { className: "w-20 rounded-md border border-border/70 bg-background px-2 py-1 text-right text-foreground", defaultValue: String(Math.round((((node.northRotation ?? 0) * 180) / Math.PI) * 10) / 10), inputMode: "decimal", onFocus: (event) => event.target.select(), onBlur: (event) => {
                                             const deg = Number(event.target.value.trim());

package/dist/site/parametrics.js

@@ -7,5 +7,5 @@
  */
 export const siteParametrics = {
     groups: [],
-    customPanel: () => import('./panel'),
+    customPanel: () => import('./panel.js'),
 };

package/dist/site/renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/site/renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,QAAQ,EAWd,MAAM,kBAAkB,CAAA;AA0JzB,eAAO,MAAM,YAAY,GAAI,UAAU;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,uCA6fxD,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/site/renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAOL,KAAK,QAAQ,EAed,MAAM,kBAAkB,CAAA;AA2KzB,eAAO,MAAM,YAAY,aAAc;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,uCAmpBxD,CAAA;eAEc,YAAY"}

package/dist/site/renderer.js

@@ -1,21 +1,24 @@
 'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { sightTriangle, streetCorners, terrainContours, terrainFieldOf, unionPolygons, useLiveNodeOverrides, useLiveTerrain, useRegistry, useScene, } from '@pascal-app/core';
-import { backdropGradient, deepSkyColor, getSceneTheme, horizonHazeColor, NodeRenderer, useImmersiveXRPresentation, useNodeEvents, useSceneAtmosphere, useSceneGroundReplacement, useViewer, } from '@pascal-app/viewer';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { belowGradeFloorY, belowGradeFootprints, coveredBelowGradeFootprints, groundPitFloorY, intersection, sightTriangle, siteFrontEdge, siteSetbackEnvelope, streetCorners, surfaceHeightAt, terrainContours, terrainFieldOf, union, unionPolygons, useLiveNodeOverrides, useLiveTerrain, useRegistry, useScene, } from '@pascal-app/core';
+import { backdropColors, backdropGradient, groundWindowMaskNode, NodeRenderer, SITE_GROUND, siteGroundShown, UNDERGROUND_RIM, useImmersiveXRPresentation, useNodeEvents, useSceneAtmosphere, useSceneGroundReplacement, useViewer, } from '@pascal-app/viewer';
 import { useEffect, useMemo, useRef } from 'react';
 import { BufferAttribute, BufferGeometry, DoubleSide, Path, Shape, ShapeGeometry, } from 'three';
 import { cameraPosition, color, mix, positionWorld, smoothstep, float as tslFloat, vec2, } from 'three/tsl';
 import { MeshLambertNodeMaterial } from 'three/webgpu';
-import { buildPatternedRibbon, PROPERTY_LINE_PATTERN, SETBACK_LINE_PATTERN, updateRibbonHeights, } from './line-ribbon';
-import { getRecessedSlabGroundHoles } from './recessed-slab-ground-holes';
-import { resolveFrontEdge, setbackEnvelope } from './setbacks';
-import { buildDrapedPolyline, terrainGridKey, updateDrapedHeights, } from './terrain-drape';
-import { HORIZON_PLANE_Y, terrainBlockBase } from './terrain-geometry';
-import { TerrainRenderer } from './terrain-renderer';
+import { GenericFoundation } from './generic-foundation.js';
+import { GroundHole, groundHoleColorNode, groundHoleShadowNode, solidGroundMaskNode, } from './ground-hole.js';
+import { GroundVeil, gradeRingGeometry, gradeRingMaterial, groundVeilMaterial, horizonVeilMaterial, noopRaycast, } from './ground-veil.js';
+import { GroundWindowSystem } from './ground-window-system.js';
+import { buildPatternedRibbon, PROPERTY_LINE_PATTERN, SETBACK_LINE_PATTERN, updateRibbonHeights, } from './line-ribbon.js';
+import { getRecessedSlabGroundHoles } from './recessed-slab-ground-holes.js';
+import { buildDrapedPolyline, terrainGridKey, updateDrapedHeights, } from './terrain-drape.js';
+import { HORIZON_PLANE_Y, terrainBlockBase } from './terrain-geometry.js';
+import { TerrainRenderer } from './terrain-renderer.js';
 const Y_OFFSET = 0.01;
-// The horizon disc is presentation-only — clicks must fall through to the
-// real site polygon / grid, so its raycast is a no-op.
-const noopRaycast = () => { };
+/** The flat lot's fill, just under grade; the plan's shapes lie in XY, turned to lie flat. */
+const GROUND_FILL_POSITION = [0, -0.05, 0];
+const FLAT_ON_THE_GROUND = [-Math.PI / 2, 0, 0];
 /**
  * The site boundary line, laid on the ground rather than across it.
  *
@@ -83,14 +86,10 @@ export const SiteRenderer = ({ node }) => {
     const atmosphere = useSceneAtmosphere();
     const groundReplaced = useSceneGroundReplacement();
     useRegistry(node.id, 'site', ref);
-    const bgColor = useViewer((state) => getSceneTheme(state.sceneTheme).ground);
-    const backgroundColor = useViewer((state) => getSceneTheme(state.sceneTheme).background);
-    const skyColor = useViewer((state) => {
-        const theme = getSceneTheme(state.sceneTheme);
-        return theme.backgroundSky ?? theme.background;
-    });
-    const appearance = useViewer((state) => getSceneTheme(state.sceneTheme).appearance);
-    const maxLightIntensity = useViewer((state) => Math.max(1, ...getSceneTheme(state.sceneTheme).lights.map((light) => light.intensity)));
+    const theme = useViewer((state) => state.sceneAppearance);
+    const bgColor = theme.ground;
+    const { background: backgroundColor, sky: skyColor, haze, skyDeep } = backdropColors(theme);
+    const maxLightIntensity = Math.max(1, ...theme.lights.map((light) => light.intensity));
     const livePolygon = useLiveNodeOverrides((state) => state.overrides.get(node.id)?.polygon ?? null);
     const polygonPoints = livePolygon?.points ?? node.polygon?.points;
     // Persisted terrain only. A stroke is applied imperatively further down, for the
@@ -123,16 +122,73 @@ export const SiteRenderer = ({ node }) => {
         }
         return { cx, cz, radius };
     }, [polygonPoints]);
+    // Where the ground meets the levels below grade. `all` says whether the scene has any (the
+    // ground materials carry the hole's mask from then on); `shown` is what the hole is cut over and
+    // the grade ring runs along under the veil: the level shown and the ones between it and grade, as
+    // the level display hides them. While the level shown is not below grade the last such set is
+    // kept, so a hole easing shut keeps its shape. `covered` is the part of them under the house
+    // itself, whatever level is shown: the ground stands open there (see `holes`).
+    const shownLevelId = useViewer((state) => state.hideLevelsAboveSelection ? state.selection.levelId : null);
+    const belowGrade = useViewer((state) => state.belowGrade);
+    const groundMode = useViewer((state) => state.groundMode);
+    const buriedCache = useRef({ all: [], shown: [], floorY: null, drawnFloorY: null, covered: [] });
+    const buried = useScene((state) => {
+        const prev = buriedCache.current;
+        const found = belowGradeFootprints(state.nodes);
+        const all = polygonsMatch(found, prev.all) ? prev.all : found;
+        const foundCovered = all.length > 0 ? coveredBelowGradeFootprints(state.nodes) : [];
+        const covered = polygonsMatch(foundCovered, prev.covered) ? prev.covered : foundCovered;
+        let shown = [];
+        let floorY = null;
+        let drawnFloorY = null;
+        if (all.length > 0) {
+            shown = shownLevelId ? belowGradeFootprints(state.nodes, shownLevelId) : [];
+            floorY = shownLevelId ? belowGradeFloorY(state.nodes, shownLevelId) : null;
+            drawnFloorY = shownLevelId ? groundPitFloorY(state.nodes, shownLevelId) : null;
+            if (shown.length === 0)
+                shown = prev.shown.length > 0 ? prev.shown : all;
+            floorY ??= prev.floorY;
+            drawnFloorY ??= prev.drawnFloorY;
+        }
+        if (polygonsMatch(shown, prev.shown))
+            shown = prev.shown;
+        if (all === prev.all &&
+            shown === prev.shown &&
+            floorY === prev.floorY &&
+            drawnFloorY === prev.drawnFloorY &&
+            covered === prev.covered)
+            return prev;
+        buriedCache.current = { all, shown, floorY, drawnFloorY, covered };
+        return buriedCache.current;
+    });
+    // Where the pit's walls start: the ground itself, flat or the sculpted terrain.
+    const groundTopAt = useMemo(() => (x, z) => persistedField ? surfaceHeightAt(persistedField, x, z) : GROUND_FILL_POSITION[1], [persistedField]);
     // Lit (not Basic) so the site ground receives the directional shadow — Basic
     // is unlit, which is why shadows used to stop dead at the slab edge. polygonOffset
     // keeps it tucked behind the grid/slab as before.
+    // The hole's nodes are in the material from the moment the scene has a level below grade (once,
+    // not when a floor is picked), the opening a uniform; without one the materials stay plain.
+    const hasBasement = buried.all.length > 0;
     const groundMaterial = useMemo(() => {
         const material = new MeshLambertNodeMaterial({ color: bgColor });
         material.polygonOffset = true;
         material.polygonOffsetFactor = 1;
         material.polygonOffsetUnits = 1;
+        // The ground window cuts the solid ground where it stands in the eye's way (viewer
+        // lib/ground-window), and the hole opens over a level below grade (ground-hole.tsx), its
+        // edge a noise threshold with a thin slate rim; with both closed the mask passes everywhere.
+        if (hasBasement) {
+            ;
+            material.maskNode = solidGroundMaskNode();
+            material.colorNode = groundHoleColorNode(UNDERGROUND_RIM);
+            material.receivedShadowNode = groundHoleShadowNode();
+        }
+        else {
+            ;
+            material.maskNode = groundWindowMaskNode();
+        }
         return material;
-    }, [bgColor]);
+    }, [bgColor, hasBasement]);
     // Presentation horizon: a large ground disc under the lot, fading into the
     // active fog radiance (or the theme backdrop when there is no atmosphere) so
     // the scene sits on an "infinite" plane instead of a hard-edged plate. Never pickable.
@@ -164,25 +220,43 @@ export const SiteRenderer = ({ node }) => {
             : backdropGradient({
                 dirY: viewDir.y,
                 background: color(backgroundColor),
-                haze: color(horizonHazeColor(skyColor, appearance)),
+                haze: color(haze),
                 sky: color(skyColor),
-                skyDeep: color(deepSkyColor(skyColor)),
+                skyDeep: color(skyDeep),
             });
         material.emissiveNode = mix(color('#000000'), backdrop, fade).mul(haloFactor);
         material.polygonOffset = true;
         material.polygonOffsetFactor = 2;
         material.polygonOffsetUnits = 2;
+        if (hasBasement) {
+            ;
+            material.maskNode = solidGroundMaskNode();
+            material.receivedShadowNode = groundHoleShadowNode();
+        }
+        else {
+            ;
+            material.maskNode = groundWindowMaskNode();
+        }
         return material;
     }, [
+        hasBasement,
         atmosphere,
         bgColor,
         backgroundColor,
         skyColor,
-        appearance,
+        haze,
+        skyDeep,
         maxLightIntensity,
         fadeBounds,
         groundReplaced,
     ]);
+    // Over a level below grade the ground is drawn as a veil (ground-veil.tsx).
+    const groundVeil = useMemo(() => groundVeilMaterial(bgColor), [bgColor]);
+    useEffect(() => () => groundVeil.dispose(), [groundVeil]);
+    const horizonVeil = useMemo(() => fadeBounds && polygonPoints && !groundReplaced
+        ? horizonVeilMaterial(bgColor, polygonPoints, fadeBounds)
+        : null, [bgColor, fadeBounds, polygonPoints, groundReplaced]);
+    useEffect(() => () => horizonVeil?.dispose(), [horizonVeil]);
     // Cache computed polygons to keep the selector stable across unrelated store updates.
     const slabPolygonsCache = useRef([]);
     const slabPolygons = useScene((state) => {
@@ -193,6 +267,30 @@ export const SiteRenderer = ({ node }) => {
         slabPolygonsCache.current = next;
         return next;
     });
+    // What the ground is cut open over: the recessed slabs, and the basement under the house. The
+    // house covers that part of a basement, so the ground there is open whatever level is shown:
+    // from outside nothing changes, and a stairwell, a floor opening or a walkthrough on the stair
+    // meets the basement, not a sheet of ground across it. A basement reaching out under the garden
+    // stays closed past the house (no pit in the garden) until its level is shown, and the hole of
+    // the level shown does the rest as it does. The one case it closes: the level display has the
+    // storeys away over a level below grade and the person keeps the ground Solid, nothing covers
+    // it then and Solid asks for solid ground. Clipped to the lot, as a hole past its line breaks
+    // the triangulation.
+    const coverOpen = !(belowGrade && groundMode === 'solid');
+    const holes = useMemo(() => {
+        if (!coverOpen || buried.covered.length === 0 || !polygonPoints || polygonPoints.length < 3)
+            return slabPolygons;
+        const inLot = intersection(union(buried.covered), polygonPoints);
+        const covered = inLot.filter((piece) => piece.holes.length === 0).map((piece) => piece.outer);
+        return covered.length > 0 ? [...slabPolygons, ...covered] : slabPolygons;
+    }, [coverOpen, buried.covered, polygonPoints, slabPolygons]);
+    const gradeRings = useMemo(() => buried.shown.map((outline) => gradeRingGeometry(outline, persistedField)), [buried.shown, persistedField]);
+    useEffect(() => () => {
+        for (const ring of gradeRings)
+            ring.dispose();
+    }, [gradeRings]);
+    const gradeRing = useMemo(gradeRingMaterial, []);
+    useEffect(() => () => gradeRing.dispose(), [gradeRing]);
     // Ground shape: site polygon with slab footprints punched as holes
     const groundShape = useMemo(() => {
         if (!polygonPoints || polygonPoints.length < 3)
@@ -203,9 +301,9 @@ export const SiteRenderer = ({ node }) => {
         for (let i = 1; i < pts.length; i++)
             shape.lineTo(pts[i][0], -pts[i][1]);
         shape.closePath();
-        addSlabHoles(shape, slabPolygons);
+        addSlabHoles(shape, holes);
         return shape;
-    }, [polygonPoints, slabPolygons]);
+    }, [polygonPoints, holes]);
     // With terrain the lot is a block — its ground cut to the property line, its
     // skirt dropping to one flat base — and the disc lies just under that base, so
     // nothing of it caps the lot and nothing of the block stands proud of it from
@@ -223,9 +321,9 @@ export const SiteRenderer = ({ node }) => {
             shape.lineTo(Math.cos(angle) * radius, Math.sin(angle) * radius);
         }
         shape.closePath();
-        addSlabHoles(shape, slabPolygons, fadeBounds.cx, fadeBounds.cz);
+        addSlabHoles(shape, holes, fadeBounds.cx, fadeBounds.cz);
         return new ShapeGeometry(shape);
-    }, [fadeBounds, slabPolygons, groundReplaced]);
+    }, [fadeBounds, holes, groundReplaced]);
     useEffect(() => () => horizonGeometry?.dispose(), [horizonGeometry]);
     useEffect(() => () => horizonMaterial?.dispose(), [horizonMaterial]);
     // Boundary line geometry, subdivided against the terrain grid when there is one.
@@ -263,12 +361,14 @@ export const SiteRenderer = ({ node }) => {
         let envelopeGeometry = null;
         const triangleGeometries = [];
         const points = polygonPoints.map(([x, z]) => [x ?? 0, z ?? 0]);
-        const front = resolveFrontEdge(points, node.frontEdge, node.northRotation ?? 0);
+        // the live ring, measured the one way the site plan and the agents measure it
+        const lot = { ...node, polygon: { type: 'polygon', points } };
+        const front = siteFrontEdge(lot);
         const streetEdges = node.streetEdges ?? [];
         const sightTriangleM = typeof node.sightTriangleFt === 'number' && node.sightTriangleFt > 0
             ? node.sightTriangleFt * 0.3048
             : 0;
-        const envelope = setbackEnvelope(points, setbacks, front, { streetEdges, sightTriangleM });
+        const envelope = siteSetbackEnvelope(lot);
         if (envelope.length >= 3) {
             const draped = buildDrapedPolyline({
                 points: envelope,
@@ -426,11 +526,15 @@ export const SiteRenderer = ({ node }) => {
     // drops the parcel's own presentation — ground fill, sculpted ground, lot
     // line — while everything standing on the site keeps its own flag (the
     // exporter and the 2D plan draw the same line). The horizon disc is a world
-    // backdrop rather than part of the parcel, so it stays either way.
+    // backdrop rather than part of the parcel, so `visible` does not hide it.
+    // `showGround` hides both ground and horizon when authored geometry supplies them, unless a level
+    // below grade is shown: the level display hides that geometry then, and the ground stands in.
     const showSiteSurfaces = node.visible !== false;
+    const showGround = siteGroundShown(node, { belowGrade });
     if (!(node && lineGeometry)) {
         return null;
     }
-    return (_jsxs("group", { ref: ref, ...handlers, children: [(node.children ?? []).map((childId) => (_jsx(NodeRenderer, { nodeId: childId }, childId))), showSiteSurfaces && showTerrain && (_jsx(TerrainRenderer, { holes: slabPolygons, material: groundMaterial, polygon: polygonPoints, site: node })), showSiteSurfaces && groundGeometry && !showTerrain && (_jsx("mesh", { geometry: groundGeometry, material: groundMaterial, position: [0, -0.05, 0], receiveShadow: true, rotation: [-Math.PI / 2, 0, 0] })), !immersiveXR && horizonGeometry && horizonMaterial && fadeBounds && (_jsx("mesh", { geometry: horizonGeometry, material: horizonMaterial, position: [fadeBounds.cx, horizonY, fadeBounds.cz], raycast: noopRaycast, receiveShadow: true, rotation: [-Math.PI / 2, 0, 0], userData: { pascalExport: 'strip' } })), showSiteSurfaces && ribbons && (_jsxs(_Fragment, { children: [_jsx("mesh", { frustumCulled: false, geometry: ribbons.property, raycast: noopRaycast, renderOrder: 9, children: _jsx("meshBasicMaterial", { color: "#1c1917", depthWrite: false, side: DoubleSide, toneMapped: false }) }), ribbons.envelope && (_jsx("mesh", { frustumCulled: false, geometry: ribbons.envelope, raycast: noopRaycast, renderOrder: 9, children: _jsx("meshBasicMaterial", { color: "#000000", depthWrite: false, opacity: 0.85, side: DoubleSide, toneMapped: false, transparent: true }) })), ribbons.triangles.map((g, i) => (_jsx("mesh", { frustumCulled: false, geometry: g, raycast: noopRaycast, renderOrder: 9, children: _jsx("meshBasicMaterial", { color: "#000000", depthWrite: false, opacity: 0.85, side: DoubleSide, toneMapped: false, transparent: true }) }, i))), _jsx("line", { frustumCulled: false, geometry: lineGeometry, renderOrder: 8, children: _jsx("lineBasicMaterial", { color: "#1c1917", opacity: 0.5, transparent: true }) })] })), showSiteSurfaces && !ribbons && (_jsx("line", { frustumCulled: false, geometry: lineGeometry, renderOrder: 9, children: _jsx("lineBasicMaterial", { color: "#f59e0b", linewidth: 2, opacity: 0.6, transparent: true }) })), showSiteSurfaces && contourGeometry && (_jsx("lineSegments", { frustumCulled: false, geometry: contourGeometry, raycast: noopRaycast, renderOrder: 8, children: _jsx("lineBasicMaterial", { color: "#000000", depthWrite: false, opacity: 0.22, toneMapped: false, transparent: true }) }))] }));
+    return (_jsxs("group", { ref: ref, ...handlers, children: [_jsx(GroundWindowSystem, {}), _jsx(GenericFoundation, {}), _jsx(GroundHole, { drawnFloorY: buried.drawnFloorY, floorY: buried.floorY, footprints: buried.shown, present: hasBasement, topAt: groundTopAt, topsoil: bgColor, topY: GROUND_FILL_POSITION[1] }), (node.children ?? []).map((childId) => (_jsx(NodeRenderer, { nodeId: childId }, childId))), showSiteSurfaces && showGround && showTerrain && (_jsx(TerrainRenderer, { holes: holes, material: groundMaterial, polygon: polygonPoints, site: node, veil: groundVeil })), showSiteSurfaces && showGround && groundGeometry && !showTerrain && (_jsxs(_Fragment, { children: [_jsx("mesh", { geometry: groundGeometry, material: groundMaterial, position: GROUND_FILL_POSITION, receiveShadow: true, rotation: FLAT_ON_THE_GROUND, userData: { [SITE_GROUND]: 'solid' } }), _jsx(GroundVeil, { geometry: groundGeometry, material: groundVeil, position: GROUND_FILL_POSITION, rotation: FLAT_ON_THE_GROUND })] })), showGround && !immersiveXR && horizonGeometry && horizonMaterial && fadeBounds && (_jsx("mesh", { geometry: horizonGeometry, material: horizonMaterial, position: [fadeBounds.cx, horizonY, fadeBounds.cz], raycast: noopRaycast, receiveShadow: true, rotation: FLAT_ON_THE_GROUND, userData: { pascalExport: 'strip', [SITE_GROUND]: 'solid' } })), showGround && !immersiveXR && horizonGeometry && horizonVeil && fadeBounds && (_jsx(GroundVeil, { geometry: horizonGeometry, material: horizonVeil, position: [fadeBounds.cx, horizonY, fadeBounds.cz], rotation: FLAT_ON_THE_GROUND })), showSiteSurfaces &&
+                gradeRings.map((geometry, index) => (_jsx(GroundVeil, { geometry: geometry, material: gradeRing, shows: "veiled" }, index))), showSiteSurfaces && ribbons && (_jsxs(_Fragment, { children: [_jsx("mesh", { frustumCulled: false, geometry: ribbons.property, raycast: noopRaycast, renderOrder: 9, children: _jsx("meshBasicMaterial", { color: "#1c1917", depthWrite: false, side: DoubleSide, toneMapped: false }) }), ribbons.envelope && (_jsx("mesh", { frustumCulled: false, geometry: ribbons.envelope, raycast: noopRaycast, renderOrder: 9, children: _jsx("meshBasicMaterial", { color: "#000000", depthWrite: false, opacity: 0.85, side: DoubleSide, toneMapped: false, transparent: true }) })), ribbons.triangles.map((g, i) => (_jsx("mesh", { frustumCulled: false, geometry: g, raycast: noopRaycast, renderOrder: 9, children: _jsx("meshBasicMaterial", { color: "#000000", depthWrite: false, opacity: 0.85, side: DoubleSide, toneMapped: false, transparent: true }) }, i))), _jsx("line", { frustumCulled: false, geometry: lineGeometry, renderOrder: 8, children: _jsx("lineBasicMaterial", { color: "#1c1917", opacity: 0.5, transparent: true }) })] })), showSiteSurfaces && !ribbons && (_jsx("line", { frustumCulled: false, geometry: lineGeometry, renderOrder: 9, children: _jsx("lineBasicMaterial", { color: "#f59e0b", linewidth: 2, opacity: 0.6, transparent: true }) })), showSiteSurfaces && contourGeometry && (_jsx("lineSegments", { frustumCulled: false, geometry: contourGeometry, raycast: noopRaycast, renderOrder: 8, children: _jsx("lineBasicMaterial", { color: "#000000", depthWrite: false, opacity: 0.22, toneMapped: false, transparent: true }) }))] }));
 };
 export default SiteRenderer;

package/dist/site/terrain-holes.d.ts

@@ -1,6 +1,6 @@
 import { type Ring } from '@pascal-app/core';
 import { BufferGeometry } from 'three';
-import type { TerrainMeshBuffers } from './terrain-geometry';
+import type { TerrainMeshBuffers } from './terrain-geometry.js';
 type Sample = {
     indices: number[];
     weights: number[];

package/dist/site/terrain-mesh.d.ts

@@ -1,7 +1,7 @@
 import type { HeightPatch, Ring, TerrainField } from '@pascal-app/core';
 import { BufferGeometry } from 'three';
-import { type TerrainMeshBuffers, type TerrainSkirtBuffers } from './terrain-geometry';
-import { type TerrainHoleBoundary } from './terrain-holes';
+import { type TerrainMeshBuffers, type TerrainSkirtBuffers } from './terrain-geometry.js';
+import { type TerrainHoleBoundary } from './terrain-holes.js';
 /**
  * The Three.js side of the terrain heightfield: owns the `BufferGeometry` and the
  * dirty-rect upload.

package/dist/site/terrain-mesh.js

@@ -1,6 +1,6 @@
 import { BufferAttribute, BufferGeometry, DynamicDrawUsage, Sphere } from 'three';
-import { buildTerrainMesh, buildTerrainSkirt, HORIZON_PLANE_Y, patchUpdateRange, SKIRT_DROP, updateTerrainMesh, updateTerrainSkirt, } from './terrain-geometry';
-import { cutTerrainHoles, updateTerrainHoleBoundary, } from './terrain-holes';
+import { buildTerrainMesh, buildTerrainSkirt, HORIZON_PLANE_Y, patchUpdateRange, SKIRT_DROP, updateTerrainMesh, updateTerrainSkirt, } from './terrain-geometry.js';
+import { cutTerrainHoles, updateTerrainHoleBoundary, } from './terrain-holes.js';
 /**
  * `ring` (from `skirtRing`) runs the skirt along the lot's property line instead
  * of the field's rectangle: the surface is cut to the lot by its material (see

package/dist/site/terrain-renderer.d.ts

@@ -19,9 +19,11 @@ import type { Material } from 'three';
  *   the editor layer, but moving actual scene geometry there would exclude it from
  *   the MRT depth/normal pass and break the screen-space ink against it.
  */
-export declare const TerrainRenderer: ({ material, site, holes, polygon, }: {
+export declare const TerrainRenderer: ({ material, veil, site, holes, polygon, }: {
     /** Owned by `SiteRenderer` so the ground material stays defined in one place. */
     material: Material;
+    /** The veil drawn in the ground's place over a level below grade, owned there too. */
+    veil: Material;
     site: SiteNode;
     holes: Ring[];
     /**

package/dist/site/terrain-renderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"terrain-renderer.d.ts","sourceRoot":"","sources":["../../src/site/terrain-renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAkC,MAAM,kBAAkB,CAAA;AAE3F,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAWrC;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,eAAe,GAAI,qCAK7B;IACD,iFAAiF;IACjF,QAAQ,EAAE,QAAQ,CAAA;IAClB,IAAI,EAAE,QAAQ,CAAA;IACd,KAAK,EAAE,IAAI,EAAE,CAAA;IACb;;;;OAIG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,GAAG,IAAI,CAAA;CAC1D,uCAoFA,CAAA;AAED,eAAe,eAAe,CAAA"}
+{"version":3,"file":"terrain-renderer.d.ts","sourceRoot":"","sources":["../../src/site/terrain-renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAkC,MAAM,kBAAkB,CAAA;AAG3F,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAYrC;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,eAAe,8CAMzB;IACD,iFAAiF;IACjF,QAAQ,EAAE,QAAQ,CAAA;IAClB,sFAAsF;IACtF,IAAI,EAAE,QAAQ,CAAA;IACd,IAAI,EAAE,QAAQ,CAAA;IACd,KAAK,EAAE,IAAI,EAAE,CAAA;IACb;;;;OAIG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,GAAG,IAAI,CAAA;CAC1D,uCA+GA,CAAA;eAEc,eAAe"}

package/dist/site/terrain-renderer.js

@@ -1,10 +1,12 @@
 'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { terrainFieldOf, useLiveTerrain } from '@pascal-app/core';
+import { SITE_GROUND } from '@pascal-app/viewer';
 import { useEffect, useMemo, useRef } from 'react';
-import { lotMaskedMaterial } from './lot-mask';
-import { skirtRing } from './terrain-geometry';
-import { applyTerrainPatch, createTerrainGeometry, disposeTerrainGeometry, needsRebuild, } from './terrain-mesh';
+import { GroundVeil } from './ground-veil.js';
+import { lotMaskedMaterial } from './lot-mask.js';
+import { skirtRing } from './terrain-geometry.js';
+import { applyTerrainPatch, createTerrainGeometry, disposeTerrainGeometry, needsRebuild, } from './terrain-mesh.js';
 /**
  * Renders the site's sculpted ground.
  *
@@ -24,7 +26,7 @@ import { applyTerrainPatch, createTerrainGeometry, disposeTerrainGeometry, needs
  *   the editor layer, but moving actual scene geometry there would exclude it from
  *   the MRT depth/normal pass and break the screen-space ink against it.
  */
-export const TerrainRenderer = ({ material, site, holes, polygon, }) => {
+export const TerrainRenderer = ({ material, veil, site, holes, polygon, }) => {
     const targetRef = useRef(null);
     // Persisted terrain only — the live stroke is applied imperatively below, so a
     // dab never triggers a React render.
@@ -43,6 +45,11 @@ export const TerrainRenderer = ({ material, site, holes, polygon, }) => {
         if (surfaceMaterial !== material)
             surfaceMaterial.dispose();
     }, [surfaceMaterial, material]);
+    const surfaceVeil = useMemo(() => (polygon && polygon.length >= 3 ? lotMaskedMaterial(veil, polygon) : veil), [veil, polygon]);
+    useEffect(() => () => {
+        if (surfaceVeil !== veil)
+            surfaceVeil.dispose();
+    }, [surfaceVeil, veil]);
     targetRef.current = target;
     useEffect(() => () => {
         if (target)
@@ -74,6 +81,6 @@ export const TerrainRenderer = ({ material, site, holes, polygon, }) => {
     }, [site.id]);
     if (!target)
         return null;
-    return (_jsxs(_Fragment, { children: [_jsx("mesh", { castShadow: true, geometry: target.geometry, material: surfaceMaterial, receiveShadow: true }), target.holeBoundary && (_jsx("mesh", { castShadow: true, geometry: target.holeBoundary.geometry, material: surfaceMaterial, receiveShadow: true })), _jsx("mesh", { geometry: target.skirt.geometry, material: material, receiveShadow: true })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("mesh", { castShadow: true, geometry: target.geometry, material: surfaceMaterial, receiveShadow: true, userData: { [SITE_GROUND]: 'solid' } }), _jsx(GroundVeil, { geometry: target.geometry, material: surfaceVeil }), target.holeBoundary && (_jsxs(_Fragment, { children: [_jsx("mesh", { castShadow: true, geometry: target.holeBoundary.geometry, material: surfaceMaterial, receiveShadow: true, userData: { [SITE_GROUND]: 'solid' } }), _jsx(GroundVeil, { geometry: target.holeBoundary.geometry, material: surfaceVeil })] })), _jsx("mesh", { geometry: target.skirt.geometry, material: material, receiveShadow: true, userData: { [SITE_GROUND]: 'solid' } }), _jsx(GroundVeil, { geometry: target.skirt.geometry, material: veil })] }));
 };
 export default TerrainRenderer;

package/dist/site/underground-edge.d.ts

@@ -0,0 +1,26 @@
+import type { UndergroundEdge } from '@pascal-app/viewer';
+/**
+ * The hole's edge looks (`UndergroundEdge`), as numbers: the ground's mask and its rim read them
+ * as uniforms and the pit's walls as uniforms and a CPU contour, so changing the look compiles
+ * nothing. `noise` is the shipped one; the others are variants to choose from.
+ */
+export type EdgeLook = {
+    /** The hole's base margin around the footprint, in metres. */
+    margin: number;
+    /** How far the noise moves the edge in or out of the margin, in metres (0: a constant offset). */
+    erode: number;
+    /** Noise cells per metre on the ground, of the broadest octave. */
+    scale: number;
+    /** The soft shade on the ground side of the cut: its width in metres and how dark it gets. */
+    featherWidth: number;
+    featherStrength: number;
+    /** The thin line along the cut: its width in metres and colour. */
+    lineWidth: number;
+    lineColor: string;
+    /** How far (m) the pit's walls are roughened sideways in depth. */
+    crumble: number;
+    /** 1: the wall is a flat section face with a line at grade, not strata under a topsoil layer. */
+    section: number;
+};
+export declare const EDGE_LOOKS: Record<UndergroundEdge, EdgeLook>;
+//# sourceMappingURL=underground-edge.d.ts.map

package/dist/site/underground-edge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"underground-edge.d.ts","sourceRoot":"","sources":["../../src/site/underground-edge.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAEzD;;;;GAIG;AACH,MAAM,MAAM,QAAQ,GAAG;IACrB,8DAA8D;IAC9D,MAAM,EAAE,MAAM,CAAA;IACd,kGAAkG;IAClG,KAAK,EAAE,MAAM,CAAA;IACb,mEAAmE;IACnE,KAAK,EAAE,MAAM,CAAA;IACb,8FAA8F;IAC9F,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,MAAM,CAAA;IACvB,mEAAmE;IACnE,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;IACjB,mEAAmE;IACnE,OAAO,EAAE,MAAM,CAAA;IACf,iGAAiG;IACjG,OAAO,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,eAAe,EAAE,QAAQ,CA6CxD,CAAA"}

package/dist/site/underground-edge.js

@@ -0,0 +1,46 @@
+export const EDGE_LOOKS = {
+    noise: {
+        margin: 1.6,
+        erode: 0.9,
+        scale: 0.6,
+        featherWidth: 0.55,
+        featherStrength: 0.6,
+        lineWidth: 0.09,
+        lineColor: '#f4f4f4',
+        crumble: 0.9,
+        section: 0,
+    },
+    quiet: {
+        margin: 1.6,
+        erode: 0.15,
+        scale: 2.4,
+        featherWidth: 0.55,
+        featherStrength: 0.6,
+        lineWidth: 0.09,
+        lineColor: '#f4f4f4',
+        crumble: 0.25,
+        section: 0,
+    },
+    section: {
+        margin: 0.6,
+        erode: 0,
+        scale: 0.6,
+        featherWidth: 0.25,
+        featherStrength: 0.4,
+        lineWidth: 0.07,
+        lineColor: '#2b2b2b',
+        crumble: 0,
+        section: 1,
+    },
+    'section-earth': {
+        margin: 0.6,
+        erode: 0,
+        scale: 0.6,
+        featherWidth: 0.25,
+        featherStrength: 0.4,
+        lineWidth: 0.07,
+        lineColor: '#2b2b2b',
+        crumble: 0.25,
+        section: 0,
+    },
+};

package/dist/skylight/definition.d.ts

@@ -1,5 +1,5 @@
 import { type NodeDefinition } from '@pascal-app/core';
-import { SkylightNode } from './schema';
+import { SkylightNode } from './schema.js';
 /**
  * Skylight — a framed glass opening hosted on a roof segment. All five
  * type variants (flat / walk-on / lantern / opening / sliding) render

package/dist/skylight/definition.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"definition.d.ts","sourceRoot":"","sources":["../../src/skylight/definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,cAAc,EAIpB,MAAM,kBAAkB,CAAA;AASzB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAoMvC;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,cAAc,CAAC,OAAO,YAAY,CAkFlE,CAAA"}
+{"version":3,"file":"definition.d.ts","sourceRoot":"","sources":["../../src/skylight/definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,cAAc,EAIpB,MAAM,kBAAkB,CAAA;AASzB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAoMvC;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,cAAc,CAAC,OAAO,YAAY,CAmFlE,CAAA"}

package/dist/skylight/definition.js

@@ -1,9 +1,9 @@
 import { SkylightNode as SkylightNodeSchema, } from '@pascal-app/core';
-import { buildSkylightFloorplan } from './floorplan';
-import { closeSkylightOpenState, isOperableSkylightNode, toggleSkylightOpenState, } from './interaction';
-import { skylightParametrics } from './parametrics';
-import { buildSkylightRoofCut } from './roof-cut';
-import { SkylightNode } from './schema';
+import { buildSkylightFloorplan } from './floorplan.js';
+import { closeSkylightOpenState, isOperableSkylightNode, toggleSkylightOpenState, } from './interaction.js';
+import { skylightParametrics } from './parametrics.js';
+import { buildSkylightRoofCut } from './roof-cut.js';
+import { SkylightNode } from './schema.js';
 // In-world handle constants. Offsets are measured from the skylight's
 // edge to the arrow's CENTER, so they need to clear half the chevron's
 // own length (~13 cm at default scale) plus the frame's outward depth
@@ -212,6 +212,7 @@ export const skylightDefinition = {
         return rest;
     },
     capabilities: {
+        exterior: true,
         selectable: { hitVolume: 'bbox' },
         duplicable: true,
         deletable: true,
@@ -229,16 +230,16 @@ export const skylightDefinition = {
     rendersChildren: false,
     renderer: {
         kind: 'parametric',
-        module: () => import('./renderer'),
+        module: () => import('./renderer.js'),
     },
-    preview: () => import('./preview'),
+    preview: () => import('./preview.js'),
     system: {
-        module: () => import('./system'),
+        module: () => import('./system.js'),
         priority: 3,
     },
-    tool: () => import('./tool'),
+    tool: () => import('./tool.js'),
     affordanceTools: {
-        move: () => import('./move-tool'),
+        move: () => import('./move-tool.js'),
     },
     toolHints: [
         { key: 'Left click', label: 'Place skylight on roof' },

package/dist/skylight/geometry.d.ts

@@ -1,5 +1,5 @@
 import * as THREE from 'three';
-import { getAnalyticalNormal, getSurfaceY } from '../shared/roof-surface';
+import { getAnalyticalNormal, getSurfaceY } from '../shared/roof-surface.js';
 export { getAnalyticalNormal, getSurfaceY };
 export declare function paneSize(value: number): number;
 export declare function clamp01(value: number): number;

package/dist/skylight/geometry.js

@@ -1,5 +1,5 @@
 import * as THREE from 'three';
-import { getAnalyticalNormal, getSurfaceY } from '../shared/roof-surface';
+import { getAnalyticalNormal, getSurfaceY } from '../shared/roof-surface.js';
 export { getAnalyticalNormal, getSurfaceY };
 export function paneSize(value) {
     return Math.max(0.02, value);

package/dist/skylight/index.d.ts

@@ -1,5 +1,5 @@
-export { skylightDefinition } from './definition';
-export { buildFrameGeometry } from './frame-csg';
-export { buildLanternGlassGeometry } from './geometry';
-export { SkylightNode } from './schema';
+export { skylightDefinition } from './definition.js';
+export { buildFrameGeometry } from './frame-csg.js';
+export { buildLanternGlassGeometry } from './geometry.js';
+export { SkylightNode } from './schema.js';
 //# sourceMappingURL=index.d.ts.map