@pascal-app/nodes 1.0.6 → 1.1.0

package/dist/roof/floorplan.js

@@ -1,6 +1,7 @@
-import { getGlazedRoofPlanLines, getRoofSegmentVisibleTopBounds, roofPlanOverlapEntryOwns, subtractPolygonsFromPolygon, unionPolygons, } from '@pascal-app/core';
+import { getGlazedRoofPlanLines, getRoofSegmentVisibleTopBounds, getSegmentSlopeFrame, roofPlanOverlapEntryOwns, subtractPolygonsFromPolygon, unionPolygons, } from '@pascal-app/core';
 import { floorplanGeometryMetadata, readFloorplanContext } from '@pascal-app/editor';
 import { getConicalRoofPlanFootprint, getRoofSegmentPlanLinework } from '../roof-segment/floorplan.js';
+import { getRoofSurfaceCreases } from './roof-plan-creases.js';
 /**
  * `roof-segment.pitch` is stored in DEGREES; a roof plan is annotated as the
  * rise over a 12 run. 30.256° → tan 0.5833 × 12 → 7.00 → '7:12'. Rounded to
@@ -78,6 +79,34 @@ function overlapEntry(entry, ctx) {
         depth: entry.segment.depth,
     };
 }
+/**
+ * A planar form's roof planes in segment-local plan coordinates, each as
+ * `[gx, gz, c]` with height `c + gx·lx + gz·lz` above the eave: every slope
+ * rises at the pitch from its eave line. `null` for the forms with curved or
+ * broken slopes, which keep their own linework.
+ */
+function localRoofPlanes(seg) {
+    const hw = Math.max(seg.width, 0.01) / 2;
+    const hd = Math.max(seg.depth, 0.01) / 2;
+    const tan = getSegmentSlopeFrame(seg).tanTheta;
+    const towardPlusZ = [0, -tan, tan * hd];
+    const towardMinusZ = [0, tan, tan * hd];
+    const towardPlusX = [-tan, 0, tan * hw];
+    const towardMinusX = [tan, 0, tan * hw];
+    switch (seg.roofType) {
+        case 'flat':
+            return [[0, 0, 0]];
+        case 'shed':
+            // high eave at lz = −hd, falling to +hd, as the 3D builder slopes it
+            return [towardPlusZ];
+        case 'gable':
+            return [towardPlusZ, towardMinusZ];
+        case 'hip':
+            return [towardPlusZ, towardMinusZ, towardPlusX, towardMinusX];
+        default:
+            return null;
+    }
+}
 /** A segment's footprint + ridge/hip/break/slope linework, in world plan coords. */
 function buildSegPlan(roof, seg, drafting) {
     const cosRoof = Math.cos(-roof.rotation);
@@ -93,18 +122,48 @@ function buildSegPlan(roof, seg, drafting) {
     ];
     const hw = Math.max(seg.width, 0.01) / 2;
     const hd = Math.max(seg.depth, 0.01) / 2;
+    const conical = seg.roofType === 'conical';
+    // The drip edge: core's own visible-top bounds, which add the horizontal
+    // component of `overhang` (plus half the wall thickness and, on the sloped
+    // faces, the shingle projection) to the footprint on each side.
+    const edge = getRoofSegmentVisibleTopBounds(seg);
+    // In the editor a line that ends on the wall line runs on to the eave or
+    // rake, as the 3D's hips, ridges and slope breaks do.
+    const toEdge = (v, half, min, max) => Math.abs(v - half) < 1e-6 ? max : Math.abs(v + half) < 1e-6 ? min : v;
+    const reach = drafting || conical ? null : edge;
+    const mapSeg = (s) => s.map(([lx, lz]) => reach
+        ? tp(toEdge(lx, hw, reach.minX, reach.maxX), toEdge(lz, hd, reach.minZ, reach.maxZ))
+        : tp(lx, lz));
     const lw = getRoofSegmentPlanLinework(seg);
-    const mapSeg = (s) => [
-        tp(s[0][0], s[0][1]),
-        tp(s[1][0], s[1][1]),
-    ];
-    const footprint = seg.roofType === 'conical'
+    const footprint = conical
         ? getConicalRoofPlanFootprint(seg).map(([x, z]) => tp(x, z))
         : [tp(-hw, -hd), tp(hw, -hd), tp(hw, hd), tp(-hw, hd)];
+    const eave = [
+        tp(edge.minX, edge.minZ),
+        tp(edge.maxX, edge.minZ),
+        tp(edge.maxX, edge.maxZ),
+        tp(edge.minX, edge.maxZ),
+    ];
+    const outline = reach ? eave : footprint;
     const ridges = lw.ridges.map(mapSeg);
     const hips = lw.hips.map(mapSeg);
     const breaks = lw.breaks.map(mapSeg);
-    const glazing = getGlazedRoofPlanLines(seg).map(mapSeg);
+    const glazing = getGlazedRoofPlanLines(seg).map(([a, b]) => [tp(a[0], a[1]), tp(b[0], b[1])]);
+    const local = localRoofPlanes(seg);
+    // Heights in the roof's level frame, so the planes of two roofs side by side
+    // compare. The planes run on past the wall line, as the overhang does.
+    const base = roof.position[1] + seg.position[1] + seg.wallHeight;
+    const surface = local
+        ? {
+            roofId: String(roof.id),
+            footprint: outline,
+            planes: local.map(([gx, gz, c0]) => {
+                const a = gx * cos - gz * sin;
+                const b = gx * sin + gz * cos;
+                return { a, b, c: base + c0 - a * segCx - b * segCz };
+            }),
+        }
+        : null;
     if (!drafting) {
         const slopes = lw.slope
             ? [
@@ -115,25 +174,18 @@ function buildSegPlan(roof, seg, drafting) {
                 },
             ]
             : [];
-        return { footprint, eave: footprint, ridges, hips, breaks, glazing, slopes };
+        return { footprint, eave, outline, ridges, hips, breaks, glazing, slopes, surface };
     }
-    // The drip edge: core's own visible-top bounds, which add the horizontal
-    // component of `overhang` (plus half the wall thickness and, on the sloped
-    // faces, the shingle projection) to the footprint on each side.
-    const edge = getRoofSegmentVisibleTopBounds(seg);
     const pitch = seg.roofType === 'barrel' ? '' : roofPitchLabel(seg.pitch);
     return {
         footprint,
-        eave: [
-            tp(edge.minX, edge.minZ),
-            tp(edge.maxX, edge.minZ),
-            tp(edge.maxX, edge.maxZ),
-            tp(edge.minX, edge.maxZ),
-        ],
+        eave,
+        outline,
         ridges,
         hips,
         breaks,
         glazing,
+        surface,
         slopes: slopeArrows(seg).map((arrow) => ({
             tail: tp(arrow.tail[0], arrow.tail[1]),
             head: tp(arrow.head[0], arrow.head[1]),
@@ -234,26 +286,25 @@ export function buildRoofFloorplan(node, ctx) {
         }
     }
     const currentEntries = entries.filter((entry) => entry.roof.id === node.id);
+    const owningCandidates = (entry) => entries.filter((candidate) => {
+        if (candidate.segment.id === entry.segment.id)
+            return false;
+        if (candidate.segment.roofType === 'shed')
+            return false;
+        return roofPlanOverlapEntryOwns(overlapEntry(candidate, ctx), overlapEntry(entry, ctx));
+    });
     const visiblePlans = currentEntries.map((entry) => {
-        const cutters = entries
-            .filter((candidate) => {
-            if (candidate.segment.id === entry.segment.id)
-                return false;
-            if (candidate.segment.roofType === 'shed')
-                return false;
-            return roofPlanOverlapEntryOwns(overlapEntry(candidate, ctx), overlapEntry(entry, ctx));
-        })
-            .map((candidate) => candidate.plan.footprint);
+        const cutters = owningCandidates(entry).map((candidate) => candidate.plan.outline);
         return {
             plan: entry.plan,
             cutters,
-            footprints: subtractPolygonsFromPolygon(entry.plan.footprint, cutters),
+            outlines: subtractPolygonsFromPolygon(entry.plan.outline, cutters),
             eaves: subtractPolygonsFromPolygon(entry.plan.eave, cutters),
             /** True when the drip edge is far enough outside the wall line to draw. */
             hasOverhang: drafting && polygonSpread(entry.plan.eave) - polygonSpread(entry.plan.footprint) > 0.04,
         };
     });
-    const rings = unionPolygons(visiblePlans.flatMap(({ footprints }) => footprints));
+    const rings = unionPolygons(visiblePlans.flatMap(({ outlines }) => outlines));
     if (rings.length === 0)
         return null;
     const eaveRings = unionPolygons(visiblePlans.flatMap(({ eaves, hasOverhang }) => (hasOverhang ? eaves : [])));
@@ -303,7 +354,7 @@ export function buildRoofFloorplan(node, ctx) {
             pointerEvents: 'none',
         });
     }
-    // Merged outline (wall line under the roof).
+    // Merged outline: the eave and rake in the editor, the wall line on a sheet.
     for (const ring of rings) {
         if (ring.length < 3)
             continue;
@@ -317,24 +368,63 @@ export function buildRoofFloorplan(node, ctx) {
             pointerEvents: 'none',
         });
     }
+    // Selected or moved, the wall line each segment stands on: whether the roof sits on the walls'
+    // centre lines (a selected segment draws its own).
+    if (!drafting && palette && ((view?.moving ?? false) || showSelectedChrome)) {
+        for (const { plan } of visiblePlans) {
+            children.push({
+                kind: 'polygon',
+                points: plan.footprint.map(([x, z]) => [x, z]),
+                fill: 'none',
+                stroke: palette.selectedStroke,
+                strokeWidth: 0.035,
+                strokeLinejoin: 'miter',
+                pointerEvents: 'none',
+            });
+        }
+    }
+    // Ridges, hips and valleys of the planar segments, off the surface they make
+    // together with this level's other roofs: a wing's ridge runs on until it
+    // meets the main roof's slope, and a valley runs where the two slopes meet.
+    // The curved and broken forms are not in that surface: where one owns an
+    // overlap it cuts these lines as before.
+    const planarEntries = entries.filter((entry) => entry.plan.surface);
+    const curvedCutters = (entry) => owningCandidates(entry)
+        .filter((candidate) => !candidate.plan.surface)
+        .map((candidate) => candidate.plan.outline);
+    for (const crease of getRoofSurfaceCreases(planarEntries.map((entry) => entry.plan.surface))) {
+        if (crease.roofId !== String(node.id))
+            continue;
+        const [i, k] = crease.between;
+        const cutters = [
+            ...curvedCutters(planarEntries[i]),
+            ...(k === i ? [] : curvedCutters(planarEntries[k])),
+        ];
+        const width = crease.kind === 'ridge' ? ridgeWidth : hipWidth;
+        for (const visible of clipLineByCutters([crease.from, crease.to], cutters))
+            pushLine(visible[0], visible[1], width);
+    }
     for (const { plan, cutters } of visiblePlans) {
         for (const line of plan.glazing) {
             for (const visible of clipLineByCutters(line, cutters))
                 pushLine(visible[0], visible[1], hipWidth);
         }
-        for (const line of plan.breaks) {
-            for (const visible of clipLineByCutters(line, cutters)) {
-                pushLine(visible[0], visible[1], hipWidth);
+        // A planar segment's ridges and hips were drawn off the shared surface above.
+        if (!plan.surface) {
+            for (const line of plan.breaks) {
+                for (const visible of clipLineByCutters(line, cutters)) {
+                    pushLine(visible[0], visible[1], hipWidth);
+                }
             }
-        }
-        for (const line of plan.hips) {
-            for (const visible of clipLineByCutters(line, cutters)) {
-                pushLine(visible[0], visible[1], hipWidth);
+            for (const line of plan.hips) {
+                for (const visible of clipLineByCutters(line, cutters)) {
+                    pushLine(visible[0], visible[1], hipWidth);
+                }
             }
-        }
-        for (const line of plan.ridges) {
-            for (const visible of clipLineByCutters(line, cutters)) {
-                pushLine(visible[0], visible[1], ridgeWidth);
+            for (const line of plan.ridges) {
+                for (const visible of clipLineByCutters(line, cutters)) {
+                    pushLine(visible[0], visible[1], ridgeWidth);
+                }
             }
         }
         // One down-slope arrow per roof plane, each tagged with the pitch in

package/dist/roof/geometry-notice.d.ts

@@ -0,0 +1,5 @@
+import { type AnyNodeId } from '@pascal-app/core';
+export declare function RoofGeometryNotice({ ids }: {
+    ids: readonly AnyNodeId[];
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=geometry-notice.d.ts.map

package/dist/roof/geometry-notice.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"geometry-notice.d.ts","sourceRoot":"","sources":["../../src/roof/geometry-notice.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAA2B,MAAM,kBAAkB,CAAA;AAI1E,wBAAgB,kBAAkB,CAAC,EAAE,GAAG,EAAE,EAAE;IAAE,GAAG,EAAE,SAAS,SAAS,EAAE,CAAA;CAAE,sCA+BxE"}

package/dist/roof/geometry-notice.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { usePascalI18n, useScene } from '@pascal-app/core';
+import { ActionButton } from '@pascal-app/editor';
+import { useGeometryStatus } from '@pascal-app/viewer';
+export function RoofGeometryNotice({ ids }) {
+    const i18n = usePascalI18n();
+    const failures = useGeometryStatus((state) => state.failures);
+    const failedId = ids.find((id) => failures.has(id));
+    if (!failedId)
+        return null;
+    return (_jsxs("div", { role: "alert", className: "mx-3 my-2 rounded-md border border-amber-500/40 p-3 text-xs", children: [_jsx("p", { children: failures.get(failedId) === 'invalid-geometry'
+                    ? i18n._({
+                        id: 'node.roof.geometryNotice.roofGeometryIsInvalidThePrevious',
+                        message: 'Roof geometry is invalid. The previous shape is still shown. Adjust the dimensions or intersections and retry.',
+                    })
+                    : i18n._({
+                        id: 'node.roof.geometryNotice.roofGeometryCouldNotBeRebuilt',
+                        message: 'Roof geometry could not be rebuilt. The previous shape is still shown. Adjust the dimensions or intersections and retry.',
+                    }) }), _jsx(ActionButton, { label: i18n._({
+                    id: 'node.roof.geometryNotice.retryRoofGeometry',
+                    message: 'Retry roof geometry',
+                }), onClick: () => {
+                    for (const id of ids)
+                        if (failures.has(id))
+                            useScene.getState().markDirty(id);
+                } })] }));
+}

package/dist/roof/glazing-controls.d.ts

@@ -1,4 +1,5 @@
 import type { CurtainGrid, RoofGlazing } from '@pascal-app/core';
+import { type MessageDescriptor } from '@pascal-app/core';
 import type { createRoofGlazingPreview } from './glazing-preview.js';
 type Preview = ReturnType<typeof createRoofGlazingPreview>;
 type NumberField = 'frameWidth' | 'frameDepth' | 'glassThickness' | 'glassOpacity' | 'glassRoughness';
@@ -27,7 +28,7 @@ export declare function GlazingColor({ field, label, value, mixed, preview, }: {
 }): import("react").JSX.Element;
 export declare const GLAZING_INFILL_OPTIONS: {
     value: RoofGlazing['panelType'];
-    label: string;
+    label: MessageDescriptor;
 }[];
 export {};
 //# sourceMappingURL=glazing-controls.d.ts.map

package/dist/roof/glazing-controls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"glazing-controls.d.ts","sourceRoot":"","sources":["../../src/roof/glazing-controls.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAYhE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAA;AAEjE,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAA;AAC1D,KAAK,WAAW,GACZ,YAAY,GACZ,YAAY,GACZ,gBAAgB,GAChB,cAAc,GACd,gBAAgB,CAAA;AAEpB,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,KAAK,EACL,KAAK,EACL,OAAO,EACP,QAAgB,EAChB,KAAa,GACd,EAAE;IACD,KAAK,EAAE,WAAW,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,+BAiCA;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,OAAO,GACR,EAAE;IACD,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAA;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,WAAW,CAAA;IACjB,KAAK,EAAE,SAAS,WAAW,EAAE,CAAA;IAC7B,OAAO,EAAE,OAAO,CAAA;CACjB,+BA+EA;AAED,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,OAAO,GACR,EAAE;IACD,KAAK,EAAE,YAAY,GAAG,YAAY,CAAA;IAClC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,OAAO,CAAA;IACd,OAAO,EAAE,OAAO,CAAA;CACjB,+BAwBA;AAED,eAAO,MAAM,sBAAsB,EAAE;IAAE,KAAK,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,EAItF,CAAA"}
+{"version":3,"file":"glazing-controls.d.ts","sourceRoot":"","sources":["../../src/roof/glazing-controls.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAChE,OAAO,EAGL,KAAK,iBAAiB,EAGvB,MAAM,kBAAkB,CAAA;AAIzB,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAA;AAEjE,KAAK,OAAO,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAA;AAC1D,KAAK,WAAW,GACZ,YAAY,GACZ,YAAY,GACZ,gBAAgB,GAChB,cAAc,GACd,gBAAgB,CAAA;AAEpB,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,KAAK,EACL,KAAK,EACL,OAAO,EACP,QAAgB,EAChB,KAAa,GACd,EAAE;IACD,KAAK,EAAE,WAAW,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,+BAiCA;AAED,wBAAgB,mBAAmB,CAAC,EAClC,IAAI,EACJ,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,OAAO,GACR,EAAE;IACD,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAA;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,WAAW,CAAA;IACjB,KAAK,EAAE,SAAS,WAAW,EAAE,CAAA;IAC7B,OAAO,EAAE,OAAO,CAAA;CACjB,+BA2HA;AAED,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,OAAO,GACR,EAAE;IACD,KAAK,EAAE,YAAY,GAAG,YAAY,CAAA;IAClC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,OAAO,CAAA;IACd,OAAO,EAAE,OAAO,CAAA;CACjB,+BA2BA;AAED,eAAO,MAAM,sBAAsB,EAAE;IACnC,KAAK,EAAE,WAAW,CAAC,WAAW,CAAC,CAAA;IAC/B,KAAK,EAAE,iBAAiB,CAAA;CACzB,EAIA,CAAA"}

package/dist/roof/glazing-controls.js

@@ -1,6 +1,7 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getLinearUnitLabel, linearControlValueToMeters, metersToLinearUnit, PanelSection, SegmentedControl, SelectControl, SliderControl, } from '@pascal-app/editor';
+import { getLinearUnitLabel, linearControlValueToMeters, metersToLinearUnit, usePascalI18n, } from '@pascal-app/core';
+import { PanelSection, SegmentedControl, SelectControl, SliderControl } from '@pascal-app/editor';
 import { useViewer } from '@pascal-app/viewer';
 import { useCallback } from 'react';
 export function GlazingNumber({ field, label, value, preview, fraction = false, mixed = false, }) {
@@ -18,6 +19,7 @@ export function GlazingNumber({ field, label, value, preview, fraction = false,
     return (_jsx(SliderControl, { label: label, value: fraction ? value * 100 : display(value), mixed: mixed, min: fraction ? (field === 'glassOpacity' ? 5 : 0) : display(0.001), max: fraction ? 100 : undefined, unit: fraction ? '%' : millimeters ? 'mm' : getLinearUnitLabel(unit), precision: fraction ? 0 : millimeters ? 1 : 3, step: fraction || millimeters ? 1 : 0.005, onChange: onChange, onCommit: preview.finish, onCancel: preview.cancel, restoreOnCommit: false, previewWhileTyping: true }));
 }
 export function GlazingGridControls({ axis, title, description, grid, grids, preview, }) {
+    const i18n = usePascalI18n();
     const unit = useViewer((state) => state.unit);
     const patch = useCallback((data, commit = false) => {
         preview.previewGlazing((config) => ({ ...config, [axis]: { ...config[axis], ...data } }));
@@ -25,26 +27,62 @@ export function GlazingGridControls({ axis, title, description, grid, grids, pre
             preview.commit();
     }, [axis, preview]);
     const mixedLayout = grids.some((value) => value.layout !== grid.layout);
-    return (_jsxs(PanelSection, { title: title, children: [_jsx(SelectControl, { label: "Layout", value: grid.layout, mixed: mixedLayout, options: [
-                    { value: 'maximum-spacing', label: 'Maximum spacing' },
-                    { value: 'count', label: 'Panel count' },
-                    { value: 'fixed-spacing', label: 'Fixed spacing' },
-                ], onChange: (layout) => patch({ layout }, true) }), mixedLayout ? (_jsx("p", { className: "pt-1 text-[11px] text-muted-foreground", children: "Choose a layout to edit the grid." })) : grid.layout === 'count' ? (_jsx(SliderControl, { label: "Panels", value: grid.count, mixed: grids.some((value) => value.count !== grid.count), min: 1, max: 32, step: 1, precision: 0, onChange: (count) => patch({ count: Math.round(count) }), onCommit: preview.finish, onCancel: preview.cancel, restoreOnCommit: false, previewWhileTyping: true })) : (_jsx(SliderControl, { label: grid.layout === 'maximum-spacing' ? 'Max spacing' : 'Spacing', value: metersToLinearUnit(grid.spacing, unit), mixed: grids.some((value) => value.spacing !== grid.spacing), min: metersToLinearUnit(0.2, unit), max: metersToLinearUnit(100, unit), unit: getLinearUnitLabel(unit), step: 0.05, precision: 2, onChange: (input) => patch({
+    return (_jsxs(PanelSection, { title: title, children: [_jsx(SelectControl, { label: i18n._({ id: 'node.roof.glazingControls.layout', message: 'Layout' }), value: grid.layout, mixed: mixedLayout, options: [
+                    {
+                        value: 'maximum-spacing',
+                        label: i18n._({
+                            id: 'node.roof.glazingControls.maximumSpacing',
+                            message: 'Maximum spacing',
+                        }),
+                    },
+                    {
+                        value: 'count',
+                        label: i18n._({ id: 'node.roof.glazingControls.panelCount', message: 'Panel count' }),
+                    },
+                    {
+                        value: 'fixed-spacing',
+                        label: i18n._({
+                            id: 'node.roof.glazingControls.fixedSpacing',
+                            message: 'Fixed spacing',
+                        }),
+                    },
+                ], onChange: (layout) => patch({ layout }, true) }), mixedLayout ? (_jsx("p", { className: "pt-1 text-[11px] text-muted-foreground", children: i18n._({
+                    id: 'node.roof.glazingControls.chooseALayoutToEditThe',
+                    message: 'Choose a layout to edit the grid.',
+                }) })) : grid.layout === 'count' ? (_jsx(SliderControl, { label: i18n._({ id: 'node.roof.glazingControls.panels', message: 'Panels' }), value: grid.count, mixed: grids.some((value) => value.count !== grid.count), min: 1, max: 32, step: 1, precision: 0, onChange: (count) => patch({ count: Math.round(count) }), onCommit: preview.finish, onCancel: preview.cancel, restoreOnCommit: false, previewWhileTyping: true })) : (_jsx(SliderControl, { label: grid.layout === 'maximum-spacing'
+                    ? i18n._({ id: 'node.roof.glazingControls.maxSpacing', message: 'Max spacing' })
+                    : i18n._({ id: 'node.roof.glazingControls.spacing', message: 'Spacing' }), value: metersToLinearUnit(grid.spacing, unit), mixed: grids.some((value) => value.spacing !== grid.spacing), min: metersToLinearUnit(0.2, unit), max: metersToLinearUnit(100, unit), unit: getLinearUnitLabel(unit), step: 0.05, precision: 2, onChange: (input) => patch({
                     spacing: linearControlValueToMeters(input, unit, { minMeters: 0.2, maxMeters: 100 }),
-                }), onCommit: preview.finish, onCancel: preview.cancel, restoreOnCommit: false, previewWhileTyping: true })), !mixedLayout && grid.layout === 'fixed-spacing' && (_jsxs("div", { className: "flex flex-col gap-2 pt-1", role: "group", "aria-label": `${title} alignment`, children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "Alignment" }), _jsx(SegmentedControl, { value: grid.alignment, mixed: grids.some((value) => value.alignment !== grid.alignment), options: [
-                            { value: 'start', label: 'Start' },
-                            { value: 'center', label: 'Center' },
-                            { value: 'end', label: 'End' },
+                }), onCommit: preview.finish, onCancel: preview.cancel, restoreOnCommit: false, previewWhileTyping: true })), !mixedLayout && grid.layout === 'fixed-spacing' && (_jsxs("div", { className: "flex flex-col gap-2 pt-1", role: "group", "aria-label": i18n._({
+                    id: 'node.roof.glazingControls.titleAlignment',
+                    message: '{title} alignment',
+                    values: { title },
+                }), children: [_jsx("span", { className: "text-xs text-muted-foreground", children: i18n._({ id: 'node.roof.glazingControls.alignment', message: 'Alignment' }) }), _jsx(SegmentedControl, { value: grid.alignment, mixed: grids.some((value) => value.alignment !== grid.alignment), options: [
+                            {
+                                value: 'start',
+                                label: i18n._({ id: 'node.roof.glazingControls.start', message: 'Start' }),
+                            },
+                            {
+                                value: 'center',
+                                label: i18n._({ id: 'node.roof.glazingControls.center', message: 'Center' }),
+                            },
+                            {
+                                value: 'end',
+                                label: i18n._({ id: 'node.roof.glazingControls.end', message: 'End' }),
+                            },
                         ], onChange: (alignment) => patch({ alignment }, true) })] })), _jsx("p", { className: "pt-1 text-[11px] leading-relaxed text-muted-foreground", children: description })] }));
 }
 export function GlazingColor({ field, label, value, mixed, preview, }) {
-    return (_jsxs("label", { className: "flex h-10 items-center justify-between gap-2 rounded-lg border border-border/50 bg-[#2C2C2E] px-3 text-xs", children: [_jsx("span", { className: "text-muted-foreground", children: label }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx("span", { className: "font-mono text-[11px] text-foreground", children: mixed ? 'Mixed' : value.toUpperCase() }), _jsx("input", { "aria-label": label, type: "color", value: value, className: "size-6 cursor-pointer overflow-hidden rounded border border-border/50 bg-transparent p-0 focus-visible:outline-2 focus-visible:outline-ring", onChange: (event) => preview.previewGlazing((config) => ({ ...config, [field]: event.target.value })), onBlur: preview.finish, onKeyDown: (event) => {
+    const i18n = usePascalI18n();
+    return (_jsxs("label", { className: "flex h-10 items-center justify-between gap-2 rounded-lg border border-border/50 bg-[#2C2C2E] px-3 text-xs", children: [_jsx("span", { className: "text-muted-foreground", children: label }), _jsxs("span", { className: "flex items-center gap-2", children: [_jsx("span", { className: "font-mono text-[11px] text-foreground", children: mixed
+                            ? i18n._({ id: 'node.roof.glazingControls.mixed', message: 'Mixed' })
+                            : value.toUpperCase() }), _jsx("input", { "aria-label": label, type: "color", value: value, className: "size-6 cursor-pointer overflow-hidden rounded border border-border/50 bg-transparent p-0 focus-visible:outline-2 focus-visible:outline-ring", onChange: (event) => preview.previewGlazing((config) => ({ ...config, [field]: event.target.value })), onBlur: preview.finish, onKeyDown: (event) => {
                             if (event.key === 'Escape')
                                 preview.cancel();
                         } })] })] }));
 }
 export const GLAZING_INFILL_OPTIONS = [
-    { value: 'glass', label: 'Glass' },
-    { value: 'solid', label: 'Solid' },
-    { value: 'empty', label: 'Empty' },
+    { value: 'glass', label: /* i18n */ { id: 'node.roof.glazingControls.glass', message: 'Glass' } },
+    { value: 'solid', label: /* i18n */ { id: 'node.roof.glazingControls.solid', message: 'Solid' } },
+    { value: 'empty', label: /* i18n */ { id: 'node.roof.glazingControls.empty', message: 'Empty' } },
 ];

package/dist/roof/glazing-panel-editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"glazing-panel-editor.d.ts","sourceRoot":"","sources":["../../src/roof/glazing-panel-editor.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,WAAW,EAChB,KAAK,eAAe,EACrB,MAAM,kBAAkB,CAAA;AAwBzB,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,eAAe,CAAA;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAA;CAChD,sCAmFA"}
+{"version":3,"file":"glazing-panel-editor.d.ts","sourceRoot":"","sources":["../../src/roof/glazing-panel-editor.tsx"],"names":[],"mappings":"AAEA,OAAO,EAML,KAAK,WAAW,EAChB,KAAK,eAAe,EAErB,MAAM,kBAAkB,CAAA;AA+BzB,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,eAAe,CAAA;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,WAAW,CAAC,KAAK,IAAI,CAAA;CAChD,sCAoHA"}

package/dist/roof/glazing-panel-editor.js

@@ -1,23 +1,29 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getGlazedRoofLayout, getGlazedRoofPanelType, getRoofGlazing, } from '@pascal-app/core';
+import { getGlazedRoofLayout, getGlazedRoofPanelType, getRoofGlazing, usePascalI18n, } from '@pascal-app/core';
 import { ActionButton, PanelSection, SegmentedControl, SelectControl, SliderControl, } from '@pascal-app/editor';
 import { RotateCcw } from 'lucide-react';
 import { useState } from 'react';
 import { GLAZING_INFILL_OPTIONS } from './glazing-controls.js';
-function faceLabel(id) {
+const FACE_LABELS = {
+    front: /* i18n */ { id: 'node.roof.glazing.face.front', message: 'Front slope' },
+    back: /* i18n */ { id: 'node.roof.glazing.face.back', message: 'Back slope' },
+    slope: /* i18n */ { id: 'node.roof.glazing.face.slope', message: 'Shed slope' },
+    'end-left': /* i18n */ { id: 'node.roof.glazing.face.endLeft', message: 'Left end' },
+    'end-right': /* i18n */ { id: 'node.roof.glazing.face.endRight', message: 'Right end' },
+};
+function faceLabel(id, i18n) {
     if (id.startsWith('barrel-'))
-        return `Arch bay ${Number(id.slice(7)) + 1}`;
-    const labels = {
-        front: 'Front slope',
-        back: 'Back slope',
-        slope: 'Shed slope',
-        'end-left': 'Left end',
-        'end-right': 'Right end',
-    };
-    return labels[id] ?? id;
+        return i18n._({
+            id: 'node.roof.glazing.face.archBay',
+            message: 'Arch bay {number}',
+            values: { number: Number(id.slice(7)) + 1 },
+        });
+    const label = FACE_LABELS[id];
+    return label ? i18n._(label) : id;
 }
 export function GlazingPanelEditor({ node, onUpdate, }) {
+    const i18n = usePascalI18n();
     const [faceId, setFaceId] = useState('front');
     const [column, setColumn] = useState(0);
     const [row, setRow] = useState(0);
@@ -36,9 +42,30 @@ export function GlazingPanelEditor({ node, onUpdate, }) {
             ...(type ? [{ face: layout.face.id, column: activeColumn, row: activeRow, type }] : []),
         ],
     });
-    return (_jsxs(PanelSection, { title: "Individual panels", defaultExpanded: false, children: [_jsx("p", { className: "pb-1 text-[11px] leading-relaxed text-muted-foreground", children: "Choose a panel to override its default infill." }), _jsx(SelectControl, { label: "Roof face", value: layout.face.id, options: layouts.map(({ face }) => ({ value: face.id, label: faceLabel(face.id) })), onChange: (value) => {
+    return (_jsxs(PanelSection, { title: i18n._({
+            id: 'node.roof.glazingPanelEditor.individualPanels',
+            message: 'Individual panels',
+        }), defaultExpanded: false, children: [_jsx("p", { className: "pb-1 text-[11px] leading-relaxed text-muted-foreground", children: i18n._({
+                    id: 'node.roof.glazingPanelEditor.chooseAPanelToOverrideIts',
+                    message: 'Choose a panel to override its default infill.',
+                }) }), _jsx(SelectControl, { label: i18n._({ id: 'node.roof.glazingPanelEditor.roofFace', message: 'Roof face' }), value: layout.face.id, options: layouts.map(({ face }) => ({ value: face.id, label: faceLabel(face.id, i18n) })), onChange: (value) => {
                     setFaceId(value);
                     setColumn(0);
                     setRow(0);
-                } }), _jsxs("p", { className: "py-1 text-[11px] text-muted-foreground", children: [columns, " ", columns === 1 ? 'column' : 'columns', " \u00B7 ", rows, " ", rows === 1 ? 'row' : 'rows'] }), columns > 1 && (_jsx(SliderControl, { label: "Column", value: activeColumn + 1, min: 1, max: columns, step: 1, precision: 0, onChange: (value) => setColumn(Math.round(value) - 1) })), rows > 1 && (_jsx(SliderControl, { label: "Row", value: activeRow + 1, min: 1, max: rows, step: 1, precision: 0, onChange: (value) => setRow(Math.round(value) - 1) })), _jsxs("div", { className: "flex flex-col gap-2 pt-1", role: "group", "aria-label": "Selected panel infill", children: [_jsxs("span", { className: "flex items-center justify-between text-xs text-muted-foreground", children: ["Panel infill ", _jsx("span", { className: "text-[11px]", children: overridden ? 'Custom' : 'Default' })] }), _jsx(SegmentedControl, { value: getGlazedRoofPanelType(node, layout.face.id, activeColumn, activeRow), options: GLAZING_INFILL_OPTIONS, onChange: (type) => update(type) })] }), _jsx(ActionButton, { label: "Reset to default", icon: _jsx(RotateCcw, { className: "size-3.5" }), disabled: !overridden, className: "mt-1 disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-[#2C2C2E]", onClick: () => update() })] }));
+                } }), _jsx("p", { className: "py-1 text-[11px] text-muted-foreground", children: i18n._({
+                    id: 'node.roof.glazingPanelEditor.grid',
+                    message: '{columns, plural, one {{columnCount} column} other {{columnCount} columns}} · {rows, plural, one {{rowCount} row} other {{rowCount} rows}}',
+                    values: { columns, rows, columnCount: String(columns), rowCount: String(rows) },
+                }) }), columns > 1 && (_jsx(SliderControl, { label: i18n._({ id: 'node.roof.glazingPanelEditor.column2', message: 'Column' }), value: activeColumn + 1, min: 1, max: columns, step: 1, precision: 0, onChange: (value) => setColumn(Math.round(value) - 1) })), rows > 1 && (_jsx(SliderControl, { label: i18n._({ id: 'node.roof.glazingPanelEditor.row2', message: 'Row' }), value: activeRow + 1, min: 1, max: rows, step: 1, precision: 0, onChange: (value) => setRow(Math.round(value) - 1) })), _jsxs("div", { className: "flex flex-col gap-2 pt-1", role: "group", "aria-label": i18n._({
+                    id: 'node.roof.glazingPanelEditor.selectedPanelInfill',
+                    message: 'Selected panel infill',
+                }), children: [_jsxs("span", { className: "flex items-center justify-between text-xs text-muted-foreground", children: [i18n._({ id: 'node.roof.glazingPanelEditor.panelInfill', message: 'Panel infill' }), ' ', _jsx("span", { className: "text-[11px]", children: overridden
+                                    ? i18n._({ id: 'node.roof.glazingPanelEditor.custom', message: 'Custom' })
+                                    : i18n._({ id: 'node.roof.glazingPanelEditor.default', message: 'Default' }) })] }), _jsx(SegmentedControl, { value: getGlazedRoofPanelType(node, layout.face.id, activeColumn, activeRow), options: GLAZING_INFILL_OPTIONS.map((option) => ({
+                            ...option,
+                            label: i18n._(option.label),
+                        })), onChange: (type) => update(type) })] }), _jsx(ActionButton, { label: i18n._({
+                    id: 'node.roof.glazingPanelEditor.resetToDefault',
+                    message: 'Reset to default',
+                }), icon: _jsx(RotateCcw, { className: "size-3.5" }), disabled: !overridden, className: "mt-1 disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-[#2C2C2E]", onClick: () => update() })] }));
 }

package/dist/roof/glazing-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"glazing-panel.d.ts","sourceRoot":"","sources":["../../src/roof/glazing-panel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAML,KAAK,eAAe,EAGrB,MAAM,kBAAkB,CAAA;AAazB,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,eAAe,EAAE,CAAA;CAAE,sCAuKtF"}
+{"version":3,"file":"glazing-panel.d.ts","sourceRoot":"","sources":["../../src/roof/glazing-panel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAML,KAAK,eAAe,EAIrB,MAAM,kBAAkB,CAAA;AAazB,wBAAgB,gBAAgB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,eAAe,EAAE,CAAA;CAAE,sCAmPtF"}

package/dist/roof/glazing-panel.js

@@ -1,6 +1,6 @@
 'use client';
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { getEffectiveNode, getRoofGlazing, isGlazedRoofSegment, supportsRoofGlazing, useLiveNodeOverrides, } from '@pascal-app/core';
+import { getEffectiveNode, getRoofGlazing, isGlazedRoofSegment, supportsRoofGlazing, useLiveNodeOverrides, usePascalI18n, } from '@pascal-app/core';
 import { PanelSection, SegmentedControl, ToggleControl } from '@pascal-app/editor';
 import { useEffect, useMemo } from 'react';
 import { useShallow } from 'zustand/react/shallow';
@@ -8,6 +8,7 @@ import { GLAZING_INFILL_OPTIONS, GlazingColor, GlazingGridControls, GlazingNumbe
 import { GlazingPanelEditor } from './glazing-panel-editor.js';
 import { createRoofGlazingPreview } from './glazing-preview.js';
 export function RoofGlazingPanel({ segments }) {
+    const i18n = usePascalI18n();
     useLiveNodeOverrides(useShallow((state) => segments.map((segment) => state.overrides.get(segment.id))));
     const idKey = segments.map((segment) => segment.id).join(',');
     const preview = useMemo(() => createRoofGlazingPreview(idKey ? idKey.split(',') : []), [idKey]);
@@ -27,15 +28,78 @@ export function RoofGlazingPanel({ segments }) {
         preview.previewGlazing((current) => ({ ...current, ...patch }));
         preview.commit();
     };
-    return (_jsxs(_Fragment, { children: [_jsxs(PanelSection, { title: "Roof system", children: [_jsx(SegmentedControl, { value: glazed ? 'glazed' : 'standard', mixed: mixed, options: [
-                            { value: 'standard', label: 'Standard' },
-                            { value: 'glazed', label: 'Glazed', disabled: !supported },
+    return (_jsxs(_Fragment, { children: [_jsxs(PanelSection, { title: i18n._({ id: 'node.roof.glazingPanel.roofSystem', message: 'Roof system' }), children: [_jsx(SegmentedControl, { value: glazed ? 'glazed' : 'standard', mixed: mixed, options: [
+                            {
+                                value: 'standard',
+                                label: i18n._({ id: 'node.roof.glazingPanel.standard', message: 'Standard' }),
+                            },
+                            {
+                                value: 'glazed',
+                                label: i18n._({ id: 'node.roof.glazingPanel.glazed', message: 'Glazed' }),
+                                disabled: !supported,
+                            },
                         ], onChange: (roofSystem) => {
                             if (roofSystem === 'standard' || supported)
                                 preview.commit({ roofSystem });
-                        } }), !supported && (_jsx("p", { className: "pt-1 text-[11px] leading-relaxed text-muted-foreground", children: "Glazing is available for gable, straight shed, and barrel roofs." })), mixed && (_jsx("p", { className: "pt-1 text-[11px] leading-relaxed text-muted-foreground", children: "Choose one roof system to edit settings for all selected segments." })), segments.length > 1 && (_jsxs("p", { className: "pt-1 text-[11px] text-muted-foreground", children: ["Changes apply to all ", segments.length, " roof segments."] }))] }), glazed && !mixed && (_jsxs(_Fragment, { children: [_jsx(GlazingGridControls, { axis: "across", title: allBarrel ? 'Grid along the length' : 'Grid across the roof', description: allBarrel
-                            ? 'Divides the length of each arch bay into columns.'
-                            : 'Divides each roof face into columns.', grid: config.across, grids: configs.map((value) => value.across), preview: preview }), _jsx(GlazingGridControls, { axis: "along", title: allBarrel ? 'Grid within each arch bay' : 'Grid along the slope', description: allBarrel
-                            ? 'Subdivides each flat arch bay. Arch bays controls the divisions around the curve.'
-                            : 'Spacing is measured on the slope, not its horizontal projection.', grid: config.along, grids: configs.map((value) => value.along), preview: preview }), _jsxs(PanelSection, { title: "Framing", children: [_jsx(GlazingNumber, { field: "frameWidth", label: "Frame width", value: config.frameWidth, mixed: mixedField('frameWidth'), preview: preview }), _jsx(GlazingNumber, { field: "frameDepth", label: "Frame depth", value: config.frameDepth, mixed: mixedField('frameDepth'), preview: preview }), _jsx(GlazingColor, { field: "frameColor", label: "Frame color", value: config.frameColor, mixed: mixedField('frameColor'), preview: preview })] }), _jsxs(PanelSection, { title: "Glass", children: [_jsx(GlazingNumber, { field: "glassThickness", label: "Pane thickness", value: config.glassThickness, mixed: mixedField('glassThickness'), preview: preview }), _jsx(GlazingColor, { field: "glassColor", label: "Glass tint", value: config.glassColor, mixed: mixedField('glassColor'), preview: preview }), _jsx(GlazingNumber, { field: "glassOpacity", label: "Opacity", value: config.glassOpacity, mixed: mixedField('glassOpacity'), preview: preview, fraction: true }), _jsx(GlazingNumber, { field: "glassRoughness", label: "Roughness", value: config.glassRoughness, mixed: mixedField('glassRoughness'), preview: preview, fraction: true })] }), _jsxs(PanelSection, { title: "Infill", children: [_jsxs("div", { className: "flex flex-col gap-2 pb-1", role: "group", "aria-label": "Default panel infill", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "Default panel infill" }), _jsx(SegmentedControl, { value: config.panelType, mixed: mixedField('panelType'), options: GLAZING_INFILL_OPTIONS, onChange: (panelType) => update({ panelType }) })] }), _jsx(ToggleControl, { label: "Close the roof ends", checked: config.glazedEnds, mixed: mixedField('glazedEnds'), onChange: (glazedEnds) => update({ glazedEnds }) }), _jsx("p", { className: "pt-1 text-[11px] leading-relaxed text-muted-foreground", children: "End infill fills the space above the walls. Edit room walls and ceilings separately." })] }), segments.length === 1 && (_jsx(GlazingPanelEditor, { node: node, onUpdate: update }, node.id))] }))] }));
+                        } }), !supported && (_jsx("p", { className: "pt-1 text-[11px] leading-relaxed text-muted-foreground", children: i18n._({
+                            id: 'node.roof.glazingPanel.glazingIsAvailableForGableStraight',
+                            message: 'Glazing is available for gable, straight shed, and barrel roofs.',
+                        }) })), mixed && (_jsx("p", { className: "pt-1 text-[11px] leading-relaxed text-muted-foreground", children: i18n._({
+                            id: 'node.roof.glazingPanel.chooseOneRoofSystemToEdit',
+                            message: 'Choose one roof system to edit settings for all selected segments.',
+                        }) })), segments.length > 1 && (_jsx("p", { className: "pt-1 text-[11px] text-muted-foreground", children: i18n._({
+                            id: 'node.roof.glazingPanel.changesApplyToAllLengthRoof',
+                            message: 'Changes apply to all {length} roof segments.',
+                            values: { length: segments.length },
+                        }) }))] }), glazed && !mixed && (_jsxs(_Fragment, { children: [_jsx(GlazingGridControls, { axis: "across", title: allBarrel
+                            ? i18n._({
+                                id: 'node.roof.glazingPanel.gridAlongTheLength',
+                                message: 'Grid along the length',
+                            })
+                            : i18n._({
+                                id: 'node.roof.glazingPanel.gridAcrossTheRoof',
+                                message: 'Grid across the roof',
+                            }), description: allBarrel
+                            ? i18n._({
+                                id: 'node.roof.glazingPanel.dividesTheLengthOfEachArch',
+                                message: 'Divides the length of each arch bay into columns.',
+                            })
+                            : i18n._({
+                                id: 'node.roof.glazingPanel.dividesEachRoofFaceIntoColumns',
+                                message: 'Divides each roof face into columns.',
+                            }), grid: config.across, grids: configs.map((value) => value.across), preview: preview }), _jsx(GlazingGridControls, { axis: "along", title: allBarrel
+                            ? i18n._({
+                                id: 'node.roof.glazingPanel.gridWithinEachArchBay',
+                                message: 'Grid within each arch bay',
+                            })
+                            : i18n._({
+                                id: 'node.roof.glazingPanel.gridAlongTheSlope',
+                                message: 'Grid along the slope',
+                            }), description: allBarrel
+                            ? i18n._({
+                                id: 'node.roof.glazingPanel.subdividesEachFlatArchBayArch',
+                                message: 'Subdivides each flat arch bay. Arch bays controls the divisions around the curve.',
+                            })
+                            : i18n._({
+                                id: 'node.roof.glazingPanel.spacingIsMeasuredOnTheSlope',
+                                message: 'Spacing is measured on the slope, not its horizontal projection.',
+                            }), grid: config.along, grids: configs.map((value) => value.along), preview: preview }), _jsxs(PanelSection, { title: i18n._({ id: 'node.roof.glazingPanel.framing', message: 'Framing' }), children: [_jsx(GlazingNumber, { field: "frameWidth", label: i18n._({ id: 'node.roof.glazingPanel.frameWidth', message: 'Frame width' }), value: config.frameWidth, mixed: mixedField('frameWidth'), preview: preview }), _jsx(GlazingNumber, { field: "frameDepth", label: i18n._({ id: 'node.roof.glazingPanel.frameDepth', message: 'Frame depth' }), value: config.frameDepth, mixed: mixedField('frameDepth'), preview: preview }), _jsx(GlazingColor, { field: "frameColor", label: i18n._({ id: 'node.roof.glazingPanel.frameColor', message: 'Frame color' }), value: config.frameColor, mixed: mixedField('frameColor'), preview: preview })] }), _jsxs(PanelSection, { title: i18n._({ id: 'node.roof.glazingPanel.glass', message: 'Glass' }), children: [_jsx(GlazingNumber, { field: "glassThickness", label: i18n._({
+                                    id: 'node.roof.glazingPanel.paneThickness',
+                                    message: 'Pane thickness',
+                                }), value: config.glassThickness, mixed: mixedField('glassThickness'), preview: preview }), _jsx(GlazingColor, { field: "glassColor", label: i18n._({ id: 'node.roof.glazingPanel.glassTint', message: 'Glass tint' }), value: config.glassColor, mixed: mixedField('glassColor'), preview: preview }), _jsx(GlazingNumber, { field: "glassOpacity", label: i18n._({ id: 'node.roof.glazingPanel.opacity', message: 'Opacity' }), value: config.glassOpacity, mixed: mixedField('glassOpacity'), preview: preview, fraction: true }), _jsx(GlazingNumber, { field: "glassRoughness", label: i18n._({ id: 'node.roof.glazingPanel.roughness', message: 'Roughness' }), value: config.glassRoughness, mixed: mixedField('glassRoughness'), preview: preview, fraction: true })] }), _jsxs(PanelSection, { title: i18n._({ id: 'node.roof.glazingPanel.infill', message: 'Infill' }), children: [_jsxs("div", { className: "flex flex-col gap-2 pb-1", role: "group", "aria-label": i18n._({
+                                    id: 'node.roof.glazingPanel.defaultPanelInfill',
+                                    message: 'Default panel infill',
+                                }), children: [_jsx("span", { className: "text-xs text-muted-foreground", children: i18n._({
+                                            id: 'node.roof.glazingPanel.defaultPanelInfill',
+                                            message: 'Default panel infill',
+                                        }) }), _jsx(SegmentedControl, { value: config.panelType, mixed: mixedField('panelType'), options: GLAZING_INFILL_OPTIONS.map((option) => ({
+                                            ...option,
+                                            label: i18n._(option.label),
+                                        })), onChange: (panelType) => update({ panelType }) })] }), _jsx(ToggleControl, { label: i18n._({
+                                    id: 'node.roof.glazingPanel.closeTheRoofEnds',
+                                    message: 'Close the roof ends',
+                                }), checked: config.glazedEnds, mixed: mixedField('glazedEnds'), onChange: (glazedEnds) => update({ glazedEnds }) }), _jsx("p", { className: "pt-1 text-[11px] leading-relaxed text-muted-foreground", children: i18n._({
+                                    id: 'node.roof.glazingPanel.endInfillFillsTheSpaceAbove',
+                                    message: 'End infill fills the space above the walls. Edit room walls and ceilings separately.',
+                                }) })] }), segments.length === 1 && (_jsx(GlazingPanelEditor, { node: node, onUpdate: update }, node.id))] }))] }));
 }