Interaktives Abhängigkeiten-Panel (Vorgänger/Nachfolger, andockbar)

Rechtsklick auf eine Zelle → "🕸 Abhängigkeiten anzeigen" öffnet ein an der
rechten Seite angedocktes Panel (wie das Einstellungen-Panel links) mit den
direkten Vorgängern (was die Zelle liest) und Nachfolgern (was sie liest),
auch über Tabellen-/Blattgrenzen hinweg. Ein Klick auf einen Eintrag
navigiert wirklich dorthin: wählt die echte Zelle im Dokument aus, wechselt
bei Bedarf das Blatt-Tab, und das Panel zentriert sich neu — Blatt-Tabs,
Canvas, Formel- und Statusleiste bleiben dabei die ganze Zeit sichtbar und
bedienbar (kein Vollbild-Dialog). Jeder Eintrag zeigt immer den Blattnamen,
nie nur implizit. Zirkelbezüge werden rot markiert.

Neu in der Engine: Workbook.graphPrecedents/graphDependents, dünne
öffentliche Wrapper um den bereits vorhandenen DependencyGraph. Im Store:
cellGraphSelf/cellGraphNeighbors (Anreicherung für die Anzeige) sowie
openDependencyGraph/closeDependencyGraph (dokumentweiter UI-State, ruft
intern das bestehende selectCell auf).

424 Tests (Engine-/Store-Ebene vollständig abgedeckt), vue-tsc/eslint/build
sauber. Das Panel selbst nur live per Playwright verifiziert (kein
Komponenten-Test-Setup vorhanden, in README dokumentiert).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/components/TableGrid.vue

@@ -969,6 +969,18 @@ function onContextMenu(e: MouseEvent) {
   if (hit && !inSelection(hit.c, hit.r)) select(hit.c, hit.r);
   menu.value = { x: e.clientX, y: e.clientY, open: true };
 }
+
+// ---- dependency-graph view ---------------------------------
+/** Opens the (single, document-wide) dependency-graph drawer on the cell
+ *  the context menu was invoked on -- `select()` in onContextMenu above
+ *  already made it the active cell by the time this runs, so the active
+ *  selection's focus is exactly the right cell. */
+function openDependencyGraph() {
+  const s = store.doc.selection;
+  if (!s || s.tableId !== props.tableId) return;
+  store.openDependencyGraph(props.tableId, s.focus.col, s.focus.row);
+}
+
 const menuItems = computed(() => {
   const t = table.value;
   const ctx = menuCtx.value;
@@ -996,6 +1008,7 @@ const menuItems = computed(() => {
   ];
   if (store.hasClipboard.value) items.push({ label: 'Einfügen', action: () => store.pasteClipboard() });
   items.push(
+    { label: '🕸 Abhängigkeiten anzeigen', action: openDependencyGraph },
     { label: 'Zeile hinzufügen', action: () => store.addRows(props.tableId) },
     { label: 'Spalte hinzufügen', action: () => store.addColumns(props.tableId) },
     { label: 'Letzte Zeile entfernen', action: () => store.removeLastRow(props.tableId) },