Recenter router around Suspense transitions

[KidkArolis]

Summary

This is the 1.0 rewrite of React Space Router around React transitions and Suspense.

The router now owns route state and commits navigations inside startTransition, so the current page stays visible and interactive while the destination loads. Route code and data start loading as soon as a navigation begins, and pending state is exposed consistently for links, programmatic navigation, and browser traversal.

What changed

• Suspense-native navigation with usePending(), usePendingRoute(), per-link data-pending, and <DelayedSuspense>.
• Route configuration moves to <Router routes={routes}>; <Routes /> is now only the render location for the matched route tree.
• Route-level code loading through resolver: () => import(...).
• Fetch-as-you-render data preparation through prepare(ctx), with handles pinned for the committed route and released on superseded or completed navigations.
• Declarative queries plus a small <Router data> adapter, so one route declaration drives both navigation preparation and speculative prefetching.
• Prefetching through <Link prefetch>, <Router prefetchLinks>, route-level prefetchable, and usePrefetch().
• One destination-resolution pipeline for links, useNavigate(), <Navigate>, the public Space Router instance, and prefetching. transformQuery applies app-owned query policy before href generation; transformRoute remains the post-match, pre-commit route transform.
• Path params are passed directly to the route segment that declares them.
• A new loading-modes demo, updated API docs, and a 0.6.x migration guide.

Why

The 0.6 API delegated route state and navigation lifecycle work to application callbacks. That made Suspense coordination, pending UI, code preloading, and data-cache lifetimes application concerns—and meant the route commit itself could happen outside React's transition.

In 1.0, a navigation is a React transition. The router owns the state update; route declarations own what must be loaded; Suspense boundaries own where loading UI appears.

Breaking changes

• Route definitions move from <Routes routes={routes}> to <Router routes={routes}>.
• <Router useRoute onNavigating onNavigated> is removed. Use useRoute() for reads, effects for post-commit observation, and route resolver / prepare / queries for loading.
• Function-form <Link> props (className, style, and extraProps) are removed. Use aria-current="page", data-pending, or useLinkState(to).
• useInternalRouterInstance() is renamed to useSpaceRouter().

See MIGRATION.md for the full migration path.

Loading model

const routes = [
  {
    path: '/issues/:id',
    resolver: () => import('./pages/IssueDetail'),
    queries: ({ params }) => [[issueQuery, { id: params.id }]],
  },
]

<Router routes={routes} data={{ prepare, prefetch }} pendingDelayMs={1000}>
  <Suspense fallback={null}>
    <Routes />
  </Suspense>
</Router>

The route chunk and query start together. The previous route remains committed while the destination suspends; <DelayedSuspense> boundaries can switch to skeletons after the configured delay.

Demo

npm run demo opens four loading-mode examples over simulated code and data latency, including immediate skeletons, hold-then-swap, delayed fallbacks, and detail-surface fades.

Verification

• npm test
• npm run demo:build
• npm run docs:build