@tanstack/react-router 1.20.0 → 1.20.3-alpha.1

package/src/awaited.tsx

@@ -1,98 +1,26 @@
 import * as React from 'react'
-import { useRouter } from './useRouter'
-import { defaultSerializeError } from './router'
-import { DeferredPromise, isDehydratedDeferred } from './defer'
-import { defaultDeserializeError, isServerSideError } from './Matches'
 
-import warning from 'tiny-warning'
+import { TSR_DEFERRED_PROMISE, defer } from '@tanstack/router-core'
+import type { DeferredPromise } from '@tanstack/router-core'
 
 export type AwaitOptions<T> = {
-  promise: DeferredPromise<T>
+  promise: Promise<T>
 }
 
-export function useAwaited<T>({ promise }: AwaitOptions<T>): [T] {
-  const router = useRouter()
-  // const rerender = React.useReducer((x) => x + 1, 0)[1]
+export function useAwaited<T>({
+  promise: _promise,
+}: AwaitOptions<T>): [T, DeferredPromise<T>] {
+  const promise = defer(_promise)
 
-  const state = promise.__deferredState
-
-  // Dehydrated promises only
-  // Successful or errored deferred promises mean they
-  // were resolved on the server and no further action is needed
-  if (isDehydratedDeferred(promise) && state.status === 'pending') {
-    const streamedData = (window as any)[`__TSR__DEFERRED__${state.uid}`]
-
-    if (streamedData) {
-      Object.assign(state, router.options.transformer.parse(streamedData))
-    } else {
-      let token = router.registeredDeferredsIds.get(state.uid)
-
-      // If we haven't yet, create a promise and resolver that our streamed HTML can use
-      // when the client-side data is streamed in and ready.
-      if (!token) {
-        token = {}
-        router.registeredDeferredsIds.set(state.uid, token)
-        router.registeredDeferreds.set(token, state)
-
-        Object.assign(state, {
-          resolve: () => {
-            state.__resolvePromise?.()
-            // rerender()
-          },
-          promise: new Promise((r) => {
-            state.__resolvePromise = r as any
-          }),
-          __resolvePromise: () => {},
-        })
-      }
-    }
+  if (promise[TSR_DEFERRED_PROMISE].status === 'pending') {
+    throw promise
   }
 
-  // If the promise is pending, always throw the state.promise
-  // For originating promises, this will be the original promise
-  // For dehydrated promises, this will be the placeholder promise
-  // that will be resolved when the server sends the real data
-  if (state.status === 'pending') {
-    throw isDehydratedDeferred(promise) ? state.promise : promise
+  if (promise[TSR_DEFERRED_PROMISE].status === 'error') {
+    throw promise[TSR_DEFERRED_PROMISE].error
   }
 
-  // If we are the originator of the promise,
-  // inject the state into the HTML stream
-  if (!isDehydratedDeferred(promise)) {
-    router.injectHtml(`<script class='tsr_deferred_data'>window.__TSR__DEFERRED__${state.uid} = ${JSON.stringify(router.options.transformer.stringify(state))}</script>
-<script class='tsr_deferred_handler'>
-  if (window.__TSR__ROUTER__) {
-    let deferred = window.__TSR__ROUTER__.getDeferred('${state.uid}')
-    if (deferred) deferred.resolve(window.__TSR__DEFERRED__${state.uid})
-  }
-  document.querySelectorAll('.tsr_deferred_handler').forEach((el) => el.parentElement.removeChild(el))
-</script>`)
-  }
-
-  if (state.status === 'error') {
-    if (typeof document !== 'undefined') {
-      if (isServerSideError(state.error)) {
-        throw (
-          router.options.errorSerializer?.deserialize ?? defaultDeserializeError
-        )(state.error.data as any)
-      } else {
-        warning(
-          false,
-          "Encountered a server-side error that doesn't fit the expected shape",
-        )
-        throw state.error
-      }
-    } else {
-      throw {
-        data: (
-          router.options.errorSerializer?.serialize ?? defaultSerializeError
-        )(state.error),
-        __isServerError: true,
-      }
-    }
-  }
-
-  return [promise.__deferredState.data as any]
+  return [promise[TSR_DEFERRED_PROMISE].data, promise]
 }
 
 export function Await<T>(
@@ -113,7 +41,8 @@ function AwaitInner<T>(
     fallback?: React.ReactNode
     children: (result: T) => React.ReactNode
   },
-) {
-  const awaited = useAwaited(props)
-  return props.children(...awaited)
+): React.JSX.Element {
+  const [data] = useAwaited(props)
+
+  return props.children(data) as React.JSX.Element
 }

package/src/fileRoute.ts

@@ -1,123 +1,54 @@
-import { NoInfer } from '@tanstack/react-store'
-import { ParsePathParams } from './link'
-import {
-  AnyRoute,
-  ResolveFullPath,
-  ResolveFullSearchSchema,
-  MergeFromFromParent,
-  RouteContext,
+import warning from 'tiny-warning'
+import { createRoute } from './route'
+
+import { useMatch } from './useMatch'
+import { useLoaderDeps } from './useLoaderDeps'
+import { useLoaderData } from './useLoaderData'
+import { useSearch } from './useSearch'
+import { useParams } from './useParams'
+import { useNavigate } from './useNavigate'
+import { useRouter } from './useRouter'
+import type { UseParamsRoute } from './useParams'
+import type { UseMatchRoute } from './useMatch'
+import type { UseSearchRoute } from './useSearch'
+import type {
   AnyContext,
-  RouteOptions,
-  UpdatableRouteOptions,
+  AnyRoute,
+  AnyRouter,
+  Constrain,
+  ConstrainLiteral,
+  FileBaseRouteOptions,
+  FileRoutesByPath,
+  LazyRouteOptions,
+  RegisteredRouter,
+  ResolveParams,
   Route,
-  createRoute,
-  RootRouteId,
-  TrimPathLeft,
+  RouteById,
   RouteConstraints,
-  ResolveFullSearchSchemaInput,
-  SearchSchemaInput,
+  RouteIds,
   RouteLoaderFn,
-  AnyPathParams,
-  AnySearchSchema,
-  FileBaseRouteOptions,
-} from './route'
-import { Assign, Expand, IsAny } from './utils'
-import { useMatch, useLoaderDeps, useLoaderData, RouteMatch } from './Matches'
-import { useSearch } from './useSearch'
-import { useParams } from './useParams'
-import warning from 'tiny-warning'
-import { RegisteredRouter } from './router'
-import { RouteById, RouteIds } from './routeInfo'
-
-export interface FileRoutesByPath {
-  // '/': {
-  //   parentRoute: typeof rootRoute
-  // }
-}
-
-type Replace<
-  S extends string,
-  From extends string,
-  To extends string,
-> = S extends `${infer Start}${From}${infer Rest}`
-  ? `${Start}${To}${Replace<Rest, From, To>}`
-  : S
-
-export type TrimLeft<
-  T extends string,
-  S extends string,
-> = T extends `${S}${infer U}` ? U : T
-
-export type TrimRight<
-  T extends string,
-  S extends string,
-> = T extends `${infer U}${S}` ? U : T
-
-export type Trim<T extends string, S extends string> = TrimLeft<
-  TrimRight<T, S>,
-  S
->
-
-export type RemoveUnderScores<T extends string> = Replace<
-  Replace<TrimRight<TrimLeft<T, '/_'>, '_'>, '_/', '/'>,
-  '/_',
-  '/'
->
-
-type RemoveRouteGroups<S extends string> =
-  S extends `${infer Before}(${infer RouteGroup})${infer After}`
-    ? RemoveRouteGroups<`${Before}${After}`>
-    : S
-
-type NormalizeSlashes<S extends string> =
-  S extends `${infer Before}//${infer After}`
-    ? NormalizeSlashes<`${Before}/${After}`>
-    : S
-
-type ReplaceFirstOccurrence<
-  T extends string,
-  Search extends string,
-  Replacement extends string,
-> = T extends `${infer Prefix}${Search}${infer Suffix}`
-  ? `${Prefix}${Replacement}${Suffix}`
-  : T
-
-export type ResolveFilePath<
-  TParentRoute extends AnyRoute,
-  TFilePath extends string,
-> = TParentRoute['id'] extends RootRouteId
-  ? TrimPathLeft<TFilePath>
-  : ReplaceFirstOccurrence<
-      TrimPathLeft<TFilePath>,
-      TrimPathLeft<TParentRoute['types']['customId']>,
-      ''
-    >
-
-export type FileRoutePath<
-  TParentRoute extends AnyRoute,
-  TFilePath extends string,
-> =
-  ResolveFilePath<TParentRoute, TFilePath> extends `_${infer _}`
-    ? ''
-    : ResolveFilePath<TParentRoute, TFilePath> extends `/_${infer _}`
-      ? ''
-      : ResolveFilePath<TParentRoute, TFilePath>
+  UpdatableRouteOptions,
+  UseNavigateResult,
+} from '@tanstack/router-core'
+import type { UseLoaderDepsRoute } from './useLoaderDeps'
+import type { UseLoaderDataRoute } from './useLoaderData'
+import type { UseRouteContextRoute } from './useRouteContext'
 
 export function createFileRoute<
   TFilePath extends keyof FileRoutesByPath,
   TParentRoute extends AnyRoute = FileRoutesByPath[TFilePath]['parentRoute'],
-  TId extends RouteConstraints['TId'] = NormalizeSlashes<
-    RemoveRouteGroups<TFilePath>
-  >,
-  TPath extends RouteConstraints['TPath'] = FileRoutePath<
-    TParentRoute,
-    TFilePath
-  >,
-  TFullPath extends RouteConstraints['TFullPath'] = ResolveFullPath<
-    TParentRoute,
-    NormalizeSlashes<RemoveRouteGroups<RemoveUnderScores<TPath>>>
-  >,
->(path: TFilePath) {
+  TId extends RouteConstraints['TId'] = FileRoutesByPath[TFilePath]['id'],
+  TPath extends RouteConstraints['TPath'] = FileRoutesByPath[TFilePath]['path'],
+  TFullPath extends
+    RouteConstraints['TFullPath'] = FileRoutesByPath[TFilePath]['fullPath'],
+>(
+  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
@@ -130,110 +61,68 @@ export function createFileRoute<
 export class FileRoute<
   TFilePath extends keyof FileRoutesByPath,
   TParentRoute extends AnyRoute = FileRoutesByPath[TFilePath]['parentRoute'],
-  TId extends RouteConstraints['TId'] = TFilePath,
-  TPath extends RouteConstraints['TPath'] = FileRoutePath<
-    TParentRoute,
-    TFilePath
-  >,
-  TFullPath extends RouteConstraints['TFullPath'] = ResolveFullPath<
-    TParentRoute,
-    RemoveUnderScores<TPath>
-  >,
+  TId extends RouteConstraints['TId'] = FileRoutesByPath[TFilePath]['id'],
+  TPath extends RouteConstraints['TPath'] = FileRoutesByPath[TFilePath]['path'],
+  TFullPath extends
+    RouteConstraints['TFullPath'] = FileRoutesByPath[TFilePath]['fullPath'],
 > {
   silent?: boolean
 
   constructor(
-    public path: TFilePath,
+    public path?: TFilePath,
     _opts?: { silent: boolean },
   ) {
     this.silent = _opts?.silent
   }
 
   createRoute = <
-    TSearchSchemaInput extends RouteConstraints['TSearchSchema'] = {},
-    TSearchSchema extends RouteConstraints['TSearchSchema'] = {},
-    TSearchSchemaUsed extends Record<
-      string,
-      any
-    > = TSearchSchemaInput extends SearchSchemaInput
-      ? Omit<TSearchSchemaInput, keyof SearchSchemaInput>
-      : TSearchSchema,
-    TFullSearchSchemaInput extends
-      RouteConstraints['TFullSearchSchema'] = ResolveFullSearchSchemaInput<
-      TParentRoute,
-      TSearchSchemaUsed
-    >,
-    TFullSearchSchema extends
-      RouteConstraints['TFullSearchSchema'] = ResolveFullSearchSchema<
-      TParentRoute,
-      TSearchSchema
-    >,
-    TParams extends RouteConstraints['TParams'] = Expand<
-      Record<ParsePathParams<TPath>, string>
-    >,
-    TAllParams extends RouteConstraints['TAllParams'] = MergeFromFromParent<
-      TParentRoute['types']['allParams'],
-      TParams
-    >,
-    TRouteContextReturn extends
-      RouteConstraints['TRouteContext'] = RouteContext,
-    TRouteContext extends RouteConstraints['TRouteContext'] = [
-      TRouteContextReturn,
-    ] extends [never]
-      ? RouteContext
-      : TRouteContextReturn,
-    TAllContext extends Expand<
-      Assign<IsAny<TParentRoute['types']['allContext'], {}>, TRouteContext>
-    > = Expand<
-      Assign<IsAny<TParentRoute['types']['allContext'], {}>, TRouteContext>
-    >,
-    TRouterContext extends RouteConstraints['TRouterContext'] = AnyContext,
+    TSearchValidator = undefined,
+    TParams = ResolveParams<TPath>,
+    TRouteContextFn = AnyContext,
+    TBeforeLoadFn = AnyContext,
     TLoaderDeps extends Record<string, any> = {},
-    TLoaderDataReturn extends any = unknown,
-    TLoaderData extends any = [TLoaderDataReturn] extends [never]
-      ? undefined
-      : TLoaderDataReturn,
-    TChildren extends RouteConstraints['TChildren'] = unknown,
-    TRouteTree extends RouteConstraints['TRouteTree'] = AnyRoute,
+    TLoaderFn = undefined,
+    TChildren = unknown,
   >(
     options?: FileBaseRouteOptions<
       TParentRoute,
+      TId,
       TPath,
-      TSearchSchemaInput,
-      TSearchSchema,
-      TFullSearchSchema,
+      TSearchValidator,
       TParams,
-      TAllParams,
-      TRouteContextReturn,
-      TRouteContext,
-      TRouterContext,
-      TAllContext,
       TLoaderDeps,
-      TLoaderDataReturn
+      TLoaderFn,
+      AnyContext,
+      TRouteContextFn,
+      TBeforeLoadFn
     > &
-      UpdatableRouteOptions<TAllParams, TFullSearchSchema, TLoaderData>,
+      UpdatableRouteOptions<
+        TParentRoute,
+        TId,
+        TFullPath,
+        TParams,
+        TSearchValidator,
+        TLoaderFn,
+        TLoaderDeps,
+        AnyContext,
+        TRouteContextFn,
+        TBeforeLoadFn
+      >,
   ): Route<
     TParentRoute,
     TPath,
     TFullPath,
     TFilePath,
     TId,
-    TSearchSchemaInput,
-    TSearchSchema,
-    TSearchSchemaUsed,
-    TFullSearchSchemaInput,
-    TFullSearchSchema,
+    TSearchValidator,
     TParams,
-    TAllParams,
-    TRouteContextReturn,
-    TRouteContext,
-    TAllContext,
-    TRouterContext,
+    AnyContext,
+    TRouteContextFn,
+    TBeforeLoadFn,
     TLoaderDeps,
-    TLoaderDataReturn,
-    TLoaderData,
+    TLoaderFn,
     TChildren,
-    TRouteTree
+    unknown
   > => {
     warning(
       this.silent,
@@ -255,32 +144,38 @@ export function FileRouteLoader<
   TRoute extends FileRoutesByPath[TFilePath]['preLoaderRoute'],
 >(
   _path: TFilePath,
-): <TLoaderData extends any>(
-  loaderFn: RouteLoaderFn<
-    TRoute['types']['allParams'],
-    TRoute['types']['loaderDeps'],
-    TRoute['types']['allContext'],
-    TRoute['types']['routeContext'],
-    TLoaderData
+): <TLoaderFn>(
+  loaderFn: Constrain<
+    TLoaderFn,
+    RouteLoaderFn<
+      TRoute['parentRoute'],
+      TRoute['types']['id'],
+      TRoute['types']['params'],
+      TRoute['types']['loaderDeps'],
+      TRoute['types']['routerContext'],
+      TRoute['types']['routeContextFn'],
+      TRoute['types']['beforeLoadFn']
+    >
   >,
-) => RouteLoaderFn<
-  TRoute['types']['allParams'],
-  TRoute['types']['loaderDeps'],
-  TRoute['types']['allContext'],
-  TRoute['types']['routeContext'],
-  NoInfer<TLoaderData>
-> {
+) => TLoaderFn {
   warning(
     false,
     `FileRouteLoader is deprecated and will be removed in the next major version. Please place the loader function in the the main route file, inside the \`createFileRoute('/path/to/file')(options)\` options`,
   )
-  return (loaderFn) => loaderFn
+  return (loaderFn) => loaderFn as any
 }
 
-export type LazyRouteOptions = Pick<
-  UpdatableRouteOptions<AnyPathParams, AnySearchSchema, any>,
-  'component' | 'errorComponent' | 'pendingComponent' | 'notFoundComponent'
->
+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: {
@@ -296,71 +191,73 @@ export class LazyRoute<TRoute extends AnyRoute> {
     ;(this as any).$$typeof = Symbol.for('react.memo')
   }
 
-  useMatch = <
-    TRouteMatchState = RouteMatch<
-      TRoute['types']['routeTree'],
-      TRoute['types']['id']
-    >,
-    TSelected = TRouteMatchState,
-  >(opts?: {
-    select?: (match: TRouteMatchState) => TSelected
-  }): TSelected => {
-    return useMatch({ select: opts?.select, from: this.options.id })
+  useMatch: UseMatchRoute<TRoute['id']> = (opts) => {
+    return useMatch({
+      select: opts?.select,
+      from: this.options.id,
+      structuralSharing: opts?.structuralSharing,
+    } as any) as any
   }
 
-  useRouteContext = <TSelected = TRoute['types']['allContext']>(opts?: {
-    select?: (s: TRoute['types']['allContext']) => TSelected
-  }): TSelected => {
+  useRouteContext: UseRouteContextRoute<TRoute['id']> = (opts) => {
     return useMatch({
       from: this.options.id,
       select: (d: any) => (opts?.select ? opts.select(d.context) : d.context),
-    })
+    }) as any
   }
 
-  useSearch = <TSelected = TRoute['types']['fullSearchSchema']>(opts?: {
-    select?: (s: TRoute['types']['fullSearchSchema']) => TSelected
-  }): TSelected => {
-    return useSearch({ ...opts, from: this.options.id })
+  useSearch: UseSearchRoute<TRoute['id']> = (opts) => {
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
+    return useSearch({
+      select: opts?.select,
+      structuralSharing: opts?.structuralSharing,
+      from: this.options.id,
+    } as any) as any
   }
 
-  useParams = <TSelected = TRoute['types']['allParams']>(opts?: {
-    select?: (s: TRoute['types']['allParams']) => TSelected
-  }): TSelected => {
-    return useParams({ ...opts, from: this.options.id })
+  useParams: UseParamsRoute<TRoute['id']> = (opts) => {
+    // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
+    return useParams({
+      select: opts?.select,
+      structuralSharing: opts?.structuralSharing,
+      from: this.options.id,
+    } as any) as any
   }
 
-  useLoaderDeps = <TSelected = TRoute['types']['loaderDeps']>(opts?: {
-    select?: (s: TRoute['types']['loaderDeps']) => TSelected
-  }): TSelected => {
+  useLoaderDeps: UseLoaderDepsRoute<TRoute['id']> = (opts) => {
     return useLoaderDeps({ ...opts, from: this.options.id } as any)
   }
 
-  useLoaderData = <TSelected = TRoute['types']['loaderData']>(opts?: {
-    select?: (s: TRoute['types']['loaderData']) => TSelected
-  }): TSelected => {
+  useLoaderData: UseLoaderDataRoute<TRoute['id']> = (opts) => {
     return useLoaderData({ ...opts, from: this.options.id } as any)
   }
+
+  useNavigate = (): UseNavigateResult<TRoute['fullPath']> => {
+    const router = useRouter()
+    return useNavigate({ from: router.routesById[this.options.id].fullPath })
+  }
 }
 
 export function createLazyRoute<
-  TId extends RouteIds<RegisteredRouter['routeTree']>,
-  TRoute extends AnyRoute = RouteById<RegisteredRouter['routeTree'], TId>,
->(id: TId) {
+  TRouter extends AnyRouter = RegisteredRouter,
+  TId extends string = string,
+  TRoute extends AnyRoute = RouteById<TRouter['routeTree'], TId>,
+>(id: ConstrainLiteral<TId, RouteIds<TRouter['routeTree']>>) {
   return (opts: LazyRouteOptions) => {
-    return new LazyRoute<TRoute>({ id: id as any, ...opts })
+    return new LazyRoute<TRoute>({
+      id: id,
+      ...opts,
+    })
   }
 }
 
 export function createLazyFileRoute<
   TFilePath extends keyof FileRoutesByPath,
   TRoute extends FileRoutesByPath[TFilePath]['preLoaderRoute'],
->(path: TFilePath) {
-  const id = removeGroups(path)
-  return (opts: LazyRouteOptions) => new LazyRoute<TRoute>({ id, ...opts })
-}
-
-const routeGroupPatternRegex = /\(.+\)/g
+>(id: TFilePath): (opts: LazyRouteOptions) => LazyRoute<TRoute> {
+  if (typeof id === 'object') {
+    return new LazyRoute<TRoute>(id) as any
+  }
 
-function removeGroups(s: string) {
-  return s.replaceAll(routeGroupPatternRegex, '').replaceAll('//', '/')
+  return (opts: LazyRouteOptions) => new LazyRoute<TRoute>({ id, ...opts })
 }

package/src/history.ts

@@ -1,8 +1,9 @@
-import { HistoryLocation } from '@tanstack/history'
+import type { HistoryLocation } from '@tanstack/history'
 
 declare module '@tanstack/history' {
   interface HistoryState {
     __tempLocation?: HistoryLocation
     __tempKey?: string
+    __hashScrollIntoViewOptions?: boolean | ScrollIntoViewOptions
   }
 }