@pascal-app/nodes 1.0.1 → 1.0.4

package/dist/column/panel.js

@@ -1,10 +1,12 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { COLUMN_PRESETS, useScene, } from '@pascal-app/core';
+import { COLUMN_PRESETS, scriptImages, useScene, } from '@pascal-app/core';
 import { ActionButton, ActionGroup, cn, PanelSection, PanelWrapper, SliderControl, ToggleControl, triggerSFX, useEditor, } from '@pascal-app/editor';
 import { useViewer } from '@pascal-app/viewer';
 import { Move, Trash2 } from 'lucide-react';
 import { useCallback } from 'react';
+import { AuthoredParams } from '../item/authored-params';
+import { planColumnEdit } from './hosted-resize';
 const SELECT_CLASS = 'h-10 w-full rounded-lg border border-border/50 bg-[#2C2C2E] px-3 text-sm text-foreground outline-none transition-colors hover:bg-[#3e3e3e] focus:ring-1 focus:ring-border';
 const MANAGED_LEAN_TO_LAYOUT_FIELDS = new Set([
     'position',
@@ -246,7 +248,7 @@ export default function ColumnPanel() {
     const selectedId = useViewer((s) => s.selection.selectedIds[0]);
     const selectedCount = useViewer((s) => s.selection.selectedIds.length);
     const setSelection = useViewer((s) => s.setSelection);
-    const updateNode = useScene((s) => s.updateNode);
+    const updateNodes = useScene((s) => s.updateNodes);
     const deleteNode = useScene((s) => s.deleteNode);
     const setMovingNode = useEditor((s) => s.setMovingNode);
     const node = useScene((s) => selectedId ? s.nodes[selectedId] : undefined);
@@ -256,8 +258,10 @@ export default function ColumnPanel() {
         const nextUpdates = node && isManagedLeanToPost(node) ? filterManagedLeanToLayoutUpdates(updates) : updates;
         if (Object.keys(nextUpdates).length === 0)
             return;
-        updateNode(selectedId, nextUpdates);
-    }, [node, selectedId, updateNode]);
+        const updatesToApply = planColumnEdit(selectedId, nextUpdates);
+        if (updatesToApply)
+            updateNodes(updatesToApply.map(([id, data]) => ({ id, data })));
+    }, [node, selectedId, updateNodes]);
     const handleClose = useCallback(() => {
         setSelection({ selectedIds: [] });
     }, [setSelection]);
