perf: memo GridCard, fuse save fns, fix slash tab active color

memento-note/lib/ai/tools/excalidraw.tool.ts

@@ -426,6 +426,7 @@ function separateArchitectureZones(
   layout: Map<string, NodeLayoutBox>,
   nodes: SimplifiedNode[],
   zones: DiagramZone[],
+  rankdir: 'LR' | 'TB',
 ): void {
   const zoneGroups = zones
     .map((zone) => {
@@ -456,21 +457,40 @@ function separateArchitectureZones(
 
   if (zoneGroups.length <= 1) return
 
-  zoneGroups.sort((a, b) => a.minY - b.minY)
-  const zoneGapY = 90
-  let cursorY = zoneGroups[0].minY
+  if (rankdir === 'LR') {
+    zoneGroups.sort((a, b) => a.minX - b.minX)
+    const zoneGapX = 140
+    let cursorX = zoneGroups[0].minX
 
-  for (const group of zoneGroups) {
-    const height = group.maxY - group.minY
-    const dy = cursorY - group.minY
-    if (dy !== 0) {
-      for (const nodeId of group.nodeIds) {
-        const box = layout.get(nodeId)
-        if (!box) continue
-        layout.set(nodeId, { ...box, y: box.y + dy })
+    for (const group of zoneGroups) {
+      const width = group.maxX - group.minX
+      const dx = cursorX - group.minX
+      if (dx !== 0) {
+        for (const nodeId of group.nodeIds) {
+          const box = layout.get(nodeId)
+          if (!box) continue
+          layout.set(nodeId, { ...box, x: box.x + dx })
+        }
       }
+      cursorX += width + zoneGapX
+    }
+  } else {
+    zoneGroups.sort((a, b) => a.minY - b.minY)
+    const zoneGapY = 90
+    let cursorY = zoneGroups[0].minY
+
+    for (const group of zoneGroups) {
+      const height = group.maxY - group.minY
+      const dy = cursorY - group.minY
+      if (dy !== 0) {
+        for (const nodeId of group.nodeIds) {
+          const box = layout.get(nodeId)
+          if (!box) continue
+          layout.set(nodeId, { ...box, y: box.y + dy })
+        }
+      }
+      cursorY += height + zoneGapY
     }
-    cursorY += height + zoneGapY
   }
 }
 
@@ -806,7 +826,7 @@ async function buildElementsFromSimplified(
   const { layout, quality, rankdir, engine } = await computeNodeLayout(nodes, edges, diagramType)
 
   if (diagramType === 'architecture-cloud' && zones.length > 1) {
-    separateArchitectureZones(layout, nodes, zones)
+    separateArchitectureZones(layout, nodes, zones, rankdir)
   }
 
   const renderSpecs = new Map<string, NodeRenderSpec>()