@pascal-app/nodes 1.0.6 → 1.0.7

package/dist/roof/glazing-controls.js

@@ -1,5 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { usePascalI18n } from '@pascal-app/core';
 import { getLinearUnitLabel, linearControlValueToMeters, metersToLinearUnit, PanelSection, SegmentedControl, SelectControl, SliderControl, } from '@pascal-app/editor';
 import { useViewer } from '@pascal-app/viewer';
 import { useCallback } from 'react';
@@ -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))] }))] }));
 }

package/dist/roof/paint.d.ts

@@ -0,0 +1,19 @@
+import { type AnyNodeId, type PaintCapability } from '@pascal-app/core';
+type RoofGableBand = 'gable-left' | 'gable-right';
+/** Every gable of the roof: the `matching` scope of a gable hit. */
+export declare const ROOF_ALL_GABLES_ROLE = "gables:all";
+/** One gable of the merged shell: `gable-left:<segmentId>` / `gable-right:<segmentId>`. */
+export declare function roofGableRole(band: RoofGableBand, segmentId: string): string;
+export declare function parseRoofGableRole(role: string): {
+    band: RoofGableBand;
+    segmentId: AnyNodeId;
+} | null;
+/**
+ * The merged roof shell's paint. Its surfaces are the roof's top / edge / wall
+ * finishes and the heel band; an edge hit on a segment's ±x end wall is that
+ * gable alone (its segment's gable finish), and the `matching` scope widens it
+ * to every gable — the roof's edge, with no segment keeping a gable of its own.
+ */
+export declare const roofPaint: PaintCapability;
+export {};
+//# sourceMappingURL=paint.d.ts.map

package/dist/roof/paint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paint.d.ts","sourceRoot":"","sources":["../../src/roof/paint.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,SAAS,EAId,KAAK,eAAe,EAKrB,MAAM,kBAAkB,CAAA;AAazB,KAAK,aAAa,GAAG,YAAY,GAAG,aAAa,CAAA;AAEjD,oEAAoE;AACpE,eAAO,MAAM,oBAAoB,eAAe,CAAA;AAEhD,2FAA2F;AAC3F,wBAAgB,aAAa,CAAC,IAAI,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAE5E;AAED,wBAAgB,kBAAkB,CAChC,IAAI,EAAE,MAAM,GACX;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,SAAS,EAAE,SAAS,CAAA;CAAE,GAAG,IAAI,CAMtD;AAqCD;;;;;GAKG;AACH,eAAO,MAAM,SAAS,EAAE,eA8GvB,CAAA"}

package/dist/roof/paint.js