@@ -290,155 +294,155 @@ export default function ColumnPanel() {
         supportStyle === 'trestle' ||
         supportStyle === 'portal-frame' ||
         supportStyle === 'box-frame';
-    return (_jsxs(PanelWrapper, { icon: "/icons/column.webp", onClose: handleClose, title: node.name || 'Column', width: 300, children: [_jsx(PanelSection, { title: "Preset", children: _jsxs("select", { className: SELECT_CLASS, onChange: (event) => {
-                        if (!event.target.value)
-                            return;
-                        handleUpdate(presetUpdates(event.target.value));
-                    }, value: "", children: [_jsx("option", { value: "", children: "Apply preset..." }), COLUMN_PRESET_OPTIONS.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] }) }), _jsxs(PanelSection, { title: "Shape", children: [_jsx("div", { className: "grid grid-cols-2 gap-2 px-1 pt-1", children: SUPPORT_STYLE_OPTIONS.map((option) => {
-                            const isSelected = supportStyle === 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: () => {
-                                    // Per-style brace defaults reset the column to that
-                                    // style's natural proportions on switch. Spread last
-                                    // so the preset's braceWidth / braceDepth win over
-                                    // the carried-from-previous-style values.
-                                    const stylePreset = option.value === 'vertical' ? {} : SUPPORT_STYLE_DEFAULTS[option.value];
-                                    handleUpdate({
-                                        supportStyle: option.value,
-                                        ...(option.value !== 'vertical'
-                                            ? {
-                                                crossSection: 'rectangular',
-                                                width: node.braceWidth ?? node.width,
-                                                depth: node.braceDepth ?? node.depth,
-                                                baseStyle: 'none',
-                                                capitalStyle: 'none',
-                                            }
-                                            : {}),
-                                        ...stylePreset,
-                                    });
-                                }, type: "button", children: _jsx("span", { className: "truncate font-medium", children: option.label }) }, option.value));
-                        }) }), isBraceSupport ? (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "Brace Width", max: 0.8, min: 0.04, onChange: (value) => handleUpdate({ braceWidth: value, width: value }), precision: 2, step: 0.01, unit: "m", value: node.braceWidth ?? node.width }), _jsx(SliderControl, { label: "Brace Depth", max: 0.8, min: 0.04, onChange: (value) => handleUpdate({ braceDepth: value, depth: value }), precision: 2, step: 0.01, unit: "m", value: node.braceDepth ?? node.depth })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "grid grid-cols-3 gap-2 px-1 pt-1", children: [
-                                    {
-                                        value: 'round',
-                                        label: 'Round',
-                                        icon: (_jsx("svg", { "aria-hidden": "true", fill: "none", height: "22", viewBox: "0 0 22 22", width: "22", children: _jsx("circle", { cx: "11", cy: "11", r: "7.5", stroke: "currentColor", strokeWidth: "1.5" }) })),
-                                    },
-                                    {
-                                        value: 'square',
-                                        label: 'Square',
-                                        icon: (_jsx("svg", { "aria-hidden": "true", fill: "none", height: "22", viewBox: "0 0 22 22", width: "22", children: _jsx("rect", { height: "15", rx: "1.5", stroke: "currentColor", strokeWidth: "1.5", width: "15", x: "3.5", y: "3.5" }) })),
-                                    },
-                                    {
-                                        value: 'rectangular',
-                                        label: 'Rectangular',
-                                        icon: (_jsx("svg", { "aria-hidden": "true", fill: "none", height: "22", viewBox: "0 0 22 22", width: "22", children: _jsx("rect", { height: "11", rx: "1.5", stroke: "currentColor", strokeWidth: "1.5", width: "16", x: "3", y: "5.5" }) })),
-                                    },
-                                ].map((option) => {
-                                    const isSelected = node.crossSection === option.value;
-                                    return (_jsxs("button", { className: cn('group flex flex-col items-center justify-center gap-1.5 rounded-lg border py-2.5 transition-all', isSelected
-                                            ? 'border-orange-400/60 bg-orange-400/10 text-foreground shadow-[0_0_0_1px_rgba(251,146,60,0.25)_inset]'
-                                            : 'border-border/50 bg-[#2C2C2E] text-muted-foreground hover:border-border hover:bg-[#3e3e3e] hover:text-foreground'), onClick: () => handleUpdate({ crossSection: option.value }), type: "button", children: [_jsx("span", { className: cn('flex h-7 w-7 items-center justify-center', isSelected ? 'text-orange-300' : 'text-muted-foreground/80'), children: option.icon }), _jsx("span", { className: "font-medium text-[11px] leading-none tracking-wide", children: option.label })] }, option.value));
-                                }) }), _jsx(SliderControl, { label: "Edge Softness", max: 0.12, min: 0, onChange: (value) => handleUpdate({ edgeSoftness: value }), precision: 3, step: 0.005, unit: "m", value: node.edgeSoftness ?? 0.025 }), (node.crossSection === 'square' || node.crossSection === 'rectangular') && (_jsx(SliderControl, { label: "Shaft Corner Radius", max: 0.3, min: 0, onChange: (value) => handleUpdate({ shaftCornerRadius: value }), precision: 3, step: 0.005, unit: "m", value: node.shaftCornerRadius ?? 0.035 }))] }))] }), _jsxs(PanelSection, { title: "Dimensions", children: [managedByLeanTo && (_jsx("p", { className: "px-1 pt-1 text-muted-foreground text-xs leading-relaxed", children: "Height and footprint are controlled by the lean-to extension. Rotate or change the support style here; resize from the parent lean-to." })), !isBraceSupport && !managedByLeanTo && (_jsxs("select", { className: SELECT_CLASS, onChange: (event) => {
-                            if (!event.target.value)
-                                return;
-                            handleUpdate(proportionUpdates(node, event.target.value));
-                        }, value: "", children: [_jsx("option", { value: "", children: "Apply proportion..." }), COLUMN_PROPORTION_OPTIONS.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] })), !managedByLeanTo && (_jsx(SliderControl, { label: "Height", max: 1000, min: 0.8, onChange: (value) => handleUpdate({ height: value }), precision: 2, step: 0.05, unit: "m", value: node.height })), isBraceSupport ? (_jsxs(_Fragment, { children: [(supportStyle === 'a-frame' ||
-                                supportStyle === 'x-brace' ||
-                                supportStyle === 'k-brace' ||
-                                supportStyle === 'single-strut' ||
-                                supportStyle === 'tripod' ||
-                                supportStyle === 'trestle' ||
-                                supportStyle === 'portal-frame' ||
-                                supportStyle === 'box-frame') && (_jsx(SliderControl, { label: "Bottom Spread", max: 1000, min: 0.2, onChange: (value) => handleUpdate({
-                                    braceBottomSpread: value,
-                                    braceTopSpread: supportStyle === 'a-frame'
-                                        ? Math.min(node.braceTopSpread ?? 0.12, value)
-                                        : (node.braceTopSpread ?? 1),
-                                }), precision: 2, step: 0.05, unit: "m", value: node.braceBottomSpread ?? 1.2 })), _jsx(SliderControl, { label: supportStyle === 'y-frame' ? 'Fork Spread' : 'Top Spread', max: supportStyle === 'y-frame' ||
-                                    supportStyle === 'v-frame' ||
-                                    supportStyle === 'x-brace' ||
-                                    supportStyle === 'k-brace' ||
-                                    supportStyle === 'single-strut' ||
-                                    supportStyle === 'tripod' ||
-                                    supportStyle === 'trestle' ||
-                                    supportStyle === 'box-frame'
-                                    ? 4
-                                    : Math.max(0.2, node.braceBottomSpread ?? 1.2), min: 0, onChange: (value) => handleUpdate({ braceTopSpread: value }), precision: 2, step: 0.02, unit: "m", value: node.braceTopSpread ??
-                                    (supportStyle === 'y-frame' ||
-                                        supportStyle === 'v-frame' ||
+    return (_jsxs(PanelWrapper, { icon: scriptImages(node)?.thumbnail ?? '/icons/column.webp', onClose: handleClose, title: node.name || 'Column', width: 300, children: [node.source ? (_jsx(AuthoredParams, { node: node })) : (_jsxs(_Fragment, { children: [_jsx(PanelSection, { title: "Preset", children: _jsxs("select", { className: SELECT_CLASS, onChange: (event) => {
+                                if (!event.target.value)
+                                    return;
+                                handleUpdate(presetUpdates(event.target.value));
+                            }, value: "", children: [_jsx("option", { value: "", children: "Apply preset..." }), COLUMN_PRESET_OPTIONS.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] }) }), _jsxs(PanelSection, { title: "Shape", children: [_jsx("div", { className: "grid grid-cols-2 gap-2 px-1 pt-1", children: SUPPORT_STYLE_OPTIONS.map((option) => {
+                                    const isSelected = supportStyle === 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: () => {
+                                            // Per-style brace defaults reset the column to that
+                                            // style's natural proportions on switch. Spread last
+                                            // so the preset's braceWidth / braceDepth win over
+                                            // the carried-from-previous-style values.
+                                            const stylePreset = option.value === 'vertical' ? {} : SUPPORT_STYLE_DEFAULTS[option.value];
+                                            handleUpdate({
+                                                supportStyle: option.value,
+                                                ...(option.value !== 'vertical'
+                                                    ? {
+                                                        crossSection: 'rectangular',
+                                                        width: node.braceWidth ?? node.width,
+                                                        depth: node.braceDepth ?? node.depth,
+                                                        baseStyle: 'none',
+                                                        capitalStyle: 'none',
+                                                    }
+                                                    : {}),
+                                                ...stylePreset,
+                                            });
+                                        }, type: "button", children: _jsx("span", { className: "truncate font-medium", children: option.label }) }, option.value));
+                                }) }), isBraceSupport ? (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "Brace Width", max: 0.8, min: 0.04, onChange: (value) => handleUpdate({ braceWidth: value, width: value }), precision: 2, step: 0.01, unit: "m", value: node.braceWidth ?? node.width }), _jsx(SliderControl, { label: "Brace Depth", max: 0.8, min: 0.04, onChange: (value) => handleUpdate({ braceDepth: value, depth: value }), precision: 2, step: 0.01, unit: "m", value: node.braceDepth ?? node.depth })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "grid grid-cols-3 gap-2 px-1 pt-1", children: [
+                                            {
+                                                value: 'round',
+                                                label: 'Round',
+                                                icon: (_jsx("svg", { "aria-hidden": "true", fill: "none", height: "22", viewBox: "0 0 22 22", width: "22", children: _jsx("circle", { cx: "11", cy: "11", r: "7.5", stroke: "currentColor", strokeWidth: "1.5" }) })),
+                                            },
+                                            {
+                                                value: 'square',
+                                                label: 'Square',
+                                                icon: (_jsx("svg", { "aria-hidden": "true", fill: "none", height: "22", viewBox: "0 0 22 22", width: "22", children: _jsx("rect", { height: "15", rx: "1.5", stroke: "currentColor", strokeWidth: "1.5", width: "15", x: "3.5", y: "3.5" }) })),
+                                            },
+                                            {
+                                                value: 'rectangular',
+                                                label: 'Rectangular',
+                                                icon: (_jsx("svg", { "aria-hidden": "true", fill: "none", height: "22", viewBox: "0 0 22 22", width: "22", children: _jsx("rect", { height: "11", rx: "1.5", stroke: "currentColor", strokeWidth: "1.5", width: "16", x: "3", y: "5.5" }) })),
+                                            },
+                                        ].map((option) => {
+                                            const isSelected = node.crossSection === option.value;
+                                            return (_jsxs("button", { className: cn('group flex flex-col items-center justify-center gap-1.5 rounded-lg border py-2.5 transition-all', isSelected
+                                                    ? 'border-orange-400/60 bg-orange-400/10 text-foreground shadow-[0_0_0_1px_rgba(251,146,60,0.25)_inset]'
+                                                    : 'border-border/50 bg-[#2C2C2E] text-muted-foreground hover:border-border hover:bg-[#3e3e3e] hover:text-foreground'), onClick: () => handleUpdate({ crossSection: option.value }), type: "button", children: [_jsx("span", { className: cn('flex h-7 w-7 items-center justify-center', isSelected ? 'text-orange-300' : 'text-muted-foreground/80'), children: option.icon }), _jsx("span", { className: "font-medium text-[11px] leading-none tracking-wide", children: option.label })] }, option.value));
+                                        }) }), _jsx(SliderControl, { label: "Edge Softness", max: 0.12, min: 0, onChange: (value) => handleUpdate({ edgeSoftness: value }), precision: 3, step: 0.005, unit: "m", value: node.edgeSoftness ?? 0.025 }), (node.crossSection === 'square' || node.crossSection === 'rectangular') && (_jsx(SliderControl, { label: "Shaft Corner Radius", max: 0.3, min: 0, onChange: (value) => handleUpdate({ shaftCornerRadius: value }), precision: 3, step: 0.005, unit: "m", value: node.shaftCornerRadius ?? 0.035 }))] }))] }), _jsxs(PanelSection, { title: "Dimensions", children: [managedByLeanTo && (_jsx("p", { className: "px-1 pt-1 text-muted-foreground text-xs leading-relaxed", children: "Height and footprint are controlled by the lean-to extension. Rotate or change the support style here; resize from the parent lean-to." })), !isBraceSupport && !managedByLeanTo && (_jsxs("select", { className: SELECT_CLASS, onChange: (event) => {
+                                    if (!event.target.value)
+                                        return;
+                                    handleUpdate(proportionUpdates(node, event.target.value));
+                                }, value: "", children: [_jsx("option", { value: "", children: "Apply proportion..." }), COLUMN_PROPORTION_OPTIONS.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] })), !managedByLeanTo && (_jsx(SliderControl, { label: "Height", max: 1000, min: 0.8, onChange: (value) => handleUpdate({ height: value }), precision: 2, step: 0.05, unit: "m", value: node.height })), isBraceSupport ? (_jsxs(_Fragment, { children: [(supportStyle === 'a-frame' ||
                                         supportStyle === 'x-brace' ||
                                         supportStyle === 'k-brace' ||
                                         supportStyle === 'single-strut' ||
                                         supportStyle === 'tripod' ||
                                         supportStyle === 'trestle' ||
                                         supportStyle === 'portal-frame' ||
-                                        supportStyle === 'box-frame'
-                                        ? 1
-                                        : 0.12) }), _jsx(ToggleControl, { checked: node.bracePlateEnabled ?? true, label: "Connector Plates", onChange: (checked) => handleUpdate({ bracePlateEnabled: checked }) })] })) : !managedByLeanTo ? (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "Width", max: 1000, min: 0.12, onChange: (value) => handleUpdate({
-                                    width: value,
-                                    radius: value / 2,
-                                    ...(node.crossSection === 'rectangular' ? {} : { depth: value }),
-                                }), precision: 2, step: 0.02, unit: "m", value: node.width }), node.crossSection === 'rectangular' && (_jsx(SliderControl, { label: "Depth", max: 1000, min: 0.12, onChange: (value) => handleUpdate({ depth: value }), precision: 2, step: 0.02, unit: "m", value: node.depth }))] })) : null] }), !isBraceSupport && (_jsxs(PanelSection, { title: "Shaft", children: [_jsxs("select", { className: SELECT_CLASS, onChange: (event) => handleUpdate(shaftProfileUpdates(event.target.value)), value: shaftProfile, children: [_jsx("option", { value: "straight", children: "Straight" }), _jsx("option", { value: "tapered", children: "Tapered" }), _jsx("option", { value: "bulged", children: "Bulged" }), _jsx("option", { value: "hourglass", children: "Hourglass" })] }), shaftProfile === 'straight' && (_jsx(SliderControl, { label: "Shaft Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value, shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.72 })), shaftProfile === 'tapered' && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "Bottom Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.82 }), _jsx(SliderControl, { label: "Top Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftEndScale ?? 0.72 }), _jsx(SliderControl, { label: "Taper", max: 0.45, min: 0, onChange: (value) => handleUpdate({ shaftTaper: value }), precision: 2, step: 0.01, value: node.shaftTaper ?? 0.14 })] })), shaftProfile === 'bulged' && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "End Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value, shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.68 }), _jsx(SliderControl, { label: "Bulge", max: 0.35, min: 0, onChange: (value) => handleUpdate({ shaftBulge: value }), precision: 2, step: 0.01, value: node.shaftBulge ?? 0.12 })] })), shaftProfile === 'hourglass' && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "End Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value, shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.84 }), _jsx(SliderControl, { label: "Waist", max: 0.35, min: 0, onChange: (value) => handleUpdate({ shaftBulge: value }), precision: 2, step: 0.01, value: node.shaftBulge ?? 0.12 })] })), _jsx(SliderControl, { label: "Segment Twist", max: 90, min: -90, onChange: (value) => handleUpdate({
-                            shaftTwistStep: value,
-                            ...(Math.abs(value) > 0.001 && (node.shaftSegmentCount ?? 1) < 8
-                                ? { shaftSegmentCount: 12 }
-                                : {}),
-                        }), precision: 0, step: 5, unit: "\u00B0", value: node.shaftTwistStep ?? 0 }), Math.abs(node.shaftTwistStep ?? 0) > 0.001 && (_jsx(SliderControl, { label: "Twist Segments", max: 48, min: 4, onChange: (value) => handleUpdate({ shaftSegmentCount: Math.round(value) }), precision: 0, step: 1, value: node.shaftSegmentCount ?? 12 })), _jsx(SliderControl, { label: "Ring Pairs", max: 4, min: 0, onChange: (value) => handleUpdate({
-                            ringCount: Math.round(value) * 2,
-                            ringPlacement: 'ends',
-                            ringSpread: node.ringSpread ?? 0.16,
-                            ringThickness: node.ringThickness ?? 0.055,
-                        }), precision: 0, step: 1, value: Math.ceil((node.ringCount ?? 0) / 2) }), (node.ringCount ?? 0) > 0 && (_jsx(SliderControl, { label: "Ring Thickness", max: 0.14, min: 0.01, onChange: (value) => handleUpdate({ ringThickness: value }), precision: 3, step: 0.005, unit: "m", value: node.ringThickness ?? 0.055 })), (node.ringCount ?? 0) > 0 && (_jsx(SliderControl, { label: "Ring Spread", max: 0.45, min: 0.04, onChange: (value) => handleUpdate({ ringSpread: value, ringPlacement: 'ends' }), precision: 2, step: 0.01, value: node.ringSpread ?? 0.16 }))] })), !isBraceSupport && (_jsxs(PanelSection, { title: "Ends", children: [_jsxs("select", { className: SELECT_CLASS, onChange: (event) => {
-                            const capitalStyle = event.target.value;
-                            handleUpdate({
-                                capitalStyle,
-                                ...(capitalStyle === 'none'
-                                    ? {}
-                                    : {
-                                        capitalHeight: Math.max(node.capitalHeight, 0.12),
-                                        capitalTierCount: capitalStyle === 'stepped'
-                                            ? Math.max(node.capitalTierCount ?? 3, 3)
-                                            : node.capitalTierCount,
-                                        capitalWidthScale: Math.max(node.capitalWidthScale ?? 1.3, capitalStyle === 'stepped' ? 1.42 : 1.28),
-                                        capitalDepthScale: Math.max(node.capitalDepthScale ?? 1.3, capitalStyle === 'stepped' ? 1.42 : 1.28),
-                                        capitalStepSpread: capitalStyle === 'stepped'
-                                            ? Math.max(node.capitalStepSpread ?? 0.34, 0.34)
-                                            : node.capitalStepSpread,
-                                    }),
-                            });
-                        }, value: node.capitalStyle === 'simple-slab' ? 'simple' : (node.capitalStyle ?? 'simple'), children: [_jsx("option", { value: "none", children: "No Top" }), _jsx("option", { value: "simple", children: "Simple Top" }), _jsx("option", { value: "stepped", children: "Stepped Top" }), _jsx("option", { value: "rounded", children: "Rounded Top" })] }), node.capitalStyle !== 'none' && (_jsx(SliderControl, { label: "Top Height", max: 0.8, min: 0.06, onChange: (value) => handleUpdate({ capitalHeight: value }), precision: 2, step: 0.02, unit: "m", value: node.capitalHeight })), node.capitalStyle !== 'none' && (_jsx(SliderControl, { label: "Top Width", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({
-                            capitalWidthScale: value,
-                            ...(node.crossSection === 'rectangular' ? {} : { capitalDepthScale: value }),
-                        }), precision: 2, step: 0.02, value: node.capitalWidthScale ?? 1.28 })), node.capitalStyle !== 'none' && node.crossSection === 'rectangular' && (_jsx(SliderControl, { label: "Top Depth", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({ capitalDepthScale: value }), precision: 2, step: 0.02, value: node.capitalDepthScale ?? node.capitalWidthScale ?? 1.28 })), node.capitalStyle === 'stepped' && (_jsx(SliderControl, { label: "Top Tiers", max: 8, min: 3, onChange: (value) => handleUpdate({ capitalTierCount: Math.round(value) }), precision: 0, step: 1, value: node.capitalTierCount ?? 3 })), node.capitalStyle === 'stepped' && (_jsx(SliderControl, { label: "Top Step Spread", max: 0.9, min: 0.05, onChange: (value) => handleUpdate({ capitalStepSpread: value }), precision: 2, step: 0.01, value: node.capitalStepSpread ?? 0.34 })), _jsxs("select", { className: `${SELECT_CLASS} mt-2`, onChange: (event) => {
-                            const baseStyle = event.target.value;
-                            handleUpdate({
-                                baseStyle,
-                                ...(baseStyle === 'none'
-                                    ? {}
-                                    : {
-                                        baseHeight: Math.max(node.baseHeight, 0.12),
-                                        baseTierCount: baseStyle === 'stepped-square'
-                                            ? Math.max(node.baseTierCount ?? 3, 3)
-                                            : node.baseTierCount,
-                                        baseWidthScale: Math.max(node.baseWidthScale ?? 1.24, baseStyle === 'stepped-square' ? 1.42 : 1.24),
-                                        baseDepthScale: Math.max(node.baseDepthScale ?? 1.24, baseStyle === 'stepped-square' ? 1.42 : 1.24),
-                                        baseStepSpread: baseStyle === 'stepped-square'
-                                            ? Math.max(node.baseStepSpread ?? 0.34, 0.34)
-                                            : node.baseStepSpread,
-                                        basePlinthHeightRatio: baseStyle === 'round-rings'
-                                            ? (node.basePlinthHeightRatio ?? 0.44)
-                                            : node.basePlinthHeightRatio,
-                                        baseRoundBandScale: baseStyle === 'round-rings'
-                                            ? (node.baseRoundBandScale ?? 0.92)
-                                            : node.baseRoundBandScale,
-                                        baseNeckScale: baseStyle === 'round-rings'
-                                            ? (node.baseNeckScale ?? 0.72)
-                                            : node.baseNeckScale,
-                                    }),
-                            });
-                        }, value: node.baseStyle ?? 'square-plinth', children: [_jsx("option", { value: "none", children: "No Bottom" }), _jsx("option", { value: "simple-square", children: "Simple Block Bottom" }), _jsx("option", { value: "square-plinth", children: "Square Plinth Bottom" }), _jsx("option", { value: "stepped-square", children: "Stepped Bottom" }), _jsx("option", { value: "round-rings", children: "Rounded Bottom" })] }), node.baseStyle !== 'none' && (_jsx(SliderControl, { label: "Bottom Height", max: 0.8, min: 0.06, onChange: (value) => handleUpdate({ baseHeight: value }), precision: 2, step: 0.02, unit: "m", value: node.baseHeight })), node.baseStyle !== 'none' && (_jsx(SliderControl, { label: "Bottom Width", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({
-                            baseWidthScale: value,
-                            ...(node.crossSection === 'rectangular' ? {} : { baseDepthScale: value }),
-                        }), precision: 2, step: 0.02, value: node.baseWidthScale ?? 1.24 })), node.baseStyle !== 'none' && node.crossSection === 'rectangular' && (_jsx(SliderControl, { label: "Bottom Depth", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({ baseDepthScale: value }), precision: 2, step: 0.02, value: node.baseDepthScale ?? node.baseWidthScale ?? 1.24 })), node.baseStyle === 'round-rings' && (_jsx(SliderControl, { label: "Plinth Thickness", max: 0.7, min: 0.2, onChange: (value) => handleUpdate({ basePlinthHeightRatio: value }), precision: 2, step: 0.01, value: node.basePlinthHeightRatio ?? 0.44 })), node.baseStyle === 'round-rings' && (_jsx(SliderControl, { label: "Round Band Width", max: 1.2, min: 0.5, onChange: (value) => handleUpdate({ baseRoundBandScale: value }), precision: 2, step: 0.01, value: node.baseRoundBandScale ?? 0.92 })), node.baseStyle === 'round-rings' && (_jsx(SliderControl, { label: "Neck Width", max: 1, min: 0.35, onChange: (value) => handleUpdate({ baseNeckScale: value }), precision: 2, step: 0.01, value: node.baseNeckScale ?? 0.72 })), node.baseStyle === 'stepped-square' && (_jsx(SliderControl, { label: "Bottom Tiers", max: 8, min: 3, onChange: (value) => handleUpdate({ baseTierCount: Math.round(value) }), precision: 0, step: 1, value: node.baseTierCount ?? 3 })), node.baseStyle === 'stepped-square' && (_jsx(SliderControl, { label: "Bottom Step Spread", max: 0.9, min: 0.05, onChange: (value) => handleUpdate({ baseStepSpread: value }), precision: 2, step: 0.01, value: node.baseStepSpread ?? 0.34 }))] })), _jsx(PanelSection, { title: "Transform", children: _jsx(SliderControl, { label: "Yaw", max: 180, min: -180, onChange: (value) => handleUpdate({ rotation: (value * Math.PI) / 180 }), precision: 0, step: 1, unit: "\u00B0", value: Math.round((node.rotation * 180) / Math.PI) }) }), _jsx(PanelSection, { title: "Actions", children: _jsxs(ActionGroup, { children: [_jsx(ActionButton, { icon: _jsx(Move, { className: "h-4 w-4" }), label: "Move", onClick: handleMove }), _jsx(ActionButton, { className: "border-red-500/40 text-red-200 hover:bg-red-500/15", icon: _jsx(Trash2, { className: "h-4 w-4" }), label: "Delete", onClick: handleDelete })] }) })] }));
+                                        supportStyle === 'box-frame') && (_jsx(SliderControl, { label: "Bottom Spread", max: 1000, min: 0.2, onChange: (value) => handleUpdate({
+                                            braceBottomSpread: value,
+                                            braceTopSpread: supportStyle === 'a-frame'
+                                                ? Math.min(node.braceTopSpread ?? 0.12, value)
+                                                : (node.braceTopSpread ?? 1),
+                                        }), precision: 2, step: 0.05, unit: "m", value: node.braceBottomSpread ?? 1.2 })), _jsx(SliderControl, { label: supportStyle === 'y-frame' ? 'Fork Spread' : 'Top Spread', max: supportStyle === 'y-frame' ||
+                                            supportStyle === 'v-frame' ||
+                                            supportStyle === 'x-brace' ||
+                                            supportStyle === 'k-brace' ||
+                                            supportStyle === 'single-strut' ||
+                                            supportStyle === 'tripod' ||
+                                            supportStyle === 'trestle' ||
+                                            supportStyle === 'box-frame'
+                                            ? 4
+                                            : Math.max(0.2, node.braceBottomSpread ?? 1.2), min: 0, onChange: (value) => handleUpdate({ braceTopSpread: value }), precision: 2, step: 0.02, unit: "m", value: node.braceTopSpread ??
+                                            (supportStyle === 'y-frame' ||
+                                                supportStyle === 'v-frame' ||
+                                                supportStyle === 'x-brace' ||
+                                                supportStyle === 'k-brace' ||
+                                                supportStyle === 'single-strut' ||
+                                                supportStyle === 'tripod' ||
+                                                supportStyle === 'trestle' ||
+                                                supportStyle === 'portal-frame' ||
+                                                supportStyle === 'box-frame'
+                                                ? 1
+                                                : 0.12) }), _jsx(ToggleControl, { checked: node.bracePlateEnabled ?? true, label: "Connector Plates", onChange: (checked) => handleUpdate({ bracePlateEnabled: checked }) })] })) : !managedByLeanTo ? (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "Width", max: 1000, min: 0.12, onChange: (value) => handleUpdate({
+                                            width: value,
+                                            radius: value / 2,
+                                            ...(node.crossSection === 'rectangular' ? {} : { depth: value }),
+                                        }), precision: 2, step: 0.02, unit: "m", value: node.width }), node.crossSection === 'rectangular' && (_jsx(SliderControl, { label: "Depth", max: 1000, min: 0.12, onChange: (value) => handleUpdate({ depth: value }), precision: 2, step: 0.02, unit: "m", value: node.depth }))] })) : null] }), !isBraceSupport && (_jsxs(PanelSection, { title: "Shaft", children: [_jsxs("select", { className: SELECT_CLASS, onChange: (event) => handleUpdate(shaftProfileUpdates(event.target.value)), value: shaftProfile, children: [_jsx("option", { value: "straight", children: "Straight" }), _jsx("option", { value: "tapered", children: "Tapered" }), _jsx("option", { value: "bulged", children: "Bulged" }), _jsx("option", { value: "hourglass", children: "Hourglass" })] }), shaftProfile === 'straight' && (_jsx(SliderControl, { label: "Shaft Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value, shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.72 })), shaftProfile === 'tapered' && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "Bottom Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.82 }), _jsx(SliderControl, { label: "Top Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftEndScale ?? 0.72 }), _jsx(SliderControl, { label: "Taper", max: 0.45, min: 0, onChange: (value) => handleUpdate({ shaftTaper: value }), precision: 2, step: 0.01, value: node.shaftTaper ?? 0.14 })] })), shaftProfile === 'bulged' && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "End Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value, shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.68 }), _jsx(SliderControl, { label: "Bulge", max: 0.35, min: 0, onChange: (value) => handleUpdate({ shaftBulge: value }), precision: 2, step: 0.01, value: node.shaftBulge ?? 0.12 })] })), shaftProfile === 'hourglass' && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "End Width", max: 1.2, min: 0.3, onChange: (value) => handleUpdate({ shaftStartScale: value, shaftEndScale: value }), precision: 2, step: 0.02, value: node.shaftStartScale ?? 0.84 }), _jsx(SliderControl, { label: "Waist", max: 0.35, min: 0, onChange: (value) => handleUpdate({ shaftBulge: value }), precision: 2, step: 0.01, value: node.shaftBulge ?? 0.12 })] })), _jsx(SliderControl, { label: "Segment Twist", max: 90, min: -90, onChange: (value) => handleUpdate({
+                                    shaftTwistStep: value,
+                                    ...(Math.abs(value) > 0.001 && (node.shaftSegmentCount ?? 1) < 8
+                                        ? { shaftSegmentCount: 12 }
+                                        : {}),
+                                }), precision: 0, step: 5, unit: "\u00B0", value: node.shaftTwistStep ?? 0 }), Math.abs(node.shaftTwistStep ?? 0) > 0.001 && (_jsx(SliderControl, { label: "Twist Segments", max: 48, min: 4, onChange: (value) => handleUpdate({ shaftSegmentCount: Math.round(value) }), precision: 0, step: 1, value: node.shaftSegmentCount ?? 12 })), _jsx(SliderControl, { label: "Ring Pairs", max: 4, min: 0, onChange: (value) => handleUpdate({
+                                    ringCount: Math.round(value) * 2,
+                                    ringPlacement: 'ends',
+                                    ringSpread: node.ringSpread ?? 0.16,
+                                    ringThickness: node.ringThickness ?? 0.055,
+                                }), precision: 0, step: 1, value: Math.ceil((node.ringCount ?? 0) / 2) }), (node.ringCount ?? 0) > 0 && (_jsx(SliderControl, { label: "Ring Thickness", max: 0.14, min: 0.01, onChange: (value) => handleUpdate({ ringThickness: value }), precision: 3, step: 0.005, unit: "m", value: node.ringThickness ?? 0.055 })), (node.ringCount ?? 0) > 0 && (_jsx(SliderControl, { label: "Ring Spread", max: 0.45, min: 0.04, onChange: (value) => handleUpdate({ ringSpread: value, ringPlacement: 'ends' }), precision: 2, step: 0.01, value: node.ringSpread ?? 0.16 }))] })), !isBraceSupport && (_jsxs(PanelSection, { title: "Ends", children: [_jsxs("select", { className: SELECT_CLASS, onChange: (event) => {
+                                    const capitalStyle = event.target.value;
+                                    handleUpdate({
+                                        capitalStyle,
+                                        ...(capitalStyle === 'none'
+                                            ? {}
+                                            : {
+                                                capitalHeight: Math.max(node.capitalHeight, 0.12),
+                                                capitalTierCount: capitalStyle === 'stepped'
+                                                    ? Math.max(node.capitalTierCount ?? 3, 3)
+                                                    : node.capitalTierCount,
+                                                capitalWidthScale: Math.max(node.capitalWidthScale ?? 1.3, capitalStyle === 'stepped' ? 1.42 : 1.28),
+                                                capitalDepthScale: Math.max(node.capitalDepthScale ?? 1.3, capitalStyle === 'stepped' ? 1.42 : 1.28),
+                                                capitalStepSpread: capitalStyle === 'stepped'
+                                                    ? Math.max(node.capitalStepSpread ?? 0.34, 0.34)
+                                                    : node.capitalStepSpread,
+                                            }),
+                                    });
+                                }, value: node.capitalStyle === 'simple-slab' ? 'simple' : (node.capitalStyle ?? 'simple'), children: [_jsx("option", { value: "none", children: "No Top" }), _jsx("option", { value: "simple", children: "Simple Top" }), _jsx("option", { value: "stepped", children: "Stepped Top" }), _jsx("option", { value: "rounded", children: "Rounded Top" })] }), node.capitalStyle !== 'none' && (_jsx(SliderControl, { label: "Top Height", max: 0.8, min: 0.06, onChange: (value) => handleUpdate({ capitalHeight: value }), precision: 2, step: 0.02, unit: "m", value: node.capitalHeight })), node.capitalStyle !== 'none' && (_jsx(SliderControl, { label: "Top Width", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({
+                                    capitalWidthScale: value,
+                                    ...(node.crossSection === 'rectangular' ? {} : { capitalDepthScale: value }),
+                                }), precision: 2, step: 0.02, value: node.capitalWidthScale ?? 1.28 })), node.capitalStyle !== 'none' && node.crossSection === 'rectangular' && (_jsx(SliderControl, { label: "Top Depth", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({ capitalDepthScale: value }), precision: 2, step: 0.02, value: node.capitalDepthScale ?? node.capitalWidthScale ?? 1.28 })), node.capitalStyle === 'stepped' && (_jsx(SliderControl, { label: "Top Tiers", max: 8, min: 3, onChange: (value) => handleUpdate({ capitalTierCount: Math.round(value) }), precision: 0, step: 1, value: node.capitalTierCount ?? 3 })), node.capitalStyle === 'stepped' && (_jsx(SliderControl, { label: "Top Step Spread", max: 0.9, min: 0.05, onChange: (value) => handleUpdate({ capitalStepSpread: value }), precision: 2, step: 0.01, value: node.capitalStepSpread ?? 0.34 })), _jsxs("select", { className: `${SELECT_CLASS} mt-2`, onChange: (event) => {
+                                    const baseStyle = event.target.value;
+                                    handleUpdate({
+                                        baseStyle,
+                                        ...(baseStyle === 'none'
+                                            ? {}
+                                            : {
+                                                baseHeight: Math.max(node.baseHeight, 0.12),
+                                                baseTierCount: baseStyle === 'stepped-square'
+                                                    ? Math.max(node.baseTierCount ?? 3, 3)
+                                                    : node.baseTierCount,
+                                                baseWidthScale: Math.max(node.baseWidthScale ?? 1.24, baseStyle === 'stepped-square' ? 1.42 : 1.24),
+                                                baseDepthScale: Math.max(node.baseDepthScale ?? 1.24, baseStyle === 'stepped-square' ? 1.42 : 1.24),
+                                                baseStepSpread: baseStyle === 'stepped-square'
+                                                    ? Math.max(node.baseStepSpread ?? 0.34, 0.34)
+                                                    : node.baseStepSpread,
+                                                basePlinthHeightRatio: baseStyle === 'round-rings'
+                                                    ? (node.basePlinthHeightRatio ?? 0.44)
+                                                    : node.basePlinthHeightRatio,
+                                                baseRoundBandScale: baseStyle === 'round-rings'
+                                                    ? (node.baseRoundBandScale ?? 0.92)
+                                                    : node.baseRoundBandScale,
+                                                baseNeckScale: baseStyle === 'round-rings'
+                                                    ? (node.baseNeckScale ?? 0.72)
+                                                    : node.baseNeckScale,
+                                            }),
+                                    });
+                                }, value: node.baseStyle ?? 'square-plinth', children: [_jsx("option", { value: "none", children: "No Bottom" }), _jsx("option", { value: "simple-square", children: "Simple Block Bottom" }), _jsx("option", { value: "square-plinth", children: "Square Plinth Bottom" }), _jsx("option", { value: "stepped-square", children: "Stepped Bottom" }), _jsx("option", { value: "round-rings", children: "Rounded Bottom" })] }), node.baseStyle !== 'none' && (_jsx(SliderControl, { label: "Bottom Height", max: 0.8, min: 0.06, onChange: (value) => handleUpdate({ baseHeight: value }), precision: 2, step: 0.02, unit: "m", value: node.baseHeight })), node.baseStyle !== 'none' && (_jsx(SliderControl, { label: "Bottom Width", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({
+                                    baseWidthScale: value,
+                                    ...(node.crossSection === 'rectangular' ? {} : { baseDepthScale: value }),
+                                }), precision: 2, step: 0.02, value: node.baseWidthScale ?? 1.24 })), node.baseStyle !== 'none' && node.crossSection === 'rectangular' && (_jsx(SliderControl, { label: "Bottom Depth", max: 2.4, min: 0.6, onChange: (value) => handleUpdate({ baseDepthScale: value }), precision: 2, step: 0.02, value: node.baseDepthScale ?? node.baseWidthScale ?? 1.24 })), node.baseStyle === 'round-rings' && (_jsx(SliderControl, { label: "Plinth Thickness", max: 0.7, min: 0.2, onChange: (value) => handleUpdate({ basePlinthHeightRatio: value }), precision: 2, step: 0.01, value: node.basePlinthHeightRatio ?? 0.44 })), node.baseStyle === 'round-rings' && (_jsx(SliderControl, { label: "Round Band Width", max: 1.2, min: 0.5, onChange: (value) => handleUpdate({ baseRoundBandScale: value }), precision: 2, step: 0.01, value: node.baseRoundBandScale ?? 0.92 })), node.baseStyle === 'round-rings' && (_jsx(SliderControl, { label: "Neck Width", max: 1, min: 0.35, onChange: (value) => handleUpdate({ baseNeckScale: value }), precision: 2, step: 0.01, value: node.baseNeckScale ?? 0.72 })), node.baseStyle === 'stepped-square' && (_jsx(SliderControl, { label: "Bottom Tiers", max: 8, min: 3, onChange: (value) => handleUpdate({ baseTierCount: Math.round(value) }), precision: 0, step: 1, value: node.baseTierCount ?? 3 })), node.baseStyle === 'stepped-square' && (_jsx(SliderControl, { label: "Bottom Step Spread", max: 0.9, min: 0.05, onChange: (value) => handleUpdate({ baseStepSpread: value }), precision: 2, step: 0.01, value: node.baseStepSpread ?? 0.34 }))] }))] })), _jsx(PanelSection, { title: "Transform", children: _jsx(SliderControl, { label: "Yaw", max: 180, min: -180, onChange: (value) => handleUpdate({ rotation: (value * Math.PI) / 180 }), precision: 0, step: 1, unit: "\u00B0", value: Math.round((node.rotation * 180) / Math.PI) }) }), _jsx(PanelSection, { title: "Actions", children: _jsxs(ActionGroup, { children: [_jsx(ActionButton, { icon: _jsx(Move, { className: "h-4 w-4" }), label: "Move", onClick: handleMove }), _jsx(ActionButton, { className: "border-red-500/40 text-red-200 hover:bg-red-500/15", icon: _jsx(Trash2, { className: "h-4 w-4" }), label: "Delete", onClick: handleDelete })] }) })] }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/column/renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,UAAU,EAKhB,MAAM,kBAAkB,CAAA;AAwwEzB;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa,GAAI,UAAU;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,gCA6C3D,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,mBAAmB;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,gCAgDrE,CAAA;AAED,eAAe,cAAc,CAAA"}
+{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/column/renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAML,KAAK,UAAU,EAQhB,MAAM,kBAAkB,CAAA;AAunEzB;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa,GAAI,UAAU;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,gCA6C3D,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,mBAAmB;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,gCAmErE,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/column/renderer.js

@@ -1,10 +1,11 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useLiveNodeOverrides, useLiveTransforms, useRegistry, useScene, } from '@pascal-app/core';
-import { baseMaterial, createColumnBoxGeometry, createColumnCylinderGeometry, createColumnSphereGeometry, createColumnTorusGeometry, createMaterial, createMaterialFromPresetRef, createSurfaceRoleMaterial, resolveMaterialRef, resolveSlotDefaultMaterial, useNodeEvents, useViewer, } from '@pascal-app/viewer';
+import { COLUMN_BASE_DEFAULT, COLUMN_CAPITAL_DEFAULT, COLUMN_FRAME_DEFAULT, COLUMN_SHAFT_DEFAULT, collectDescendants, createSceneApi, useLiveNodeOverrides, useLiveTransforms, useRegistry, useScene, } from '@pascal-app/core';
+import { baseMaterial, createColumnBoxGeometry, createColumnCylinderGeometry, createColumnSphereGeometry, createColumnTorusGeometry, createMaterial, createMaterialFromPresetRef, createSurfaceRoleMaterial, NodeRenderer, resolveMaterialRef, resolveSlotDefaultMaterial, useNodeEvents, useViewer, } from '@pascal-app/viewer';
 import { createContext, useContext, useEffect, useMemo, useRef } from 'react';
 import { BufferGeometry, Float32BufferAttribute } from 'three';
