@pascal-app/nodes 1.0.6 → 1.1.0

package/dist/cabinet/run-panel.js

@@ -1,6 +1,6 @@
 'use client';
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cascadeDirty, createSceneApi, resolveLevelId, runAsSingleSceneHistoryStep, useScene, } from '@pascal-app/core';
+import { cascadeDirty, createSceneApi, resolveLevelId, runAsSingleSceneHistoryStep, usePascalI18n, useScene, } from '@pascal-app/core';
 import { ActionButton, PanelSection, PanelWrapper, SegmentedControl, SliderControl, ToggleControl, usePlacementNotice, } from '@pascal-app/editor';
 import { useViewer } from '@pascal-app/viewer';
 import { Copy, Equal as EqualIcon, Plus, Trash } from 'lucide-react';
@@ -58,35 +58,46 @@ function selectCabinetRunPlanningNodes(nodes, runId) {
     });
 }
 const FRONT_STYLE_OPTIONS = [
-    { value: 'slab', label: 'Slab' },
-    { value: 'shaker', label: 'Shaker' },
-    { value: 'raised-arch', label: 'Raised Arch' },
+    { value: 'slab', label: /* i18n */ { id: 'node.cabinet.runPanel.slab', message: 'Slab' } },
+    { value: 'shaker', label: /* i18n */ { id: 'node.cabinet.runPanel.shaker', message: 'Shaker' } },
+    {
+        value: 'raised-arch',
+        label: /* i18n */ { id: 'node.cabinet.runPanel.raisedArch', message: 'Raised Arch' },
+    },
 ];
 const FRONT_OVERLAY_OPTIONS = [
-    { value: 'full', label: 'Overlay' },
-    { value: 'inset', label: 'Inset' },
+    { value: 'full', label: /* i18n */ { id: 'node.cabinet.runPanel.overlay', message: 'Overlay' } },
+    { value: 'inset', label: /* i18n */ { id: 'node.cabinet.runPanel.inset', message: 'Inset' } },
 ];
 const HANDLE_STYLE_OPTIONS = [
-    { value: 'bar', label: 'Bar' },
-    { value: 'knob', label: 'Knob' },
-    { value: 'cutout', label: 'Cutout' },
-    { value: 'hole', label: 'Hole' },
-    { value: 'none', label: 'None' },
+    { value: 'bar', label: /* i18n */ { id: 'node.cabinet.runPanel.bar', message: 'Bar' } },
+    { value: 'knob', label: /* i18n */ { id: 'node.cabinet.runPanel.knob', message: 'Knob' } },
+    { value: 'cutout', label: /* i18n */ { id: 'node.cabinet.runPanel.cutout', message: 'Cutout' } },
+    { value: 'hole', label: /* i18n */ { id: 'node.cabinet.runPanel.hole', message: 'Hole' } },
+    { value: 'none', label: /* i18n */ { id: 'node.cabinet.runPanel.none', message: 'None' } },
 ];
 const HANDLE_POSITION_OPTIONS = [
-    { value: 'auto', label: 'Auto' },
-    { value: 'top', label: 'Top' },
-    { value: 'center', label: 'Center' },
+    { value: 'auto', label: /* i18n */ { id: 'node.cabinet.runPanel.auto', message: 'Auto' } },
+    { value: 'top', label: /* i18n */ { id: 'node.cabinet.runPanel.top', message: 'Top' } },
+    { value: 'center', label: /* i18n */ { id: 'node.cabinet.runPanel.center', message: 'Center' } },
 ];
