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

package/build/stats-react.json

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

package/build/umd/index.development.js

@@ -724,7 +724,7 @@
       Object.assign(this, {
         route,
         router,
-        matchId: opts.matchId,
+        id: opts.id,
         pathname: opts.pathname,
         params: opts.params,
         store: createStore({
@@ -1018,13 +1018,12 @@
         parseSearch: options?.parseSearch ?? defaultParseSearch,
         fetchServerDataFn: options?.fetchServerDataFn ?? defaultFetchServerDataFn
       };
-      this.history = this.options?.history ?? createBrowserHistory();
       this.store = createStore(getInitialRouterState());
       this.basepath = '';
       this.update(options);
 
       // Allow frameworks to hook into the router creation
-      this.options.createRouter?.(this);
+      this.options.Router?.(this);
     }
     reset = () => {
       this.store.setState(s => Object.assign(s, getInitialRouterState()));
@@ -1063,13 +1062,14 @@
       return () => {};
     };
     update = opts => {
-      if (!this.store.state.latestLocation) {
+      Object.assign(this.options, opts);
+      if (!this.history || this.options.history && this.options.history !== this.history) {
+        this.history = this.options?.history ?? isServer ? createMemoryHistory() : createBrowserHistory();
         this.store.setState(s => {
           s.latestLocation = this.#parseLocation();
           s.currentLocation = s.latestLocation;
         });
       }
-      Object.assign(this.options, opts);
       const {
         basepath,
         routeConfig
@@ -1294,7 +1294,7 @@
           const interpolatedPath = interpolatePath(foundRoute.path, params);
           const matchId = interpolatePath(foundRoute.id, params, true);
           const match = existingMatches.find(d => d.id === matchId) || this.store.state.matchCache[matchId]?.match || new RouteMatch(this, foundRoute, {
-            matchId,
+            id: matchId,
             params,
             pathname: joinPaths([this.basepath, interpolatedPath])
           });
@@ -1366,10 +1366,11 @@
 
         // TODO: batch requests when possible
 
-        return this.options.fetchServerDataFn({
+        const res = await this.options.fetchServerDataFn({
           router: this,
           routeMatch
         });
+        return res;
       }
     };
     invalidateRoute = async opts => {
@@ -1560,7 +1561,7 @@
         state: {
           ...pick(this.store.state, ['latestLocation', 'currentLocation', 'status', 'lastUpdated']),
           currentMatches: this.store.state.currentMatches.map(match => ({
-            matchId: match.id,
+            id: match.id,
             state: {
               ...pick(match.store.state, ['status', 'routeLoaderData', 'invalidAt', 'invalid'])
             }
@@ -1580,7 +1581,7 @@
         });
         currentMatches.forEach((match, index) => {
           const dehydratedMatch = dehydratedRouter.state.currentMatches[index];
-          invariant(dehydratedMatch && dehydratedMatch.matchId === match.id, 'Oh no! There was a hydration mismatch when attempting to rethis.store the state of the router! 😬');
+          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);
         });
         currentMatches.forEach(match => match.__validate());
@@ -1727,7 +1728,9 @@
         id,
         ...next.state
       });
-      this.load(this.#parseLocation(this.store.state.latestLocation));
+
+      // this.load(this.#parseLocation(this.store.state.latestLocation))
+
       return this.navigationPromise = new Promise(resolve => {
         const previousNavigationResolve = this.resolveNavigation;
         this.resolveNavigation = () => {
@@ -1769,7 +1772,7 @@
     });
   }
 
-  // createRouterAction is a constrained identify function that takes options: key, action, onSuccess, onError, onSettled, etc
+  // RouterAction is a constrained identify function that takes options: key, action, onSuccess, onError, onSettled, etc
   function createAction(options) {
     const store = createStore({
       submissions: []
@@ -2026,7 +2029,7 @@
     ...rest
   }) {
     router.update(rest);
-    const [,, currentMatches] = useStore(router.store, s => [s.status, s.pendingMatches, s.currentMatches], true);
+    const currentMatches = useStore(router.store, s => s.currentMatches, undefined);
     React__namespace.useEffect(router.mount, [router]);
     return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(routerContext.Provider, {
       value: {
@@ -2193,11 +2196,11 @@
 
     // React.useEffect(() => {
     //   if (activeErrorState) {
-    //     let prevKey = router.store.currentLocation.key
+    //     let prevKey = router.store.state.currentLocation.key
     //     return createRoot((dispose) => {
     //       createEffect(() => {
-    //         if (router.store.currentLocation.key !== prevKey) {
-    //           prevKey = router.store.currentLocation.key
+    //         if (router.store.state.currentLocation.key !== prevKey) {
+    //           prevKey = router.store.state.currentLocation.key
     //           setActiveErrorState({} as any)
     //         }
     //       })