-import { COLUMN_BASE_DEFAULT, COLUMN_CAPITAL_DEFAULT, COLUMN_FRAME_DEFAULT, COLUMN_SHAFT_DEFAULT, } from './slots';
+import { ScriptedOpeningModel } from '../shared/scripted-opening';
+import { columnCapitalBlocks, columnShaftLayout, getSegments, getShaftScaleAt, getShaftSegmentCount, getShaftTwistRadians, } from './shape';
 const DEFAULT_COLUMN_MATERIAL = baseMaterial();
 const DEFAULT_COLUMN_SLOT_MATERIALS = createSingleColumnMaterialMap(DEFAULT_COLUMN_MATERIAL);
 const ColumnMaterialContext = createContext(DEFAULT_COLUMN_SLOT_MATERIALS);
@@ -99,51 +100,6 @@ function createColumnSlotMaterials({ colorPreset, material, materialPreset, node
         }),
     };
 }
-function getSegments(node) {
-    if (node.crossSection === 'octagonal')
-        return 8;
-    if (node.crossSection === 'sixteen-sided')
-        return 16;
-    return 32;
-}
-function getShaftProfile(node) {
-    return node.shaftProfile ?? (node.shaftTaper > 0 ? 'tapered' : 'straight');
-}
-function getShaftSegmentCount(node) {
-    const shaftProfile = getShaftProfile(node);
-    const shaftTaper = node.shaftTaper ?? 0;
-    const hasTwist = Math.abs(node.shaftTwistStep ?? 0) > 0.001;
-    return Math.max(hasTwist ? 4 : 1, shaftProfile === 'straight' && shaftTaper <= 0 && !hasTwist
-        ? 1
-        : (node.shaftSegmentCount ?? (hasTwist ? 12 : 24)));
-}
-function getShaftTwistRadians(node, index) {
-    return ((node.shaftTwistStep ?? 0) * Math.PI * index) / 180;
-}
-function getShaftScaleAt(node, t) {
-    const shaftProfile = getShaftProfile(node);
-    const shaftTaper = Math.min(node.shaftTaper ?? 0, 0.85);
-    const startScale = node.shaftStartScale ?? 0.72;
-    const endScale = node.shaftEndScale ?? startScale;
-    const shaftBulge = node.shaftBulge ??
-        (shaftProfile === 'bulged'
-            ? 0.16
-            : shaftProfile === 'baluster'
-                ? 0.2
-                : shaftProfile === 'hourglass'
-                    ? 0.18
-                    : 0);
-    const taperedScale = 1 - shaftTaper * t;
-    const linearScale = (startScale + (endScale - startScale) * t) * taperedScale;
-    const bulgeCurve = Math.sin(Math.PI * t);
-    const hourglassCurve = Math.abs(t - 0.5) * 2;
-    const profileScale = shaftProfile === 'bulged' || shaftProfile === 'baluster'
-        ? linearScale + shaftBulge * bulgeCurve
-        : shaftProfile === 'hourglass'
-            ? linearScale - shaftBulge * (1 - hourglassCurve)
-            : linearScale;
-    return Math.max(0.1, profileScale);
-}
 function clamp(value, min, max) {
     return Math.min(max, Math.max(min, value));
 }
