@tanstack/router-core 0.0.1-beta.177 → 0.0.1-beta.179

package/build/types/route.d.ts

@@ -58,11 +58,14 @@ export type AnyRouteProps = RegisteredRouteProps<any, any, any, any, any>;
 export type RouteOptions<TParentRoute extends AnyRoute = AnyRoute, TCustomId extends string = string, TPath extends string = string, TLoader = unknown, TParentSearchSchema extends AnySearchSchema = {}, TSearchSchema extends AnySearchSchema = {}, TFullSearchSchema extends AnySearchSchema = TSearchSchema, TParams extends AnyPathParams = AnyPathParams, TAllParams extends AnyPathParams = TParams, TParentContext extends AnyContext = AnyContext, TAllParentContext extends AnyContext = AnyContext, TRouteContext extends RouteContext = RouteContext, TAllContext extends AnyContext = AnyContext> = BaseRouteOptions<TParentRoute, TCustomId, TPath, TLoader, TParentSearchSchema, TSearchSchema, TFullSearchSchema, TParams, TAllParams, TParentContext, TAllParentContext, TRouteContext, TAllContext> & UpdatableRouteOptions<TLoader, TSearchSchema, TFullSearchSchema, TAllParams, TRouteContext, TAllContext>;
 export type ParamsFallback<TPath extends string, TParams> = unknown extends TParams ? Record<ParsePathParams<TPath>, string> : TParams;
 export type BaseRouteOptions<TParentRoute extends AnyRoute = AnyRoute, TCustomId extends string = string, TPath extends string = string, TLoader = unknown, TParentSearchSchema extends AnySearchSchema = {}, TSearchSchema extends AnySearchSchema = {}, TFullSearchSchema extends AnySearchSchema = TSearchSchema, TParams extends AnyPathParams = {}, TAllParams = ParamsFallback<TPath, TParams>, TParentContext extends AnyContext = AnyContext, TAllParentContext extends AnyContext = AnyContext, TRouteContext extends RouteContext = RouteContext, TAllContext extends AnyContext = AnyContext> = RoutePathOptions<TCustomId, TPath> & {
-    layoutLimit?: string;
     getParentRoute: () => TParentRoute;
     validateSearch?: SearchSchemaValidator<TSearchSchema>;
     loader?: LoaderFn<TLoader, TSearchSchema, TFullSearchSchema, TAllParams, NoInfer<TRouteContext>, TAllContext>;
-} & ([TLoader] extends [never] ? {
+} & (keyof PickRequired<RouteContext> extends never ? {
+    beforeLoad?: BeforeLoadFn<TParentRoute, TAllParams, TSearchSchema, TFullSearchSchema, TParentContext, TAllParentContext, TRouteContext>;
+} : {
+    beforeLoad: BeforeLoadFn<TParentRoute, TAllParams, TSearchSchema, TFullSearchSchema, TParentContext, TAllParentContext, TRouteContext>;
+}) & ([TLoader] extends [never] ? {
     loader: 'Loaders must return a type other than never. If you are throwing a redirect() and not returning anything, return a redirect() instead.';
 } : {}) & ({
     parseParams?: (rawParams: IsAny<TPath, any, Record<ParsePathParams<TPath>, string>>) => TParams extends Record<ParsePathParams<TPath>, any> ? TParams : 'parseParams must return an object';
@@ -70,21 +73,20 @@ export type BaseRouteOptions<TParentRoute extends AnyRoute = AnyRoute, TCustomId
 } | {
     stringifyParams?: never;
     parseParams?: never;
-}) & (keyof PickRequired<RouteContext> extends never ? {
-    getContext?: GetContextFn<TParentRoute, TAllParams, TFullSearchSchema, TParentContext, TAllParentContext, TRouteContext>;
-} : {
-    getContext: GetContextFn<TParentRoute, TAllParams, TFullSearchSchema, TParentContext, TAllParentContext, TRouteContext>;
 });
-type GetContextFn<TParentRoute, TAllParams, TFullSearchSchema, TParentContext, TAllParentContext, TRouteContext> = (opts: {
+type BeforeLoadFn<TParentRoute, TAllParams, TSearchSchema, TFullSearchSchema, TParentContext, TAllParentContext, TRouteContext> = (opts: {
     params: TAllParams;
+    routeSearch: TSearchSchema;
     search: TFullSearchSchema;
+    abortController: AbortController;
+    preload: boolean;
 } & (TParentRoute extends undefined ? {
     context?: TAllParentContext;
     parentContext?: TParentContext;
 } : {
     context: TAllParentContext;
     parentContext: TParentContext;
-})) => TRouteContext;
+})) => Promise<TRouteContext> | TRouteContext | void;
 export type UpdatableRouteOptions<TLoader, TSearchSchema extends AnySearchSchema, TFullSearchSchema extends AnySearchSchema, TAllParams extends AnyPathParams, TRouteContext extends AnyContext, TAllContext extends AnyContext> = MetaOptions & {
     key?: null | false | GetKeyFn<TFullSearchSchema, TAllParams>;
     caseSensitive?: boolean;
@@ -97,7 +99,6 @@ export type UpdatableRouteOptions<TLoader, TSearchSchema extends AnySearchSchema
     preloadMaxAge?: number;
     maxAge?: number;
     gcMaxAge?: number;
-    beforeLoad?: (opts: LoaderContext<TSearchSchema, TFullSearchSchema, TAllParams, NoInfer<TRouteContext>, TAllContext>) => Promise<void> | void;
     onError?: (err: any) => void;
     onEnter?: (match: AnyRouteMatch) => void;
     onTransition?: (match: AnyRouteMatch) => void;
@@ -199,7 +200,7 @@ export declare class Route<TParentRoute extends RouteConstraints['TParentRoute']
         routerContext: TRouterContext;
     };
     isRoot: TParentRoute extends Route<any> ? true : false;
