fix: resolve TypeScript build errors blocking Docker image

- nodeColors.ts: add missing camera/printer/computer/cpl entries to Record<NodeType, NodeColors>
- CanvasContainer.tsx: use ConnectionMode enum instead of bare string literal
- export.ts: cast style object to Partial<CSSStyleDeclaration> for CSS custom property
- Sidebar.tsx: cast suggested_type to NodeType to satisfy NodeData type

frontend/src/components/canvas/CanvasContainer.tsx

@@ -4,6 +4,7 @@ import {
   Background,
   Controls,
   BackgroundVariant,
+  ConnectionMode,
   type Node,
   type Edge,
   type Connection,
@@ -56,7 +57,7 @@ export function CanvasContainer({ onConnect: onConnectProp, onEdgeDoubleClick }:
         snapGrid={[16, 16]}
         fitView
         colorMode="dark"
-        connectionMode="loose"
+        connectionMode={ConnectionMode.Loose}
         isValidConnection={(connection) => connection.source !== connection.target}
       >
         <Background

frontend/src/components/panels/Sidebar.tsx

@@ -165,7 +165,7 @@ function PendingDevicesPanel({ onNodeApproved }: { onNodeApproved: (nodeId: stri
     try {
       const nodeData = {
         label: device.hostname ?? device.ip,
-        type: device.suggested_type ?? 'generic',
+        type: (device.suggested_type ?? 'generic') as import('@/types').NodeType,
         ip: device.ip,
         hostname: device.hostname ?? undefined,
         status: 'unknown',

frontend/src/utils/export.ts

@@ -8,9 +8,9 @@ export async function exportToPng(element: HTMLElement): Promise<void> {
   const dataUrl = await toPng(element, {
     backgroundColor: '#0d1117',
     style: {
-      // Exclude controls and minimap from the export
+      // Exclude controls from the export
       '--xy-controls-display': 'none',
-    },
+    } as Partial<CSSStyleDeclaration>,
   })
 
   const link = document.createElement('a')

frontend/src/utils/nodeColors.ts

@@ -15,9 +15,13 @@ export const NODE_DEFAULT_COLORS: Record<NodeType, NodeColors> = {
   vm:      { border: '#a855f7', background: '#21262d', icon: '#a855f7' },
   lxc:     { border: '#00d4ff', background: '#21262d', icon: '#00d4ff' },
   nas:     { border: '#39d353', background: '#21262d', icon: '#39d353' },
-  iot:     { border: '#e3b341', background: '#21262d', icon: '#e3b341' },
-  ap:      { border: '#00d4ff', background: '#21262d', icon: '#00d4ff' },
-  generic: { border: '#8b949e', background: '#21262d', icon: '#8b949e' },
+  iot:      { border: '#e3b341', background: '#21262d', icon: '#e3b341' },
+  ap:       { border: '#00d4ff', background: '#21262d', icon: '#00d4ff' },
+  camera:   { border: '#8b949e', background: '#21262d', icon: '#8b949e' },
+  printer:  { border: '#8b949e', background: '#21262d', icon: '#8b949e' },
+  computer: { border: '#a855f7', background: '#21262d', icon: '#a855f7' },
+  cpl:      { border: '#e3b341', background: '#21262d', icon: '#e3b341' },
+  generic:  { border: '#8b949e', background: '#21262d', icon: '#8b949e' },
 }
 
 export function resolveNodeColors(data: Pick<NodeData, 'type' | 'custom_colors'>): NodeColors {