@@ -868,58 +824,15 @@ function LeafCarvings({ node, capitalY, capitalHeight, }) {
         })) }));
 }
 function Capital({ node, y, height }) {
-    if (height <= 0)
+    const blocks = columnCapitalBlocks(node, y, height);
+    if (!blocks.length)
         return null;
-    const capitalStyle = node.capitalStyle ?? 'simple';
-    if (capitalStyle === 'none')
-        return null;
-    if (capitalStyle === 'south-indian-bracket' || capitalStyle === 'wood-bracket') {
-        const tierCount = Math.max(1, node.bracketTierCount ?? 3);
-        const tierHeight = height / tierCount;
-        const bracketDepth = node.bracketDepth ?? 0.35;
-        return (_jsxs("group", { children: [Array.from({ length: tierCount }, (_, index) => {
-                    const t = index / Math.max(1, tierCount - 1);
-                    const scale = (node.capitalWidthScale ?? 1.6) + t * 0.32;
-                    return (_jsx(SquareBlock, { depth: node.depth * scale + bracketDepth * t, height: tierHeight, width: node.width * scale + bracketDepth * t, y: y + index * tierHeight }, index));
-                }), Array.from({ length: node.pendantCount ?? 0 }, (_, index) => {
-                    const count = Math.max(1, node.pendantCount ?? 0);
-                    const angle = (index / count) * Math.PI * 2;
+    return (_jsxs("group", { children: [blocks.map((block, index) => block.kind === 'box' ? (_jsx(SquareBlock, { y: block.y, height: block.height, width: block.width, depth: block.depth }, index)) : block.kind === 'oval' ? (_jsx(OvalBlock, { y: block.y, height: block.height, width: block.width, depth: block.depth }, index)) : block.kind === 'round' ? (_jsx(RoundBlock, { y: block.y, height: block.height, radius: block.radius, segments: getSegments(node) }, index)) : (_jsx(ColumnBlock, { node: node, y: block.y, height: block.height, scale: block.scale }, index))), (node.capitalStyle === 'south-indian-bracket' || node.capitalStyle === 'wood-bracket') &&
+                Array.from({ length: node.pendantCount ?? 0 }, (_, index) => {
+                    const angle = (index / Math.max(1, node.pendantCount ?? 0)) * Math.PI * 2;
                     const distance = Math.max(node.width, node.depth) * 0.56;
                     return (_jsx(MappedCone, { height: height * 0.28, position: [Math.cos(angle) * distance, y - height * 0.1, Math.sin(angle) * distance], radiusX: 0.035, rotation: [0, 0, 0], segments: 6 }, index));
-                })] }));
-    }
-    if (capitalStyle === 'rounded' || capitalStyle === 'doric') {
-        const topWidth = node.width * (node.capitalWidthScale ?? 1.34);
-        const topDepth = node.depth * (node.capitalDepthScale ?? node.capitalWidthScale ?? 1.34);
-        return (_jsxs("group", { children: [_jsx(OvalBlock, { depth: topDepth * 0.72, height: height * 0.24, segments: 32, width: topWidth * 0.72, y: y }), _jsx(OvalBlock, { depth: topDepth * 0.92, height: height * 0.32, segments: 32, width: topWidth * 0.92, y: y + height * 0.24 }), _jsx(SquareBlock, { depth: topDepth, height: height * 0.44, width: topWidth, y: y + height * 0.56 })] }));
-    }
-    if (capitalStyle === 'stepped') {
-        const widthScale = node.capitalWidthScale ?? 1.46;
-        const depthScale = node.capitalDepthScale ?? widthScale;
-        const tierCount = Math.max(3, node.capitalTierCount ?? 3);
-        const tierHeight = height / tierCount;
-        const stepSpread = node.capitalStepSpread ?? 0.42;
-        return (_jsx("group", { children: Array.from({ length: tierCount }, (_, index) => {
-                const t = index / Math.max(1, tierCount - 1);
-                const widthScaleAt = Math.max(0.5, widthScale - (1 - t) * stepSpread);
-                const depthScaleAt = Math.max(0.5, depthScale - (1 - t) * stepSpread);
-                return (_jsx(SquareBlock, { depth: node.depth * depthScaleAt, height: tierHeight * 1.01, width: node.width * widthScaleAt, y: y + index * tierHeight }, index));
-            }) }));
-    }
-    if (capitalStyle === 'volute' ||
-        capitalStyle === 'ionic-volute' ||
-        capitalStyle === 'leaf-carved' ||
-        capitalStyle === 'corinthian-leaf') {
-        const topWidth = node.width * (node.capitalWidthScale ?? 1.46);
-        const topDepth = node.depth * (node.capitalDepthScale ?? node.capitalWidthScale ?? 1.46);
-        return (_jsxs("group", { children: [_jsx(ColumnBlock, { height: height * 0.24, node: node, scale: 0.9, y: y }), _jsx(ColumnBlock, { height: height * 0.2, node: node, scale: 1.08, y: y + height * 0.24 }), _jsx(SquareBlock, { depth: topDepth, height: height * 0.28, width: topWidth, y: y + height * 0.44 }), _jsx(Volutes, { capitalHeight: height, capitalY: y, node: node }), _jsx(LeafCarvings, { capitalHeight: height, capitalY: y, node: node })] }));
-    }
-    const widthScale = node.capitalWidthScale ?? (capitalStyle === 'simple-slab' ? 1.28 : 1.18);
-    const depthScale = node.capitalDepthScale ?? widthScale;
-    if (node.crossSection === 'square' || node.crossSection === 'rectangular') {
-        return (_jsx(SquareBlock, { depth: node.depth * depthScale, height: height, width: node.width * widthScale, y: y }));
-    }
-    return (_jsx(RoundBlock, { height: height, radius: Math.max(node.radius * widthScale, node.width * widthScale * 0.5), segments: getSegments(node), y: y }));
+                }), _jsx(Volutes, { capitalHeight: height, capitalY: y, node: node }), _jsx(LeafCarvings, { capitalHeight: height, capitalY: y, node: node })] }));
 }
 /**
  * The column's geometry tree — either a fabricated support frame or the
@@ -931,12 +844,7 @@ function Capital({ node, y, height }) {
  * wrapping this in its own providers.
  */
 function ColumnBody({ node }) {
-    const shaftLayout = useMemo(() => {
-        const baseHeight = node.baseStyle === 'none' ? 0 : Math.min(node.baseHeight, node.height * 0.4);
-        const capitalHeight = node.capitalStyle === 'none' ? 0 : Math.min(node.capitalHeight, node.height * 0.4);
-        const shaftHeight = Math.max(0.1, node.height - baseHeight - capitalHeight);
-        return { baseHeight, capitalHeight, shaftY: baseHeight, shaftHeight };
-    }, [node.baseHeight, node.baseStyle, node.capitalHeight, node.capitalStyle, node.height]);
+    const shaftLayout = columnShaftLayout(node);
     if (node.supportStyle !== 'vertical') {
         const support = node.supportStyle === 'a-frame' ? (_jsx(AFrameSupport, { node: node })) : node.supportStyle === 'y-frame' ? (_jsx(YFrameSupport, { node: node })) : node.supportStyle === 'v-frame' ? (_jsx(VFrameSupport, { node: node })) : node.supportStyle === 'x-brace' ? (_jsx(XBraceSupport, { node: node })) : node.supportStyle === 'k-brace' ? (_jsx(KBraceSupport, { node: node })) : node.supportStyle === 'single-strut' ? (_jsx(SingleStrutSupport, { node: node })) : node.supportStyle === 'tripod' ? (_jsx(TripodSupport, { node: node })) : node.supportStyle === 'trestle' ? (_jsx(TrestleSupport, { node: node })) : node.supportStyle === 'portal-frame' ? (_jsx(PortalFrameSupport, { node: node })) : (_jsx(BoxFrameSupport, { node: node }));
         return _jsx(ColumnSlot, { slotId: "frame", children: support });
@@ -985,7 +893,7 @@ export const ColumnPreview = ({ node }) => {
             obj.raycast = () => { };
         });
     });
