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

package/build/stats-react.json

@@ -7,7 +7,7 @@
         "name": "index.production.js",
         "children": [
           {
-            "uid": "8d97-81",
+            "uid": "a738-81",
             "name": "\u0000rollupPluginBabelHelpers.js"
           },
           {
@@ -15,11 +15,11 @@
             "children": [
               {
                 "name": "tiny-invariant@1.3.1/node_modules/tiny-invariant/dist/esm/tiny-invariant.js",
-                "uid": "8d97-83"
+                "uid": "a738-83"
               },
               {
                 "name": "immer@9.0.16/node_modules/immer/dist/immer.esm.mjs",
-                "uid": "8d97-85"
+                "uid": "a738-85"
               }
             ]
           },
@@ -28,17 +28,17 @@
             "children": [
               {
                 "name": "router-core/build/esm/index.js",
-                "uid": "8d97-87"
+                "uid": "a738-87"
               },
               {
                 "name": "react-router/src",
                 "children": [
                   {
-                    "uid": "8d97-89",
+                    "uid": "a738-89",
                     "name": "useStore.ts"
                   },
                   {
-                    "uid": "8d97-91",
+                    "uid": "a738-91",
                     "name": "index.tsx"
                   }
                 ]
@@ -51,155 +51,155 @@
     "isRoot": true
   },
   "nodeParts": {
-    "8d97-81": {
+    "a738-81": {
       "renderedLength": 429,
       "gzipLength": 238,
       "brotliLength": 0,
-      "mainUid": "8d97-80"
+      "mainUid": "a738-80"
     },
-    "8d97-83": {
+    "a738-83": {
       "renderedLength": 181,
       "gzipLength": 129,
       "brotliLength": 0,
-      "mainUid": "8d97-82"
+      "mainUid": "a738-82"
     },
-    "8d97-85": {
+    "a738-85": {
       "renderedLength": 8203,
       "gzipLength": 3238,
       "brotliLength": 0,
-      "mainUid": "8d97-84"
+      "mainUid": "a738-84"
     },
-    "8d97-87": {
-      "renderedLength": 56666,
-      "gzipLength": 13446,
+    "a738-87": {
+      "renderedLength": 56569,
+      "gzipLength": 13422,
       "brotliLength": 0,
-      "mainUid": "8d97-86"
+      "mainUid": "a738-86"
     },
-    "8d97-89": {
+    "a738-89": {
       "renderedLength": 1347,
       "gzipLength": 484,
       "brotliLength": 0,
-      "mainUid": "8d97-88"
+      "mainUid": "a738-88"
     },
-    "8d97-91": {
+    "a738-91": {
       "renderedLength": 12608,
       "gzipLength": 3327,
       "brotliLength": 0,
-      "mainUid": "8d97-90"
+      "mainUid": "a738-90"
     }
   },
   "nodeMetas": {
-    "8d97-80": {
+    "a738-80": {
       "id": "\u0000rollupPluginBabelHelpers.js",
       "moduleParts": {
-        "index.production.js": "8d97-81"
+        "index.production.js": "a738-81"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "8d97-90"
+          "uid": "a738-90"
         }
       ]
     },
-    "8d97-82": {
+    "a738-82": {
       "id": "/node_modules/.pnpm/tiny-invariant@1.3.1/node_modules/tiny-invariant/dist/esm/tiny-invariant.js",
       "moduleParts": {
-        "index.production.js": "8d97-83"
+        "index.production.js": "a738-83"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "8d97-86"
+          "uid": "a738-86"
         }
       ]
     },
-    "8d97-84": {
+    "a738-84": {
       "id": "/node_modules/.pnpm/immer@9.0.16/node_modules/immer/dist/immer.esm.mjs",
       "moduleParts": {
-        "index.production.js": "8d97-85"
+        "index.production.js": "a738-85"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "8d97-86"
+          "uid": "a738-86"
         }
       ]
     },
-    "8d97-86": {
+    "a738-86": {
       "id": "/packages/router-core/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "8d97-87"
+        "index.production.js": "a738-87"
       },
       "imported": [
         {
-          "uid": "8d97-82"
+          "uid": "a738-82"
         },
         {
-          "uid": "8d97-84"
+          "uid": "a738-84"
         }
       ],
       "importedBy": [
         {
-          "uid": "8d97-90"
+          "uid": "a738-90"
         }
       ]
     },
-    "8d97-88": {
+    "a738-88": {
       "id": "/packages/react-router/src/useStore.ts",
       "moduleParts": {
-        "index.production.js": "8d97-89"
+        "index.production.js": "a738-89"
       },
       "imported": [
         {
-          "uid": "8d97-93"
+          "uid": "a738-93"
         }
       ],
       "importedBy": [
         {
-          "uid": "8d97-90"
+          "uid": "a738-90"
         }
       ]
     },
-    "8d97-90": {
+    "a738-90": {
       "id": "/packages/react-router/src/index.tsx",
       "moduleParts": {
-        "index.production.js": "8d97-91"
+        "index.production.js": "a738-91"
       },
       "imported": [
         {
-          "uid": "8d97-80"
+          "uid": "a738-80"
         },
         {
-          "uid": "8d97-92"
+          "uid": "a738-92"
         },
         {
-          "uid": "8d97-86"
+          "uid": "a738-86"
         },
         {
-          "uid": "8d97-88"
+          "uid": "a738-88"
         }
       ],
       "importedBy": [],
       "isEntry": true
     },
-    "8d97-92": {
+    "a738-92": {
       "id": "react",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "8d97-90"
+          "uid": "a738-90"
         }
       ],
       "isExternal": true
     },
-    "8d97-93": {
+    "a738-93": {
       "id": "use-sync-external-store/shim/with-selector",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "8d97-88"
+          "uid": "a738-88"
         }
       ],
       "isExternal": true

package/build/types/index.d.ts

@@ -99,9 +99,9 @@ declare function useParams<TFrom extends keyof RegisteredAllRouteInfo['routeInfo
     from: TFrom;
     track?: (search: TDefaultSelected) => TSelected;
 }): TSelected;
-declare function useNavigate<TDefaultFrom extends keyof RegisteredAllRouteInfo['routeInfoById'] = '/'>(defaultOpts: {
+declare function useNavigate<TDefaultFrom extends keyof RegisteredAllRouteInfo['routeInfoById'] = '/'>(defaultOpts?: {
     from?: TDefaultFrom;
-}): <TFrom extends string = TDefaultFrom, TTo extends string = ".">(opts: MakeLinkOptions<TFrom, TTo>) => Promise<void>;
+}): <TFrom extends string = TDefaultFrom, TTo extends string = ".">(opts?: MakeLinkOptions<TFrom, TTo> | undefined) => Promise<void>;
 declare function useMatchRoute(): <TFrom extends ValidFromPath<AnyAllRouteInfo> = "/", TTo extends string = ".">(opts: MakeUseMatchRouteOptions<TFrom, TTo>) => false;
 declare function MatchRoute<TFrom extends ValidFromPath<RegisteredAllRouteInfo> = '/', TTo extends string = '.'>(props: MakeMatchRouteOptions<TFrom, TTo>): any;
 declare function Outlet(): JSX.Element | null;

package/build/umd/index.development.js

@@ -167,13 +167,8 @@
     const getLocation = () => parseLocation(entries[index], currentState);
     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 = {
@@ -202,10 +197,9 @@
   function parseLocation(href, state) {
     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
@@ -742,7 +736,7 @@
         this.store.setState(s => s.status = 'success');
       }
     }
-    #setLoaderData = loaderData => {
+    setLoaderData = loaderData => {
       batch(() => {
         this.store.setState(s => {
           s.routeLoaderData = loaderData;
@@ -817,7 +811,7 @@
             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 => {
               s.error = undefined;
@@ -1002,8 +996,7 @@
     throw new Error('Failed to fetch match data');
   };
   class Router {
-    // __location: Location<TAllRouteInfo['fullSearchSchema']>
-
+    #unsubHistory;
     startedLoadingAt = Date.now();
     resolveNavigation = () => {};
     constructor(options) {
@@ -1035,9 +1028,6 @@
         if (!this.store.state.currentMatches.length) {
           this.load();
         }
-        const unsubHistory = this.history.listen(() => {
-          this.load(this.#parseLocation(this.store.state.latestLocation));
-        });
         const visibilityChangeEvent = 'visibilitychange';
         const focusEvent = 'focus';
 
@@ -1050,7 +1040,6 @@
           window.addEventListener(focusEvent, this.#onFocus, false);
         }
         return () => {
-          unsubHistory();
           if (window.removeEventListener) {
             // Be sure to unsubscribe if a new handler is set
 
@@ -1064,11 +1053,17 @@
     update = opts => {
       Object.assign(this.options, opts);
       if (!this.history || this.options.history && this.options.history !== this.history) {
-        this.history = this.options?.history ?? isServer ? createMemoryHistory() : createBrowserHistory();
+        if (this.#unsubHistory) {
+          this.#unsubHistory();
+        }
+        this.history = 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,
@@ -1582,7 +1577,10 @@
         currentMatches.forEach((match, index) => {
           const dehydratedMatch = dehydratedRouter.state.currentMatches[index];
           invariant(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());
         Object.assign(s, {