-    options: RouteOptions<TParentRoute, TCustomId, TPath, TLoader, InferFullSearchSchema<TParentRoute>, TSearchSchema, TFullSearchSchema, TParams, TAllParams, TParentContext, TAllParentContext, TRouteContext, TAllContext> & UpdatableRouteOptions<TLoader, TSearchSchema, TFullSearchSchema, TAllParams, TRouteContext, TAllContext>;
+    options: RouteOptions<TParentRoute, TCustomId, TPath, TLoader, InferFullSearchSchema<TParentRoute>, TSearchSchema, TFullSearchSchema, TParams, TAllParams, TParentContext, TAllParentContext, TRouteContext, TAllContext>;
     parentRoute: TParentRoute;
     id: TId;
     path: TPath;

package/build/types/router.d.ts

@@ -136,6 +136,7 @@ export interface MatchRouteOptions {
     fuzzy?: boolean;
 }
 export interface DehydratedRouterState {
+    matchIds: string[];
     dehydratedMatches: DehydratedRouteMatch[];
 }
 export type DehydratedRouteMatch = Pick<RouteMatch, 'fetchedAt' | 'invalid' | 'maxAge' | 'preloadMaxAge' | 'id' | 'loaderData' | 'status' | 'updatedAt'>;
@@ -209,7 +210,7 @@ export declare class Router<TRouteTree extends AnyRoute = AnyRoute, TDehydrated
         throwOnError?: boolean;
         debug?: boolean;
     }) => RouteMatch<TRouteTree>[];
-    loadMatches: (resolvedMatches: AnyRouteMatch[], opts?: {
+    loadMatches: (_resolvedMatches: AnyRouteMatch[], opts?: {
         preload?: boolean;
         maxAge?: number;
     }) => Promise<void>;

package/build/umd/index.development.js

@@ -806,6 +806,7 @@
     const componentTypes = ['component', 'errorComponent', 'pendingComponent'];
     const visibilityChangeEvent = 'visibilitychange';
     const focusEvent = 'focus';
+    const preloadWarning = 'Error preloading route! ☝️';
     class Router {
       #unsubHistory;
       resetNextScroll = false;
@@ -1235,39 +1236,14 @@
               return parentSearchInfo;
             }
           })();
-          Object.assign(match, {
-            ...searchInfo
-          });
-          const contextInfo = (() => {
-            try {
-              const routeContext = route.options.getContext?.({
-                parentContext: parentMatch?.routeContext ?? {},
-                context: parentMatch?.context ?? this?.options.context ?? {},
-                params: match.params,
-                search: match.search
-              }) || {};
-              const context = {
-                ...(parentMatch?.context ?? this?.options.context),
-                ...routeContext
-              };
-              return {
-                context,
-                routeContext
-              };
-            } catch (err) {
-              route.options.onError?.(err);
-              throw err;
-            }
-          })();
-          Object.assign(match, {
-            ...contextInfo
-          });
+          Object.assign(match, searchInfo);
         });
         return matches;
       };
