@tanstack/router-core 0.0.1-beta.51 → 0.0.1-beta.53

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tanstack/router-core",
   "author": "Tanner Linsley",
-  "version": "0.0.1-beta.51",
+  "version": "0.0.1-beta.53",
   "license": "MIT",
   "repository": "tanstack/router",
   "homepage": "https://tanstack.com/router",

package/src/history.ts

@@ -2,6 +2,8 @@
 // This implementation attempts to be more lightweight by
 // making assumptions about the way TanStack Router works
 
+import { match } from 'assert'
+
 export interface RouterHistory {
   location: RouterLocation
   listen: (cb: () => void) => () => void
@@ -146,13 +148,8 @@ export function createMemoryHistory(
 
   return createHistory({
     getLocation,
-    listener: (onUpdate) => {
-      window.addEventListener(popStateEvent, onUpdate)
-      // We might need to handle the hashchange event in the future
-      // window.addEventListener(hashChangeEvent, onUpdate)
-      return () => {
-        window.removeEventListener(popStateEvent, onUpdate)
-      }
+    listener: () => {
+      return () => {}
     },
     pushState: (path, state) => {
       currentState = {
@@ -182,11 +179,19 @@ export function createMemoryHistory(
 function parseLocation(href: string, state: any): RouterLocation {
   let hashIndex = href.indexOf('#')
   let searchIndex = href.indexOf('?')
-  const pathEnd = Math.min(hashIndex, searchIndex)
 
   return {
     href,
-    pathname: pathEnd > -1 ? href.substring(0, pathEnd) : href,
+    pathname: href.substring(
+      0,
+      hashIndex > 0
+        ? searchIndex > 0
+          ? Math.min(hashIndex, searchIndex)
+          : hashIndex
+        : searchIndex > 0
+        ? searchIndex
+        : href.length,
+    ),
     hash: hashIndex > -1 ? href.substring(hashIndex, searchIndex) : '',
     search: searchIndex > -1 ? href.substring(searchIndex) : '',
     state,

package/src/routeMatch.ts

@@ -95,7 +95,7 @@ export class RouteMatch<
     }
   }
 
-  #setLoaderData = (loaderData: TRouteInfo['routeLoaderData']) => {
+  setLoaderData = (loaderData: TRouteInfo['routeLoaderData']) => {
     batch(() => {
       this.store.setState((s) => {
         s.routeLoaderData = loaderData
@@ -197,7 +197,7 @@ export class RouteMatch<
           if (this.route.options.loader) {
             const data = await this.router.loadMatchData(this)
             if ((latestPromise = checkLatest())) return latestPromise
-            this.#setLoaderData(data)
+            this.setLoaderData(data)
           }
 
           this.store.setState((s) => {

package/src/router.ts

@@ -295,6 +295,7 @@ export class Router<
     'stringifySearch' | 'parseSearch' | 'context'
   >
   history!: RouterHistory
+  #unsubHistory?: () => void
   basepath: string
   // __location: Location<TAllRouteInfo['fullSearchSchema']>
   routeTree!: Route<TAllRouteInfo, RouteInfo>
@@ -341,10 +342,6 @@ export class Router<
         this.load()
       }
 
-      const unsubHistory = this.history.listen(() => {
-        this.load(this.#parseLocation(this.store.state.latestLocation))
-      })
-
       const visibilityChangeEvent = 'visibilitychange'
       const focusEvent = 'focus'
 
@@ -358,7 +355,6 @@ export class Router<
       }
 
       return () => {
-        unsubHistory()
         if (window.removeEventListener) {
           // Be sure to unsubscribe if a new handler is set
 
@@ -384,15 +380,22 @@ export class Router<
       !this.history ||
       (this.options.history && this.options.history !== this.history)
     ) {
+      if (this.#unsubHistory) {
+        this.#unsubHistory()
+      }
+
       this.history =
-        this.options?.history ?? isServer
-          ? createMemoryHistory()
-          : createBrowserHistory()!
+        this.options.history ??
+        (isServer ? createMemoryHistory() : createBrowserHistory()!)
 
       this.store.setState((s) => {
         s.latestLocation = this.#parseLocation()
         s.currentLocation = s.latestLocation
       })
+
+      this.#unsubHistory = this.history.listen(() => {
+        this.load(this.#parseLocation(this.store.state.latestLocation))
+      })
     }
 
     const { basepath, routeConfig } = this.options
@@ -817,7 +820,12 @@ export class Router<
     }
   }
 
-  invalidateRoute = async (opts: MatchLocation) => {
+  invalidateRoute = async <
+    TFrom extends ValidFromPath<TAllRouteInfo> = '/',
+    TTo extends string = '.',
+  >(
+    opts: ToOptions<TAllRouteInfo, TFrom, TTo>,
+  ) => {
     const next = this.buildNext(opts)
     const unloadedMatchIds = this.matchRoutes(next.pathname).map((d) => d.id)
 
@@ -1007,7 +1015,7 @@ export class Router<
       ) {
         e.preventDefault()
         if (pathIsEqual && !search && !hash) {
-          this.invalidateRoute(nextOpts)
+          this.invalidateRoute(nextOpts as any)
         }
 
         // All is well? Navigate!
@@ -1114,7 +1122,10 @@ export class Router<
           dehydratedMatch && dehydratedMatch.id === match.id,
           'Oh no! There was a hydration mismatch when attempting to rethis.store the state of the router! 😬',
         )
-        Object.assign(match, dehydratedMatch)
+        match.store.setState((s) => {
+          Object.assign(s, dehydratedMatch.state)
+        })
+        match.setLoaderData(dehydratedMatch.state.routeLoaderData)
       })
 
       currentMatches.forEach((match) => match.__validate())