@pascal-app/nodes 1.0.1 → 1.0.4

package/dist/window/panel.js

@@ -1,11 +1,16 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useInteractive, useScene, WindowNode, } from '@pascal-app/core';
-import { ActionButton, ActionGroup, cn, PanelSection, PanelWrapper, SegmentedControl, SliderControl, ToggleControl, triggerSFX, useEditor, } from '@pascal-app/editor';
+import { scriptImages, useInteractive, useScene, } from '@pascal-app/core';
+import { getWindowStyleOverrides, SHAPED_WINDOW_TYPES, SILLLESS_WINDOW_TYPES, WINDOW_STYLE_CHOICES, WINDOW_STYLE_LABELS, windowStylesOf, windowTakesStyle, windowTypeChange, } from '@pascal-app/core/building';
+import { ActionButton, ActionGroup, cn, duplicateNodeAndPickUp, PanelSection, PanelWrapper, SegmentedControl, SliderControl, ToggleControl, triggerSFX, useEditor, } from '@pascal-app/editor';
 import { useViewer } from '@pascal-app/viewer';
 import { Copy, FlipHorizontal2, Move, Trash2 } from 'lucide-react';
-import { useCallback, useRef } from 'react';
-import { OpeningDocumentationFields } from '../shared/opening-documentation-fields';
+import { useCallback, useEffect, useMemo } from 'react';
+import { AuthoredParams } from '../item/authored-params';
+import { constrainCurtainOpening, curtainOpeningLimits } from '../shared/curtain-opening-limits';
+import { createOpeningPropertyPreview } from '../shared/opening-property-preview';
+import { openingPropertyPreviewHost } from '../shared/opening-property-preview-host';
+import { windowTypeOptions } from './placement';
 function isSameWindowValue(current, next) {
     if (typeof current === 'number' && typeof next === 'number') {
         return Math.abs(current - next) < 1e-6;
@@ -26,43 +31,25 @@ function normalizeWindowCornerRadii(radii, width, height) {
         return next;
     return next.map((radius) => radius * scale);
 }
-function isSameRadiusTuple(current, next) {
-    return current.every((value, index) => Math.abs(value - (next[index] ?? 0)) < 1e-6);
-}
-const windowTypeOptions = [
-    { label: 'Fixed', value: 'fixed' },
-    { label: 'Sliding', value: 'sliding' },
-    { label: 'Casement', value: 'casement' },
-    { label: 'Awning', value: 'awning' },
-    { label: 'Single Hung', value: 'single-hung' },
-    { label: 'Double Hung', value: 'double-hung' },
-    { label: 'Bay', value: 'bay' },
-    { label: 'Bow', value: 'bow' },
-    { label: 'Louvered', value: 'louvered' },
-];
-const shapedWindowTypes = new Set([
-    'fixed',
-    'casement',
-    'awning',
-    'hopper',
-    'louvered',
-]);
-const silllessWindowTypes = new Set(['bay', 'bow']);
 export default function WindowPanel() {
     const selectedId = useViewer((s) => s.selection.selectedIds[0]);
     const setSelection = useViewer((s) => s.setSelection);
     const deleteNode = useScene((s) => s.deleteNode);
     const setMovingNode = useEditor((s) => s.setMovingNode);
-    const previewRef = useRef(null);
+    const preview = useMemo(() => selectedId
+        ? createOpeningPropertyPreview(selectedId, openingPropertyPreviewHost)
+        : null, [selectedId]);
+    useEffect(() => () => preview?.cancel(), [preview]);
     const node = useScene((s) => selectedId ? s.nodes[selectedId] : undefined);
-    // Panel slider-drag fix recipe (plans/editor-node-registry.md). Without
-    // it, the 15+ SliderControls in this panel would loop on drag.
+    // Stable handler refs ("Custom panels" in wiki/architecture/node-definitions.md).
+    // Without them, the 15+ SliderControls in this panel would loop on drag.
     const handleUpdate = useCallback((updates) => {
         if (!selectedId)
             return;
         const liveNode = useScene.getState().nodes[selectedId];
         if (liveNode?.type !== 'window')
             return;
+        updates = constrainCurtainOpening(liveNode, updates, useScene.getState().nodes);
         const hasChange = Object.entries(updates).some(([key, value]) => {
             const currentValue = liveNode[key];
             return !isSameWindowValue(currentValue, value);
@@ -75,43 +62,8 @@ export default function WindowPanel() {
         if (liveNode.parentId)
             scene.dirtyNodes.add(liveNode.parentId);
     }, [selectedId]);
-    const previewWindowUpdate = useCallback((key, value) => {
-        if (!selectedId)
-            return;
-        const liveNode = useScene.getState().nodes[selectedId];
-        if (liveNode?.type !== 'window')
-            return;
-        if (!(previewRef.current &&
-            previewRef.current.id === selectedId &&
-            previewRef.current.key === key)) {
-            previewRef.current = {
-                id: selectedId,
-                key,
-                value: liveNode[key],
-            };
-        }
-        if (isSameWindowValue(liveNode[key], value))
-            return;
-        liveNode[key] = value;
-        useScene.getState().dirtyNodes.add(selectedId);
-    }, [selectedId]);
-    const commitWindowPreview = useCallback((key, value) => {
-        if (!selectedId)
-            return;
-        const scene = useScene.getState();
-        const liveNode = scene.nodes[selectedId];
-        const preview = previewRef.current;
-        if (liveNode?.type === 'window' && preview?.id === selectedId && preview.key === key) {
-            ;
-            liveNode[key] = preview.value;
-            scene.dirtyNodes.add(selectedId);
-        }
-        previewRef.current = null;
-        useScene.getState().updateNode(selectedId, {
-            [key]: value,
-        });
-        scene.dirtyNodes.add(selectedId);
-    }, [selectedId]);
+    const previewWindowUpdate = (key, value) => preview?.preview({ [key]: value });
+    const commitWindowPreview = (key, value) => preview?.commit({ [key]: value });
     const handleClose = useCallback(() => {
         setSelection({ selectedIds: [] });
     }, [setSelection]);
@@ -140,53 +92,12 @@ export default function WindowPanel() {
         setSelection({ selectedIds: [] });
     }, [selectedId, node, deleteNode, setSelection]);
     const handleDuplicate = useCallback(() => {
-        if (!node?.parentId)
-            return;
-        triggerSFX('sfx:item-pick');
-        useScene.temporal.getState().pause();
-        const duplicate = WindowNode.parse({
-            position: [...node.position],
-            rotation: [...node.rotation],
-            side: node.side,
-            wallId: node.wallId,
-            dormerId: node.dormerId,
-            dormerFace: node.dormerFace,
-            roofSegmentId: node.roofSegmentId,
-            roofFace: node.roofFace,
-            parentId: node.parentId,
-            width: node.width,
-            height: node.height,
-            roughOpeningWidth: node.roughOpeningWidth,
-            roughOpeningHeight: node.roughOpeningHeight,
-            windowType: node.windowType,
-            operationState: node.operationState,
-            awningDirection: node.awningDirection,
-            casementStyle: node.casementStyle,
-            hingesSide: node.hingesSide,
-            frameThickness: node.frameThickness,
-            frameDepth: node.frameDepth,
-            openingKind: node.openingKind,
-            openingShape: node.openingShape,
-            openingRadiusMode: node.openingRadiusMode ?? 'all',
-            openingCornerRadii: [...(node.openingCornerRadii ?? [0.15, 0.15, 0.15, 0.15])],
-            cornerRadius: node.cornerRadius,
-            archHeight: node.archHeight,
-            openingRevealRadius: node.openingRevealRadius,
-            columnRatios: [...node.columnRatios],
-            rowRatios: [...node.rowRatios],
-            columnDividerThickness: node.columnDividerThickness,
-            rowDividerThickness: node.rowDividerThickness,
-            sill: node.sill,
-            sillDepth: node.sillDepth,
-            sillThickness: node.sillThickness,
-            metadata: { isNew: true },
-        });
-        useScene.getState().createNode(duplicate, node.parentId);
-        setMovingNode(duplicate);
-        setSelection({ selectedIds: [] });
-    }, [node, setMovingNode, setSelection]);
+        if (node)
+            duplicateNodeAndPickUp(node);
+    }, [node]);
     if (!(node && node.type === 'window' && selectedId))
         return null;
+    const limits = curtainOpeningLimits(node, useScene.getState().nodes);
     const numCols = node.columnRatios.length;
     const numRows = node.rowRatios.length;
     const colSum = node.columnRatios.reduce((a, b) => a + b, 0);
@@ -194,6 +105,8 @@ export default function WindowPanel() {
     const normCols = node.columnRatios.map((r) => r / colSum);
     const normRows = node.rowRatios.map((r) => r / rowSum);
     const isOpening = node.openingKind === 'opening';
+    // Built from a script: its params replace the parametric frame's fields, as on an authored item.
+    const scripted = Boolean(node.source);
     const openingShape = node.openingShape ?? 'rectangle';
     const windowShape = openingShape === 'arch' || openingShape === 'rounded' ? openingShape : 'rectangle';
     const openingRadiusMode = node.openingRadiusMode ?? 'all';
@@ -212,18 +125,20 @@ export default function WindowPanel() {
         windowType === 'hopper' ||
         windowType === 'louvered';
     const isOperableWindow = isTrackSashWindow || isOperableSashWindow;
-    const supportsWindowShape = shapedWindowTypes.has(node.windowType ?? 'fixed');
+    const supportsWindowShape = SHAPED_WINDOW_TYPES.has(node.windowType ?? 'fixed');
     const supportsGrid = isFixedWindow;
-    const supportsSill = !silllessWindowTypes.has(node.windowType);
-    const showWindowTypeSection = !isOpening;
-    const showWindowShapeSection = !isOpening && supportsWindowShape;
-    const showOpeningShapeSection = isOpening;
-    const showFrameSection = !isOpening;
-    const showGridSection = !isOpening && supportsGrid;
-    const showSillSection = !isOpening && supportsSill;
-    const showOperationSection = !isOpening && isOperableWindow;
-    const showAwningDirectionSection = !isOpening && displayedWindowType === 'awning';
-    const showCasementSection = !isOpening && windowType === 'casement';
+    const supportsSill = !SILLLESS_WINDOW_TYPES.has(node.windowType);
+    const showWindowTypeSection = !scripted && !isOpening;
+    const windowStyles = windowStylesOf(node);
+    const showWindowShapeSection = !scripted && !isOpening && supportsWindowShape;
+    const showOpeningShapeSection = !scripted && isOpening;
+    const showFrameSection = !scripted && !isOpening;
+    const showGridSection = !scripted && !isOpening && supportsGrid;
+    const showStyleSection = !scripted && !isOpening && windowTakesStyle(node.windowType);
+    const showSillSection = !scripted && !isOpening && supportsSill;
+    const showOperationSection = !scripted && !isOpening && isOperableWindow;
+    const showAwningDirectionSection = !scripted && !isOpening && displayedWindowType === 'awning';
+    const showCasementSection = !scripted && !isOpening && windowType === 'casement';
     const showFlipSide = !isOpening;
     const operationLabel = isTrackSashWindow
         ? windowType === 'sliding'
@@ -245,24 +160,17 @@ export default function WindowPanel() {
         const nextUpdates = { ...updates };
         if (openingShape === 'rounded') {
             if (openingRadiusMode === 'individual') {
-                const currentRadii = openingCornerRadii;
                 const nextRadii = normalizeWindowCornerRadii(openingCornerRadii, nextWidth, nextHeight);
-                if (!isSameRadiusTuple(currentRadii, nextRadii)) {
-                    nextUpdates.openingCornerRadii = nextRadii;
-                }
+                nextUpdates.openingCornerRadii = nextRadii;
             }
             else {
                 const nextRadius = Math.min(Math.max(cornerRadius, 0), getMaxSharedWindowRadius(nextWidth, nextHeight));
-                if (Math.abs(nextRadius - cornerRadius) > 1e-6) {
-                    nextUpdates.cornerRadius = nextRadius;
-                }
+                nextUpdates.cornerRadius = nextRadius;
             }
         }
         if (openingShape === 'arch') {
             const nextArchHeight = Math.min(Math.max(archHeight, 0.05), Math.max(nextHeight, 0.05));
-            if (Math.abs(nextArchHeight - archHeight) > 1e-6) {
-                nextUpdates.archHeight = nextArchHeight;
-            }
+            nextUpdates.archHeight = nextArchHeight;
         }
         return nextUpdates;
     };
@@ -304,7 +212,7 @@ export default function WindowPanel() {
         });
         handleUpdate({ rowRatios: newRatios });
     };
-    return (_jsxs(PanelWrapper, { icon: "/icons/window.webp", onClose: handleClose, title: node.name || 'Window', width: 320, children: [_jsx(PanelSection, { title: "Type", children: _jsx(SegmentedControl, { onChange: (value) => handleUpdate({
+    return (_jsxs(PanelWrapper, { icon: scriptImages(node)?.thumbnail ?? '/icons/window.webp', onClose: handleClose, title: node.name || 'Window', width: 320, children: [!scripted && (_jsx(PanelSection, { title: "Type", children: _jsx(SegmentedControl, { onChange: (value) => handleUpdate({
                         openingKind: value,
                         ...(value === 'opening'
                             ? {
@@ -319,17 +227,13 @@ export default function WindowPanel() {
                     }), options: [
                         { value: 'window', label: 'Window' },
                         { value: 'opening', label: 'Opening' },
-                    ], value: node.openingKind ?? 'window' }) }), _jsx(PanelSection, { title: "Documentation", children: _jsx(OpeningDocumentationFields, { constructionType: node.constructionType, dimensionReference: node.dimensionReference, finishOpeningHeight: node.finishOpeningHeight, finishOpeningWidth: node.finishOpeningWidth, mark: node.mark, masonryOpeningHeight: node.masonryOpeningHeight, masonryOpeningWidth: node.masonryOpeningWidth, onChange: handleUpdate, roughOpeningHeight: node.roughOpeningHeight, roughOpeningWidth: node.roughOpeningWidth }) }), showWindowTypeSection && (_jsxs(PanelSection, { title: "Window Type", children: [_jsx("div", { className: "grid grid-cols-2 gap-2 px-1 pt-1", children: windowTypeOptions.map((option) => {
+                    ], value: node.openingKind ?? 'window' }) })), showWindowTypeSection && (_jsxs(PanelSection, { title: "Window Type", children: [_jsx("div", { className: "grid grid-cols-2 gap-2 px-1 pt-1", children: windowTypeOptions.map((option) => {
                             const isSelected = displayedWindowType === option.value;
                             return (_jsx("button", { className: cn('flex min-h-12 items-center rounded-lg border px-3 py-2.5 text-left text-xs transition-colors', isSelected
                                     ? 'border-orange-400/60 bg-orange-400/10 text-foreground'
                                     : 'border-border/50 bg-[#2C2C2E] text-muted-foreground hover:bg-[#3e3e3e] hover:text-foreground'), onClick: () => handleUpdate({
-                                    windowType: option.value,
+                                    ...windowTypeChange(node, option.value),
                                     ...(option.value === 'awning' ? { awningDirection } : {}),
-                                    ...(!shapedWindowTypes.has(option.value)
-                                        ? { openingShape: 'rectangle' }
-                                        : {}),
-                                    ...(silllessWindowTypes.has(option.value) ? { sill: false } : {}),
                                 }), type: "button", children: _jsx("span", { className: "truncate font-medium", children: option.label }) }, option.value));
                         }) }), showAwningDirectionSection && (_jsx("div", { className: "mt-2", children: _jsx(SegmentedControl, { onChange: (value) => handleUpdate({
                                 windowType: 'awning',
@@ -343,7 +247,9 @@ export default function WindowPanel() {
                                 ], value: node.casementStyle ?? 'single' }), (node.casementStyle ?? 'single') === 'single' && (_jsx(SegmentedControl, { onChange: (value) => handleUpdate({ hingesSide: value }), options: [
                                     { value: 'left', label: 'Left' },
                                     { value: 'right', label: 'Right' },
-                                ], value: node.hingesSide ?? 'left' }))] })), showOperationSection && (_jsx("div", { className: "mt-2", children: _jsx(SliderControl, { label: operationLabel, max: 1, min: 0, onChange: setOperationState, precision: 2, restoreOnCommit: false, step: 0.05, value: Math.round((node.operationState ?? 0) * 100) / 100 }) }))] })), _jsxs(PanelSection, { title: "Position", children: [_jsx(SliderControl, { label: _jsxs(_Fragment, { children: ["X", _jsx("sub", { className: "ml-[1px] text-[11px] opacity-70", children: "pos" })] }), onChange: (v) => handleUpdate({ position: [v, node.position[1], node.position[2]] }), precision: 2, step: 0.1, unit: "m", value: node.position[0] }), _jsx(SliderControl, { label: _jsxs(_Fragment, { children: ["Y", _jsx("sub", { className: "ml-[1px] text-[11px] opacity-70", children: "pos" })] }), onChange: (v) => handleUpdate({ position: [node.position[0], v, node.position[2]] }), precision: 2, step: 0.1, unit: "m", value: node.position[1] }), showFlipSide && (_jsx("div", { className: "px-1 pt-2 pb-1", children: _jsx(ActionButton, { className: "w-full", icon: _jsx(FlipHorizontal2, { className: "h-4 w-4" }), label: "Flip Side", onClick: handleFlip }) }))] }), _jsxs(PanelSection, { title: "Dimensions", children: [_jsx(SliderControl, { label: "Width", min: 0, onChange: (v) => handleUpdate(getDimensionUpdates({ width: v })), precision: 2, restoreOnCommit: false, step: 0.1, unit: "m", value: node.width }), _jsx(SliderControl, { label: "Height", min: 0, onChange: (v) => handleUpdate(getDimensionUpdates({ height: v })), precision: 2, restoreOnCommit: false, step: 0.1, unit: "m", value: node.height })] }), showWindowShapeSection && (_jsxs(PanelSection, { title: "Top Shape", children: [_jsx(SegmentedControl, { onChange: (value) => handleUpdate({
+                                ], value: node.hingesSide ?? 'left' }))] })), showOperationSection && (_jsx("div", { className: "mt-2", children: _jsx(SliderControl, { label: operationLabel, max: 1, min: 0, onChange: setOperationState, precision: 2, restoreOnCommit: false, step: 0.05, value: Math.round((node.operationState ?? 0) * 100) / 100 }) }))] })), showStyleSection && (_jsxs(PanelSection, { title: "Style", children: [_jsx("div", { className: "grid grid-cols-2 gap-2 px-1 pt-1", children: WINDOW_STYLE_CHOICES.map((style) => (_jsx("button", { "aria-pressed": windowStyles.includes(style), className: cn('flex min-h-10 items-center rounded-lg border px-3 py-2 text-left text-xs transition-colors', windowStyles.includes(style)
+                                ? 'border-orange-400/60 bg-orange-400/10 text-foreground'
+                                : 'border-border/50 bg-[#2C2C2E] text-muted-foreground hover:bg-[#3e3e3e] hover:text-foreground'), onClick: () => handleUpdate(getWindowStyleOverrides(style)), type: "button", children: _jsx("span", { className: "truncate font-medium", children: WINDOW_STYLE_LABELS[style] }) }, style))) }), !windowStyles.length && (_jsx("p", { className: "px-1 pt-2 text-muted-foreground text-xs", children: "Custom: the panes match no style." }))] })), _jsxs(PanelSection, { title: "Position", children: [_jsx(SliderControl, { label: _jsxs(_Fragment, { children: ["X", _jsx("sub", { className: "ml-[1px] text-[11px] opacity-70", children: "pos" })] }), onChange: (v) => handleUpdate({ position: [v, node.position[1], node.position[2]] }), precision: 2, step: 0.1, unit: "m", value: node.position[0] }), _jsx(SliderControl, { label: _jsxs(_Fragment, { children: ["Y", _jsx("sub", { className: "ml-[1px] text-[11px] opacity-70", children: "pos" })] }), onChange: (v) => handleUpdate({ position: [node.position[0], v, node.position[2]] }), precision: 2, step: 0.1, unit: "m", value: node.position[1] }), showFlipSide && (_jsx("div", { className: "px-1 pt-2 pb-1", children: _jsx(ActionButton, { className: "w-full", icon: _jsx(FlipHorizontal2, { className: "h-4 w-4" }), label: "Flip Side", onClick: handleFlip }) }))] }), scripted && _jsx(AuthoredParams, { node: node }), !scripted && (_jsxs(PanelSection, { title: "Dimensions", children: [limits && (_jsx("p", { className: "text-[11px] text-muted-foreground", children: "Size is limited to the wall, including clearance for the opening frame." })), _jsx(SliderControl, { label: "Width", max: limits?.width, min: 0.01, onChange: (v) => preview?.preview(getDimensionUpdates({ width: v })), onCommit: (v) => preview?.commit(getDimensionUpdates({ width: v })), onCancel: () => preview?.cancel(), previewWhileTyping: true, precision: 2, restoreOnCommit: false, step: 0.01, unit: "m", value: node.width }), _jsx(SliderControl, { label: "Height", max: limits?.height, min: 0.01, onChange: (v) => preview?.preview(getDimensionUpdates({ height: v })), onCommit: (v) => preview?.commit(getDimensionUpdates({ height: v })), onCancel: () => preview?.cancel(), previewWhileTyping: true, precision: 2, restoreOnCommit: false, step: 0.01, unit: "m", value: node.height })] })), showWindowShapeSection && (_jsxs(PanelSection, { title: "Top Shape", children: [_jsx(SegmentedControl, { onChange: (value) => handleUpdate({
                             openingShape: value,
                             ...(value === 'rounded'
                                 ? {
@@ -362,24 +268,24 @@ export default function WindowPanel() {
                         ], value: windowShape }), windowShape === 'rounded' && (_jsxs("div", { className: "mt-2 flex flex-col gap-1", children: [_jsx(SegmentedControl, { onChange: (value) => handleUpdate({ openingRadiusMode: value }), options: [
                                     { value: 'all', label: 'All' },
                                     { value: 'individual', label: 'Individual' },
-                                ], value: openingRadiusMode }), openingRadiusMode === 'all' ? (_jsx(SliderControl, { label: "Corner Radius", max: maxRoundedRadius, min: 0, onChange: (value) => previewWindowUpdate('cornerRadius', value), onCommit: (value) => commitWindowPreview('cornerRadius', value), precision: 2, step: 0.05, unit: "m", value: cornerRadius })) : (_jsx(_Fragment, { children: [
+                                ], value: openingRadiusMode }), openingRadiusMode === 'all' ? (_jsx(SliderControl, { label: "Corner Radius", max: maxRoundedRadius, min: 0, onChange: (value) => previewWindowUpdate('cornerRadius', value), onCommit: (value) => commitWindowPreview('cornerRadius', value), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 2, step: 0.05, unit: "m", value: cornerRadius })) : (_jsx(_Fragment, { children: [
                                     ['Top Left', 0],
                                     ['Top Right', 1],
                                     ['Bottom Right', 2],
                                     ['Bottom Left', 3],
-                                ].map(([label, index]) => (_jsx(SliderControl, { label: label, max: maxRoundedRadius, min: 0, onChange: (value) => setOpeningCornerRadius(index, value), onCommit: (value) => setOpeningCornerRadius(index, value, true), precision: 2, step: 0.05, unit: "m", value: openingCornerRadii[index] ?? 0 }, label))) })), _jsx(SliderControl, { label: "Reveal Radius", max: 0.08, min: 0, onChange: (value) => previewWindowUpdate('openingRevealRadius', value), onCommit: (value) => commitWindowPreview('openingRevealRadius', value), precision: 3, step: 0.005, unit: "m", value: openingRevealRadius })] })), windowShape === 'arch' && (_jsx("div", { className: "mt-2 flex flex-col gap-1", children: _jsx(SliderControl, { label: "Arch Height", max: Math.max(0.05, node.height), min: 0.05, onChange: (value) => handleUpdate({ archHeight: value }), precision: 2, restoreOnCommit: false, step: 0.05, unit: "m", value: archHeight }) }))] })), showOpeningShapeSection && (_jsxs(PanelSection, { title: "Opening Shape", children: [_jsx(SegmentedControl, { onChange: (value) => handleUpdate({ openingShape: value }), options: [
+                                ].map(([label, index]) => (_jsx(SliderControl, { label: label, max: maxRoundedRadius, min: 0, onChange: (value) => setOpeningCornerRadius(index, value), onCommit: (value) => setOpeningCornerRadius(index, value, true), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 2, step: 0.05, unit: "m", value: openingCornerRadii[index] ?? 0 }, label))) })), _jsx(SliderControl, { label: "Reveal Radius", max: 0.08, min: 0, onChange: (value) => previewWindowUpdate('openingRevealRadius', value), onCommit: (value) => commitWindowPreview('openingRevealRadius', value), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 3, step: 0.005, unit: "m", value: openingRevealRadius })] })), windowShape === 'arch' && (_jsx("div", { className: "mt-2 flex flex-col gap-1", children: _jsx(SliderControl, { label: "Arch Height", max: Math.max(0.05, node.height), min: 0.05, onChange: (value) => previewWindowUpdate('archHeight', value), onCommit: (value) => commitWindowPreview('archHeight', value), onCancel: () => preview?.cancel(), previewWhileTyping: true, precision: 2, restoreOnCommit: false, step: 0.05, unit: "m", value: archHeight }) }))] })), showOpeningShapeSection && (_jsxs(PanelSection, { title: "Opening Shape", children: [_jsx(SegmentedControl, { onChange: (value) => handleUpdate({ openingShape: value }), options: [
                             { value: 'rectangle', label: 'Rect' },
                             { value: 'rounded', label: 'Rounded' },
                             { value: 'arch', label: 'Arch' },
                         ], value: openingShape }), openingShape === 'rounded' && (_jsxs("div", { className: "mt-2 flex flex-col gap-1", children: [_jsx(SegmentedControl, { onChange: (value) => handleUpdate({ openingRadiusMode: value }), options: [
                                     { value: 'all', label: 'All' },
                                     { value: 'individual', label: 'Individual' },
-                                ], value: openingRadiusMode }), openingRadiusMode === 'all' ? (_jsx(SliderControl, { label: "Corner Radius", max: maxRoundedRadius, min: 0, onChange: (value) => previewWindowUpdate('cornerRadius', value), onCommit: (value) => commitWindowPreview('cornerRadius', value), precision: 2, step: 0.05, unit: "m", value: cornerRadius })) : (_jsx(_Fragment, { children: [
+                                ], value: openingRadiusMode }), openingRadiusMode === 'all' ? (_jsx(SliderControl, { label: "Corner Radius", max: maxRoundedRadius, min: 0, onChange: (value) => previewWindowUpdate('cornerRadius', value), onCommit: (value) => commitWindowPreview('cornerRadius', value), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 2, step: 0.05, unit: "m", value: cornerRadius })) : (_jsx(_Fragment, { children: [
                                     ['Top Left', 0],
                                     ['Top Right', 1],
                                     ['Bottom Right', 2],
                                     ['Bottom Left', 3],
-                                ].map(([label, index]) => (_jsx(SliderControl, { label: label, max: maxRoundedRadius, min: 0, onChange: (value) => setOpeningCornerRadius(index, value), onCommit: (value) => setOpeningCornerRadius(index, value, true), precision: 2, step: 0.05, unit: "m", value: openingCornerRadii[index] ?? 0 }, label))) })), _jsx(SliderControl, { label: "Reveal Radius", max: 0.08, min: 0, onChange: (value) => previewWindowUpdate('openingRevealRadius', value), onCommit: (value) => commitWindowPreview('openingRevealRadius', value), precision: 3, step: 0.005, unit: "m", value: openingRevealRadius })] })), openingShape === 'arch' && (_jsx("div", { className: "mt-2 flex flex-col gap-1", children: _jsx(SliderControl, { label: "Arch Height", max: Math.max(0.05, node.height), min: 0.05, onChange: (value) => handleUpdate({ archHeight: value }), precision: 2, restoreOnCommit: false, step: 0.05, unit: "m", value: archHeight }) }))] })), !isOpening && (_jsxs(_Fragment, { children: [showFrameSection && (_jsxs(PanelSection, { title: "Frame", children: [_jsx(SliderControl, { label: "Thickness", min: 0, onChange: (v) => handleUpdate({ frameThickness: v }), precision: 3, step: 0.01, unit: "m", value: node.frameThickness }), _jsx(SliderControl, { label: "Depth", min: 0, onChange: (v) => handleUpdate({ frameDepth: v }), precision: 3, step: 0.01, unit: "m", value: node.frameDepth })] })), showGridSection && (_jsxs(PanelSection, { title: "Grid", children: [_jsx(SliderControl, { label: "Columns", max: 8, min: 1, onChange: (v) => {
+                                ].map(([label, index]) => (_jsx(SliderControl, { label: label, max: maxRoundedRadius, min: 0, onChange: (value) => setOpeningCornerRadius(index, value), onCommit: (value) => setOpeningCornerRadius(index, value, true), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 2, step: 0.05, unit: "m", value: openingCornerRadii[index] ?? 0 }, label))) })), _jsx(SliderControl, { label: "Reveal Radius", max: 0.08, min: 0, onChange: (value) => previewWindowUpdate('openingRevealRadius', value), onCommit: (value) => commitWindowPreview('openingRevealRadius', value), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 3, step: 0.005, unit: "m", value: openingRevealRadius })] })), openingShape === 'arch' && (_jsx("div", { className: "mt-2 flex flex-col gap-1", children: _jsx(SliderControl, { label: "Arch Height", max: Math.max(0.05, node.height), min: 0.05, onChange: (value) => previewWindowUpdate('archHeight', value), onCommit: (value) => commitWindowPreview('archHeight', value), onCancel: () => preview?.cancel(), previewWhileTyping: true, precision: 2, restoreOnCommit: false, step: 0.05, unit: "m", value: archHeight }) }))] })), !isOpening && !scripted && (_jsxs(_Fragment, { children: [showFrameSection && (_jsxs(PanelSection, { title: "Frame", children: [_jsx(SliderControl, { label: "Thickness", min: 0, onChange: (v) => previewWindowUpdate('frameThickness', v), onCommit: (v) => commitWindowPreview('frameThickness', v), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 3, step: 0.01, unit: "m", value: node.frameThickness }), _jsx(SliderControl, { label: "Depth", min: 0, onChange: (v) => previewWindowUpdate('frameDepth', v), onCommit: (v) => commitWindowPreview('frameDepth', v), onCancel: () => preview?.cancel(), previewWhileTyping: true, restoreOnCommit: false, precision: 3, step: 0.01, unit: "m", value: node.frameDepth })] })), showGridSection && (_jsxs(PanelSection, { title: "Grid", children: [_jsx(SliderControl, { label: "Columns", max: 8, min: 1, onChange: (v) => {
                                     const n = Math.max(1, Math.min(8, Math.round(v)));
                                     handleUpdate({ columnRatios: Array(n).fill(1 / n) });
                                 }, precision: 0, step: 1, value: numCols }), _jsx(SliderControl, { label: "Rows", max: 8, min: 1, onChange: (v) => {

package/dist/window/placement.d.ts

@@ -0,0 +1,23 @@
+import type { ToolHint, WindowNode } from '@pascal-app/core';
+import { type WindowStyle } from '@pascal-app/core/building';
+/** The window panel's Window Type row and the tool's Type chip. */
+export declare const windowTypeOptions: Array<{
+    label: string;
+    value: WindowNode['windowType'];
+}>;
+type WindowPlacementState = {
+    type: WindowNode['windowType'];
+    style: WindowStyle;
+    cycleType(): void;
+    cycleStyle(): void;
+};
+export declare const useWindowPlacement: import("zustand").UseBoundStore<import("zustand").StoreApi<WindowPlacementState>>;
+/**
+ * The window the tool places: the chips' type and style, as the panel writes them. The draft takes
+ * these by merge and the tool has no sill control, so the type always says whether there is a sill:
+ * cycled past Bay or Bow, a Fixed window would otherwise keep their "no sill".
+ */
+export declare function placedWindowFields(): Partial<WindowNode>;
+export declare const WINDOW_PLACEMENT_HINTS: ToolHint[];
+export {};
+//# sourceMappingURL=placement.d.ts.map

package/dist/window/placement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"placement.d.ts","sourceRoot":"","sources":["../../src/window/placement.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC5D,OAAO,EAKL,KAAK,WAAW,EAGjB,MAAM,2BAA2B,CAAA;AAGlC,mEAAmE;AACnE,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,UAAU,CAAC,YAAY,CAAC,CAAA;CAAE,CAUvF,CAAA;AAED,KAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,UAAU,CAAC,YAAY,CAAC,CAAA;IAC9B,KAAK,EAAE,WAAW,CAAA;IAClB,SAAS,IAAI,IAAI,CAAA;IACjB,UAAU,IAAI,IAAI,CAAA;CACnB,CAAA;AAID,eAAO,MAAM,kBAAkB,mFAW5B,CAAA;AAEH;;;;GAIG;AACH,wBAAgB,kBAAkB,IAAI,OAAO,CAAC,UAAU,CAAC,CAOxD;AAED,eAAO,MAAM,sBAAsB,EAAE,QAAQ,EAgC5C,CAAA"}

package/dist/window/placement.js

@@ -0,0 +1,66 @@
+// The window tool's placement choices: the chips [O] Type and [L] Style.
+import { getWindowStyleOverrides, SILLLESS_WINDOW_TYPES, WINDOW_STYLE_CHOICES, WINDOW_STYLE_LABELS, windowTakesStyle, windowTypeFields, } from '@pascal-app/core/building';
+import { create } from 'zustand';
+/** The window panel's Window Type row and the tool's Type chip. */
+export const windowTypeOptions = [
+    { label: 'Fixed', value: 'fixed' },
+    { label: 'Sliding', value: 'sliding' },
+    { label: 'Casement', value: 'casement' },
+    { label: 'Awning', value: 'awning' },
+    { label: 'Single Hung', value: 'single-hung' },
+    { label: 'Double Hung', value: 'double-hung' },
+    { label: 'Bay', value: 'bay' },
+    { label: 'Bow', value: 'bow' },
+    { label: 'Louvered', value: 'louvered' },
+];
+const next = (list, value) => list[(list.indexOf(value) + 1) % list.length];
+export const useWindowPlacement = create((set, get) => ({
+    type: 'fixed',
+    style: 'single',
+    cycleType: () => set({
+        type: next(windowTypeOptions.map((option) => option.value), get().type),
+    }),
+    cycleStyle: () => set({ style: next(WINDOW_STYLE_CHOICES, get().style) }),
+}));
+/**
+ * The window the tool places: the chips' type and style, as the panel writes them. The draft takes
+ * these by merge and the tool has no sill control, so the type always says whether there is a sill:
+ * cycled past Bay or Bow, a Fixed window would otherwise keep their "no sill".
+ */
+export function placedWindowFields() {
+    const { type, style } = useWindowPlacement.getState();
+    return {
+        ...windowTypeFields(type),
+        sill: !SILLLESS_WINDOW_TYPES.has(type),
+        ...(windowTakesStyle(type) ? getWindowStyleOverrides(style) : {}),
+    };
+}
+export const WINDOW_PLACEMENT_HINTS = [
+    {
+        key: 'O',
+        label: 'Type',
+        chip: {
+            subscribe: (onChange) => useWindowPlacement.subscribe(onChange),
+            value: () => useWindowPlacement.getState().type,
+            cycle: () => useWindowPlacement.getState().cycleType(),
+            labels: Object.fromEntries(windowTypeOptions.map((option) => [option.value, `Type: ${option.label}`])),
+            tooltip: 'Window type — click or press O to cycle',
+        },
+    },
+    {
+        key: 'L',
+        label: 'Style',
+        // Shown only while the tool places a Fixed window, the one type a style shapes.
+        visible: {
+            subscribe: (onChange) => useWindowPlacement.subscribe(onChange),
+            value: () => windowTakesStyle(useWindowPlacement.getState().type),
+        },
+        chip: {
+            subscribe: (onChange) => useWindowPlacement.subscribe(onChange),
+            value: () => useWindowPlacement.getState().style,
+            cycle: () => useWindowPlacement.getState().cycleStyle(),
+            labels: Object.fromEntries(WINDOW_STYLE_CHOICES.map((style) => [style, `Style: ${WINDOW_STYLE_LABELS[style]}`])),
+            tooltip: 'Window style — click or press L to cycle',
+        },
+    },
+];

package/dist/window/preview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"preview.d.ts","sourceRoot":"","sources":["../../src/window/preview.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAE1C;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,GAAI,2BAIpB;IACD,IAAI,EAAE,UAAU,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,gCAwBA,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"preview.d.ts","sourceRoot":"","sources":["../../src/window/preview.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAE1C;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa,GAAI,2BAIpB;IACD,IAAI,EAAE,UAAU,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,OAAO,CAAA;CAChB,gCA0BA,CAAA;AAED,eAAe,aAAa,CAAA"}

package/dist/window/preview.js

@@ -17,6 +17,8 @@ import { applyGhost } from '../shared/ghost-materials';
 const WindowPreview = ({ node, invalid, valid, }) => {
     const mesh = useMemo(() => {
         const m = buildWindowPreviewMesh(node);
+        // The placement parent already applies the body offset; keep host context for depth.
+        m.position.z = node.position[2];
         m.layers.set(EDITOR_LAYER);
         return m;
     }, [node]);

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

@@ -1 +1 @@
-{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/window/renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+C,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAW/F,eAAO,MAAM,cAAc,GAAI,UAAU;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,gCA4C5D,CAAA;AAED,eAAe,cAAc,CAAA"}
+{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/window/renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+C,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAY/F,eAAO,MAAM,cAAc,GAAI,UAAU;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,gCA6C5D,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/window/renderer.js

@@ -1,9 +1,10 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useLiveNodeOverrides, useRegistry, useScene } from '@pascal-app/core';
 import { createMaterial, DEFAULT_WINDOW_MATERIAL, useNodeEvents, useViewer, } from '@pascal-app/viewer';
 import { useLayoutEffect, useMemo, useRef } from 'react';
 import { RoofFaceHostFrame } from '../shared/roof-face-host';
+import { ScriptedOpeningModel } from '../shared/scripted-opening';
 export const WindowRenderer = ({ node }) => {
     const ref = useRef(null);
     useRegistry(node.id, 'window', ref);
@@ -27,7 +28,7 @@ export const WindowRenderer = ({ node }) => {
         node.material?.properties,
         node.material?.texture,
     ]);
-    const mesh = (_jsx("mesh", { material: material, position: renderNode.position, ref: ref, rotation: renderNode.rotation, visible: renderNode.visible, ...(isTransient ? {} : handlers), children: _jsx("boxGeometry", { args: [0, 0, 0] }) }));
+    const mesh = (_jsxs("mesh", { material: material, position: renderNode.position, ref: ref, rotation: renderNode.rotation, visible: renderNode.visible, ...(isTransient ? {} : handlers), children: [_jsx("boxGeometry", { args: [0, 0, 0] }), renderNode.source && _jsx(ScriptedOpeningModel, { node: renderNode })] }));
     if (!renderNode.roofSegmentId)
         return mesh;
     return (_jsx(RoofFaceHostFrame, { roofFace: renderNode.roofFace, roofSegmentId: renderNode.roofSegmentId, children: mesh }));

package/dist/window/tool.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tool.d.ts","sourceRoot":"","sources":["../../src/window/tool.tsx"],"names":[],"mappings":"AA+FA;;;;;;;;;GASG;AACH,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EA09BvB,CAAA;AAED,eAAe,UAAU,CAAA"}
+{"version":3,"file":"tool.d.ts","sourceRoot":"","sources":["../../src/window/tool.tsx"],"names":[],"mappings":"AAuGA;;;;;;;;;GASG;AACH,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAgkCvB,CAAA;AAED,eAAe,UAAU,CAAA"}