@tanstack/react-router 1.120.4-alpha.19 → 1.120.4

package/src/Match.tsx

@@ -306,17 +306,6 @@ export const Outlet = React.memo(function OutletImpl() {
     },
   })
 
-  const pendingElement = router.options.defaultPendingComponent ? (
-    <router.options.defaultPendingComponent />
-  ) : null
-
-  if (router.isShell)
-    return (
-      <React.Suspense fallback={pendingElement}>
-        <ShellInner />
-      </React.Suspense>
-    )
-
   if (parentGlobalNotFound) {
     return renderRouteNotFound(router, route, undefined)
   }
@@ -327,6 +316,10 @@ export const Outlet = React.memo(function OutletImpl() {
 
   const nextMatch = <Match matchId={childMatchId} />
 
+  const pendingElement = router.options.defaultPendingComponent ? (
+    <router.options.defaultPendingComponent />
+  ) : null
+
   if (matchId === rootRouteId) {
     return (
       <React.Suspense fallback={pendingElement}>{nextMatch}</React.Suspense>
@@ -335,7 +328,3 @@ export const Outlet = React.memo(function OutletImpl() {
 
   return nextMatch
 })
-
-function ShellInner(): React.ReactElement {
-  throw new Error('ShellBoundaryError')
-}

package/src/Matches.tsx

@@ -15,7 +15,6 @@ import type { ReactNode } from './route'
 import type {
   AnyRouter,
   DeepPartial,
-  Expand,
   MakeOptionalPathParams,
   MakeOptionalSearchParams,
   MakeRouteMatchUnion,
@@ -124,9 +123,7 @@ export function useMatchRoute<TRouter extends AnyRouter = RegisteredRouter>() {
       const TMaskTo extends string = '',
     >(
       opts: UseMatchRouteOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>,
-    ):
-      | false
-      | Expand<ResolveRoute<TRouter, TFrom, TTo>['types']['allParams']> => {
+    ): false | ResolveRoute<TRouter, TFrom, TTo>['types']['allParams'] => {
       const { pending, caseSensitive, fuzzy, includeSearch, ...rest } = opts
 
       return router.matchRoute(rest as any, {

package/src/RouterProvider.tsx

@@ -17,17 +17,15 @@ export function RouterContextProvider<
 }: RouterProps<TRouter, TDehydrated> & {
   children: React.ReactNode
 }) {
-  if (Object.keys(rest).length > 0) {
-    // Allow the router to update options on the router instance
-    router.update({
-      ...router.options,
-      ...rest,
-      context: {
-        ...router.options.context,
-        ...rest.context,
-      },
-    } as any)
-  }
+  // Allow the router to update options on the router instance
+  router.update({
+    ...router.options,
+    ...rest,
+    context: {
+      ...router.options.context,
+      ...rest.context,
+    },
+  } as any)
 
   const routerContext = getRouterContext()
 

package/src/Scripts.tsx

@@ -50,7 +50,6 @@ export const Scripts = () => {
         children,
       })),
     }),
-    structuralSharing: true as any,
   })
 
   const allScripts = [...scripts, ...assetScripts] as Array<RouterManagedTag>

package/src/ScrollRestoration.tsx

@@ -64,6 +64,6 @@ export function useElementScrollRestoration(
   }
 
   const restoreKey = getKey(router.latestLocation)
-  const byKey = scrollRestorationCache.state[restoreKey]
+  const byKey = scrollRestorationCache?.state[restoreKey]
   return byKey?.[elementSelector]
 }

package/src/fileRoute.ts

@@ -28,7 +28,6 @@ import type {
   RouteIds,
   RouteLoaderFn,
   UpdatableRouteOptions,
-  UseNavigateResult,
 } from '@tanstack/router-core'
 import type { UseLoaderDepsRoute } from './useLoaderDeps'
 import type { UseLoaderDataRoute } from './useLoaderData'
@@ -42,13 +41,8 @@ export function createFileRoute<
   TFullPath extends
     RouteConstraints['TFullPath'] = FileRoutesByPath[TFilePath]['fullPath'],
 >(
-  path?: TFilePath,
+  path: TFilePath,
 ): FileRoute<TFilePath, TParentRoute, TId, TPath, TFullPath>['createRoute'] {
-  if (typeof path === 'object') {
-    return new FileRoute<TFilePath, TParentRoute, TId, TPath, TFullPath>(path, {
-      silent: true,
-    }).createRoute(path) as any
-  }
   return new FileRoute<TFilePath, TParentRoute, TId, TPath, TFullPath>(path, {
     silent: true,
   }).createRoute
@@ -69,7 +63,7 @@ export class FileRoute<
   silent?: boolean
 
   constructor(
-    public path?: TFilePath,
+    public path: TFilePath,
     _opts?: { silent: boolean },
   ) {
     this.silent = _opts?.silent
@@ -165,18 +159,6 @@ export function FileRouteLoader<
   return (loaderFn) => loaderFn as any
 }
 
-declare module '@tanstack/router-core' {
-  export interface LazyRoute<in out TRoute extends AnyRoute> {
-    useMatch: UseMatchRoute<TRoute['id']>
-    useRouteContext: UseRouteContextRoute<TRoute['id']>
-    useSearch: UseSearchRoute<TRoute['id']>
-    useParams: UseParamsRoute<TRoute['id']>
-    useLoaderDeps: UseLoaderDepsRoute<TRoute['id']>
-    useLoaderData: UseLoaderDataRoute<TRoute['id']>
-    useNavigate: () => UseNavigateResult<TRoute['fullPath']>
-  }
-}
-
 export class LazyRoute<TRoute extends AnyRoute> {
   options: {
     id: string
@@ -232,7 +214,7 @@ export class LazyRoute<TRoute extends AnyRoute> {
     return useLoaderData({ ...opts, from: this.options.id } as any)
   }
 
-  useNavigate = (): UseNavigateResult<TRoute['fullPath']> => {
+  useNavigate = () => {
     const router = useRouter()
     return useNavigate({ from: router.routesById[this.options.id].fullPath })
   }
@@ -254,10 +236,6 @@ export function createLazyRoute<
 export function createLazyFileRoute<
   TFilePath extends keyof FileRoutesByPath,
   TRoute extends FileRoutesByPath[TFilePath]['preLoaderRoute'],
->(id: TFilePath): (opts: LazyRouteOptions) => LazyRoute<TRoute> {
-  if (typeof id === 'object') {
-    return new LazyRoute<TRoute>(id) as any
-  }
-
+>(id: TFilePath) {
   return (opts: LazyRouteOptions) => new LazyRoute<TRoute>({ id, ...opts })
 }

package/src/index.tsx

@@ -48,6 +48,7 @@ export type {
   DeferredPromiseState,
   DeferredPromise,
   ParsedLocation,
+  ParsePathParams,
   RemoveTrailingSlashes,
   RemoveLeadingSlashes,
   ActiveOptions,
@@ -56,8 +57,6 @@ export type {
   RootRouteId,
   AnyPathParams,
   ResolveParams,
-  ResolveOptionalParams,
-  ResolveRequiredParams,
   SearchSchemaInput,
   AnyContext,
   RouteContext,
@@ -79,6 +78,8 @@ export type {
   TrimPath,
   TrimPathLeft,
   TrimPathRight,
+  ParseSplatParams,
+  SplatParams,
   StringifyParamsFn,
   ParamsOptions,
   InferAllParams,
@@ -125,7 +126,6 @@ export type {
   RouteById,
   RootRouteOptions,
   SerializerExtensions,
-  CreateFileRoute,
 } from '@tanstack/router-core'
 
 export type * from './serializer'
@@ -237,7 +237,6 @@ export type {
   RouteConstraints,
   RouteMask,
   MatchRouteOptions,
-  CreateLazyFileRoute,
 } from '@tanstack/router-core'
 export type {
   UseLinkPropsOptions,

package/src/link.tsx

@@ -16,7 +16,6 @@ import {
   useLayoutEffect,
 } from './utils'
 
-import { useMatch } from './useMatch'
 import { useMatches } from './Matches'
 import type {
   AnyRouter,
@@ -106,24 +105,11 @@ export function useLinkProps<
     structuralSharing: true as any,
   })
 
-  const isRelativeFromPath = options.relative === 'path'
-
-  // when `from` is not supplied, use the nearest parent match's full path as the `from` location
-  // so relative routing works as expected. Try to stay out of rerenders as much as possible.
-  const nearestFrom = useMatch({
-    strict: false,
-    select: (match) => (isRelativeFromPath ? undefined : match.fullPath),
-  })
-
-  // When no from and relative is path, use the leaf match as the from location
-  // Avoid rerenders as much as possible.
-  const leafFrom = useMatches({
-    select: (matches) =>
-      isRelativeFromPath ? matches[matches.length - 1]!.fullPath : undefined,
+  // when `from` is not supplied, use the leaf route of the current matches as the `from` location
+  // so relative routing works as expected
+  const from = useMatches({
+    select: (matches) => options.from ?? matches[matches.length - 1]?.fullPath,
   })
-
-  const from = options.from ?? (isRelativeFromPath ? leafFrom : nearestFrom)
-
   // Use it as the default `from` location
   const _options = React.useMemo(() => ({ ...options, from }), [options, from])
 

package/src/router.ts

@@ -1,5 +1,4 @@
 import { RouterCore } from '@tanstack/router-core'
-import { createFileRoute, createLazyFileRoute } from './fileRoute'
 import type { RouterHistory } from '@tanstack/history'
 import type {
   AnyRoute,
@@ -106,11 +105,3 @@ export class Router<
     super(options)
   }
 }
-
-if (typeof globalThis !== 'undefined') {
-  ;(globalThis as any).createFileRoute = createFileRoute
-  ;(globalThis as any).createLazyFileRoute = createLazyFileRoute
-} else if (typeof window !== 'undefined') {
-  ;(window as any).createFileRoute = createFileRoute
-  ;(window as any).createFileRoute = createLazyFileRoute
-}

package/src/useBlocker.tsx

@@ -177,10 +177,7 @@ export function useBlocker(
         location: HistoryLocation,
       ): AnyShouldBlockFnLocation {
         const parsedLocation = router.parseLocation(undefined, location)
-        const matchedRoutes = router.getMatchedRoutes(
-          parsedLocation.pathname,
-          undefined,
-        )
+        const matchedRoutes = router.getMatchedRoutes(parsedLocation)
         if (matchedRoutes.foundRoute === undefined) {
           throw new Error(`No route found for location ${location.href}`)
         }

package/src/useNavigate.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react'
 import { useRouter } from './useRouter'
-import { useMatch } from './useMatch'
 import type {
   AnyRouter,
   FromPathOption,
@@ -15,32 +14,15 @@ export function useNavigate<
 >(_defaultOpts?: {
   from?: FromPathOption<TRouter, TDefaultFrom>
 }): UseNavigateResult<TDefaultFrom> {
-  const { navigate, state } = useRouter()
-
-  // Just get the index of the current match to avoid rerenders
-  // as much as possible
-  const matchIndex = useMatch({
-    strict: false,
-    select: (match) => match.index,
-  })
+  const { navigate } = useRouter()
 
   return React.useCallback(
     (options: NavigateOptions) => {
-      const isRelativeFromPath = options.relative === 'path'
-
-      const from =
-        options.from ??
-        _defaultOpts?.from ??
-        (isRelativeFromPath
-          ? state.matches[state.matches.length - 1]!.fullPath
-          : state.matches[matchIndex]!.fullPath)
-
       return navigate({
+        from: _defaultOpts?.from,
         ...options,
-        from: from,
       })
     },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [_defaultOpts?.from, navigate],
   ) as UseNavigateResult<TDefaultFrom>
 }
@@ -53,7 +35,6 @@ export function Navigate<
   const TMaskTo extends string = '',
 >(props: NavigateOptions<TRouter, TFrom, TTo, TMaskFrom, TMaskTo>): null {
   const router = useRouter()
-  const navigate = useNavigate()
 
   const previousPropsRef = React.useRef<NavigateOptions<
     TRouter,
@@ -64,9 +45,11 @@ export function Navigate<
   > | null>(null)
   React.useEffect(() => {
     if (previousPropsRef.current !== props) {
-      navigate(props)
+      router.navigate({
+        ...props,
+      })
       previousPropsRef.current = props
     }
-  }, [router, props, navigate])
+  }, [router, props])
   return null
 }