@tanstack/react-router 1.133.21 → 1.133.25

package/src/Matches.tsx

@@ -41,6 +41,10 @@ declare module '@tanstack/router-core' {
   }
 }
 
+/**
+ * Internal component that renders the router's active match tree with
+ * suspense, error, and not-found boundaries. Rendered by `RouterProvider`.
+ */
 export function Matches() {
   const router = useRouter()
   const rootRoute: AnyRoute = router.routesById[rootRouteId]
@@ -119,6 +123,18 @@ export type UseMatchRouteOptions<
   MaskOptions<TRouter, TMaskFrom, TMaskTo> &
   MatchRouteOptions
 
+/**
+ * Create a matcher function for testing locations against route definitions.
+ *
+ * The returned function accepts standard navigation options (`to`, `params`,
+ * `search`, etc.) and returns either `false` (no match) or the matched params
+ * object when the route matches the current or pending location.
+ *
+ * Useful for conditional rendering and active UI states.
+ *
+ * @returns A `matchRoute(options)` function that returns `false` or params.
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchRouteHook
+ */
 export function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {
   const router = useRouter()
 
@@ -169,6 +185,13 @@ export type MakeMatchRouteOptions<
     | React.ReactNode
 }
 
+/**
+ * Component that conditionally renders its children based on whether a route
+ * matches the provided `from`/`to` options. If `children` is a function, it
+ * receives the matched params object.
+ *
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/matchRouteComponent
+ */
 export function MatchRoute<
   TRouter extends AnyRouter = RegisteredRouter,
   const TFrom extends string = string,
@@ -220,6 +243,22 @@ export function useMatches<
   } as any) as UseMatchesResult<TRouter, TSelected>
 }
 
+/**
+ * Read the full array of active route matches or select a derived subset.
+ *
+ * Useful for debugging, breadcrumbs, or aggregating metadata across matches.
+ *
+ * @returns The array of matches (or the selected value).
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook
+ */
+
+/**
+ * Read the full array of active route matches or select a derived subset.
+ *
+ * Useful for debugging, breadcrumbs, or aggregating metadata across matches.
+ *
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchesHook
+ */
 export function useParentMatches<
   TRouter extends AnyRouter = RegisteredRouter,
   TSelected = unknown,
@@ -242,6 +281,10 @@ export function useParentMatches<
   } as any)
 }
 
+/**
+ * Read the array of active route matches that are children of the current
+ * match (or selected parent) in the match tree.
+ */
 export function useChildMatches<
   TRouter extends AnyRouter = RegisteredRouter,
   TSelected = unknown,

package/src/Scripts.tsx

@@ -3,6 +3,10 @@ import { useRouterState } from './useRouterState'
 import { useRouter } from './useRouter'
 import type { RouterManagedTag } from '@tanstack/router-core'
 
