@tanstack/react-router 0.0.1-beta.277 → 0.0.1-beta.279

package/build/umd/index.development.js

@@ -942,13 +942,14 @@
     invariant(routeId, `Could not find routeId for matchId "${matchId}". Please file an issue!`);
     const route = router.routesById[routeId];
     const PendingComponent = route.options.pendingComponent ?? router.options.defaultPendingComponent;
+    const pendingElement = PendingComponent ? /*#__PURE__*/React__namespace.createElement(PendingComponent, null) : null;
     const routeErrorComponent = route.options.errorComponent ?? router.options.defaultErrorComponent ?? ErrorComponent;
     const ResolvedSuspenseBoundary = route.options.wrapInSuspense ?? PendingComponent ?? route.options.component?.preload ?? route.options.pendingComponent?.preload ?? route.options.errorComponent?.preload ? React__namespace.Suspense : SafeFragment;
     const ResolvedCatchBoundary = routeErrorComponent ? CatchBoundary : SafeFragment;
     return /*#__PURE__*/React__namespace.createElement(matchContext.Provider, {
       value: matchId
     }, /*#__PURE__*/React__namespace.createElement(ResolvedSuspenseBoundary, {
-      fallback: PendingComponent
+      fallback: pendingElement
     }, /*#__PURE__*/React__namespace.createElement(ResolvedCatchBoundary, {
       getResetKey: () => router.state.resolvedLocation.state?.key,
       errorComponent: routeErrorComponent,
@@ -957,7 +958,7 @@
       }
     }, /*#__PURE__*/React__namespace.createElement(MatchInner, {
       matchId: matchId,
-      pendingElement: PendingComponent
+      pendingElement: pendingElement
     }))));
   }
   function MatchInner({
@@ -977,7 +978,7 @@
     }
     if (match.status === 'pending') {
       if (match.showPending) {
-        return pendingElement || null;
+        return pendingElement;
       }
       throw match.loadPromise;
     }
@@ -1007,6 +1008,9 @@
     });
   });
   function useMatchRoute() {
+    useRouterState({
+      select: s => [s.location, s.resolvedLocation]
+    });
     const {
       matchRoute
     } = useRouter();
@@ -2088,7 +2092,10 @@
         while (parsed.length > 1 && parsed[0]?.value === '/') {
           parsed.shift();
         }
-        const score = parsed.map(d => {
+        const scores = parsed.map(d => {
+          if (d.value === '/') {
+            return 0.75;
+          }
           if (d.type === 'param') {
             return 0.5;
           }
@@ -2102,38 +2109,31 @@
           trimmed,
           parsed,
           index: i,
-          score
+          scores
         });
       });
       this.flatRoutes = scoredRoutes.sort((a, b) => {
-        let isIndex = a.trimmed === '/' ? 1 : b.trimmed === '/' ? -1 : 0;
-        if (isIndex !== 0) return isIndex;
-        const length = Math.min(a.score.length, b.score.length);
-
-        // Sort by length of score
-        if (a.score.length !== b.score.length) {
-          return b.score.length - a.score.length;
-        }
+        const minLength = Math.min(a.scores.length, b.scores.length);
 
         // Sort by min available score
-        for (let i = 0; i < length; i++) {
-          if (a.score[i] !== b.score[i]) {
-            return b.score[i] - a.score[i];
+        for (let i = 0; i < minLength; i++) {
+          if (a.scores[i] !== b.scores[i]) {
+            return b.scores[i] - a.scores[i];
           }
         }
 
+        // Sort by length of score
+        if (a.scores.length !== b.scores.length) {
+          return b.scores.length - a.scores.length;
+        }
+
         // Sort by min available parsed value
-        for (let i = 0; i < length; i++) {
+        for (let i = 0; i < minLength; i++) {
           if (a.parsed[i].value !== b.parsed[i].value) {
             return a.parsed[i].value > b.parsed[i].value ? 1 : -1;
           }
         }
 
-        // Sort by length of trimmed full path
-        if (a.trimmed !== b.trimmed) {
-          return a.trimmed > b.trimmed ? 1 : -1;
-        }
-
         // Sort by original index
         return a.index - b.index;
       }).map((d, i) => {
@@ -2538,9 +2538,9 @@
       let latestPromise;
       let firstBadMatchIndex;
       const updateMatch = match => {
-        const isPreload = this.state.preloadMatches.find(d => d.id === match.id);
+        // const isPreload = this.state.preloadMatches.find((d) => d.id === match.id)
         const isPending = this.state.pendingMatches?.find(d => d.id === match.id);
-        const matchesKey = isPreload ? 'preloadMatches' : isPending ? 'pendingMatches' : 'matches';
+        const matchesKey = preload ? 'preloadMatches' : isPending ? 'pendingMatches' : 'matches';
         this.__store.setState(s => ({
           ...s,
           [matchesKey]: s[matchesKey]?.map(d => d.id === match.id ? match : d)