@@ -0,0 +1,158 @@
+import { getEffectiveRoofSurfaceMaterial, getEffectiveSegmentSurfaceMaterial, getRoofWallBandMaterial, useScene, } from '@pascal-app/core';
+import { buildRoofSurfaceMaterialPatch, resolveRoofWallHit } from '@pascal-app/editor';
+import { getRoofMaterialArray, levelWallCladdingRef, levelWallFaceRef, ROOF_HEEL_MATERIAL_INDEX, useViewer, } from '@pascal-app/viewer';
+import { Vector3 } from 'three';
+import { wallBandPatch } from '../roof-segment/paint.js';
+import { swapPreviewMaterial } from '../shared/swap-preview-material.js';
+/** Every gable of the roof: the `matching` scope of a gable hit. */
+export const ROOF_ALL_GABLES_ROLE = 'gables:all';
+/** One gable of the merged shell: `gable-left:<segmentId>` / `gable-right:<segmentId>`. */
+export function roofGableRole(band, segmentId) {
+    return `${band}:${segmentId}`;
+}
+export function parseRoofGableRole(role) {
+    const split = role.indexOf(':');
+    if (split < 0)
+        return null;
+    const band = role.slice(0, split);
+    if (band !== 'gable-left' && band !== 'gable-right')
+        return null;
+    return { band, segmentId: role.slice(split + 1) };
+}
+const isSurfaceRole = (role) => role === 'top' || role === 'edge' || role === 'wall';
+const hitWorldPoint = new Vector3();
+/** The merged shell's surface under the cursor: its material slot, else the hit normal. */
+function surfaceRole(materialIndex, normal) {
+    if (materialIndex === 3)
+        return 'top';
+    if (materialIndex === ROOF_HEEL_MATERIAL_INDEX)
+        return 'heel';
+    if (materialIndex === 0)
+        return 'edge';
+    if (materialIndex === 1 || materialIndex === 2)
+        return 'wall';
+    const normalY = normal?.[1];
+    if (normalY !== undefined && normalY > 0.35)
+        return 'top';
+    if (normalY !== undefined && Math.abs(normalY) <= 0.35)
+        return 'edge';
+    if (normalY !== undefined && normalY < -0.35)
+        return 'wall';
+    return null;
+}
+/** The merged roof with `role` repainted, so the preview draws it the way a commit would. */
+function previewRoof(roof, role, material, preset) {
+    if (role === 'heel')
+        return { ...roof, ...wallBandPatch('heel', material, preset) };
+    const surface = role === ROOF_ALL_GABLES_ROLE ? 'edge' : role;
+    if (!isSurfaceRole(surface))
+        return null;
+    return { ...roof, ...buildRoofSurfaceMaterialPatch(roof, surface, material, preset) };
+}
+/**
+ * The merged roof shell's paint. Its surfaces are the roof's top / edge / wall
+ * finishes and the heel band; an edge hit on a segment's ±x end wall is that
+ * gable alone (its segment's gable finish), and the `matching` scope widens it
+ * to every gable — the roof's edge, with no segment keeping a gable of its own.
+ */
+export const roofPaint = {
+    materialTarget: 'roof',
+    resolveRole(args) {
+        const role = surfaceRole(args.materialIndex, args.normal);
+        if (role !== 'edge' || !(args.localPosition && args.hitObject))
+            return role;
+        args.hitObject.updateWorldMatrix(true, false);
+        const position = args.hitObject.localToWorld(hitWorldPoint.set(...args.localPosition));
+        const hit = resolveRoofWallHit(args.node, [position.x, position.y, position.z], args.normal, args.hitObject);
+        if (!hit || (hit.face.id !== 'left' && hit.face.id !== 'right'))
+            return role;
+        return roofGableRole(hit.face.id === 'left' ? 'gable-left' : 'gable-right', hit.segment.id);
+    },
+    roleLabel(_node, role) {
+        if (role === 'heel')
+            return 'Heel band';
+        if (role === ROOF_ALL_GABLES_ROLE)
+            return 'All gables';
+        const gable = parseRoofGableRole(role);
+        if (!gable)
+            return null;
+        return gable.band === 'gable-left' ? 'Left gable' : 'Right gable';
+    },
+    scopes(_node, role) {
+        if (!parseRoofGableRole(role))
+            return null;
+        return {
+            scopes: ['single', 'matching'],
+            labels: { matching: 'All gables' },
+            roleFor: (scope) => (scope === 'matching' ? ROOF_ALL_GABLES_ROLE : role),
+        };
+    },
+    buildPatch({ node, role, material, materialPreset }) {
+        const roof = node;
+        if (role === 'heel')
+            return wallBandPatch('heel', material, materialPreset);
+        if (role === ROOF_ALL_GABLES_ROLE)
+            return buildRoofSurfaceMaterialPatch(roof, 'edge', material, materialPreset);
+        if (!isSurfaceRole(role))
+            return {};
+        return buildRoofSurfaceMaterialPatch(roof, role, material, materialPreset);
+    },
+    commit(args) {
+        const scene = useScene.getState();
+        const gable = parseRoofGableRole(args.role);
+        if (gable) {
+            scene.updateNode(gable.segmentId, wallBandPatch(gable.band, args.material, args.materialPreset));
+            return;
+        }
+        if (args.role !== ROOF_ALL_GABLES_ROLE) {
+            scene.updateNode(args.node.id, roofPaint.buildPatch(args));
+            return;
+        }
+        // Every gable: the roof's edge, and no segment keeping a gable of its own.
+        const cleared = {
+            ...wallBandPatch('gable-left', undefined, undefined),
+            ...wallBandPatch('gable-right', undefined, undefined),
+        };
+        scene.updateNodes([
+            { id: args.node.id, data: roofPaint.buildPatch(args) },
+            ...(args.node.children ?? []).flatMap((childId) => scene.nodes[childId]?.type === 'roof-segment'
+                ? [{ id: childId, data: cleared }]
+                : []),
+        ]);
+    },
+    applyPreview(args) {
+        // One gable has no surface of its own on the merged shell until it is painted.
+        if (parseRoofGableRole(args.role))
+            return null;
+        const mesh = args.root.getObjectByName('merged-roof');
+        if (!mesh)
+            return null;
+        const roof = args.node;
+        const preview = previewRoof(roof, args.role, args.material, args.materialPreset);
+        if (!preview)
+            return null;
+        // The renderer's wall-derived defaults, so the surfaces not being painted hold still.
+        const nodes = args.nodes ?? useScene.getState().nodes;
+        const viewer = useViewer.getState();
+        const material = getRoofMaterialArray(preview, viewer.shading, viewer.textures, viewer.colorPreset, viewer.sceneTheme, levelWallCladdingRef(nodes, roof), args.materials ?? useScene.getState().materials, levelWallFaceRef(nodes, roof));
+        return material ? swapPreviewMaterial(mesh, material) : null;
+    },
+    // The top / edge / wall finishes return null here and resolve through the
+    // editor's roof surface fallback (`resolveActivePaintMaterialFromSelection`).
+    getEffectiveMaterial({ node, role, nodes }) {
+        if (role === 'heel') {
+            const own = getRoofWallBandMaterial(node, 'heel');
+            return own ? { material: own.material, materialPreset: own.materialPreset } : null;
+        }
+        const gable = parseRoofGableRole(role);
+        const segment = gable ? nodes?.[gable.segmentId] : undefined;
+        if (!(gable && segment?.type === 'roof-segment'))
+            return null;
+        // Unpainted, a gable shows the segment's edge, falling back to the roof's.
+        const own = getRoofWallBandMaterial(segment, gable.band);
+        if (own)
+            return { material: own.material, materialPreset: own.materialPreset };
+        const edge = getEffectiveSegmentSurfaceMaterial(segment, 'edge', getEffectiveRoofSurfaceMaterial(node, 'edge'));
+        return { material: edge.material, materialPreset: edge.materialPreset };
+    },
+};

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

@@ -1 +1 @@
-{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../src/roof/panel.tsx"],"names":[],"mappings":"AA0CA,MAAM,CAAC,OAAO,UAAU,SAAS,uCA8jBhC"}
+{"version":3,"file":"panel.d.ts","sourceRoot":"","sources":["../../src/roof/panel.tsx"],"names":[],"mappings":"AAiDA,MAAM,CAAC,OAAO,UAAU,SAAS,uCAqsBhC"}