-function moduleSummary(module) {
+function moduleSummary(module, i18n) {
     if ((module.cabinetType ?? 'base') === 'tall')
-        return 'Tall cabinet';
+        return i18n._({ id: 'node.cabinet.runPanel.summaryTall', message: 'Tall cabinet' });
     const stack = stackForCabinet(module);
     if (stack.length === 0)
-        return 'Empty';
+        return i18n._({ id: 'node.cabinet.runPanel.summaryEmpty', message: 'Empty' });
     if (stack.length === 1)
-        return stack[0].type;
-    return `${stack.length} compartments`;
+        return i18n._({
+            id: 'node.cabinet.runPanel.summaryCompartment',
+            message: '{type, select, shelf {Shelf} drawer {Drawer} door {Door} oven {Oven} microwave {Microwave} dishwasher {Dishwasher} sink {Sink} cooktop_gas {Gas cooktop} cooktop_induction {Induction cooktop} pull_out_pantry {Pull-out pantry} fridge_single {Fridge} fridge_double {Double fridge} fridge_top_freezer {Top-freezer fridge} fridge_bottom_freezer {Bottom-freezer fridge} hood_pyramid {Pyramid hood} hood_curved_glass {Curved glass hood} other {{raw}}}',
+            values: { type: stack[0].type.replaceAll('-', '_'), raw: stack[0].type },
+        });
+    return i18n._({
+        id: 'node.cabinet.runPanel.summaryCompartments',
+        message: '{count, plural, one {{number} compartment} other {{number} compartments}}',
+        values: { count: stack.length, number: String(stack.length) },
+    });
 }
 export function bumpRunLayoutRevisionViaStore(scene, run) {
     bumpCabinetRunLayoutRevision(createSceneApi(useScene), run);
@@ -318,11 +329,18 @@ function writeCabinetRun({ modules, node, patch, }, sceneApi) {
     }
 }
 export function CabinetRunPanel({ node, modules, onClose, }) {
+    const i18n = usePascalI18n();
     const setSelection = useViewer((s) => s.setSelection);
     const planningNodeList = useScene(useShallow((state) => selectCabinetRunPlanningNodes(state.nodes, node.id)));
     const planningNodes = useMemo(() => Object.fromEntries(planningNodeList.map((planningNode) => [planningNode.id, planningNode])), [planningNodeList]);
     const planningNode = planningNodes[node.id] ?? node;
     const sortedModules = useMemo(() => [...modules].sort((a, b) => a.position[0] - b.position[0]), [modules]);
+    const moduleNames = sortedModules.map((module, index) => module.name ||
+        i18n._({
+            id: 'node.cabinet.runPanel.moduleNumber',
+            message: 'Module {number}',
+            values: { number: index + 1 },
+        }));
     const [arraySourceId, setArraySourceId] = useState(null);
     const [arrayCopyCount, setArrayCopyCount] = useState(2);
     const [arraySpacing, setArraySpacing] = useState(0);
@@ -348,7 +366,12 @@ export function CabinetRunPanel({ node, modules, onClose, }) {
                     .applyNodeChanges(outcome.changes));
         }
         catch (error) {
-            setFinishMessage(error instanceof Error ? error.message : 'Unable to finish this kitchen run.');
+            setFinishMessage(error instanceof Error
+                ? error.message
+                : i18n._({
+                    id: 'node.cabinet.runPanel.unableToFinish',
+                    message: 'Unable to finish this kitchen run.',
+                }));
         }
     };
     const updateRun = useCallback((patch) => updateCabinetRun({ modules, node, patch }), [modules, node]);
@@ -367,11 +390,23 @@ export function CabinetRunPanel({ node, modules, onClose, }) {
     }, [node]);
     const equalizeWidthsTitle = !widthEqualization.ok
         ? widthEqualization.reason === 'not-enough-modules'
-            ? 'At least two standard base cabinets are required'
-            : 'The available run width cannot satisfy the cabinet width limits'
+            ? i18n._({
+                id: 'node.cabinet.runPanel.equalizeNeedsTwo',
+                message: 'At least two standard base cabinets are required',
+            })
+            : i18n._({
+                id: 'node.cabinet.runPanel.equalizeNoFit',
+                message: 'The available run width cannot satisfy the cabinet width limits',
+            })
         : widthEqualization.changed