-      loadMatches = async (resolvedMatches, opts) => {
+      loadMatches = async (_resolvedMatches, opts) => {
+        const getFreshMatches = () => _resolvedMatches.map(d => this.getRouteMatch(d.id));
         if (!opts?.preload) {
-          resolvedMatches.forEach(match => {
+          getFreshMatches().forEach(match => {
             // Update each match with its latest route data
             this.setRouteMatch(match.id, s => ({
               ...s,
@@ -1287,7 +1263,8 @@
 
         // Check each match middleware to see if the route can be accessed
         try {
-          for (const [index, match] of resolvedMatches.entries()) {
+          for (const [index, match] of getFreshMatches().entries()) {
+            const parentMatch = getFreshMatches()[index - 1];
             const route = this.getRoute(match.routeId);
             const handleError = (err, code) => {
               err.routerCode = code;
@@ -1318,10 +1295,21 @@
             }
             let didError = false;
             try {
-              await route.options.beforeLoad?.({
+              const routeContext = (await route.options.beforeLoad?.({
                 ...match,
-                preload: !!opts?.preload
-              });
+                preload: !!opts?.preload,
+                parentContext: parentMatch?.routeContext ?? {},
+                context: parentMatch?.context ?? this?.options.context ?? {}
+              })) ?? {};
+              const context = {
+                ...(parentMatch?.context ?? this?.options.context),
+                ...routeContext
+              };
+              this.setRouteMatch(match.id, s => ({
+                ...s,
+                context,
+                routeContext
+              }));
             } catch (err) {
               handleError(err, 'BEFORE_LOAD');
               didError = true;
@@ -1338,7 +1326,7 @@
           }
           throw err;
         }
-        const validResolvedMatches = resolvedMatches.slice(0, firstBadMatchIndex);
+        const validResolvedMatches = getFreshMatches().slice(0, firstBadMatchIndex);
         const matchPromises = [];
         validResolvedMatches.forEach((match, index) => {
           matchPromises.push((async () => {
@@ -1547,14 +1535,14 @@
           if (preload) {
             this.preloadRoute(nextOpts).catch(err => {
               console.warn(err);
-              console.warn('Error preloading route! ☝️');
+              console.warn(preloadWarning);
             });
           }
         };
         const handleTouchStart = e => {
           this.preloadRoute(nextOpts).catch(err => {
             console.warn(err);
-            console.warn('Error preloading route! ☝️');
+            console.warn(preloadWarning);
           });
         };
         const handleEnter = e => {
@@ -1567,7 +1555,7 @@
               target.preloadTimeout = null;
               this.preloadRoute(nextOpts).catch(err => {
                 console.warn(err);
-                console.warn('Error preloading route! ☝️');
+                console.warn(preloadWarning);
               });
             }, preloadDelay);
           }
@@ -1594,6 +1582,7 @@
       dehydrate = () => {
         return {
           state: {
+            matchIds: this.state.matchIds,
             dehydratedMatches: this.state.matches.map(d => pick(d, ['fetchedAt', 'invalid', 'preloadMaxAge', 'maxAge', 'id', 'loaderData', 'status', 'updatedAt']))
           }
         };
@@ -1608,11 +1597,9 @@
         const ctx = _ctx;
         this.dehydratedData = ctx.payload;
         this.options.hydrate?.(ctx.payload);
-        const {
-          dehydratedMatches
-        } = ctx.router.state;
+        const dehydratedState = ctx.router.state;
         let matches = this.matchRoutes(this.state.location.pathname, this.state.location.search).map(match => {
-          const dehydratedMatch = dehydratedMatches.find(d => d.id === match.id);
+          const dehydratedMatch = dehydratedState.dehydratedMatches.find(d => d.id === match.id);
           invariant(dehydratedMatch, `Could not find a client-side match for dehydrated match with id: ${match.id}!`);
           if (dehydratedMatch) {
             return {
@@ -1625,6 +1612,7 @@
         this.__store.setState(s => {
           return {
             ...s,
+            matchIds: dehydratedState.matchIds,
             matches,
             matchesById: this.#mergeMatches(s.matchesById, matches)
           };
@@ -1641,10 +1629,10 @@
             const id = `__TSR_DEHYDRATED__${strKey}`;
             const data = typeof getData === 'function' ? await getData() : getData;
             return `<script id='${id}' suppressHydrationWarning>window["__TSR_DEHYDRATED__${escapeJSON(strKey)}"] = ${JSON.stringify(data)}
-        // ;(() => {
-        //   var el = document.getElementById('${id}')
-        //   el.parentElement.removeChild(el)
-        // })()
+        ;(() => {
+          var el = document.getElementById('${id}')
+          el.parentElement.removeChild(el)
+        })()
         </script>`;
           });
           return () => this.hydrateData(key);