@pascal-app/editor 1.0.0-beta.5 → 1.0.1

package/src/components/ui/sidebar/panels/settings-panel/keyboard-shortcuts-dialog.tsx

@@ -1,5 +1,4 @@
 import { Keyboard } from 'lucide-react'
-import { useEffect, useState } from 'react'
 import { Button } from './../../../../../components/ui/primitives/button'
 import {
   Dialog,
@@ -9,7 +8,10 @@ import {
   DialogTitle,
   DialogTrigger,
 } from './../../../../../components/ui/primitives/dialog'
-import { ShortcutToken } from './../../../../../components/ui/primitives/shortcut-token'
+import {
+  ShortcutToken,
+  shortcutDisplayValue,
+} from './../../../../../components/ui/primitives/shortcut-token'
 
 type Shortcut = {
   keys: string[]
@@ -22,14 +24,6 @@ type ShortcutCategory = {
   shortcuts: Shortcut[]
 }
 
-const KEY_DISPLAY_MAP: Record<string, string> = {
-  'Arrow Up': '↑',
-  'Arrow Down': '↓',
-  Esc: '⎋',
-  Shift: '⇧',
-  Space: '␣',
-}
-
 const SHORTCUT_CATEGORIES: ShortcutCategory[] = [
   {
     title: 'Editor Navigation',
@@ -60,10 +54,12 @@ const SHORTCUT_CATEGORIES: ShortcutCategory[] = [
       {
         keys: ['Esc'],
         action: 'Cancel the active tool and return to Select mode',
+        note: 'Mid-draw it cancels only the chain in progress and keeps the tool armed; press it again to leave the tool.',
       },
       { keys: ['Delete / Backspace'], action: 'Delete selected objects' },
       { keys: ['Cmd/Ctrl', 'Z'], action: 'Undo' },
       { keys: ['Cmd/Ctrl', 'Shift', 'Z'], action: 'Redo' },
+      { keys: ['Cmd/Ctrl', 'S'], action: 'Save' },
     ],
   },
   {
@@ -147,6 +143,19 @@ const SHORTCUT_CATEGORIES: ShortcutCategory[] = [
   {
     title: 'Drawing Tools',
     shortcuts: [
+      // Shift and Ctrl each mean one thing held and another tapped, and only
+      // the hold was documented — which read as the taps not existing. Both
+      // taps are listed first because they are the ones nobody discovers.
+      {
+        keys: ['Shift'],
+        action: 'Cycle the snapping mode',
+        note: 'Tap and release without pressing anything else, while a drawing or move gesture is available.',
+      },
+      {
+        keys: ['Cmd/Ctrl'],
+        action: 'Cycle the grid step: 0.5 m → 0.25 m → 0.1 m → 0.05 m',
+        note: 'Tap and release on its own. Use it when the default half-metre grid is too coarse — placing a window, for instance.',
+      },
       {
         keys: ['Shift'],
         action: 'Bypass guided snapping and angle constraints',
@@ -199,25 +208,13 @@ const SHORTCUT_CATEGORIES: ShortcutCategory[] = [
   },
 ]
 
-function getDisplayKey(key: string, isMac: boolean): string {
-  if (key === 'Cmd/Ctrl') return isMac ? '⌘' : 'Ctrl'
-  if (key === 'Delete / Backspace') return isMac ? '⌫' : 'Backspace'
-  return KEY_DISPLAY_MAP[key] ?? key
-}
-
 function ShortcutKeys({ keys }: { keys: string[] }) {
-  const [isMac, setIsMac] = useState(true)
-
-  useEffect(() => {
-    setIsMac(navigator.platform.toUpperCase().indexOf('MAC') >= 0)
-  }, [])
-
   return (
     <div className="flex flex-wrap items-center gap-1">
       {keys.map((key, index) => (
         <div className="flex items-center gap-1" key={`${key}-${index}`}>
           {index > 0 ? <span className="text-[10px] text-muted-foreground">+</span> : null}
-          <ShortcutToken displayValue={getDisplayKey(key, isMac)} value={key} />
+          <ShortcutToken displayValue={shortcutDisplayValue(key)} value={key} />
         </div>
       ))}
     </div>

package/src/components/ui/sidebar/panels/settings-panel/print-export-button.test.ts

@@ -0,0 +1,167 @@
+import { describe, expect, test } from 'bun:test'
+import type { PrintLevelBundleReport } from '../../../../../lib/level-print-export'
+import type { ModelExport, ModelExportOptions } from '../../../../../lib/model-export'
+import type { PrintExportReport } from '../../../../../lib/print-export'
+import { preparePrintExport } from './print-export-button'
+
+const report: PrintExportReport = {
+  kind: 'print-export-report',
+  version: 2,
+  format: '3mf',
+  scale: 100,
+  units: 'millimeter',
+  orientation: 'z-up',
+  status: 'pass',
+  bounds: {
+    min: { x: -25, y: -15, z: 0 },
+    max: { x: 25, y: 15, z: 20 },
+    width: 50,
+    depth: 30,
+    height: 20,
+  },
+  triangleCount: 12,
+  invalidTriangleCount: 0,
+  degenerateTriangleCount: 0,
+  boundaryEdgeCount: 0,
+  nonManifoldEdgeCount: 0,
+  connectedComponentCount: 1,
+  solidComponentCount: 1,
+  invertedWinding: false,
+  volumeMm3: 30_000,
+  diagnostics: [],
+}
+
+describe('simple 3D print export', () => {
+  test('uses one fixed safe print profile', async () => {
+    const calls: { format?: string; options?: ModelExportOptions }[] = []
+    const artifact = { blob: new Blob(['3mf']), filename: 'house.3mf', metadata: report }
+    const modelExport: ModelExport = async (format, options) => {
+      calls.push({ format, options })
+      return artifact
+    }
+
+    const prepared = await preparePrintExport(modelExport, true, 'print-3mf')
+
+    expect(calls).toEqual([
+      {
+        format: 'print-3mf',
+        options: {
+          onlyVisible: true,
+          download: false,
+          printScale: 100,
+          printScope: 'levels',
+          printContent: 'structure',
+          printBase: 'none',
+        },
+      },
+    ])
+    expect(prepared).toEqual({ artifact, report })
+  })
+
+  test('uses the same safe profile for printable STL files', async () => {
+    const calls: { format?: string; options?: ModelExportOptions }[] = []
+    const stlReport: PrintExportReport = { ...report, format: 'stl' }
+    const artifact = { blob: new Blob(['stl']), filename: 'house.zip', metadata: stlReport }
+    const modelExport: ModelExport = async (format, options) => {
+      calls.push({ format, options })
+      return artifact
+    }
+
+    const prepared = await preparePrintExport(modelExport, false, 'print-stl')
+
+    expect(calls).toEqual([
+      {
+        format: 'print-stl',
+        options: {
+          onlyVisible: false,
+          download: false,
+          printScale: 100,
+          printScope: 'levels',
+          printContent: 'structure',
+          printBase: 'none',
+        },
+      },
+    ])
+    expect(prepared).toEqual({ artifact, report: stlReport })
+  })
+
+  test('blocks the download when preflight finds invalid geometry', async () => {
+    const blockedReport: PrintExportReport = {
+      ...report,
+      status: 'blocked',
+      diagnostics: [
+        {
+          severity: 'error',
+          code: 'open_boundary',
+          message: 'One wall has an open edge.',
+        },
+      ],
+    }
+    const modelExport: ModelExport = async () => ({
+      blob: new Blob(['3mf']),
+      filename: 'house.3mf',
+      metadata: blockedReport,
+    })
+
+    await expect(preparePrintExport(modelExport, true, 'print-3mf')).rejects.toThrow(
+      'One wall has an open edge.',
+    )
+  })
+
+  test('shows a per-level preflight error when the bundle has no top-level error', async () => {
+    const blockedPartReport: PrintExportReport = {
+      ...report,
+      status: 'blocked',
+      diagnostics: [
+        {
+          severity: 'error',
+          code: 'open_boundary',
+          message: 'The upper level has an open edge.',
+        },
+      ],
+    }
+    const blockedBundleReport: PrintLevelBundleReport = {
+      kind: 'print-level-export-report',
+      version: 2,
+      format: '3mf',
+      scale: 100,
+      units: 'millimeter',
+      orientation: 'z-up',
+      status: 'blocked',
+      partCount: 1,
+      parts: [
+        {
+          kind: 'level',
+          levelId: 'upper-level',
+          label: 'Upper level',
+          objectName: 'Upper level',
+          filename: null,
+          sourceBaseMeters: 3,
+          report: blockedPartReport,
+        },
+      ],
+      excludedNodeIds: [],
+      diagnostics: [],
+    }
+    const modelExport: ModelExport = async () => ({
+      blob: new Blob(['3mf']),
+      filename: 'house.zip',
+      metadata: blockedBundleReport,
+    })
+
+    await expect(preparePrintExport(modelExport, true, 'print-3mf')).rejects.toThrow(
+      'The upper level has an open edge.',
+    )
+  })
+
+  test('rejects an exporter response without print metadata', async () => {
+    const modelExport: ModelExport = async () => ({
+      blob: new Blob(['3mf']),
+      filename: 'house.3mf',
+    })
+
+    await expect(preparePrintExport(modelExport, false, 'print-3mf')).rejects.toThrow(
+      'did not return a valid file',
+    )
+  })
+})

package/src/components/ui/sidebar/panels/settings-panel/print-export-button.tsx

@@ -0,0 +1,128 @@
+import { AlertTriangle, Printer } from 'lucide-react'
+import { useState } from 'react'
+import { Button } from '../../../../../components/ui/primitives/button'
+import {
+  isPrintLevelBundleReport,
+  type PrintLevelBundleReport,
+} from '../../../../../lib/level-print-export'
+import type {
+  ModelExport,
+  ModelExportArtifact,
+  ModelExportFormat,
+} from '../../../../../lib/model-export'
+import {
+  isPrintExportReport,
+  type PrintExportReport,
+} from '../../../../../lib/print-export'
+import useEditor from '../../../../../store/use-editor'
+
+type PreparedPrintExport = {
+  artifact: ModelExportArtifact
+  report: PrintExportReport | PrintLevelBundleReport
+}
+
+type PrintModelExportFormat = Extract<ModelExportFormat, 'print-3mf' | 'print-stl'>
+
+function downloadArtifact(artifact: ModelExportArtifact) {
+  const url = URL.createObjectURL(artifact.blob)
+  const link = document.createElement('a')
+  link.href = url
+  link.download = artifact.filename
+  link.click()
+  URL.revokeObjectURL(url)
+}
+
+function firstBlockingMessage(report: PrintExportReport | PrintLevelBundleReport) {
+  const bundleDiagnostic = report.diagnostics.find((item) => item.severity === 'error')
+  if (bundleDiagnostic || !isPrintLevelBundleReport(report)) return bundleDiagnostic?.message
+
+  for (const part of report.parts) {
+    const partDiagnostic = part.report.diagnostics.find((item) => item.severity === 'error')
+    if (partDiagnostic) return partDiagnostic.message
+  }
+}
+
+export async function preparePrintExport(
+  modelExport: ModelExport,
+  onlyVisible: boolean,
+  format: PrintModelExportFormat,
+): Promise<PreparedPrintExport> {
+  const artifact = await modelExport(format, {
+    onlyVisible,
+    download: false,
+    printScale: 100,
+    printScope: 'levels',
+    printContent: 'structure',
+    printBase: 'none',
+  })
+
+  if (
+    !artifact ||
+    (!isPrintExportReport(artifact.metadata) && !isPrintLevelBundleReport(artifact.metadata))
+  ) {
+    throw new Error('The 3D print exporter did not return a valid file.')
+  }
+
+  if (artifact.metadata.status === 'blocked') {
+    throw new Error(
+      firstBlockingMessage(artifact.metadata) ??
+        'This project cannot be exported as printable parts.',
+    )
+  }
+
+  return { artifact, report: artifact.metadata }
+}
+
+export function PrintExportButton({ onlyVisible }: { onlyVisible: boolean }) {
+  const modelExport = useEditor((state) => state.modelExport)
+  const [exportingFormat, setExportingFormat] = useState<PrintModelExportFormat | null>(null)
+  const [error, setError] = useState<string | null>(null)
+
+  const handleExport = async (format: PrintModelExportFormat) => {
+    if (!modelExport) return
+
+    setExportingFormat(format)
+    setError(null)
+    try {
+      const prepared = await preparePrintExport(modelExport, onlyVisible, format)
+      downloadArtifact(prepared.artifact)
+    } catch (reason) {
+      setError(reason instanceof Error ? reason.message : '3D print export failed.')
+    } finally {
+      setExportingFormat(null)
+    }
+  }
+
+  const isExporting = exportingFormat !== null
+
+  return (
+    <>
+      <Button
+        aria-busy={exportingFormat === 'print-3mf'}
+        className="w-full justify-start gap-2"
+        disabled={isExporting || !modelExport}
+        onClick={() => void handleExport('print-3mf')}
+        variant="outline"
+      >
+        <Printer className="size-4" />
+        Export 3D print 3MF
+      </Button>
+      <Button
+        aria-busy={exportingFormat === 'print-stl'}
+        className="w-full justify-start gap-2"
+        disabled={isExporting || !modelExport}
+        onClick={() => void handleExport('print-stl')}
+        variant="outline"
+      >
+        <Printer className="size-4" />
+        Export 3D print STL
+      </Button>
+      {error && (
+        <div className="flex gap-2 text-destructive text-xs">
+          <AlertTriangle className="mt-0.5 size-4 shrink-0" />
+          <span>{error}</span>
+        </div>
+      )}
+    </>
+  )
+}

package/src/components/ui/sidebar/panels/site-panel/building-tree-node.tsx

@@ -26,8 +26,15 @@ export const BuildingTreeNode = memo(function BuildingTreeNode({
   const createNode = useScene((state) => state.createNode)
   const isVisible = useScene((s) => s.nodes[nodeId]?.visible !== false)
   const name = useScene((s) => s.nodes[nodeId]?.name)
+  // Levels and elevators first, units after, so the units read as one group.
   const children = useScene(
-    useShallow((s) => (s.nodes[nodeId] as BuildingNode | undefined)?.children ?? []),
+    useShallow((s) => {
+      const ids = (s.nodes[nodeId] as BuildingNode | undefined)?.children ?? []
+      return [
+        ...ids.filter((id) => s.nodes[id]?.type !== 'unit'),
+        ...ids.filter((id) => s.nodes[id]?.type === 'unit'),
+      ]
+    }),
   )
   const isSelected = useViewer((state) => state.selection.buildingId === nodeId)
   const isHovered = useViewer((state) => state.hoveredId === nodeId)

package/src/components/ui/sidebar/panels/site-panel/dormer-tree-node.tsx

@@ -2,10 +2,11 @@ import { type AnyNodeId, type DormerNode, useScene } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
 import Image from 'next/image'
 import { memo, useCallback, useState } from 'react'
+import { useShallow } from 'zustand/react/shallow'
 import { SnapTargetIcon } from '../../../snap-target-badge'
 import useEditor from './../../../../../store/use-editor'
 import { InlineRenameInput } from './inline-rename-input'
-import { focusTreeNode, handleTreeSelection, TreeNodeWrapper } from './tree-node'
+import { focusTreeNode, handleTreeSelection, TreeNode, TreeNodeWrapper } from './tree-node'
 import { TreeNodeActions } from './tree-node-actions'
 
 interface DormerTreeNodeProps {
@@ -26,8 +27,12 @@ export const DormerTreeNode = memo(function DormerTreeNode({
   isLast,
 }: DormerTreeNodeProps) {
   const [isEditing, setIsEditing] = useState(false)
+  const [expanded, setExpanded] = useState(true)
   const isVisible = useScene((s) => s.nodes[nodeId]?.visible !== false)
   const node = useScene((s) => s.nodes[nodeId] as DormerNode | undefined)
+  const children = useScene(
+    useShallow((s) => (s.nodes[nodeId] as DormerNode | undefined)?.children ?? []),
+  )
   const isSelected = useViewer((state) => state.selection.selectedIds.includes(nodeId))
   const isHovered = useViewer((state) => state.hoveredId === nodeId)
   const setSelection = useViewer((state) => state.setSelection)
@@ -55,8 +60,8 @@ export const DormerTreeNode = memo(function DormerTreeNode({
     <TreeNodeWrapper
       actions={<TreeNodeActions nodeId={nodeId} />}
       depth={depth}
-      expanded={false}
-      hasChildren={false}
+      expanded={expanded}
+      hasChildren={children.length > 0}
       icon={
         <SnapTargetIcon target="roof">
           <Image
@@ -86,7 +91,16 @@ export const DormerTreeNode = memo(function DormerTreeNode({
       onDoubleClick={() => focusTreeNode(nodeId)}
       onMouseEnter={() => setHoveredId(nodeId)}
       onMouseLeave={() => setHoveredId(null)}
-      onToggle={() => {}}
-    />
+      onToggle={() => setExpanded((value) => !value)}
+    >
+      {children.map((childId, index) => (
+        <TreeNode
+          depth={depth + 1}
+          isLast={index === children.length - 1}
+          key={childId}
+          nodeId={childId as AnyNodeId}
+        />
+      ))}
+    </TreeNodeWrapper>
   )
 })