-            ? 'Equalize all resizeable standard base cabinets in this run'
-            : 'The resizeable cabinet widths are already equal';
+            ? i18n._({
+                id: 'node.cabinet.runPanel.equalizeAll',
+                message: 'Equalize all resizeable standard base cabinets in this run',
+            })
+            : i18n._({
+                id: 'node.cabinet.runPanel.equalizeAlreadyEqual',
+                message: 'The resizeable cabinet widths are already equal',
+            });
     const duplicateAlongRun = useCallback(() => {
         if (!arraySource)
             return;
@@ -388,11 +423,30 @@ export function CabinetRunPanel({ node, modules, onClose, }) {
     }, [arrayCopyCount, arrayDirection, arraySpacing, arraySource, node, setSelection]);
     const duplicateAlongRunTitle = !arrayPlan.ok
         ? arrayPlan.reason === 'no-source'
-            ? 'Choose a standard or appliance module as the source'
+            ? i18n._({
+                id: 'node.cabinet.runPanel.arrayNoSource',
+                message: 'Choose a standard or appliance module as the source',
+            })
             : arrayPlan.reason === 'invalid-options'
-                ? 'Choose a copy count from 1 to 20 and spacing from 0 to 2 m'
-                : 'There is not enough room in this run for the requested array'
-        : `Create ${arrayCopyCount} ${arraySource?.name || 'module'} cop${arrayCopyCount === 1 ? 'y' : 'ies'}`;
+                ? i18n._({
+                    id: 'node.cabinet.runPanel.arrayInvalidOptions',
+                    message: 'Choose a copy count from 1 to 20 and spacing from 0 to 2 m',
+                })
+                : i18n._({
+                    id: 'node.cabinet.runPanel.arrayNoRoom',
+                    message: 'There is not enough room in this run for the requested array',
+                })
+        : arraySource?.name
+            ? i18n._({
+                id: 'node.cabinet.runPanel.arrayCreateNamed',
+                message: '{count, plural, one {Create {number} {name} copy} other {Create {number} {name} copies}}',
+                values: { count: arrayCopyCount, number: String(arrayCopyCount), name: arraySource.name },
+            })
+            : i18n._({
+                id: 'node.cabinet.runPanel.arrayCreate',
+                message: '{count, plural, one {Create {number} module copy} other {Create {number} module copies}}',
+                values: { count: arrayCopyCount, number: String(arrayCopyCount) },
+            });
     const dimensionProfile = cabinetDimensionProfileId(node);
     const wallHeightPreset = cabinetWallHeightPresetId(node);
     const applyWallHeightPreset = useCallback((presetId) => {
@@ -419,48 +473,145 @@ export function CabinetRunPanel({ node, modules, onClose, }) {
             setSelection({ selectedIds: [] });
         }
     }, [node.id, setSelection]);
-    return (_jsxs(PanelWrapper, { icon: "/icons/item.webp", onClose: onClose, title: node.name || 'Kitchen run', width: 320, children: [placementNotice && (_jsx("p", { role: "status", className: "px-3 py-2 text-xs text-amber-600", children: placementNotice.line })), _jsx(PanelSection, { title: "Finish & align", children: _jsxs("div", { className: "flex flex-col gap-2 px-1 pb-2", children: [_jsx(ActionButton, { label: "Align cabinets & handles", onClick: () => finishRun('align') }), finishMessage && (_jsx("p", { role: "status", className: "text-xs text-amber-600", children: finishMessage })), _jsx("p", { className: "text-xs text-muted-foreground", children: "Match base heights, backs, reveals and handles. Align upper cabinets; preserve tall appliances and custom compartments." }), _jsx(ToggleControl, { label: "Finished exposed ends", checked: node.withFinishedEnds, onChange: (checked) => updateRun({ withFinishedEnds: checked }) }), _jsx(ActionButton, { label: "Fit wall fillers", disabled: fillerPlan.length === 0, onClick: () => finishRun('fill') }), _jsx("p", { className: "text-xs text-muted-foreground", children: fillerPlan.length
+    return (_jsxs(PanelWrapper, { icon: "/icons/item.webp", onClose: onClose, title: node.name || i18n._({ id: 'node.cabinet.runPanel.kitchenRun', message: 'Kitchen run' }), width: 320, children: [placementNotice && (_jsx("p", { role: "status", className: "px-3 py-2 text-xs text-amber-600", children: placementNotice.line })), _jsx(PanelSection, { title: i18n._({ id: 'node.cabinet.runPanel.finishAlign', message: 'Finish & align' }), children: _jsxs("div", { className: "flex flex-col gap-2 px-1 pb-2", children: [_jsx(ActionButton, { label: i18n._({
+                                id: 'node.cabinet.runPanel.alignCabinetsHandles',
+                                message: 'Align cabinets & handles',
+                            }), onClick: () => finishRun('align') }), finishMessage && (_jsx("p", { role: "status", className: "text-xs text-amber-600", children: finishMessage })), _jsx("p", { className: "text-xs text-muted-foreground", children: i18n._({
+                                id: 'node.cabinet.runPanel.matchBaseHeightsBacksRevealsAnd',
+                                message: 'Match base heights, backs, reveals and handles. Align upper cabinets; preserve tall appliances and custom compartments.',
+                            }) }), _jsx(ToggleControl, { label: i18n._({
+                                id: 'node.cabinet.runPanel.finishedExposedEnds',
+                                message: 'Finished exposed ends',
+                            }), checked: node.withFinishedEnds, onChange: (checked) => updateRun({ withFinishedEnds: checked }) }), _jsx(ActionButton, { label: i18n._({
+                                id: 'node.cabinet.runPanel.fitWallFillers',
+                                message: 'Fit wall fillers',
+                            }), disabled: fillerPlan.length === 0, onClick: () => finishRun('fill') }), _jsx("p", { className: "text-xs text-muted-foreground", children: fillerPlan.length
                                 ? fillerPlan
-                                    .map(({ side, width }) => `${side}: ${Math.round(width * 1000)} mm`)
+                                    .map(({ side, width }) => i18n._({
+                                    id: 'node.cabinet.runPanel.fillerPlanSide',
+                                    message: '{side, select, left {Left: {width} mm} other {Right: {width} mm}}',
+                                    values: { side, width: String(Math.round(width * 1000)) },
+                                }))
                                     .join(' · ')
-                                : 'Fits 50–150 mm gaps at run ends beside perpendicular walls.' })] }) }), _jsxs(PanelSection, { title: "Modules", children: [_jsx("div", { className: "flex flex-col gap-2 px-1 pb-2", children: sortedModules.map((module, index) => (_jsxs("div", { className: "flex items-center justify-between gap-2 rounded-lg border border-border/40 bg-black/3 dark:bg-[#252527] px-2 py-2", children: [_jsxs("button", { className: "min-h-8 min-w-0 flex-1 py-1 text-left", onClick: () => setSelection({ selectedIds: [module.id] }), type: "button", children: [_jsx("div", { className: "truncate text-xs font-medium text-foreground", children: module.name || `Module ${index + 1}` }), _jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: moduleSummary(module) })] }), _jsx("button", { "aria-label": `Use ${module.name || `Module ${index + 1}`} as array source`, className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border/50 text-muted-foreground transition-colors hover:bg-black/5 dark:hover:bg-white/8 hover:text-foreground disabled:cursor-not-allowed disabled:opacity-30", disabled: module.moduleKind === 'corner-filler', onClick: () => setArraySourceId(module.id), title: module.moduleKind === 'corner-filler'
-                                        ? 'Corner fillers cannot be used as array sources'
-                                        : 'Use this module as the array source', type: "button", children: _jsx(Copy, { className: "h-3.5 w-3.5" }) }), _jsx("button", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-red-500/20 bg-red-500/8 text-red-700 dark:text-red-300 transition-colors hover:bg-red-500/15 hover:text-red-700 dark:hover:text-red-200 disabled:opacity-30", disabled: modules.length <= 1, onClick: () => deleteModule(module), type: "button", children: _jsx(Trash, { className: "h-3.5 w-3.5" }) })] }, module.id))) }), _jsxs("div", { className: "px-1 pb-1", children: [_jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsx(ActionButton, { icon: _jsx(Plus, { className: "h-4 w-4" }), label: "Add left", onClick: () => addModule('left') }), _jsx(ActionButton, { icon: _jsx(Plus, { className: "h-4 w-4" }), label: "Add right", onClick: () => addModule('right') })] }), _jsx(ActionButton, { className: "mt-2 w-full", disabled: !widthEqualization.ok || !widthEqualization.changed, icon: _jsx(EqualIcon, { className: "h-4 w-4" }), label: "Equalize widths", onClick: equalizeWidths, title: equalizeWidthsTitle }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: "Balances standard base cabinets while keeping appliance and corner-filler widths fixed." })] })] }), _jsx(PanelSection, { title: "Duplicate along run", children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [_jsxs("div", { className: "rounded-lg border border-border/40 bg-black/3 dark:bg-[#252527] px-2 py-2", children: [_jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: "Source module" }), _jsx("div", { className: "truncate pt-1 text-xs font-medium text-foreground", children: arraySource?.name ||
-                                        (arraySource ? moduleSummary(arraySource) : 'No eligible module') })] }), _jsx(SliderControl, { label: "Copies", max: 20, min: 1, onChange: (value) => setArrayCopyCount(Math.round(value)), precision: 0, step: 1, value: arrayCopyCount }), _jsx(SliderControl, { label: "Spacing", max: 2, min: 0, onChange: setArraySpacing, precision: 2, step: 0.01, unit: "m", value: arraySpacing }), _jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Direction" }), _jsx(SegmentedControl, { onChange: (value) => setArrayDirection(value), options: [
-                                        { value: 'left', label: 'Left' },
-                                        { value: 'right', label: 'Right' },
-                                    ], value: arrayDirection })] }), _jsx(ActionButton, { className: "w-full", disabled: !arrayPlan.ok, icon: _jsx(Copy, { className: "h-4 w-4" }), label: "Create array", onClick: duplicateAlongRun, title: duplicateAlongRunTitle }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: "Copies include the source cabinet structure and any attached wall cabinet. Existing modules stay fixed; the requested array must fit in the available run space." })] }) }), _jsx(PanelSection, { title: "Shared Plinth & Countertop", children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [node.runTier === 'base' && (_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Standard dimensions" }), _jsx(SegmentedControl, { mixed: dimensionProfile === 'custom', onChange: (value) => applyDimensionProfile(value), options: CABINET_DIMENSION_PROFILES.map((profile) => ({
-                                        label: profile.label,
+                                : i18n._({
+                                    id: 'node.cabinet.runPanel.fits50150MmGapsAt',
+                                    message: 'Fits 50–150 mm gaps at run ends beside perpendicular walls.',
+                                }) })] }) }), _jsxs(PanelSection, { title: i18n._({ id: 'node.cabinet.runPanel.modules', message: 'Modules' }), children: [_jsx("div", { className: "flex flex-col gap-2 px-1 pb-2", children: sortedModules.map((module, index) => (_jsxs("div", { className: "flex items-center justify-between gap-2 rounded-lg border border-border/40 bg-black/3 dark:bg-[#252527] px-2 py-2", children: [_jsxs("button", { className: "min-h-8 min-w-0 flex-1 py-1 text-left", onClick: () => setSelection({ selectedIds: [module.id] }), type: "button", children: [_jsx("div", { className: "truncate text-xs font-medium text-foreground", children: moduleNames[index] }), _jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: moduleSummary(module, i18n) })] }), _jsx("button", { "aria-label": i18n._({
+                                        id: 'node.cabinet.runPanel.useAsArraySource',
+                                        message: 'Use {name} as array source',
+                                        values: { name: moduleNames[index] },
+                                    }), className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-border/50 text-muted-foreground transition-colors hover:bg-black/5 dark:hover:bg-white/8 hover:text-foreground disabled:cursor-not-allowed disabled:opacity-30", disabled: module.moduleKind === 'corner-filler', onClick: () => setArraySourceId(module.id), title: module.moduleKind === 'corner-filler'
+                                        ? i18n._({
+                                            id: 'node.cabinet.runPanel.cornerFillersCannotBeUsedAs',
+                                            message: 'Corner fillers cannot be used as array sources',
+                                        })
+                                        : i18n._({
+                                            id: 'node.cabinet.runPanel.useThisModuleAsTheArray',
+                                            message: 'Use this module as the array source',
+                                        }), type: "button", children: _jsx(Copy, { className: "h-3.5 w-3.5" }) }), _jsx("button", { "aria-label": i18n._({
+                                        id: 'node.cabinet.runPanel.deleteModule',
+                                        message: 'Delete {name}',
+                                        values: { name: moduleNames[index] },
+                                    }), className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-md border border-red-500/20 bg-red-500/8 text-red-700 dark:text-red-300 transition-colors hover:bg-red-500/15 hover:text-red-700 dark:hover:text-red-200 disabled:opacity-30", disabled: modules.length <= 1, onClick: () => deleteModule(module), type: "button", children: _jsx(Trash, { className: "h-3.5 w-3.5" }) })] }, module.id))) }), _jsxs("div", { className: "px-1 pb-1", children: [_jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsx(ActionButton, { icon: _jsx(Plus, { className: "h-4 w-4" }), label: i18n._({ id: 'node.cabinet.runPanel.addLeft', message: 'Add left' }), onClick: () => addModule('left') }), _jsx(ActionButton, { icon: _jsx(Plus, { className: "h-4 w-4" }), label: i18n._({ id: 'node.cabinet.runPanel.addRight', message: 'Add right' }), onClick: () => addModule('right') })] }), _jsx(ActionButton, { className: "mt-2 w-full", disabled: !widthEqualization.ok || !widthEqualization.changed, icon: _jsx(EqualIcon, { className: "h-4 w-4" }), label: i18n._({
+                                    id: 'node.cabinet.runPanel.equalizeWidths',
+                                    message: 'Equalize widths',
+                                }), onClick: equalizeWidths, title: equalizeWidthsTitle }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: i18n._({
+                                    id: 'node.cabinet.runPanel.balancesStandardBaseCabinetsWhileKeeping',
+                                    message: 'Balances standard base cabinets while keeping appliance and corner-filler widths fixed.',
+                                }) })] })] }), _jsx(PanelSection, { title: i18n._({
+                    id: 'node.cabinet.runPanel.duplicateAlongRun',
+                    message: 'Duplicate along run',
+                }), children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [_jsxs("div", { className: "rounded-lg border border-border/40 bg-black/3 dark:bg-[#252527] px-2 py-2", children: [_jsx("div", { className: "text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.sourceModule', message: 'Source module' }) }), _jsx("div", { className: "truncate pt-1 text-xs font-medium text-foreground", children: arraySource?.name ||
+                                        (arraySource
+                                            ? moduleSummary(arraySource, i18n)
+                                            : i18n._({
+                                                id: 'node.cabinet.runPanel.noEligibleModule',
+                                                message: 'No eligible module',
+                                            })) })] }), _jsx(SliderControl, { label: i18n._({ id: 'node.cabinet.runPanel.copies', message: 'Copies' }), max: 20, min: 1, onChange: (value) => setArrayCopyCount(Math.round(value)), precision: 0, step: 1, value: arrayCopyCount }), _jsx(SliderControl, { label: i18n._({ id: 'node.cabinet.runPanel.spacing', message: 'Spacing' }), max: 2, min: 0, onChange: setArraySpacing, precision: 2, step: 0.01, unit: "m", value: arraySpacing }), _jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.direction', message: 'Direction' }) }), _jsx(SegmentedControl, { onChange: (value) => setArrayDirection(value), options: [
+                                        {
+                                            value: 'left',
+                                            label: i18n._({ id: 'node.cabinet.runPanel.left', message: 'Left' }),
+                                        },
+                                        {
+                                            value: 'right',
+                                            label: i18n._({ id: 'node.cabinet.runPanel.right', message: 'Right' }),
+                                        },
+                                    ], value: arrayDirection })] }), _jsx(ActionButton, { className: "w-full", disabled: !arrayPlan.ok, icon: _jsx(Copy, { className: "h-4 w-4" }), label: i18n._({ id: 'node.cabinet.runPanel.createArray', message: 'Create array' }), onClick: duplicateAlongRun, title: duplicateAlongRunTitle }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: i18n._({
+                                id: 'node.cabinet.runPanel.copiesIncludeTheSourceCabinetStructure',
+                                message: 'Copies include the source cabinet structure and any attached wall cabinet. Existing modules stay fixed; the requested array must fit in the available run space.',
+                            }) })] }) }), _jsx(PanelSection, { title: i18n._({
+                    id: 'node.cabinet.runPanel.sharedPlinthCountertop',
+                    message: 'Shared Plinth & Countertop',
+                }), children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [node.runTier === 'base' && (_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({
+                                        id: 'node.cabinet.runPanel.standardDimensions',
+                                        message: 'Standard dimensions',
+                                    }) }), _jsx(SegmentedControl, { mixed: dimensionProfile === 'custom', onChange: (value) => applyDimensionProfile(value), options: CABINET_DIMENSION_PROFILES.map((profile) => ({
+                                        label: profile.id === 'us-base'
+                                            ? i18n._({ id: 'node.cabinet.runPanel.usProfile', message: 'US · 24 in' })
+                                            : i18n._({
+                                                id: 'node.cabinet.runPanel.metricProfile',
+                                                message: 'Metric · 600 mm',
+                                            }),
                                         value: profile.id,
-                                    })), value: dimensionProfile === 'us-base' ? 'us-base' : 'metric-base' }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: "Applies depth, carcass, plinth, and countertop thickness to this run." })] })), node.runTier === 'wall' && (_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Height preset" }), _jsx(SegmentedControl, { mixed: wallHeightPreset === 'custom', onChange: (value) => applyWallHeightPreset(value), options: CABINET_WALL_HEIGHT_PRESETS.map((preset) => ({
+                                    })), value: dimensionProfile === 'us-base' ? 'us-base' : 'metric-base' }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: i18n._({
+                                        id: 'node.cabinet.runPanel.appliesDepthCarcassPlinthAndCountertop',
+                                        message: 'Applies depth, carcass, plinth, and countertop thickness to this run.',
+                                    }) })] })), node.runTier === 'wall' && (_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.heightPreset', message: 'Height preset' }) }), _jsx(SegmentedControl, { mixed: wallHeightPreset === 'custom', onChange: (value) => applyWallHeightPreset(value), options: CABINET_WALL_HEIGHT_PRESETS.map((preset) => ({
                                         label: (_jsxs("span", { className: "flex flex-col items-center leading-3", children: [_jsx("span", { children: preset.label }), _jsx("span", { className: "text-[9px] text-muted-foreground", children: preset.metricLabel })] })),
                                         value: preset.id,
-                                    })), value: wallHeightPreset === 'custom' ? '18' : wallHeightPreset }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: "Common wall-cabinet heights. Use the slider below for a custom height." })] })), _jsx(SliderControl, { label: "Depth", max: 1.2, min: 0.3, onChange: (value) => updateRun({ depth: value }), precision: 2, step: 0.01, unit: "m", value: node.depth }), _jsx(SliderControl, { label: "Carcass height", max: node.runTier === 'tall' ? 2.4 : 1.4, min: Math.max(0.4, ...modules.map((module) => minCabinetCarcassHeightForStack(module))), onChange: (value) => updateRun({ carcassHeight: value }), precision: 2, step: 0.01, unit: "m", value: node.carcassHeight }), _jsx(ToggleControl, { checked: node.showPlinth, label: "Show plinth", onChange: (checked) => updateRun({ showPlinth: checked }) }), node.showPlinth && (_jsx(SliderControl, { label: "Plinth height", max: 0.3, min: 0.02, onChange: (value) => updateRun({ plinthHeight: value }), precision: 2, step: 0.01, unit: "m", value: node.plinthHeight })), _jsx(ToggleControl, { checked: node.withCountertop, label: "Show countertop", onChange: (checked) => updateRun({ withCountertop: checked }) }), node.withCountertop && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: "Countertop height", max: 0.08, min: 0.005, onChange: (value) => updateRun({ countertopThickness: value }), precision: 3, step: 0.005, unit: "m", value: node.countertopThickness }), _jsx(SliderControl, { label: "Countertop depth", max: 0.12, min: 0, onChange: (value) => updateRun({ countertopOverhang: value }), precision: 2, step: 0.005, unit: "m", value: node.countertopOverhang })] }))] }) }), _jsx(PanelSection, { title: "Island & Bar", children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [node.withCountertop && node.barLedge?.edge !== 'back' && (_jsx(SliderControl, { label: "Seating overhang", max: 0.45, min: 0, onChange: (value) => updateRun({ countertopBackOverhang: value }), precision: 2, step: 0.05, unit: "m", value: node.countertopBackOverhang })), _jsx(ToggleControl, { checked: node.withFinishedBack, label: "Finished back", onChange: (checked) => updateRun({ withFinishedBack: checked }) }), node.withCountertop && (_jsx(ToggleControl, { checked: node.withWaterfall, label: "Waterfall ends", onChange: (checked) => updateRun({ withWaterfall: checked }) })), _jsx(ToggleControl, { checked: Boolean(node.barLedge), label: "Bar counter", onChange: (checked) => updateRun({
+                                    })), value: wallHeightPreset === 'custom' ? '18' : wallHeightPreset }), _jsx("p", { className: "px-1 pt-1 text-[10px] leading-4 text-muted-foreground", children: i18n._({
+                                        id: 'node.cabinet.runPanel.commonWallCabinetHeightsUseThe',
+                                        message: 'Common wall-cabinet heights. Use the slider below for a custom height.',
+                                    }) })] })), _jsx(SliderControl, { label: i18n._({ id: 'node.cabinet.runPanel.depth', message: 'Depth' }), max: 1.2, min: 0.3, onChange: (value) => updateRun({ depth: value }), precision: 2, step: 0.01, unit: "m", value: node.depth }), _jsx(SliderControl, { label: i18n._({ id: 'node.cabinet.runPanel.carcassHeight', message: 'Carcass height' }), max: node.runTier === 'tall' ? 2.4 : 1.4, min: Math.max(0.4, ...modules.map((module) => minCabinetCarcassHeightForStack(module))), onChange: (value) => updateRun({ carcassHeight: value }), precision: 2, step: 0.01, unit: "m", value: node.carcassHeight }), _jsx(ToggleControl, { checked: node.showPlinth, label: i18n._({ id: 'node.cabinet.runPanel.showPlinth', message: 'Show plinth' }), onChange: (checked) => updateRun({ showPlinth: checked }) }), node.showPlinth && (_jsx(SliderControl, { label: i18n._({ id: 'node.cabinet.runPanel.plinthHeight', message: 'Plinth height' }), max: 0.3, min: 0.02, onChange: (value) => updateRun({ plinthHeight: value }), precision: 2, step: 0.01, unit: "m", value: node.plinthHeight })), _jsx(ToggleControl, { checked: node.withCountertop, label: i18n._({
+                                id: 'node.cabinet.runPanel.showCountertop',
+                                message: 'Show countertop',
+                            }), onChange: (checked) => updateRun({ withCountertop: checked }) }), node.withCountertop && (_jsxs(_Fragment, { children: [_jsx(SliderControl, { label: i18n._({
+                                        id: 'node.cabinet.runPanel.countertopHeight',
+                                        message: 'Countertop height',
+                                    }), max: 0.08, min: 0.005, onChange: (value) => updateRun({ countertopThickness: value }), precision: 3, step: 0.005, unit: "m", value: node.countertopThickness }), _jsx(SliderControl, { label: i18n._({
+                                        id: 'node.cabinet.runPanel.countertopDepth',
+                                        message: 'Countertop depth',
+                                    }), max: 0.12, min: 0, onChange: (value) => updateRun({ countertopOverhang: value }), precision: 2, step: 0.005, unit: "m", value: node.countertopOverhang })] }))] }) }), _jsx(PanelSection, { title: i18n._({ id: 'node.cabinet.runPanel.islandBar', message: 'Island & Bar' }), children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [node.withCountertop && node.barLedge?.edge !== 'back' && (_jsx(SliderControl, { label: i18n._({
+                                id: 'node.cabinet.runPanel.seatingOverhang',
+                                message: 'Seating overhang',
+                            }), max: 0.45, min: 0, onChange: (value) => updateRun({ countertopBackOverhang: value }), precision: 2, step: 0.05, unit: "m", value: node.countertopBackOverhang })), _jsx(ToggleControl, { checked: node.withFinishedBack, label: i18n._({ id: 'node.cabinet.runPanel.finishedBack', message: 'Finished back' }), onChange: (checked) => updateRun({ withFinishedBack: checked }) }), node.withCountertop && (_jsx(ToggleControl, { checked: node.withWaterfall, label: i18n._({
+                                id: 'node.cabinet.runPanel.waterfallEnds',
+                                message: 'Waterfall ends',
+                            }), onChange: (checked) => updateRun({ withWaterfall: checked }) })), _jsx(ToggleControl, { checked: Boolean(node.barLedge), label: i18n._({ id: 'node.cabinet.runPanel.barCounter', message: 'Bar counter' }), onChange: (checked) => updateRun({
                                 barLedge: checked ? { edge: 'back', height: 1.06, depth: 0.35 } : undefined,
                             }) }), node.barLedge && (_jsxs(_Fragment, { children: [_jsx(SegmentedControl, { onChange: (value) => updateRun({
                                         barLedge: { ...node.barLedge, edge: value },
                                     }), options: [
-                                        { value: 'back', label: 'Back' },
-                                        { value: 'left', label: 'Left' },
-                                        { value: 'right', label: 'Right' },
-                                    ], value: node.barLedge.edge }), _jsx(SliderControl, { label: "Bar height", max: 1.3, min: 0.9, onChange: (value) => updateRun({ barLedge: { ...node.barLedge, height: value } }), precision: 2, step: 0.01, unit: "m", value: node.barLedge.height }), _jsx(SliderControl, { label: "Bar depth", max: 0.5, min: 0.15, onChange: (value) => updateRun({ barLedge: { ...node.barLedge, depth: value } }), precision: 2, step: 0.01, unit: "m", value: node.barLedge.depth })] }))] }) }), _jsx(PanelSection, { title: "Fronts", children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Style" }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ frontStyle: value }), options: FRONT_STYLE_OPTIONS.map((option) => ({
+                                        {
+                                            value: 'back',
+                                            label: i18n._({ id: 'node.cabinet.runPanel.back', message: 'Back' }),
+                                        },
+                                        {
+                                            value: 'left',
+                                            label: i18n._({ id: 'node.cabinet.runPanel.left', message: 'Left' }),
+                                        },
+                                        {
+                                            value: 'right',
+                                            label: i18n._({ id: 'node.cabinet.runPanel.right', message: 'Right' }),
+                                        },
+                                    ], value: node.barLedge.edge }), _jsx(SliderControl, { label: i18n._({ id: 'node.cabinet.runPanel.barHeight', message: 'Bar height' }), max: 1.3, min: 0.9, onChange: (value) => updateRun({ barLedge: { ...node.barLedge, height: value } }), precision: 2, step: 0.01, unit: "m", value: node.barLedge.height }), _jsx(SliderControl, { label: i18n._({ id: 'node.cabinet.runPanel.barDepth', message: 'Bar depth' }), max: 0.5, min: 0.15, onChange: (value) => updateRun({ barLedge: { ...node.barLedge, depth: value } }), precision: 2, step: 0.01, unit: "m", value: node.barLedge.depth })] }))] }) }), _jsx(PanelSection, { title: i18n._({ id: 'node.cabinet.runPanel.fronts', message: 'Fronts' }), children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.style', message: 'Style' }) }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ frontStyle: value }), options: FRONT_STYLE_OPTIONS.map((option) => ({
                                         value: option.value,
-                                        label: option.label,
-                                    })), value: node.frontStyle ?? 'slab' })] }), _jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Mounting" }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ frontOverlay: value }), options: FRONT_OVERLAY_OPTIONS.map((option) => ({
+                                        label: i18n._(option.label),
+                                    })), value: node.frontStyle ?? 'slab' })] }), _jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.mounting', message: 'Mounting' }) }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ frontOverlay: value }), options: FRONT_OVERLAY_OPTIONS.map((option) => ({
                                         value: option.value,
