@pascal-app/editor 1.0.6 → 1.1.0

package/src/components/ui/helpers/helper-manager.tsx

@@ -6,16 +6,18 @@ import {
   floorPlacedCollides,
   nodeRegistry,
   type TerrainVerb,
-  useScene,
+  useScene, usePascalI18n,
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
 import { useEffect, useMemo, useState, useSyncExternalStore } from 'react'
 import { useShallow } from 'zustand/react/shallow'
 import { useIsMobile } from '../../../hooks/use-mobile'
 import {
+  AXIS_MOVE_DRAG_LABEL,
   type ContextualShortcutHint,
   GROUP_MOVE_DRAG_LABEL,
   GROUP_ROTATE_DRAG_LABEL,
+  PATH_POINT_DRAG_LABEL,
   ROTATE_HANDLE_DRAG_LABEL,
   resolveRotateHandleHelpHints,
   resolveSelectModeHelpHints,
@@ -42,7 +44,7 @@ import {
   terrainHudTitle,
   toolHudTitle,
 } from '../../../lib/hud-title'
-import type { ReshapeKind } from '../../../lib/interaction/scope'
+import type { InteractionScope, ReshapeKind } from '../../../lib/interaction/scope'
 import {
   type MezzanineShape,
   useMezzanineDraft,
@@ -94,7 +96,7 @@ function reshapingHints(reshape: ReshapeKind): ContextualShortcutHint[] {
         : 'Move corner'
   return [
     { keys: ['Drag'], label: action },
-    { keys: ['Esc'], label: 'Cancel' },
+    { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
   ]
 }
 
@@ -106,8 +108,8 @@ function reshapingHints(reshape: ReshapeKind): ContextualShortcutHint[] {
 function terrainSculptHints(verb: TerrainVerb, sampling: boolean): ContextualShortcutHint[] {
   if (sampling) {
     return [
-      { keys: ['Click'], label: 'Pick target height' },
-      { keys: ['Esc'], label: 'Cancel picking' },
+      { keys: ['Click'], label: /* i18n */ { id: 'editor.helpers.helperManager.pickTargetHeight', message: 'Pick target height' } },
+      { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancelPicking', message: 'Cancel picking' } },
     ]
   }
   const action =
@@ -122,8 +124,8 @@ function terrainSculptHints(verb: TerrainVerb, sampling: boolean): ContextualSho
     { keys: ['Drag'], label: action },
     // Nested, so the two render as alternatives ("[ / ]") rather than a chord —
     // a flat `['[', ']']` joins with "+" and would read as "press both".
-    { keys: [['[', ']']], label: 'Brush size' },
-    { keys: ['Esc'], label: 'Cancel stroke' },
+    { keys: [['[', ']']], label: /* i18n */ { id: 'editor.helpers.helperManager.brushSize', message: 'Brush size' } },
+    { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancelStroke', message: 'Cancel stroke' } },
   ]
 }
 
@@ -141,12 +143,12 @@ const EMPTY_CONTEXTUAL_HINTS: ContextualShortcutHint[] = []
 export function paintHints(mode: PaintMode): ContextualShortcutHint[] {
   if (mode === 'pick')
     return [
-      { keys: ['Left click'], label: 'Paint with this material' },
-      { keys: ['Esc'], label: 'Cancel' },
+      { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.paintWithThisMaterial', message: 'Paint with this material' } },
+      { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
     ]
   if (mode === 'erase')
-    return [{ keys: ['Left click'], label: 'Remove a painted part, or reset a surface' }]
-  if (mode === 'surface') return [{ keys: [['Alt', 'Option']], label: 'Hold to pick a material' }]
+    return [{ keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.removeAPaintedPartOrReset', message: 'Remove a painted part, or reset a surface' } }]
+  if (mode === 'surface') return [{ keys: [['Alt', 'Option']], label: /* i18n */ { id: 'editor.helpers.helperManager.holdToPickAMaterial', message: 'Hold to pick a material' } }]
   return []
 }
 
@@ -156,43 +158,45 @@ export function paintRegionHints(
   hovering = true,
 ): ContextualShortcutHint[] {
   const gesture: Record<typeof mode, ContextualShortcutHint> = {
-    rectangle: { keys: ['Drag'], label: 'Press anywhere, drag to the opposite corner' },
-    polygon: { keys: ['Left click'], label: 'Add point · click the first to close' },
+    rectangle: { keys: ['Drag'], label: /* i18n */ { id: 'editor.helpers.helperManager.pressAnywhereDragToTheOpposite', message: 'Press anywhere, drag to the opposite corner' } },
+    polygon: { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.addPointClickTheFirstTo', message: 'Add point · click the first to close' } },
   }
   // Off anything the sub-mode draws on, the HUD says where to go instead.
   if (!hovering)
     return [
       ...(notice ? [{ keys: ['!'], label: notice, active: true }] : []),
       { keys: ['Hover'], label: paintRegionHoverHint(mode), active: true },
-      { keys: ['Esc'], label: 'Cancel' },
+      { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
     ]
   return [
     ...(notice ? [{ keys: ['!'], label: notice, active: true }] : []),
     gesture[mode],
-    ...(mode === 'polygon' ? [{ keys: ['Backspace'], label: 'Remove last point' }] : []),
-    { keys: ['Esc'], label: 'Cancel' },
+    ...(mode === 'polygon' ? [{ keys: ['Backspace'], label: /* i18n */ { id: 'editor.helpers.helperManager.removeLastPoint', message: 'Remove last point' } }] : []),
+    { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
   ]
 }
+const DRAW_MEZZANINE = /* i18n */ { id: 'editor.helpers.helperManager.drawTheMezzanine', message: 'Draw the mezzanine' }
+const DRAW_OPENING = /* i18n */ { id: 'editor.helpers.helperManager.drawTheOpening', message: 'Draw the opening' }
 // "Add mezzanine": the outline gesture for the shape picked in the room panel,
 // then Esc; the snapping chip sits below.
 export function mezzanineHints(shape: MezzanineShape): ContextualShortcutHint[] {
   return shape === 'rectangle'
     ? [
-        { keys: ['Left click'], label: 'Set one corner, then the opposite' },
-        { keys: ['Drag'], label: 'Draw the mezzanine' },
-        { keys: ['Esc'], label: 'Cancel' },
+        { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.setOneCornerThenTheOpposite', message: 'Set one corner, then the opposite' } },
+        { keys: ['Drag'], label: DRAW_MEZZANINE },
+        { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
       ]
     : [
-        { keys: ['Left click'], label: 'Add point · click the first to close' },
-        { keys: ['Backspace'], label: 'Remove last point' },
-        { keys: ['Enter'], label: 'Finish' },
-        { keys: ['Esc'], label: 'Cancel' },
+        { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.addPointClickTheFirstTo', message: 'Add point · click the first to close' } },
+        { keys: ['Backspace'], label: /* i18n */ { id: 'editor.helpers.helperManager.removeLastPoint', message: 'Remove last point' } },
+        { keys: ['Enter'], label: /* i18n */ { id: 'editor.helpers.helperManager.finish', message: 'Finish' } },
+        { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
       ]
 }
 /** "Cut opening": the outline gesture for the chosen shape, then Esc. */
 export function openingHints(shape: OpeningShape): ContextualShortcutHint[] {
   return mezzanineHints(shape).map((hint) =>
-    hint.label === 'Draw the mezzanine' ? { ...hint, label: 'Draw the opening' } : hint,
+    typeof hint.label !== 'string' && hint.label.id === DRAW_MEZZANINE.id ? { ...hint, label: DRAW_OPENING } : hint,
   )
 }
 const TERRACE_CHIP_HINTS = [TERRACE_SHAPE_HINT]
@@ -200,22 +204,22 @@ const TERRACE_CHIP_HINTS = [TERRACE_SHAPE_HINT]
 export function terraceHints(shape: TerraceShape): ContextualShortcutHint[] {
   return shape === 'rectangle'
     ? [
-        { keys: ['Left click'], label: 'Set one corner, then the opposite' },
-        { keys: ['Drag'], label: 'Draw the terrace' },
-        { keys: ['Esc'], label: 'Done' },
+        { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.setOneCornerThenTheOpposite', message: 'Set one corner, then the opposite' } },
+        { keys: ['Drag'], label: /* i18n */ { id: 'editor.helpers.helperManager.drawTheTerrace', message: 'Draw the terrace' } },
+        { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.done', message: 'Done' } },
       ]
     : [
-        { keys: ['Left click'], label: 'Add point · click the first to close' },
-        { keys: ['Backspace'], label: 'Remove last point' },
-        { keys: ['Enter'], label: 'Finish' },
-        { keys: ['Esc'], label: 'Done' },
+        { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.addPointClickTheFirstTo', message: 'Add point · click the first to close' } },
+        { keys: ['Backspace'], label: /* i18n */ { id: 'editor.helpers.helperManager.removeLastPoint', message: 'Remove last point' } },
+        { keys: ['Enter'], label: /* i18n */ { id: 'editor.helpers.helperManager.finish', message: 'Finish' } },
+        { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.done', message: 'Done' } },
       ]
 }
 export const ROOM_DIVIDE_HINTS: ContextualShortcutHint[] = [
-  { keys: ['Left click'], label: 'Add point' },
-  { keys: ['Backspace'], label: 'Remove last point' },
-  { keys: ['Enter'], label: 'Finish at the edge' },
-  { keys: ['Esc'], label: 'Cancel' },
+  { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.addPoint', message: 'Add point' } },
+  { keys: ['Backspace'], label: /* i18n */ { id: 'editor.helpers.helperManager.removeLastPoint', message: 'Remove last point' } },
+  { keys: ['Enter'], label: /* i18n */ { id: 'editor.helpers.helperManager.finishAtTheEdge', message: 'Finish at the edge' } },
+  { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
 ]
 const NO_CONTEXTUAL_HELP_SUBSCRIPTION = () => () => {}
 
@@ -277,22 +281,76 @@ export function mezzanineGesture(
 
 export const MEZZANINE_GESTURE_HINTS: Record<MezzanineGesture, ContextualShortcutHint[]> = {
   raise: [
-    { keys: ['Drag'], label: 'Raise or lower' },
-    { keys: ['Esc'], label: 'Cancel' },
+    { keys: ['Drag'], label: /* i18n */ { id: 'editor.helpers.helperManager.raiseOrLower', message: 'Raise or lower' } },
+    { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
   ],
   resize: [
-    { keys: ['Drag'], label: 'Resize' },
-    { keys: ['Esc'], label: 'Cancel' },
+    { keys: ['Drag'], label: /* i18n */ { id: 'editor.helpers.helperManager.resize', message: 'Resize' } },
+    { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
   ],
   move: [
-    { keys: ['Left click'], label: 'Place inside the room' },
-    { keys: [['R', 'T']], label: 'Rotate ±45°' },
-    { keys: ['Alt'], label: 'Free move' },
-    { keys: ['Esc'], label: 'Cancel' },
+    { keys: ['Left click'], label: /* i18n */ { id: 'editor.helpers.helperManager.placeInsideTheRoom', message: 'Place inside the room' } },
+    { keys: [['R', 'T']], label: /* i18n */ { id: 'editor.helpers.helperManager.rotate45', message: 'Rotate ±45°' } },
+    { keys: ['Alt'], label: /* i18n */ { id: 'editor.helpers.helperManager.freeMove', message: 'Free move' } },
+    { keys: ['Esc'], label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' } },
   ],
 }
 
+export type MepHandleGesture = 'edit-path' | 'move'
+
+/**
+ * A drag on an MEP handle — a run point, where Alt detaches the joint, or a
+ * fitting, run or run segment slid along an axis — or null. Its HUD names the
+ * kind and the gesture, not "Resize".
+ */
+export function mepHandleGesture(
+  drag: { nodeId: string; label: string } | null,
+): MepHandleGesture | null {
+  if (drag?.label === PATH_POINT_DRAG_LABEL) return 'edit-path'
+  if (drag?.label === AXIS_MOVE_DRAG_LABEL) return 'move'
+  return null
+}
+
+export function mepHandleGestureHints(
+  gesture: MepHandleGesture,
+  altPressed: boolean,
+): ContextualShortcutHint[] {
+  const cancel: ContextualShortcutHint = {
+    keys: ['Esc'],
+    label: /* i18n */ { id: 'editor.helpers.helperManager.cancel', message: 'Cancel' },
+  }
+  if (gesture === 'move') return [cancel]
+  return [
+    {
+      keys: ['Alt'],
+      label: /* i18n */ { id: 'editor.helpers.helperManager.detachTheJoint', message: 'Detach the joint' },
+      active: altPressed,
+    },
+    cancel,
+  ]
+}
+
+/**
+ * Whether the armed tool's own hints (`toolHints`) win over the node in hand: a registry tool that
+ * holds its draft in a placing scope (the roof's footprint, a fitting, a block) says what its clicks
+ * do, where the generic rows misnamed it ("Move roof · Left click: Place" while a click draws a
+ * footprint).
+ */
+export function toolHintsOwnPlacing(
+  scope: InteractionScope,
+  tool: string | null,
+  toolHintCount: number,
+): boolean {
+  return (
+    scope.kind === 'placing' &&
+    scope.driver === 'registry-tool' &&
+    scope.nodeType === tool &&
+    toolHintCount > 0
+  )
+}
+
 export function HelperManager() {
+  const i18n = usePascalI18n()
   const mode = useEditor((s) => s.mode)
   const tool = useEditor((s) => s.tool)
   const terrainVerb = useEditor((s) => s.terrainVerb)
@@ -318,6 +376,10 @@ export function HelperManager() {
   const reshapingNode = useReshapingNode()
   const activeHandleDrag = useActiveHandleDrag()
   const mezzanineHandle = useScene((s) => mezzanineGesture(activeHandleDrag, s.nodes))
+  const mepHandle = mepHandleGesture(activeHandleDrag)
+  const mepHandleKind = useScene((s) =>
+    mepHandle && activeHandleDrag ? s.nodes[activeHandleDrag.nodeId as AnyNodeId]?.type : undefined,
+  )
   const selectedIds = useViewer((s) => s.selection.selectedIds)
   const isMobile = useIsMobile()
   const modifiers = useActiveModifierKeys()
@@ -417,7 +479,7 @@ export function HelperManager() {
   if (activeHandleDrag?.label === GROUP_MOVE_DRAG_LABEL) {
     return (
       <ContextualHelperPanel
-        hints={[{ keys: ['R / T'], label: 'Rotate the selection ±45°' }]}
+        hints={[{ keys: ['R / T'], label: i18n._({ id: 'editor.helpers.helperManager.rotateTheSelection45', message: 'Rotate the selection ±45°' }) }]}
         snapContext={snapContext}
         title={MOVE_SELECTION_HUD_TITLE}
       />
@@ -440,10 +502,10 @@ export function HelperManager() {
     return (
       <ContextualHelperPanel
         hints={[
-          { keys: ['Left click'], label: 'Place' },
-          { keys: [['R', 'T']], label: 'Rotate ±45°' },
-          { keys: ['Alt'], label: 'Free move · slide doors and windows' },
-          { keys: ['Esc'], label: 'Cancel' },
+          { keys: ['Left click'], label: i18n._({ id: 'editor.helpers.helperManager.place', message: 'Place' }) },
+          { keys: [['R', 'T']], label: i18n._({ id: 'editor.helpers.helperManager.rotate45', message: 'Rotate ±45°' }) },
+          { keys: ['Alt'], label: i18n._({ id: 'editor.helpers.helperManager.freeMoveSlideDoorsAndWindows', message: 'Free move · slide doors and windows' }) },
+          { keys: ['Esc'], label: i18n._({ id: 'editor.helpers.helperManager.cancel', message: 'Cancel' }) },
         ]}
         snapContext={snapContext}
         title={MOVE_ROOM_HUD_TITLE}
@@ -496,6 +558,20 @@ export function HelperManager() {
     )
   }
 
+  if (mepHandle) {
+    return (
+      <ContextualHelperPanel
+        hints={mepHandleGestureHints(mepHandle, modifiers.alt)}
+        snapContext={snapContext}
+        title={
+          mepHandleKind
+            ? nodeKindHudTitle(mepHandleKind, mepHandle === 'move' ? 'move' : 'edit')
+            : null
+        }
+      />
+    )
+  }
+
   // A single-node resize arrow is still an active snapping interaction. Roof
   // width/depth handles opt into grid snapping, so keep the mode and grid-step
   // controls visible for the whole drag instead of falling through to idle
@@ -504,8 +580,8 @@ export function HelperManager() {
     return (
       <ContextualHelperPanel
         hints={[
-          { keys: ['Drag'], label: 'Resize' },
-          { keys: ['Esc'], label: 'Cancel' },
+          { keys: ['Drag'], label: i18n._({ id: 'editor.helpers.helperManager.resize', message: 'Resize' }) },
+          { keys: ['Esc'], label: i18n._({ id: 'editor.helpers.helperManager.cancel', message: 'Cancel' }) },
         ]}
         snapContext={snapContext}
         title={RESIZE_HUD_TITLE}
@@ -522,7 +598,7 @@ export function HelperManager() {
       ? nodeRegistry.get(reshapingNode.type)?.affordanceHints?.[scope.reshape]
       : undefined
     const title = reshapingNode
-      ? nodeKindHudTitle(reshapingNode.type, scope.reshape === 'split' ? 'Split' : 'Edit')
+      ? nodeKindHudTitle(reshapingNode.type, scope.reshape === 'split' ? 'split' : 'edit')
       : null
     if (hints) {
       return (
@@ -543,12 +619,15 @@ export function HelperManager() {
     )
   }
 
-  if (movingNode) {
+  if (
+    movingNode &&
+    !toolHintsOwnPlacing(scope, tool, tool ? (nodeRegistry.get(tool)?.toolHints?.length ?? 0) : 0)
+  ) {
     // A fresh placement (e.g. a positioned preset like a shelf) advertises its
     // once/repeat continuation, exactly like the GLB item tool — but an existing
     // node being *moved* is not a placement, so it gets no continuation chip.
     const isFreshPlacement = isFreshPlacementMetadata(movingNode.metadata)
-    const movingTitle = nodeKindHudTitle(movingNode.type, isFreshPlacement ? undefined : 'Move')
+    const movingTitle = nodeKindHudTitle(movingNode.type, isFreshPlacement ? undefined : 'move')
     if (movingNode.type === 'building') return <BuildingHelper showRotate title={movingTitle} />
     const movingContinuationContext = isFreshPlacement
       ? keyCyclableContinuationContext(continuationContextOf(movingNode.type))
@@ -611,7 +690,7 @@ export function HelperManager() {
       <ContextualHelperPanel
         hints={contextualEditHints}
         snapContext={snapContext}
-        title={contextualHelpNode ? nodeKindHudTitle(contextualHelpNode.type, 'Edit') : null}
+        title={contextualHelpNode ? nodeKindHudTitle(contextualHelpNode.type, 'edit') : null}
       />
     )
   }
@@ -639,9 +718,9 @@ export function HelperManager() {
     return (
       <ContextualHelperPanel
         hints={[
-          { keys: ['Hover'], label: 'Inspect surface dimensions' },
-          { keys: ['Click'], label: 'Pin measurement lens' },
-          { keys: ['Esc'], label: 'Exit smart measure' },
+          { keys: ['Hover'], label: i18n._({ id: 'editor.helpers.helperManager.inspectSurfaceDimensions', message: 'Inspect surface dimensions' }) },
+          { keys: ['Click'], label: i18n._({ id: 'editor.helpers.helperManager.pinMeasurementLens', message: 'Pin measurement lens' }) },
+          { keys: ['Esc'], label: i18n._({ id: 'editor.helpers.helperManager.exitSmartMeasure', message: 'Exit smart measure' }) },
         ]}
         title={SMART_MEASURE_HUD_TITLE}
       />

package/src/components/ui/helpers/item-helper.tsx

@@ -1,3 +1,4 @@
+import { usePascalI18n } from '@pascal-app/core'
 import type { ContinuationContext } from '../../../lib/continuation'
 import type { HudTitle } from '../../../lib/hud-title'
 import type { SnapContext } from '../../../lib/snapping-mode'
@@ -33,17 +34,18 @@ export function ItemHelper({
   extraHints = [],
   replacesPlace = false,
 }: ItemHelperProps) {
+  const i18n = usePascalI18n()
   return (
     <ContextualHelperPanel
       continuationContext={continuationContext}
       notice={notice}
       hints={[
         // Where a click does something else (joining a corner), that row says so instead.
-        ...(replacesPlace ? [] : [{ keys: ['Left click'], label: 'Place' }]),
+        ...(replacesPlace ? [] : [{ keys: ['Left click'], label: i18n._({ id: 'editor.helpers.itemHelper.place', message: 'Place' }) }]),
         ...extraHints,
-        { keys: ['R', 'T'], label: 'Rotate' },
-        ...(showForce ? [{ keys: ['Alt'], label: 'Force place' }] : []),
-        { keys: [showEsc ? 'Esc' : 'Right click'], label: 'Cancel' },
+        { keys: ['R', 'T'], label: i18n._({ id: 'editor.helpers.itemHelper.rotate', message: 'Rotate' }) },
+        ...(showForce ? [{ keys: ['Alt'], label: i18n._({ id: 'editor.helpers.itemHelper.forcePlace', message: 'Force place' }) }] : []),
+        { keys: [showEsc ? 'Esc' : 'Right click'], label: i18n._({ id: 'editor.helpers.itemHelper.cancel', message: 'Cancel' }) },
       ]}
       snapContext={snapContext}
       title={title}

package/src/components/ui/helpers/registered-tool-helper.tsx

@@ -1,3 +1,4 @@
+import { usePascalI18n } from '@pascal-app/core'
 import type { ToolHint } from '@pascal-app/core'
 import type { ContinuationContext } from '../../../lib/continuation'
 import type { HudTitle } from '../../../lib/hud-title'
@@ -29,6 +30,7 @@ export function RegisteredToolHelper({
   title?: HudTitle | null
   notice?: string | null
 }) {
+  const i18n = usePascalI18n()
   const visible = useVisibleToolHints(hints)
   if (visible.length === 0 && !snapContext && !continuationContext && !notice) return null
   // Hints carrying a live-state `chip` render as mode chips next to the
@@ -44,7 +46,7 @@ export function RegisteredToolHelper({
         const isBypassHint = hint.key === 'Shift'
         return {
           keys: [hint.key],
-          label: shiftPressed && isBypassHint ? 'Guided constraints bypassed' : hint.label,
+          label: shiftPressed && isBypassHint ? i18n._({ id: 'editor.helpers.registeredToolHelper.guidedConstraintsBypassed', message: 'Guided constraints bypassed' }) : hint.label,
           active: shiftPressed && isBypassHint,
         }
       })}

package/src/components/ui/level-duplicate-dialog.tsx

@@ -1,9 +1,10 @@
 'use client'
 
-import type { LevelNode } from '@pascal-app/core'
+import type { LevelNode, MessageDescriptor } from '@pascal-app/core'
 import { useEffect, useState } from 'react'
 import type { LevelDuplicatePreset } from '@pascal-app/core/building'
-import { getLevelDisplayName } from '@pascal-app/core'
+import { useLocale, usePascalI18n } from '@pascal-app/core'
+import { localizedLevelName } from '../../i18n/level-name'
 import { cn } from '../../lib/utils'
 import {
   Dialog,
@@ -16,36 +17,31 @@ import {
 
 const DUPLICATE_PRESETS: Array<{
   id: LevelDuplicatePreset
-  label: string
-  description: string
+  label: MessageDescriptor
+  description: MessageDescriptor
 }> = [
   {
     id: 'everything',
-    label: 'Everything',
-    description: 'Structure, materials, furniture, and references.',
+    label: /* i18n */ { id: 'editor.levelDuplicateDialog.everything', message: 'Everything' },
+    description: /* i18n */ { id: 'editor.levelDuplicateDialog.structureMaterialsFurnitureAndReferences', message: 'Structure, materials, furniture, and references.' },
   },
   {
     id: 'structure',
-    label: 'Structure only',
-    description: 'Walls, slabs, roofs, stairs, windows, and doors without finishes.',
+    label: /* i18n */ { id: 'editor.levelDuplicateDialog.structureOnly', message: 'Structure only' },
+    description: /* i18n */ { id: 'editor.levelDuplicateDialog.wallsSlabsRoofsStairsWindowsAnd', message: 'Walls, slabs, roofs, stairs, windows, and doors without finishes.' },
   },
   {
     id: 'structure-materials',
-    label: 'Structure + materials',
-    description: 'Structure with the current material and finish assignments.',
+    label: /* i18n */ { id: 'editor.levelDuplicateDialog.structureMaterials', message: 'Structure + materials' },
+    description: /* i18n */ { id: 'editor.levelDuplicateDialog.structureWithTheCurrentMaterialAnd', message: 'Structure with the current material and finish assignments.' },
   },
   {
     id: 'structure-furniture',
-    label: 'Structure + furniture',
-    description: 'Structure, finishes, and placed items, without guide references.',
+    label: /* i18n */ { id: 'editor.levelDuplicateDialog.structureFurniture', message: 'Structure + furniture' },
+    description: /* i18n */ { id: 'editor.levelDuplicateDialog.structureFinishesAndPlacedItemsWithout', message: 'Structure, finishes, and placed items, without guide references.' },
   },
 ]
 
-function getLevelLabel(level: LevelNode | null) {
-  if (!level) return 'this level'
-  return getLevelDisplayName(level)
-}
-
 export function LevelDuplicateDialog({
   open,
   level,
@@ -57,6 +53,8 @@ export function LevelDuplicateDialog({
   onConfirm: (preset: LevelDuplicatePreset) => void
   onOpenChange: (open: boolean) => void
 }) {
+  const i18n = usePascalI18n()
+  const locale = useLocale()
   const [preset, setPreset] = useState<LevelDuplicatePreset>('everything')
 
   useEffect(() => {
@@ -69,8 +67,19 @@ export function LevelDuplicateDialog({
     <Dialog onOpenChange={onOpenChange} open={open}>
       <DialogContent className="sm:max-w-md" showCloseButton={false}>
         <DialogHeader>
-          <DialogTitle>Duplicate Level</DialogTitle>
-          <DialogDescription>Choose what to copy from {getLevelLabel(level)}.</DialogDescription>
+          <DialogTitle>{i18n._({ id: 'editor.levelDuplicateDialog.duplicateLevel', message: 'Duplicate Level' })}</DialogTitle>
+          <DialogDescription>
+            {level
+              ? i18n._({
+                  id: 'editor.levelDuplicateDialog.chooseWhatToCopyFromLevel',
+                  message: 'Choose what to copy from {levelName}.',
+                  values: { levelName: localizedLevelName(level, i18n, locale) },
+                })
+              : i18n._({
+                  id: 'editor.levelDuplicateDialog.chooseWhatToCopyFromThisLevel',
+                  message: 'Choose what to copy from this level.',
+                })}
+          </DialogDescription>
         </DialogHeader>
 
         <div className="grid gap-2">
@@ -86,8 +95,8 @@ export function LevelDuplicateDialog({
               onClick={() => setPreset(option.id)}
               type="button"
             >
-              <div className="font-medium text-sm">{option.label}</div>
-              <div className="mt-1 text-muted-foreground text-xs">{option.description}</div>
+              <div className="font-medium text-sm">{i18n._(option.label)}</div>
+              <div className="mt-1 text-muted-foreground text-xs">{i18n._(option.description)}</div>
             </button>
           ))}
         </div>
@@ -98,14 +107,14 @@ export function LevelDuplicateDialog({
             onClick={() => onOpenChange(false)}
             type="button"
           >
-            Cancel
+            {i18n._({ id: 'editor.levelDuplicateDialog.cancel', message: 'Cancel' })}
           </button>
           <button
             className="cursor-pointer rounded-md bg-primary px-4 py-2 text-primary-foreground text-sm transition-opacity hover:opacity-90"
             onClick={() => onConfirm(preset)}
             type="button"
           >
-            Duplicate
+            {i18n._({ id: 'editor.levelDuplicateDialog.duplicate', message: 'Duplicate' })}
           </button>
         </DialogFooter>
       </DialogContent>