diff --git a/docs/components/canvas.md b/docs/components/canvas.md index 6fdce076..e36da24f 100644 --- a/docs/components/canvas.md +++ b/docs/components/canvas.md @@ -43,6 +43,7 @@ Selection controls: | Operation | How | |-----------|-----| | Focus (enter) a card | Single-click its body | +| Navigate between cards | `⌘⌃↑` / `⌘⌃↓` / `⌘⌃←` / `⌘⌃→` — jump to the nearest card in that direction (spatial, based on card positions) | | Move a card | Drag its title bar | | Resize a card | Drag its edges/corners | | Expand / restore a card | `⌘⌥E`, double-click the title bar, or the title-bar expand button — fills the viewport with that card; click the dimmed background or `⌘⌥E` again to restore | @@ -115,6 +116,15 @@ performance. - `windowTintMode` / repository colors — card and nav tinting. - `showRunButtonInToolbar` — whether the Run button appears in the Canvas toolbar. +## Keyboard card navigation + +`⌘⌃↑` / `⌘⌃↓` / `⌘⌃←` / `⌘⌃→` move focus to the **nearest card** in +that direction, based on the 2D card positions on the board. If the target card +is partially off-screen, the canvas pans smoothly to reveal it without changing +the zoom level. These are the same key combos used for worktree/book navigation +in Normal and Shelf views — in Canvas they switch to spatial navigation +automatically. + ## When to recommend Canvas vs Shelf - **Canvas** = spatial, see-everything, broadcast to many. Best when you're diff --git a/supacode/Features/Canvas/Views/CanvasHelpButton.swift b/supacode/Features/Canvas/Views/CanvasHelpButton.swift index b3269e29..829d44bd 100644 --- a/supacode/Features/Canvas/Views/CanvasHelpButton.swift +++ b/supacode/Features/Canvas/Views/CanvasHelpButton.swift @@ -49,6 +49,16 @@ struct CanvasHelpButton: View { for: AppShortcuts.CommandID.expandCanvasCard, in: resolvedKeybindings ) + let navUpDown = [ + AppShortcuts.display(for: AppShortcuts.CommandID.selectPreviousWorktree, in: resolvedKeybindings), + AppShortcuts.display(for: AppShortcuts.CommandID.selectNextWorktree, in: resolvedKeybindings), + ].compactMap { $0 } + let navLeftRight = [ + AppShortcuts.display(for: AppShortcuts.CommandID.selectPreviousShelfBook, in: resolvedKeybindings), + AppShortcuts.display(for: AppShortcuts.CommandID.selectNextShelfBook, in: resolvedKeybindings), + ].compactMap { $0 } + let navKeys = (navUpDown + navLeftRight).joined(separator: " / ") + return VStack(alignment: .leading, spacing: 14) { Text("Canvas Navigation") .font(.headline) @@ -70,6 +80,13 @@ struct CanvasHelpButton: View { detail: expandShortcut.map { "\($0), or the card's title-bar button" } ?? "Use the card's title-bar button" ) + if !navKeys.isEmpty { + canvasHelpRow( + icon: "arrow.up.arrow.down.arrow.left.arrow.right", + title: "Navigate between cards", + detail: "\(navKeys) — jump to the nearest card in that direction" + ) + } } } .padding()