-                                        label: option.label,
-                                    })), value: node.frontOverlay ?? 'full' })] }), _jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Reveal gap" }), _jsx(SegmentedControl, { mixed: cabinetRevealGapId(node.frontGap) === 'custom', onChange: (value) => updateRun({
+                                        label: i18n._(option.label),
+                                    })), value: node.frontOverlay ?? 'full' })] }), _jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.revealGap', message: 'Reveal gap' }) }), _jsx(SegmentedControl, { mixed: cabinetRevealGapId(node.frontGap) === 'custom', onChange: (value) => updateRun({
                                         frontGap: cabinetRevealGapById(value).value,
                                     }), options: CABINET_REVEAL_GAPS.map((gap) => ({
                                         value: gap.id,
                                         label: gap.label,
                                     })), value: cabinetRevealGapId(node.frontGap) === 'custom'
                                         ? '3'
-                                        : cabinetRevealGapId(node.frontGap) })] })] }) }), _jsx(PanelSection, { title: "Handles", children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Style" }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ handleStyle: value }), options: HANDLE_STYLE_OPTIONS.map((option) => ({
+                                        : cabinetRevealGapId(node.frontGap) })] })] }) }), _jsx(PanelSection, { title: i18n._({ id: 'node.cabinet.runPanel.handles', message: 'Handles' }), children: _jsxs("div", { className: "space-y-2 px-1 pb-2", children: [_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.style', message: 'Style' }) }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ handleStyle: value }), options: HANDLE_STYLE_OPTIONS.map((option) => ({
                                         value: option.value,
-                                        label: option.label,
-                                    })), value: node.handleStyle })] }), (node.handleStyle === 'bar' || node.handleStyle === 'knob') && (_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: "Position" }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ handlePosition: value }), options: HANDLE_POSITION_OPTIONS.map((option) => ({
+                                        label: i18n._(option.label),
+                                    })), value: node.handleStyle })] }), (node.handleStyle === 'bar' || node.handleStyle === 'knob') && (_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] uppercase tracking-wide text-muted-foreground", children: i18n._({ id: 'node.cabinet.runPanel.position', message: 'Position' }) }), _jsx(SegmentedControl, { onChange: (value) => updateRun({ handlePosition: value }), options: HANDLE_POSITION_OPTIONS.map((option) => ({
                                         value: option.value,