+/**
+ * Render body script tags collected from route matches and SSR manifests.
+ * Should be placed near the end of the document body.
+ */
 export const Scripts = () => {
   const router = useRouter()
   const nonce = router.options.ssr?.nonce

package/src/ScrollRestoration.tsx

@@ -17,7 +17,7 @@ function useScrollRestoration() {
 }
 
 /**
- * @deprecated use createRouter's `scrollRestoration` option instead
+ * @deprecated Use the `scrollRestoration` router option instead.
  */
 export function ScrollRestoration(_props: ScrollRestorationOptions) {
   useScrollRestoration()

package/src/awaited.tsx

@@ -7,6 +7,7 @@ export type AwaitOptions<T> = {
   promise: Promise<T>
 }
 
+/** Suspend until a deferred promise resolves/rejects and return its data. */
 export function useAwaited<T>({
   promise: _promise,
 }: AwaitOptions<T>): [T, DeferredPromise<T>] {
@@ -23,6 +24,10 @@ export function useAwaited<T>({
   return [promise[TSR_DEFERRED_PROMISE].data, promise]
 }
 
+/**
+ * Component that suspends on a deferred promise and renders its child with
+ * the resolved value. Optionally provides a Suspense fallback.
+ */
 export function Await<T>(
   props: AwaitOptions<T> & {
     fallback?: React.ReactNode

package/src/fileRoute.ts

@@ -35,6 +35,17 @@ import type { UseLoaderDepsRoute } from './useLoaderDeps'
 import type { UseLoaderDataRoute } from './useLoaderData'
 import type { UseRouteContextRoute } from './useRouteContext'
 
+/**
+ * Creates a file-based Route factory for a given path.
+ *
+ * Used by TanStack Router's file-based routing to associate a file with a
+ * route. The returned function accepts standard route options. In normal usage
+ * the `path` string is inserted and maintained by the `tsr` generator.
+ *
+ * @param path File path literal for the route (usually auto-generated).
+ * @returns A function that accepts Route options and returns a Route instance.
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/createFileRouteFunction
+ */
 /**
  * Creates a file-based Route factory for a given path.
  *
@@ -66,6 +77,10 @@ export function createFileRoute<
   }).createRoute
 }
 
+/** 
+  @deprecated It's no longer recommended to use the `FileRoute` class directly.
+  Instead, use `createFileRoute('/path/to/file')(options)` to create a file route.
+*/
 /** 
   @deprecated It's no longer recommended to use the `FileRoute` class directly.
   Instead, use `createFileRoute('/path/to/file')(options)` to create a file route.
@@ -159,6 +174,11 @@ export class FileRoute<
   }
 }
 
+/** 
+  @deprecated It's recommended not to split loaders into separate files.
+  Instead, place the loader function in the the main route file, inside the
+  `createFileRoute('/path/to/file)(options)` options.
+*/
 /** 
   @deprecated It's recommended not to split loaders into separate files.
   Instead, place the loader function in the the main route file, inside the
@@ -264,6 +284,18 @@ export class LazyRoute<TRoute extends AnyRoute> {
   }
 }
 
+/**
+ * Creates a lazily-configurable code-based route stub by ID.
+ *
+ * Use this for code-splitting with code-based routes. The returned function
+ * accepts only non-critical route options like `component`, `pendingComponent`,
+ * `errorComponent`, and `notFoundComponent` which are applied when the route
+ * is matched.
+ *
+ * @param id Route ID string literal to associate with the lazy route.
+ * @returns A function that accepts lazy route options and returns a `LazyRoute`.
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/createLazyRouteFunction
+ */
 /**
  * Creates a lazily-configurable code-based route stub by ID.
  *
@@ -289,6 +321,17 @@ export function createLazyRoute<
   }
 }
 
+/**
+ * Creates a lazily-configurable file-based route stub by file path.
+ *
+ * Use this for code-splitting with file-based routes (eg. `.lazy.tsx` files).
+ * The returned function accepts only non-critical route options like
+ * `component`, `pendingComponent`, `errorComponent`, and `notFoundComponent`.
+ *
+ * @param id File path literal for the route file.
+ * @returns A function that accepts lazy route options and returns a `LazyRoute`.
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/createLazyFileRouteFunction
+ */
 /**
  * Creates a lazily-configurable file-based route stub by file path.
  *

package/src/lazyRouteComponent.tsx

@@ -2,6 +2,15 @@ import * as React from 'react'
 import { isModuleNotFoundError } from '@tanstack/router-core'
 import type { AsyncRouteComponent } from './route'
 
+/**
+ * Wrap a dynamic import to create a route component that supports
+ * `.preload()` and friendly reload-on-module-missing behavior.
+ *
+ * @param importer Function returning a module promise
+ * @param exportName Named export to use (default: `default`)
+ * @returns A lazy route component compatible with TanStack Router
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/lazyRouteComponentFunction
+ */
 export function lazyRouteComponent<
   T extends Record<string, any>,
   TKey extends keyof T = 'default',

package/src/link.tsx

@@ -25,6 +25,18 @@ import type {
   ValidateLinkOptionsArray,
 } from './typePrimitives'
 
+/**
+ * Build anchor-like props for declarative navigation and preloading.
+ *
+ * Returns stable `href`, event handlers and accessibility props derived from
+ * router options and active state. Used internally by `Link` and custom links.
+ *
+ * Options cover `to`, `params`, `search`, `hash`, `state`, `preload`,
+ * `activeProps`, `inactiveProps`, and more.
+ *
+ * @returns React anchor props suitable for `<a>` or custom components.
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useLinkPropsHook
+ */
 export function useLinkProps<
   TRouter extends AnyRouter = RegisteredRouter,
   const TFrom extends string = string,

package/src/useLoaderData.tsx

@@ -54,6 +54,17 @@ export type UseLoaderDataRoute<out TId> = <
     StructuralSharingOption<TRouter, TSelected, TStructuralSharing>,
 ) => UseLoaderDataResult<TRouter, TId, true, TSelected>
 
+/**
+ * Read and select the current route's loader data with type‑safety.
+ *
+ * Options:
+ * - `from`/`strict`: Choose which route's data to read and strictness
+ * - `select`: Map the loader data to a derived value
+ * - `structuralSharing`: Enable structural sharing for stable references
+ *
+ * @returns The loader data (or selected value) for the matched route.
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useLoaderDataHook
+ */
 export function useLoaderData<
   TRouter extends AnyRouter = RegisteredRouter,
   const TFrom extends string | undefined = undefined,

package/src/useLoaderDeps.tsx

@@ -40,6 +40,17 @@ export type UseLoaderDepsRoute<out TId> = <
     StructuralSharingOption<TRouter, TSelected, false>,
 ) => UseLoaderDepsResult<TRouter, TId, TSelected>
 
+/**
+ * Read and select the current route's loader dependencies object.
+ *
+ * Options:
+ * - `from`: Choose which route's loader deps to read
+ * - `select`: Map the deps to a derived value
+ * - `structuralSharing`: Enable structural sharing for stable references
+ *
+ * @returns The loader deps (or selected value) for the matched route.
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useLoaderDepsHook
+ */
 export function useLoaderDeps<
   TRouter extends AnyRouter = RegisteredRouter,
   const TFrom extends string | undefined = undefined,

package/src/useLocation.tsx

@@ -26,6 +26,17 @@ export type UseLocationResult<
   ? RouterState<TRouter['routeTree']>['location']
   : TSelected
 
+/**
+ * Read the current location from the router state with optional selection.
+ * Useful for subscribing to just the pieces of location you care about.
+ *
+ * Options:
+ * - `select`: Project the `location` object to a derived value
+ * - `structuralSharing`: Enable structural sharing for stable references
+ *
+ * @returns The current location (or selected value).
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useLocationHook
+ */
 export function useLocation<
   TRouter extends AnyRouter = RegisteredRouter,
   TSelected = unknown,

package/src/useMatch.tsx

@@ -75,6 +75,18 @@ export type UseMatchResult<
     : MakeRouteMatchUnion<TRouter>
   : TSelected
 
+/**
+ * Read and select the nearest or targeted route match.
+ *
+ * Options:
+ * - `from`/`strict`: Target a specific route ID and control union vs. exact typing
+ * - `select`: Project the match object to a derived value
+ * - `shouldThrow`: Throw if the match is not found in strict contexts
+ * - `structuralSharing`: Enable structural sharing for stable references
+ *
+ * @returns The active match (or selected value).
+ * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useMatchHook
+ */
 export function useMatch<
   TRouter extends AnyRouter = RegisteredRouter,
   const TFrom extends string | undefined = undefined,

package/src/useNavigate.tsx

@@ -9,13 +9,17 @@ import type {
 } from '@tanstack/router-core'
 
 /**
- * React hook that returns a `navigate` function for programmatic navigation.
- * Supports updating pathname, search, hash and state with full type-safety.
+ * Imperative navigation hook.
+ *
+ * Returns a stable `navigate(options)` function to change the current location
+ * programmatically. Prefer the `Link` component for user-initiated navigation,
+ * and use this hook from effects, callbacks, or handlers where imperative
+ * navigation is required.
  *
  * Options:
- * - `from`: Default base path used to resolve relative `to` destinations.
+ * - `from`: Optional route base used to resolve relative `to` paths.
  *
- * @returns A memoized `navigate` function.
+ * @returns A function that accepts `NavigateOptions`.
  * @link https://tanstack.com/router/latest/docs/framework/react/api/router/useNavigateHook
  */
 export function useNavigate<