-    return (_jsx(ColumnMaterialContext.Provider, { value: materials, children: _jsx(ColumnEdgeSoftnessContext.Provider, { value: node.edgeSoftness ?? 0.025, children: _jsx("group", { ref: groupRef, children: _jsx(ColumnBody, { node: node }) }) }) }));
+    return (_jsx(ColumnMaterialContext.Provider, { value: materials, children: _jsx(ColumnEdgeSoftnessContext.Provider, { value: node.edgeSoftness ?? 0.025, children: _jsx("group", { ref: groupRef, children: node.source ? _jsx(ScriptedOpeningModel, { node: node }) : _jsx(ColumnBody, { node: node }) }) }) }));
 };
 export const ColumnRenderer = ({ node: rawNode }) => {
     const ref = useRef(null);
@@ -995,6 +903,8 @@ export const ColumnRenderer = ({ node: rawNode }) => {
     // override entry; unrelated writes don't re-render.
     const liveOverride = useLiveNodeOverrides((s) => s.overrides.get(rawNode.id));
     const node = useMemo(() => (liveOverride ? { ...rawNode, ...liveOverride } : rawNode), [rawNode, liveOverride]);
+    const scriptedColumn = Boolean(node.source);
+    const modelData = useMemo(() => ({ scriptedColumn }), [scriptedColumn]);
     const handlers = useNodeEvents(node, 'column');
     const liveTransform = useLiveTransforms((state) => state.get(node.id));
     const shading = useViewer((state) => state.shading);
@@ -1011,6 +921,20 @@ export const ColumnRenderer = ({ node: rawNode }) => {
         colorPreset,
     }), [shading, textures, colorPreset, node, sceneMaterials]);
     useRegistry(node.id, node.type, ref);
