@tanstack/react-router 0.0.1-beta.270 → 0.0.1-beta.272

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tanstack/react-router",
   "author": "Tanner Linsley",
-  "version": "0.0.1-beta.270",
+  "version": "0.0.1-beta.272",
   "license": "MIT",
   "repository": "tanstack/router",
   "homepage": "https://tanstack.com/router",
@@ -44,7 +44,7 @@
     "@tanstack/store": "^0.1.3",
     "tiny-invariant": "^1.3.1",
     "tiny-warning": "^1.0.3",
-    "@tanstack/history": "0.0.1-beta.270"
+    "@tanstack/history": "0.0.1-beta.272"
   },
   "scripts": {
     "build": "rollup --config rollup.config.js"

package/src/RouterProvider.tsx

@@ -74,18 +74,26 @@ export function RouterProvider<
     },
   } as any)
 
-  const inner = (
-    <routerContext.Provider value={router}>
+  const matches = router.options.InnerWrap ? (
+    <router.options.InnerWrap>
       <Matches />
+    </router.options.InnerWrap>
+  ) : (
+    <Matches />
+  )
+
+  const provider = (
+    <routerContext.Provider value={router}>
+      {matches}
       <Transitioner />
     </routerContext.Provider>
   )
 
   if (router.options.Wrap) {
-    return <router.options.Wrap>{inner}</router.options.Wrap>
+    return <router.options.Wrap>{provider}</router.options.Wrap>
   }
 
-  return inner
+  return provider
 }
 
 function Transitioner() {

package/src/lazyRouteComponent.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { RouteComponent } from './route'
+import { AsyncRouteComponent } from './route'
 
 export function lazyRouteComponent<
   T extends Record<string, any>,
@@ -7,7 +7,9 @@ export function lazyRouteComponent<
 >(
   importer: () => Promise<T>,
   exportName?: TKey,
-): T[TKey] extends (props: any) => any ? RouteComponent : never {
+): T[TKey] extends (props: infer TProps) => any
+  ? AsyncRouteComponent<TProps>
+  : never {
   let loadPromise: Promise<any>
 
   const load = () => {

package/src/route.ts

@@ -184,7 +184,7 @@ export type UpdatableRouteOptions<
   wrapInSuspense?: boolean
   // The content to be rendered when the route is matched. If no component is provided, defaults to `<Outlet />`
   component?: RouteComponent
-  errorComponent?: false | null | RouteComponent
+  errorComponent?: false | null | ErrorRouteComponent
   pendingComponent?: RouteComponent
   pendingMs?: number
   pendingMinMs?: number
@@ -773,11 +773,7 @@ export function createRouteMask<
   return opts as any
 }
 
-export type ErrorRouteProps<
-  TFullSearchSchema extends Record<string, any> = AnySearchSchema,
-  TAllParams extends AnyPathParams = AnyPathParams,
-  TAllContext extends Record<string, any> = AnyContext,
-> = {
+export type ErrorRouteProps = {
   error: unknown
   info: { componentStack: string }
 }
@@ -785,14 +781,19 @@ export type ErrorRouteProps<
 
 export type ReactNode = any
 
-export type SyncRouteComponent =
-  | (() => JSX.Element)
-  | React.LazyExoticComponent<() => JSX.Element>
+export type SyncRouteComponent<TProps> =
+  | ((props: TProps) => ReactNode)
+  | React.LazyExoticComponent<(props: TProps) => ReactNode>
 
-export type RouteComponent = SyncRouteComponent & {
+export type AsyncRouteComponent<TProps> = SyncRouteComponent<TProps> & {
   preload?: () => Promise<void>
 }
 
+export type RouteComponent<TProps = any> = SyncRouteComponent<TProps> &
+  AsyncRouteComponent<TProps>
+
+export type ErrorRouteComponent = RouteComponent<ErrorRouteProps>
+
 export class NotFoundRoute<
   TParentRoute extends AnyRootRoute,
   TSearchSchema extends RouteConstraints['TSearchSchema'] = {},

package/src/router.ts

@@ -119,6 +119,7 @@ export interface RouterOptions<
   routeMasks?: RouteMask<TRouteTree>[]
   unmaskOnReload?: boolean
   Wrap?: (props: { children: any }) => JSX.Element
+  InnerWrap?: (props: { children: any }) => JSX.Element
   notFoundRoute?: AnyRoute
 }