@tanstack/router-core 0.0.1-beta.159 → 0.0.1-beta.160

package/build/types/index.d.ts

@@ -151,7 +151,7 @@ type HydrationCtx = {
     router: DehydratedRouter;
     payload: Record<string, any>;
 };
-interface RouteMatch<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TRoute extends AnyRoute = Route> {
+interface RouteMatch<TRouteTree extends AnyRoute = AnyRoute, TRoute extends AnyRoute = AnyRoute> {
     id: string;
     key?: string;
     routeId: string;
@@ -210,7 +210,7 @@ interface RouterOptions<TRouteTree extends AnyRoute, TDehydrated extends Record<
     dehydrate?: () => TDehydrated;
     hydrate?: (dehydrated: TDehydrated) => void;
 }
-interface RouterState<TRouteTree extends AnyRoute = RegisteredRouter['routeTree']> {
+interface RouterState<TRouteTree extends AnyRoute = AnyRoute> {
     status: 'idle' | 'pending';
     isFetching: boolean;
     matchesById: Record<string, RouteMatch<TRouteTree, AnyRoute>>;
@@ -254,7 +254,7 @@ interface DehydratedRouter {
 }
 type RouterConstructorOptions<TRouteTree extends AnyRoute, TDehydrated extends Record<string, any>> = Omit<RouterOptions<TRouteTree, TDehydrated>, 'context'> & RouterContextOptions<TRouteTree>;
 declare const componentTypes: readonly ["component", "errorComponent", "pendingComponent"];
-declare class Router<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TDehydrated extends Record<string, any> = Record<string, any>> {
+declare class Router<TRouteTree extends AnyRoute = AnyRoute, TDehydrated extends Record<string, any> = Record<string, any>> {
     #private;
     types: {
         RootRoute: TRouteTree;
@@ -375,7 +375,7 @@ type AnyRouteProps = RouteProps<any, any, any, any, any>;
 type ComponentPropsFromRoute<TRoute> = TRoute extends Route<infer TParentRoute, infer TPath, infer TFullPath, infer TCustomId, infer TId, infer TLoader, infer TSearchSchema, infer TFullSearchSchema, infer TParams, infer TAllParams, infer TParentContext, infer TAllParentContext, infer TRouteContext, infer TContext, infer TRouterContext, infer TChildren, infer TRouteTree> ? RouteProps<TLoader, TFullSearchSchema, TAllParams, TRouteContext, TContext> : never;
 type ComponentFromRoute<TRoute> = RegisteredRouteComponent<ComponentPropsFromRoute<TRoute>>;
 type RouteLoaderFromRoute<TRoute extends AnyRoute> = LoaderFn<TRoute['__types']['loader'], TRoute['__types']['searchSchema'], TRoute['__types']['fullSearchSchema'], TRoute['__types']['allParams'], TRoute['__types']['routeContext'], TRoute['__types']['context']>;
-type RouteProps<TLoader = unknown, TFullSearchSchema extends AnySearchSchema = AnySearchSchema, TAllParams extends AnyPathParams = AnyPathParams, TRouteContext extends AnyContext = AnyContext, TContext extends AnyContext = AnyContext> = {
+type RouteProps<TLoader extends any = unknown, TFullSearchSchema extends AnySearchSchema = AnySearchSchema, TAllParams extends AnyPathParams = AnyPathParams, TRouteContext extends AnyContext = AnyContext, TContext extends AnyContext = AnyContext> = {
     useMatch: () => RouteMatch<any, any>;
     useLoader: () => UseLoaderResult<TLoader>;
     useSearch: <TStrict extends boolean = true, TSearch = TFullSearchSchema, TSelected = TSearch>(opts?: {
@@ -394,12 +394,14 @@ type RouteProps<TLoader = unknown, TFullSearchSchema extends AnySearchSchema = A
 };
 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>;
 type ParamsFallback<TPath extends string, TParams> = unknown extends TParams ? Record<ParsePathParams<TPath>, string> : TParams;
-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 = unknown, TAllParams = ParamsFallback<TPath, TParams>, TParentContext extends AnyContext = AnyContext, TAllParentContext extends AnyContext = AnyContext, TRouteContext extends RouteContext = RouteContext, TAllContext extends AnyContext = AnyContext> = RoutePathOptions<TCustomId, TPath> & {
+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, TParentSearchSchema>;
+    validateSearch?: SearchSchemaValidator<TSearchSchema>;
     loader?: LoaderFn<TLoader, TSearchSchema, TFullSearchSchema, TAllParams, NoInfer<TRouteContext>, TAllContext>;
-} & ({
+} & ([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';
     stringifyParams?: (params: NoInfer<ParamsFallback<TPath, TParams>>) => Record<ParsePathParams<TPath>, string>;
 } | {
@@ -457,14 +459,11 @@ type ParseParamsFn<TPath extends string, TParams> = (rawParams: IsAny<TPath, any
 type ParseParamsObj<TPath extends string, TParams> = {
     parse?: ParseParamsFn<TPath, TParams>;
 };
-type SearchSchemaValidator<TReturn, TParentSchema> = SearchSchemaValidatorObj<TReturn, TParentSchema> | SearchSchemaValidatorFn<TReturn, TParentSchema>;
-type SearchSchemaValidatorObj<TReturn, TParentSchema> = {
-    parse?: SearchSchemaValidatorFn<TReturn, TParentSchema>;
+type SearchSchemaValidator<TReturn> = SearchSchemaValidatorObj<TReturn> | SearchSchemaValidatorFn<TReturn>;
+type SearchSchemaValidatorObj<TReturn> = {
+    parse?: SearchSchemaValidatorFn<TReturn>;
 };
-type SearchSchemaValidatorFn<TReturn, TParentSchema> = (searchObj: Record<string, unknown>) => {} extends TParentSchema ? TReturn : keyof TReturn extends keyof TParentSchema ? {
-    error: 'Top level search params cannot be redefined by child routes!';
-    keys: keyof TReturn & keyof TParentSchema;
-} : TReturn;
+type SearchSchemaValidatorFn<TReturn> = (searchObj: Record<string, unknown>) => TReturn;
 type DefinedPathParamWarning = 'Path params cannot be redefined by child routes!';
 type ParentParams<TParentParams> = AnyPathParams extends TParentParams ? {} : {
     [Key in keyof TParentParams]?: DefinedPathParamWarning;

package/build/umd/index.development.js

@@ -578,8 +578,6 @@
 
     const rootRouteId = '__root__';
 
-    // | ParseParamsObj<TPath, TParams>
-
     // The parse type here allows a zod schema to be passed directly to the validator
 
     class Route {
@@ -812,25 +810,27 @@
         this.__store = new Store(getInitialRouterState(), {
           onUpdate: () => {
             const prev = this.state;
-            this.state = this.__store.state;
-            const matchesByIdChanged = prev.matchesById !== this.state.matchesById;
+            const next = this.__store.state;
+            console.log(Object.values(next.matchesById).find(d => d.status === 'error'));
+            const matchesByIdChanged = prev.matchesById !== next.matchesById;
             let matchesChanged;
             let pendingMatchesChanged;
             if (!matchesByIdChanged) {
-              matchesChanged = prev.matchIds.length !== this.state.matchIds.length || prev.matchIds.some((d, i) => d !== this.state.matchIds[i]);
-              pendingMatchesChanged = prev.pendingMatchIds.length !== this.state.pendingMatchIds.length || prev.pendingMatchIds.some((d, i) => d !== this.state.pendingMatchIds[i]);
+              matchesChanged = prev.matchIds.length !== next.matchIds.length || prev.matchIds.some((d, i) => d !== next.matchIds[i]);
+              pendingMatchesChanged = prev.pendingMatchIds.length !== next.pendingMatchIds.length || prev.pendingMatchIds.some((d, i) => d !== next.pendingMatchIds[i]);
             }
             if (matchesByIdChanged || matchesChanged) {
-              this.state.matches = this.state.matchIds.map(id => {
-                return this.state.matchesById[id];
+              next.matches = next.matchIds.map(id => {
+                return next.matchesById[id];
               });
             }
             if (matchesByIdChanged || pendingMatchesChanged) {
-              this.state.pendingMatches = this.state.pendingMatchIds.map(id => {
-                return this.state.matchesById[id];
+              next.pendingMatches = next.pendingMatchIds.map(id => {
+                return next.matchesById[id];
               });
             }
-            this.state.isFetching = [...this.state.matches, ...this.state.pendingMatches].some(d => d.isFetching);
+            next.isFetching = [...next.matches, ...next.pendingMatches].some(d => d.isFetching);
+            this.state = next;
           },
           defaultPriority: 'low'
         });
@@ -911,11 +911,12 @@
       cancelMatch = id => {
         this.getRouteMatch(id)?.abortController?.abort();
       };
-      safeLoad = opts => {
-        return this.load(opts).catch(err => {
-          // console.warn(err)
-          // invariant(false, 'Encountered an error during router.load()! ☝️.')
-        });
+      safeLoad = async opts => {
+        try {
+          return this.load(opts);
+        } catch (err) {
+          // Don't do anything
+        }
       };
       latestLoadPromise = Promise.resolve();
       load = async opts => {
@@ -952,11 +953,16 @@
           });
           try {
             // Load the matches
-            await this.loadMatches(pendingMatches);
+            try {
+              await this.loadMatches(pendingMatches);
+            } catch (err) {
+              // swallow this error, since we'll display the
+              // errors on the route components
+            }
 
             // Only apply the latest transition
             if (latestPromise = checkLatest()) {
-              return await latestPromise;
+              return latestPromise;
             }
             const prevLocation = this.state.resolvedLocation;
             this.__store.setState(s => ({
@@ -973,7 +979,7 @@
           } catch (err) {
             // Only apply the latest transition
             if (latestPromise = checkLatest()) {
-              return await latestPromise;
+              return latestPromise;
             }
             reject(err);
           }
@@ -1232,6 +1238,7 @@
                   throw errorHandlerErr;
                 }
               }
+              console.log('set error');
               this.setRouteMatch(match.id, s => ({
                 ...s,
                 error: err,
@@ -1284,19 +1291,8 @@
               const latest = this.getRouteMatch(match.id);
               return latest && latest.fetchedAt !== fetchedAt ? latest.loadPromise : undefined;
             };
-            const loadPromise = (async () => {
+            const load = async () => {
               let latestPromise;
-              const componentsPromise = Promise.all(componentTypes.map(async type => {
-                const component = route.options[type];
-                if (component?.preload) {
-                  await component.preload();
-                }
-              }));
-              const loaderPromise = route.options.loader?.({
-                ...match,
-                preload: !!opts?.preload,
-                parentMatchPromise
-              });
               const handleError = err => {
                 if (isRedirect(err)) {
                   if (!opts?.preload) {
@@ -1307,33 +1303,46 @@
                 return false;
               };
               try {
+                const componentsPromise = Promise.all(componentTypes.map(async type => {
+                  const component = route.options[type];
+                  if (component?.preload) {
+                    await component.preload();
+                  }
+                }));
+                const loaderPromise = route.options.loader?.({
+                  ...match,
+                  preload: !!opts?.preload,
+                  parentMatchPromise
+                });
                 const [_, loader] = await Promise.all([componentsPromise, loaderPromise]);
                 if (latestPromise = checkLatest()) return await latestPromise;
                 this.setRouteMatchData(match.id, () => loader, opts);
-              } catch (err) {
+              } catch (loaderError) {
                 if (latestPromise = checkLatest()) return await latestPromise;
-                if (handleError(err)) {
-                  return;
-                }
-                const errorHandler = route.options.onLoadError ?? route.options.onError;
-                let caughtError = err;
+                handleError(loaderError);
+                let error = loaderError;
                 try {
-                  errorHandler?.(err);
-                } catch (errorHandlerErr) {
-                  caughtError = errorHandlerErr;
-                  if (handleError(errorHandlerErr)) {
-                    return;
+                  if (route.options.onLoadError) {
+                    route.options.onLoadError?.(loaderError);
+                  } else {
+                    route.options.onError?.(loaderError);
                   }
+                } catch (errorHandlerErr) {
+                  error = errorHandlerErr;
+                  handleError(error);
                 }
+                console.log('set error');
                 this.setRouteMatch(match.id, s => ({
                   ...s,
-                  error: caughtError,
+                  error: error,
                   status: 'error',
                   isFetching: false,
                   updatedAt: Date.now()
                 }));
+                console.log(this.getRouteMatch(match.id)?.status);
               }
-            })();
+            };
+            const loadPromise = load();
             this.setRouteMatch(match.id, s => ({
               ...s,
               status: s.status !== 'success' ? 'pending' : s.status,
@@ -1757,13 +1766,18 @@
         return this.state.matchesById[id];
       };
       setRouteMatch = (id, updater) => {
-        this.__store.setState(prev => ({
-          ...prev,
-          matchesById: {
-            ...prev.matchesById,
-            [id]: updater(prev.matchesById[id])
+        this.__store.setState(prev => {
+          if (!prev.matchesById[id]) {
+            console.warn(`No match found with id: ${id}`);
           }
-        }));
+          return {
+            ...prev,
+            matchesById: {
+              ...prev.matchesById,
+              [id]: updater(prev.matchesById[id])
+            }
+          };
+        });
       };
       setRouteMatchData = (id, updater, opts) => {
         const match = this.getRouteMatch(id);
@@ -1772,6 +1786,7 @@
         const updatedAt = opts?.updatedAt ?? Date.now();
         const preloadInvalidAt = updatedAt + (opts?.maxAge ?? route.options.preloadMaxAge ?? this.options.defaultPreloadMaxAge ?? 5000);
         const invalidAt = updatedAt + (opts?.maxAge ?? route.options.maxAge ?? this.options.defaultMaxAge ?? Infinity);
+        console.log('set success');
         this.setRouteMatch(id, s => ({
           ...s,
           error: undefined,