-                                        label: option.label,
+                                        label: i18n._(option.label),
                                     })), value: node.handlePosition ?? 'auto' })] }))] }) })] }));
 }

package/dist/cabinet/system.js

@@ -4,7 +4,7 @@ import { useFrame } from '@react-three/fiber';
 import { useRef } from 'react';
 import { poseCabinetMovingParts } from './animation.js';
 import { updateCooktopFlameTube } from './cooktop-flame.js';
-import { bumpCabinetRunsNear, cabinetRunFootprint, cabinetRunNeighborSignature, } from './definition.js';
+import { bumpCabinetRunsNear, cabinetRunFootprint, cabinetRunNeighborSignature, } from './definition.render.js';
 import { collectCabinetFlameObjects } from './flame-index.js';
 function materialWithOpacity(material) {
     if (!material)

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

@@ -1 +1 @@
-{"version":3,"file":"tool.d.ts","sourceRoot":"","sources":["../../src/cabinet/tool.tsx"],"names":[],"mappings":"AAmiEA,MAAM,CAAC,OAAO,UAAU,WAAW,gCAGlC"}
+{"version":3,"file":"tool.d.ts","sourceRoot":"","sources":["../../src/cabinet/tool.tsx"],"names":[],"mappings":"AAi1EA,MAAM,CAAC,OAAO,UAAU,WAAW,gCAGlC"}