-    return (_jsx(ColumnMaterialContext.Provider, { value: materials, children: _jsx(ColumnEdgeSoftnessContext.Provider, { value: node.edgeSoftness ?? 0.025, children: _jsx("group", { position: liveTransform?.position ?? node.position, ref: ref, rotation: [0, liveTransform?.rotation ?? node.rotation, 0], visible: node.visible, ...handlers, children: _jsx(ColumnBody, { node: node }) }) }) }));
+    // This renderer bypasses GeometrySystem, which normally invalidates hosted descendants.
+    useEffect(() => {
+        const dirtySubtree = () => {
+            const scene = createSceneApi(useScene);
+            for (const id of collectDescendants(node.id, { scene })) {
+                scene.markDirty(id);
+            }
+        };
+        dirtySubtree();
+        return useLiveTransforms.subscribe((state, previous) => {
+            if (state.transforms.get(node.id) !== previous.transforms.get(node.id))
+                dirtySubtree();
+        });
+    }, [node]);
+    return (_jsx(ColumnMaterialContext.Provider, { value: materials, children: _jsx(ColumnEdgeSoftnessContext.Provider, { value: node.edgeSoftness ?? 0.025, children: _jsxs("group", { position: liveTransform?.position ?? node.position, ref: ref, rotation: [0, liveTransform?.rotation ?? node.rotation, 0], visible: node.visible, userData: modelData, ...handlers, children: [node.source ? _jsx(ScriptedOpeningModel, { node: node }) : _jsx(ColumnBody, { node: node }), node.children.map((id) => (_jsx(NodeRenderer, { nodeId: id }, id)))] }) }) }));
 };
 export default ColumnRenderer;