@tanstack/react-router 0.0.1-beta.70 → 0.0.1-beta.72

package/build/stats-react.json

@@ -7,7 +7,7 @@
         "name": "index.production.js",
         "children": [
           {
-            "uid": "d36d-109",
+            "uid": "7ba6-109",
             "name": "\u0000rollupPluginBabelHelpers.js"
           },
           {
@@ -15,11 +15,11 @@
             "children": [
               {
                 "name": "tiny-invariant@1.3.1/node_modules/tiny-invariant/dist/esm/tiny-invariant.js",
-                "uid": "d36d-111"
+                "uid": "7ba6-111"
               },
               {
                 "name": "tiny-warning@1.0.3/node_modules/tiny-warning/dist/tiny-warning.esm.js",
-                "uid": "d36d-113"
+                "uid": "7ba6-113"
               }
             ]
           },
@@ -28,19 +28,19 @@
             "children": [
               {
                 "name": "store/build/esm/index.js",
-                "uid": "d36d-115"
+                "uid": "7ba6-115"
               },
               {
                 "name": "router/build/esm/index.js",
-                "uid": "d36d-117"
+                "uid": "7ba6-117"
               },
               {
                 "name": "react-store/build/esm/index.js",
-                "uid": "d36d-119"
+                "uid": "7ba6-119"
               },
               {
                 "name": "react-router/src/index.tsx",
-                "uid": "d36d-121"
+                "uid": "7ba6-121"
               }
             ]
           }
