feat(steps): draw all arms of conditional navigations as separate edges

Adds multi-arm navigation support: when a destination is produced by a conditional, every arm is now drawn as its own edge. Introduces helpers (hrefArms, destinationsForHref) and updates framework resolvers and edge creation to emit multiple navigates edges (via alsoTargets) instead of a single one. Also introduces per-app rooted route tables to avoid cross-app crossings, and updates various resolvers (React Router, TanStack Router, Vue Router, SvelteKit, Vue, and SvelteKit’s linker) and the UI to reflect multiple possible destinations. Tests and docs updated to reflect the new behavior, ensuring the Screens tab shows all possible navigation paths from conditional destinations. This makes navigation visualization more accurate for forked destinations.
This commit is contained in:
Colby McHenry
2026-08-31 11:34:26 -05:00
parent 209a07e881
commit 6f4887db80
31 changed files with 3969 additions and 87 deletions
+6 -1
View File
@@ -153,7 +153,12 @@ export const svelteResolver: FrameworkResolver = {
const fileName = filePath.split(/[/\\]/).pop() || '';
const routeMatch = getSvelteKitRouteInfo(fileName);
if (routeMatch) {
// Only a `+page.svelte` is a URL. A `+layout.svelte` and a `+error.svelte`
// sit at the same path as the page beside them, so emitting a route for
// them put the same address in the index two and three times over — one
// `/` for the page, one for the layout, one for the error page — which the
// Screens picture then drew as three separate screens.
if (routeMatch === 'page') {
// Extract route path from directory structure
// e.g., src/routes/blog/[slug]/+page.svelte -> /blog/:slug
const routePath = filePathToSvelteKitRoute(filePath);