@tanstack/router-core 0.0.1-beta.166 → 0.0.1-beta.168

package/build/esm/index.js

@@ -551,6 +551,15 @@ const rootRouteId = '__root__';
 
 // The parse type here allows a zod schema to be passed directly to the validator
 
+// T extends Record<PropertyKey, infer U>
+//   ? {
+//       [K in keyof T]: UseLoaderResultPromise<T[K]>
+//     }
+//   : UseLoaderResultPromise<T>
+
+// export type UseLoaderResultPromise<T> = T extends Promise<infer U>
+//   ? StreamedPromise<U>
+//   : T
 class Route {
   // Set up in this.init()
 
@@ -813,7 +822,7 @@ class Router {
     } = this.options;
     this.basepath = `/${trimPath(basepath ?? '') ?? ''}`;
     if (routeTree && routeTree !== this.routeTree) {
-      this.#buildRouteTree(routeTree);
+      this.#processRoutes(routeTree);
     }
     return this;
   };
@@ -1133,7 +1142,6 @@ class Router {
     return matches;
   };
   loadMatches = async (resolvedMatches, opts) => {
-    this.cleanMatches();
     if (!opts?.preload) {
       resolvedMatches.forEach(match => {
         // Update each match with its latest route data
@@ -1146,10 +1154,12 @@ class Router {
           error: match.error,
           paramsError: match.paramsError,
           searchError: match.searchError,
-          params: match.params
+          params: match.params,
+          preloadInvalidAt: 0
         }));
       });
     }
+    this.cleanMatches();
     let firstBadMatchIndex;
 
     // Check each match middleware to see if the route can be accessed
@@ -1285,6 +1295,7 @@ class Router {
       })());
     });
     await Promise.all(matchPromises);
+    this.cleanMatches();
   };
   reload = () => {
     return this.navigate({
@@ -1464,7 +1475,9 @@ class Router {
   };
   dehydrate = () => {
     return {
-      state: pick(this.state, ['location', 'status', 'lastUpdated'])
+      state: {
+        dehydratedMatches: this.state.matches.map(d => pick(d, ['fetchedAt', 'invalid', 'invalidAt', 'id', 'loaderData', 'status', 'updatedAt']))
+      }
     };
   };
   hydrate = async __do_not_use_server_ctx => {
@@ -1477,16 +1490,27 @@ class Router {
     const ctx = _ctx;
     this.dehydratedData = ctx.payload;
     this.options.hydrate?.(ctx.payload);
-    const routerState = ctx.router.state;
+    const {
+      dehydratedMatches
+    } = 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);
+      invariant(dehydratedMatch, `Could not find a client-side match for dehydrated match with id: ${match.id}!`);
+      if (dehydratedMatch) {
+        return {
+          ...match,
+          ...dehydratedMatch
+        };
+      }
+      return match;
+    });
     this.__store.setState(s => {
       return {
         ...s,
-        ...routerState,
-        resolvedLocation: routerState.location
+        matches,
+        matchesById: this.#mergeMatches(s.matchesById, matches)
       };
     });
-    await this.load();
-    return;
   };
   injectedHtml = [];
   injectHtml = async html => {
@@ -1499,10 +1523,10 @@ class Router {
         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);
@@ -1523,7 +1547,7 @@ class Router {
   //     ?.__promisesByKey[key]?.resolve(value)
   // }
 
-  #buildRouteTree = routeTree => {
+  #processRoutes = routeTree => {
     this.routeTree = routeTree;
     this.routesById = {};
     this.routesByPath = {};
@@ -1726,7 +1750,6 @@ class Router {
       preloadInvalidAt,
       invalidAt
     }));
-    if (this.state.matches.find(d => d.id === id)) ;
   };
   invalidate = async opts => {
     if (opts?.matchId) {
@@ -1935,5 +1958,27 @@ function restoreScrollPositions(router, opts) {
   }
 }
 
-export { FileRoute, PathParamError, RootRoute, Route, Router, RouterContext, SearchParamError, cleanPath, componentTypes, createBrowserHistory, createHashHistory, createMemoryHistory, decode, defaultParseSearch, defaultStringifySearch, encode, functionalUpdate, interpolatePath, isPlainObject, isRedirect, joinPaths, last, lazyFn, matchByPath, matchPathname, parsePathname, parseSearchWith, partialDeepEqual, pick, redirect, replaceEqualDeep, resolvePath, restoreScrollPositions, rootRouteId, stringifySearchWith, trimPath, trimPathLeft, trimPathRight, watchScrollPositions };
+function defer(_promise) {
+  const promise = _promise;
+  if (!promise.__deferredState) {
+    promise.__deferredState = {
+      uid: Math.random().toString(36).slice(2),
+      status: 'pending'
+    };
+    const state = promise.__deferredState;
+    promise.then(data => {
+      state.status = 'success';
+      state.data = data;
+    }).catch(error => {
+      state.status = 'error';
+      state.error = error;
+    });
+  }
+  return promise;
+}
+function isDehydratedDeferred(obj) {
+  return typeof obj === 'object' && obj !== null && !(obj instanceof Promise) && !obj.then && '__deferredState' in obj;
+}
+
+export { FileRoute, PathParamError, RootRoute, Route, Router, RouterContext, SearchParamError, cleanPath, componentTypes, createBrowserHistory, createHashHistory, createMemoryHistory, decode, defaultParseSearch, defaultStringifySearch, defer, encode, functionalUpdate, interpolatePath, isDehydratedDeferred, isPlainObject, isRedirect, joinPaths, last, lazyFn, matchByPath, matchPathname, parsePathname, parseSearchWith, partialDeepEqual, pick, redirect, replaceEqualDeep, resolvePath, restoreScrollPositions, rootRouteId, stringifySearchWith, trimPath, trimPathLeft, trimPathRight, watchScrollPositions };
 //# sourceMappingURL=index.js.map