@@ -50,176 +50,176 @@
     "isRoot": true
   },
   "nodeParts": {
-    "d36d-109": {
+    "7ba6-109": {
       "renderedLength": 429,
       "gzipLength": 238,
       "brotliLength": 0,
-      "mainUid": "d36d-108"
+      "mainUid": "7ba6-108"
     },
-    "d36d-111": {
+    "7ba6-111": {
       "renderedLength": 181,
       "gzipLength": 129,
       "brotliLength": 0,
-      "mainUid": "d36d-110"
+      "mainUid": "7ba6-110"
     },
-    "d36d-113": {
+    "7ba6-113": {
       "renderedLength": 44,
       "gzipLength": 62,
       "brotliLength": 0,
-      "mainUid": "d36d-112"
+      "mainUid": "7ba6-112"
     },
-    "d36d-115": {
+    "7ba6-115": {
       "renderedLength": 1288,
       "gzipLength": 497,
       "brotliLength": 0,
-      "mainUid": "d36d-114"
+      "mainUid": "7ba6-114"
     },
-    "d36d-117": {
-      "renderedLength": 46138,
-      "gzipLength": 10996,
+    "7ba6-117": {
+      "renderedLength": 46930,
+      "gzipLength": 11106,
       "brotliLength": 0,
-      "mainUid": "d36d-116"
+      "mainUid": "7ba6-116"
     },
-    "d36d-119": {
+    "7ba6-119": {
       "renderedLength": 1571,
       "gzipLength": 594,
       "brotliLength": 0,
-      "mainUid": "d36d-118"
+      "mainUid": "7ba6-118"
     },
-    "d36d-121": {
-      "renderedLength": 12488,
-      "gzipLength": 3230,
+    "7ba6-121": {
+      "renderedLength": 12514,
+      "gzipLength": 3242,
       "brotliLength": 0,
-      "mainUid": "d36d-120"
+      "mainUid": "7ba6-120"
     }
   },
   "nodeMetas": {
-    "d36d-108": {
+    "7ba6-108": {
       "id": "\u0000rollupPluginBabelHelpers.js",
       "moduleParts": {
-        "index.production.js": "d36d-109"
+        "index.production.js": "7ba6-109"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "d36d-120"
+          "uid": "7ba6-120"
         }
       ]
     },
-    "d36d-110": {
+    "7ba6-110": {
       "id": "/node_modules/.pnpm/tiny-invariant@1.3.1/node_modules/tiny-invariant/dist/esm/tiny-invariant.js",
       "moduleParts": {
-        "index.production.js": "d36d-111"
+        "index.production.js": "7ba6-111"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "d36d-116"
+          "uid": "7ba6-116"
         }
       ]
     },
-    "d36d-112": {
+    "7ba6-112": {
       "id": "/node_modules/.pnpm/tiny-warning@1.0.3/node_modules/tiny-warning/dist/tiny-warning.esm.js",
       "moduleParts": {
-        "index.production.js": "d36d-113"
+        "index.production.js": "7ba6-113"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "d36d-116"
+          "uid": "7ba6-116"
         }
       ]
     },
-    "d36d-114": {
+    "7ba6-114": {
       "id": "/packages/store/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "d36d-115"
+        "index.production.js": "7ba6-115"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "d36d-116"
+          "uid": "7ba6-116"
         }
       ]
     },
-    "d36d-116": {
+    "7ba6-116": {
       "id": "/packages/router/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "d36d-117"
+        "index.production.js": "7ba6-117"
       },
       "imported": [
         {
-          "uid": "d36d-110"
+          "uid": "7ba6-110"
         },
         {
-          "uid": "d36d-112"
+          "uid": "7ba6-112"
         },
         {
-          "uid": "d36d-114"
+          "uid": "7ba6-114"
         }
       ],
       "importedBy": [
         {
-          "uid": "d36d-120"
+          "uid": "7ba6-120"
         }
       ]
     },
-    "d36d-118": {
+    "7ba6-118": {
       "id": "/packages/react-store/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "d36d-119"
+        "index.production.js": "7ba6-119"
       },
       "imported": [
         {
-          "uid": "d36d-123"
+          "uid": "7ba6-123"
         }
       ],
       "importedBy": [
         {
-          "uid": "d36d-120"
+          "uid": "7ba6-120"
         }
       ]
     },
-    "d36d-120": {
+    "7ba6-120": {
       "id": "/packages/react-router/src/index.tsx",
       "moduleParts": {
-        "index.production.js": "d36d-121"
+        "index.production.js": "7ba6-121"
       },
       "imported": [
         {
-          "uid": "d36d-108"
+          "uid": "7ba6-108"
         },
         {
-          "uid": "d36d-122"
+          "uid": "7ba6-122"
         },
         {
-          "uid": "d36d-116"
+          "uid": "7ba6-116"
         },
         {
-          "uid": "d36d-118"
+          "uid": "7ba6-118"
         }
       ],
       "importedBy": [],
       "isEntry": true
     },
-    "d36d-122": {
+    "7ba6-122": {
       "id": "react",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "d36d-120"
+          "uid": "7ba6-120"
         }
       ],
       "isExternal": true
     },
-    "d36d-123": {
+    "7ba6-123": {
       "id": "use-sync-external-store/shim/with-selector",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "d36d-118"
+          "uid": "7ba6-118"
         }
       ],
       "isExternal": true

package/build/umd/index.development.js

@@ -185,7 +185,8 @@
       forward: () => {
         opts.forward();
         onUpdate();
-      }
+      },
+      createHref: str => opts.createHref(str)
     };
   }
   function createBrowserHistory(opts) {
@@ -214,7 +215,8 @@
       },
       back: () => window.history.back(),
       forward: () => window.history.forward(),
-      go: n => window.history.go(n)
+      go: n => window.history.go(n),
+      createHref: path => createHref(path)
     });
   }
   function createHashHistory() {
@@ -256,7 +258,8 @@
       forward: () => {
         index = Math.min(index + 1, entries.length - 1);
       },
-      go: n => window.history.go(n)
+      go: n => window.history.go(n),
+      createHref: path => path
     });
   }
   function parseLocation(href, state) {
@@ -435,7 +438,7 @@
     // Remove empty segments and '.' segments
     const split = pathname.split('/').filter(Boolean);
     segments.push(...split.map(part => {
-      if (part === '$') {
+      if (part === '$' || part === '*') {
         return {
           type: 'wildcard',
           value: part
@@ -464,7 +467,7 @@
   function interpolatePath(path, params, leaveWildcard) {
     const interpolatedPathSegments = parsePathname(path);
     return joinPaths(interpolatedPathSegments.map(segment => {
-      if (segment.value === '$' && !leaveWildcard) {
+      if (['$', '*'].includes(segment.value) && !leaveWildcard) {
         return '';
       }
       if (segment.type === 'param') {
@@ -503,7 +506,7 @@
         if (routeSegment) {
           if (routeSegment.type === 'wildcard') {
             if (baseSegment?.value) {
-              params['$'] = joinPaths(baseSegments.slice(i).map(d => d.value));
+              params['*'] = joinPaths(baseSegments.slice(i).map(d => d.value));
               return true;
             }
             return false;
@@ -791,6 +794,18 @@
 
       // Allow frameworks to hook into the router creation
       this.options.Router?.(this);
+      const next = this.buildNext({
+        hash: true,
+        fromCurrent: true,
+        search: true,
+        state: true
+      });
+      if (this.state.latestLocation.href !== next.href) {
+        this.#commitLocation({
+          ...next,
+          replace: true
+        });
+      }
     }
     reset = () => {
       this.store.setState(s => Object.assign(s, getInitialRouterState()));
@@ -802,25 +817,6 @@
         if (!this.state.currentMatches.length) {
           this.safeLoad();
         }
-        const visibilityChangeEvent = 'visibilitychange';
-        const focusEvent = 'focus';
-
-        // addEventListener does not exist in React Native, but window does
-        // In the future, we might need to invert control here for more adapters
-        // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-        if (window.addEventListener) {
-          // Listen to visibilitychange and focus
-          window.addEventListener(visibilityChangeEvent, this.#onFocus, false);
-          window.addEventListener(focusEvent, this.#onFocus, false);
-        }
-        return () => {
-          if (window.removeEventListener) {
-            // Be sure to unsubscribe if a new handler is set
-
-            window.removeEventListener(visibilityChangeEvent, this.#onFocus);
-            window.removeEventListener(focusEvent, this.#onFocus);
-          }
-        };
       }
       return () => {};
     };
@@ -1313,7 +1309,40 @@
           }
           this.routesById[route.id] = route;
           const children = route.children;
-          if (children?.length) recurseRoutes(children);
+          if (children?.length) {
+            recurseRoutes(children);
+            route.children = children.map((d, i) => {
+              const parsed = parsePathname(trimPathLeft(cleanPath(d.path ?? '/')));
+              while (parsed.length > 1 && parsed[0]?.value === '/') {
+                parsed.shift();
+              }
+              let score = 0;
+              parsed.forEach((d, i) => {
+                let modifier = 1;
+                while (i--) {
+                  modifier *= 0.001;
+                }
+                if (d.type === 'pathname' && d.value !== '/') {
+                  score += 1 * modifier;
+                } else if (d.type === 'param') {
+                  score += 2 * modifier;
+                } else if (d.type === 'wildcard') {
+                  score += 3 * modifier;
+                }
+              });
+              return {
+                child: d,
+                parsed,
+                index: i,
+                score
+              };
+            }).sort((a, b) => {
+              if (a.score !== b.score) {
+                return a.score - b.score;
+              }
+              return a.index - b.index;
+            }).map(d => d.child);
+          }
         });
       };
       recurseRoutes([routeTree]);
@@ -1337,9 +1366,6 @@
         key: state?.key || '__init__'
       };
     };
-    #onFocus = () => {
-      this.safeLoad();
-    };
     #buildLocation = (dest = {}) => {
       dest.fromCurrent = dest.fromCurrent ?? dest.to === '';
       const fromPathname = dest.fromCurrent ? this.state.latestLocation.pathname : dest.from ?? this.state.latestLocation.pathname;
@@ -1374,13 +1400,14 @@
       const searchStr = this.options.stringifySearch(search);
       let hash = dest.hash === true ? this.state.latestLocation.hash : functionalUpdate(dest.hash, this.state.latestLocation.hash);
       hash = hash ? `#${hash}` : '';
+      const nextState = dest.state === true ? this.state.latestLocation.state : functionalUpdate(dest.state, this.state.latestLocation.state);
       return {
         pathname,
         search,
         searchStr,
-        state: this.state.latestLocation.state,
+        state: nextState,
         hash,
-        href: `${pathname}${searchStr}${hash}`,
+        href: this.history.createHref(`${pathname}${searchStr}${hash}`),
         key: dest.key
       };
     };
@@ -1870,7 +1897,7 @@
   }
   function useRouterContext() {
     const value = React__namespace.useContext(routerContext);
-    warning(!value, 'useRouter must be used inside a <Router> component!');
+    warning(value, 'useRouter must be used inside a <Router> component!');
     useStore(value.router.store);
     return value.router;
   }
@@ -2062,15 +2089,16 @@
       style: {
         height: '.5rem'
       }
-    }), /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement("pre", null, error.message ? /*#__PURE__*/React__namespace.createElement("code", {
+    }), /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement("pre", {
       style: {
         fontSize: '.7em',
         border: '1px solid red',
         borderRadius: '.25rem',
         padding: '.5rem',
-        color: 'red'
+        color: 'red',
+        overflow: 'auto'
       }
-    }, error.message) : null)));
+    }, error.message ? /*#__PURE__*/React__namespace.createElement("code", null, error.message) : null)));
   }
 
   // TODO: While we migrate away from the history package, these need to be disabled