@tanstack/react-router 0.0.1-beta.16 → 0.0.1-beta.19

package/build/stats-html.html

@@ -4014,7 +4014,7 @@ var drawChart = (function (exports) {
   </script>
   <script>
     /*<!--*/
-    const data = {"version":2,"tree":{"name":"root","children":[{"name":"index.production.js","children":[{"uid":"36b9-59","name":"\u0000rollupPluginBabelHelpers.js"},{"name":"packages","children":[{"name":"router-core/build/esm/index.js","uid":"36b9-61"},{"name":"react-router/src/index.tsx","uid":"36b9-63"}]}]}],"isRoot":true},"nodeParts":{"36b9-59":{"renderedLength":798,"gzipLength":366,"brotliLength":0,"mainUid":"36b9-58"},"36b9-61":{"renderedLength":74402,"gzipLength":15504,"brotliLength":0,"mainUid":"36b9-60"},"36b9-63":{"renderedLength":11304,"gzipLength":2961,"brotliLength":0,"mainUid":"36b9-62"}},"nodeMetas":{"36b9-58":{"id":"\u0000rollupPluginBabelHelpers.js","moduleParts":{"index.production.js":"36b9-59"},"imported":[],"importedBy":[{"uid":"36b9-62"}]},"36b9-60":{"id":"/packages/router-core/build/esm/index.js","moduleParts":{"index.production.js":"36b9-61"},"imported":[],"importedBy":[{"uid":"36b9-62"}]},"36b9-62":{"id":"/packages/react-router/src/index.tsx","moduleParts":{"index.production.js":"36b9-63"},"imported":[{"uid":"36b9-58"},{"uid":"36b9-64"},{"uid":"36b9-65"},{"uid":"36b9-60"},{"uid":"36b9-66"}],"importedBy":[],"isEntry":true},"36b9-64":{"id":"react","moduleParts":{},"imported":[],"importedBy":[{"uid":"36b9-62"}],"isExternal":true},"36b9-65":{"id":"use-sync-external-store/shim","moduleParts":{},"imported":[],"importedBy":[{"uid":"36b9-62"}],"isExternal":true},"36b9-66":{"id":"react-lazy-with-preload/lib/index","moduleParts":{},"imported":[],"importedBy":[{"uid":"36b9-62"}],"isExternal":true}},"env":{"rollup":"2.77.2"},"options":{"gzip":true,"brotli":false,"sourcemap":false}};
+    const data = {"version":2,"tree":{"name":"root","children":[{"name":"index.production.js","children":[{"uid":"5c4d-59","name":"\u0000rollupPluginBabelHelpers.js"},{"name":"packages","children":[{"name":"router-core/build/esm/index.js","uid":"5c4d-61"},{"name":"react-router/src/index.tsx","uid":"5c4d-63"}]}]}],"isRoot":true},"nodeParts":{"5c4d-59":{"renderedLength":798,"gzipLength":366,"brotliLength":0,"mainUid":"5c4d-58"},"5c4d-61":{"renderedLength":75162,"gzipLength":15777,"brotliLength":0,"mainUid":"5c4d-60"},"5c4d-63":{"renderedLength":12237,"gzipLength":3143,"brotliLength":0,"mainUid":"5c4d-62"}},"nodeMetas":{"5c4d-58":{"id":"\u0000rollupPluginBabelHelpers.js","moduleParts":{"index.production.js":"5c4d-59"},"imported":[],"importedBy":[{"uid":"5c4d-62"}]},"5c4d-60":{"id":"/packages/router-core/build/esm/index.js","moduleParts":{"index.production.js":"5c4d-61"},"imported":[],"importedBy":[{"uid":"5c4d-62"}]},"5c4d-62":{"id":"/packages/react-router/src/index.tsx","moduleParts":{"index.production.js":"5c4d-63"},"imported":[{"uid":"5c4d-58"},{"uid":"5c4d-64"},{"uid":"5c4d-65"},{"uid":"5c4d-60"}],"importedBy":[],"isEntry":true},"5c4d-64":{"id":"react","moduleParts":{},"imported":[],"importedBy":[{"uid":"5c4d-62"}],"isExternal":true},"5c4d-65":{"id":"use-sync-external-store/shim","moduleParts":{},"imported":[],"importedBy":[{"uid":"5c4d-62"}],"isExternal":true}},"env":{"rollup":"2.77.2"},"options":{"gzip":true,"brotli":false,"sourcemap":false}};
 
     const run = () => {
       const width = window.innerWidth;

package/build/stats-react.json

@@ -7,7 +7,7 @@
         "name": "index.production.js",
         "children": [
           {
-            "uid": "36b9-68",
+            "uid": "5c4d-67",
             "name": "\u0000rollupPluginBabelHelpers.js"
           },
           {
@@ -15,11 +15,11 @@
             "children": [
               {
                 "name": "router-core/build/esm/index.js",
-                "uid": "36b9-70"
+                "uid": "5c4d-69"
               },
               {
                 "name": "react-router/src/index.tsx",
-                "uid": "36b9-72"
+                "uid": "5c4d-71"
               }
             ]
           }
@@ -29,104 +29,90 @@
     "isRoot": true
   },
   "nodeParts": {
-    "36b9-68": {
+    "5c4d-67": {
       "renderedLength": 798,
       "gzipLength": 366,
       "brotliLength": 0,
-      "mainUid": "36b9-67"
+      "mainUid": "5c4d-66"
     },
-    "36b9-70": {
-      "renderedLength": 74402,
-      "gzipLength": 15504,
+    "5c4d-69": {
+      "renderedLength": 75162,
+      "gzipLength": 15777,
       "brotliLength": 0,
-      "mainUid": "36b9-69"
+      "mainUid": "5c4d-68"
     },
-    "36b9-72": {
-      "renderedLength": 11304,
-      "gzipLength": 2961,
+    "5c4d-71": {
+      "renderedLength": 12237,
+      "gzipLength": 3143,
       "brotliLength": 0,
-      "mainUid": "36b9-71"
+      "mainUid": "5c4d-70"
     }
   },
   "nodeMetas": {
-    "36b9-67": {
+    "5c4d-66": {
       "id": "\u0000rollupPluginBabelHelpers.js",
       "moduleParts": {
-        "index.production.js": "36b9-68"
+        "index.production.js": "5c4d-67"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "36b9-71"
+          "uid": "5c4d-70"
         }
       ]
     },
-    "36b9-69": {
+    "5c4d-68": {
       "id": "/packages/router-core/build/esm/index.js",
       "moduleParts": {
-        "index.production.js": "36b9-70"
+        "index.production.js": "5c4d-69"
       },
       "imported": [],
       "importedBy": [
         {
-          "uid": "36b9-71"
+          "uid": "5c4d-70"
         }
       ]
     },
-    "36b9-71": {
+    "5c4d-70": {
       "id": "/packages/react-router/src/index.tsx",
       "moduleParts": {
-        "index.production.js": "36b9-72"
+        "index.production.js": "5c4d-71"
       },
       "imported": [
         {
-          "uid": "36b9-67"
+          "uid": "5c4d-66"
         },
         {
-          "uid": "36b9-73"
+          "uid": "5c4d-72"
         },
         {
-          "uid": "36b9-74"
+          "uid": "5c4d-73"
         },
         {
-          "uid": "36b9-69"
-        },
-        {
-          "uid": "36b9-75"
+          "uid": "5c4d-68"
         }
       ],
       "importedBy": [],
       "isEntry": true
     },
-    "36b9-73": {
+    "5c4d-72": {
       "id": "react",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "36b9-71"
+          "uid": "5c4d-70"
         }
       ],
       "isExternal": true
     },
-    "36b9-74": {
+    "5c4d-73": {
       "id": "use-sync-external-store/shim",
       "moduleParts": {},
       "imported": [],
       "importedBy": [
         {
-          "uid": "36b9-71"
-        }
-      ],
-      "isExternal": true
-    },
-    "36b9-75": {
-      "id": "react-lazy-with-preload/lib/index",
-      "moduleParts": {},
-      "imported": [],
-      "importedBy": [
-        {
-          "uid": "36b9-71"
+          "uid": "5c4d-70"
         }
       ],
       "isExternal": true

package/build/types/index.d.ts

@@ -9,17 +9,24 @@
  * @license MIT
  */
 import * as React from 'react';
-import { AnyRouteConfig, RouteConfig, AnyAllRouteInfo, AllRouteInfo, RouterState, RouteMatch, ToOptions, MatchRouteOptions, RouteInfoByPath, ResolveRelativePath, NoInfer, DefaultAllRouteInfo, AnyRouteInfo, RouteInfo, CheckId, ToIdOption, ValidFromPath, LinkOptions, RouterOptions, Router } from '@tanstack/router-core';
+import { AnyRouteConfig, RouteConfig, AnyAllRouteInfo, AllRouteInfo, RouterState, RouteMatch, ToOptions, MatchRouteOptions, RouteInfoByPath, ResolveRelativePath, NoInfer, DefaultAllRouteInfo, AnyRouteInfo, RouteInfo, CheckId, ToIdOption, ValidFromPath, LinkOptions, Router, RouterOptions } from '@tanstack/router-core';
 export * from '@tanstack/router-core';
-export { lazyWithPreload as lazy } from 'react-lazy-with-preload/lib/index';
-export { PreloadableComponent as LazyComponent } from 'react-lazy-with-preload';
 
-declare type SyncRouteComponent = (props?: {}) => React.ReactNode;
-declare type RouteComponent = SyncRouteComponent & {
-    preload?: () => Promise<{
-        default: SyncRouteComponent;
-    }>;
+interface ResolveRouter {
+}
+type ResolvedRouter = ResolveRouter extends {
+    router: Router<infer TRouteConfig, infer TAllRouteInfo>;
+} ? Router<TRouteConfig, TAllRouteInfo> : Router;
+type ResolvedAllRouteInfo = ResolveRouter extends {
+    router: Router<infer TRouteConfig, infer TAllRouteInfo>;
+} ? TAllRouteInfo : AnyAllRouteInfo;
+type SyncRouteComponent = (props?: {}) => JSX.Element | React.ReactNode;
+type RouteComponent = SyncRouteComponent & {
+    preload?: () => Promise<SyncRouteComponent>;
 };
+declare function lazy(importer: () => Promise<{
+    default: SyncRouteComponent;
+}>): RouteComponent;
 declare module '@tanstack/router-core' {
     interface FrameworkGenerics {
         Component: RouteComponent;
@@ -55,28 +62,40 @@ declare module '@tanstack/router-core' {
         }) => JSX.Element;
     }
 }
-declare type LinkPropsOptions<TAllRouteInfo extends AnyAllRouteInfo = DefaultAllRouteInfo, TFrom extends ValidFromPath<TAllRouteInfo> = '/', TTo extends string = '.'> = LinkOptions<TAllRouteInfo, TFrom, TTo> & {
+type LinkPropsOptions<TAllRouteInfo extends AnyAllRouteInfo = DefaultAllRouteInfo, TFrom extends ValidFromPath<TAllRouteInfo> = '/', TTo extends string = '.'> = LinkOptions<TAllRouteInfo, TFrom, TTo> & {
     activeProps?: React.AnchorHTMLAttributes<HTMLAnchorElement> | (() => React.AnchorHTMLAttributes<HTMLAnchorElement>);
     inactiveProps?: React.AnchorHTMLAttributes<HTMLAnchorElement> | (() => React.AnchorHTMLAttributes<HTMLAnchorElement>);
 };
-declare type PromptProps = {
+type PromptProps = {
     message: string;
     when?: boolean | any;
     children?: React.ReactNode;
 };
-declare type MatchesProviderProps = {
+declare function Link<TTo extends string = '.'>(props: LinkPropsOptions<ResolvedAllRouteInfo, '/', TTo> & React.AnchorHTMLAttributes<HTMLAnchorElement> & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> & {
+    children?: React.ReactNode | ((state: {
+        isActive: boolean;
+    }) => React.ReactNode);
+}): JSX.Element;
+declare const matchesContext: React.Context<RouteMatch<DefaultAllRouteInfo, RouteInfo<string, string, string, string, {}, {}, {}, unknown, unknown, {}, {}, {}, {}, Record<never, string>, {}>>[]>;
+declare const routerContext: React.Context<{
+    router: ResolvedRouter;
+}>;
+type MatchesProviderProps = {
     value: RouteMatch[];
     children: React.ReactNode;
 };
 declare function MatchesProvider(props: MatchesProviderProps): JSX.Element;
 declare function createReactRouter<TRouteConfig extends AnyRouteConfig = RouteConfig>(opts: RouterOptions<TRouteConfig>): Router<TRouteConfig>;
-declare type RouterProps<TRouteConfig extends AnyRouteConfig = RouteConfig, TAllRouteInfo extends AnyAllRouteInfo = DefaultAllRouteInfo> = RouterOptions<TRouteConfig> & {
+type RouterProps<TRouteConfig extends AnyRouteConfig = RouteConfig, TAllRouteInfo extends AnyAllRouteInfo = DefaultAllRouteInfo> = RouterOptions<TRouteConfig> & {
     router: Router<TRouteConfig, TAllRouteInfo>;
     children?: React.ReactNode;
 };
 declare function RouterProvider<TRouteConfig extends AnyRouteConfig = RouteConfig, TAllRouteInfo extends AnyAllRouteInfo = DefaultAllRouteInfo>({ children, router, ...rest }: RouterProps<TRouteConfig, TAllRouteInfo>): JSX.Element;
-declare function useRouter(): Router;
+declare function useRouter(): ResolvedRouter;
 declare function useMatches(): RouteMatch[];
+declare function useMatch<TId extends keyof ResolvedAllRouteInfo['routeInfoById'], TStrict extends true | false = true>(routeId: TId, opts?: {
+    strict?: TStrict;
+}): TStrict extends true ? RouteMatch<ResolvedAllRouteInfo, ResolvedAllRouteInfo['routeInfoById'][TId]> : RouteMatch<ResolvedAllRouteInfo, ResolvedAllRouteInfo['routeInfoById'][TId]> | undefined;
 declare function Outlet(): JSX.Element | null;
 declare function DefaultErrorBoundary({ error }: {
     error: any;
@@ -84,4 +103,4 @@ declare function DefaultErrorBoundary({ error }: {
 declare function usePrompt(message: string, when: boolean | any): void;
 declare function Prompt({ message, when, children }: PromptProps): React.ReactNode;
 
-export { DefaultErrorBoundary, MatchesProvider, MatchesProviderProps, Outlet, Prompt, PromptProps, RouteComponent, RouterProps, RouterProvider, createReactRouter, useMatches, usePrompt, useRouter };
+export { DefaultErrorBoundary, Link, MatchesProvider, MatchesProviderProps, Outlet, Prompt, PromptProps, ResolveRouter, ResolvedAllRouteInfo, ResolvedRouter, RouteComponent, RouterProps, RouterProvider, SyncRouteComponent, createReactRouter, lazy, matchesContext, routerContext, useMatch, useMatches, usePrompt, useRouter };

package/build/umd/index.development.js

@@ -9,10 +9,10 @@
  * @license MIT
  */
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('use-sync-external-store/shim'), require('react-lazy-with-preload/lib/index')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react', 'use-sync-external-store/shim', 'react-lazy-with-preload/lib/index'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactRouter = {}, global.React, global.shim, global.index));
-})(this, (function (exports, React, shim, index) { 'use strict';
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('use-sync-external-store/shim')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react', 'use-sync-external-store/shim'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.ReactRouter = {}, global.React, global.shim));
+})(this, (function (exports, React, shim) { 'use strict';
 
   function _interopNamespace(e) {
     if (e && e.__esModule) return e;
@@ -1549,11 +1549,19 @@
         }
       },
       fetch: async opts => {
-        const id = '' + Date.now() + Math.random();
-        routeMatch.__.latestId = id; // If the match was in an error state, set it
+        const loadId = '' + Date.now() + Math.random();
+        routeMatch.__.latestId = loadId;
+
+        const checkLatest = async () => {
+          if (loadId !== routeMatch.__.latestId) {
+            // warning(true, 'Data loader is out of date!')
+            return new Promise(() => {});
+          }
+        }; // If the match was in an error state, set it
         // to a loading state again. Otherwise, keep it
         // as loading or resolved
 
+
         if (routeMatch.status === 'idle') {
           routeMatch.status = 'loading';
         } // We started loading the route, so it's no longer invalid
@@ -1585,19 +1593,8 @@
               var _ref, _ref2, _opts$maxAge;
 
               if (routeMatch.options.loader) {
-                var _routeMatch$parentMat3;
-
-                const data = await routeMatch.options.loader({
-                  parentLoaderPromise: (_routeMatch$parentMat3 = routeMatch.parentMatch) == null ? void 0 : _routeMatch$parentMat3.__.dataPromise,
-                  params: routeMatch.params,
-                  search: routeMatch.routeSearch,
-                  signal: routeMatch.__.abortController.signal
-                });
-
-                if (id !== routeMatch.__.latestId) {
-                  return routeMatch.__.loadPromise;
-                }
-
+                const data = await router.loadMatchData(routeMatch);
+                await checkLatest();
                 routeMatch.routeLoaderData = replaceEqualDeep(routeMatch.routeLoaderData, data);
               }
 
@@ -1607,9 +1604,7 @@
               routeMatch.invalidAt = routeMatch.updatedAt + ((_ref = (_ref2 = (_opts$maxAge = opts == null ? void 0 : opts.maxAge) != null ? _opts$maxAge : routeMatch.options.loaderMaxAge) != null ? _ref2 : router.options.defaultLoaderMaxAge) != null ? _ref : 0);
               return routeMatch.routeLoaderData;
             } catch (err) {
-              if (id !== routeMatch.__.latestId) {
-                return routeMatch.__.loadPromise;
-              }
+              await checkLatest();
 
               {
                 console.error(err);
@@ -1622,29 +1617,23 @@
             }
           });
 
-          try {
-            await Promise.all([routeMatch.__.componentsPromise, routeMatch.__.dataPromise.catch(() => {})]);
-
-            if (id !== routeMatch.__.latestId) {
-              return routeMatch.__.loadPromise;
-            }
-          } finally {
-            if (id !== routeMatch.__.latestId) {
-              return routeMatch.__.loadPromise;
-            }
-
+          const after = async () => {
+            await checkLatest();
             routeMatch.isFetching = false;
+            delete routeMatch.__.loadPromise;
 
             routeMatch.__.notify();
+          };
+
+          try {
+            await Promise.all([routeMatch.__.componentsPromise, routeMatch.__.dataPromise.catch(() => {})]);
+            after();
+          } catch (_unused) {
+            after();
           }
         });
         await routeMatch.__.loadPromise;
-
-        if (id !== routeMatch.__.latestId) {
-          return routeMatch.__.loadPromise;
-        }
-
-        delete routeMatch.__.loadPromise;
+        await checkLatest();
       }
     });
 
@@ -1738,6 +1727,8 @@
     });
 
     let router = {
+      types: undefined,
+      // public api
       history,
       options: originalOptions,
       listeners: [],
@@ -1746,7 +1737,6 @@
       routeTree: undefined,
       routesById: {},
       location: undefined,
-      allRouteInfo: undefined,
       //
       navigationPromise: Promise.resolve(),
       resolveNavigation: () => {},
@@ -2129,6 +2119,11 @@
           match.__.validate();
 
           match.load(loaderOpts);
+          const search = match.search;
+
+          if (search.__data && search.__data.matchId !== match.matchId) {
+            return;
+          }
 
           if (match.__.loadPromise) {
             // Wait for the first sign of activity from the match
@@ -2138,6 +2133,37 @@
         router.notify();
         await Promise.all(matchPromises);
       },
+      loadMatchData: async routeMatch => {
+        if (isServer || !router.options.useServerData) {
+          var _await$routeMatch$opt;
+
+          return (_await$routeMatch$opt = await (routeMatch.options.loader == null ? void 0 : routeMatch.options.loader({
+            // parentLoaderPromise: routeMatch.parentMatch?.__.dataPromise,
+            params: routeMatch.params,
+            search: routeMatch.routeSearch,
+            signal: routeMatch.__.abortController.signal
+          }))) != null ? _await$routeMatch$opt : {};
+        } else {
+          const next = router.buildNext({
+            to: '.',
+            search: d => _extends({}, d != null ? d : {}, {
+              __data: {
+                matchId: routeMatch.matchId
+              }
+            })
+          });
+          const res = await fetch(next.href, {
+            method: 'GET' // signal: routeMatch.__.abortController.signal,
+
+          });
+
+          if (res.ok) {
+            return res.json();
+          }
+
+          throw new Error('Failed to fetch match data');
+        }
+      },
       invalidateRoute: opts => {
         var _router$state$pending5, _router$state$pending6;
 
@@ -2514,9 +2540,38 @@
   const _excluded = ["type", "children", "target", "activeProps", "inactiveProps", "activeOptions", "disabled", "hash", "search", "params", "to", "preload", "preloadDelay", "preloadMaxAge", "replace", "style", "className", "onClick", "onFocus", "onMouseEnter", "onMouseLeave", "onTouchStart", "onTouchEnd"],
         _excluded2 = ["pending", "caseSensitive", "children"],
         _excluded3 = ["children", "router"];
+  function lazy(importer) {
+    const lazyComp = /*#__PURE__*/React__namespace.lazy(importer);
+    let promise;
+    let resolvedComp;
+    const forwardedComp = /*#__PURE__*/React__namespace.forwardRef((props, ref) => {
+      const resolvedCompRef = React__namespace.useRef(resolvedComp || lazyComp);
+      return /*#__PURE__*/React__namespace.createElement(resolvedCompRef.current, _extends$2({}, ref ? {
+        ref
+      } : {}, props));
+    });
+    const finalComp = forwardedComp;
+
+    finalComp.preload = () => {
+      if (!promise) {
+        promise = importer().then(module => {
+          resolvedComp = module.default;
+          return resolvedComp;
+        });
+      }
+
+      return promise;
+    };
+
+    return finalComp;
+  }
   //
+  function Link(props) {
+    const router = useRouter();
+    return /*#__PURE__*/React__namespace.createElement(router.Link, props);
+  }
   const matchesContext = /*#__PURE__*/React__namespace.createContext(null);
-  const routerContext = /*#__PURE__*/React__namespace.createContext(null); // Detect if we're in the DOM
+  const routerContext = /*#__PURE__*/React__namespace.createContext(null);
   function MatchesProvider(props) {
     return /*#__PURE__*/React__namespace.createElement(matchesContext.Provider, props);
   }
@@ -2662,7 +2717,7 @@
 
             if ((_opts$strict = opts == null ? void 0 : opts.strict) != null ? _opts$strict : true) {
               invariant(match, "Could not find an active match for \"" + routeId + "\"!");
-              invariant(runtimeMatch.routeId == (match == null ? void 0 : match.routeId), "useMatch('" + (match == null ? void 0 : match.routeId) + "') is being called in a component that is meant to render the '" + runtimeMatch.routeId + "' route. Did you mean to 'useMatch(" + (match == null ? void 0 : match.routeId) + ", { strict: false })' or 'useRoute(" + (match == null ? void 0 : match.routeId) + ")' instead?");
+              invariant(runtimeMatch.routeId == (match == null ? void 0 : match.routeId), "useMatch(\"" + (match == null ? void 0 : match.routeId) + "\") is being called in a component that is meant to render the '" + runtimeMatch.routeId + "' route. Did you mean to 'useMatch(\"" + (match == null ? void 0 : match.routeId) + "\", { strict: false })' or 'useRoute(\"" + (match == null ? void 0 : match.routeId) + "\")' instead?");
             }
 
             return match;
@@ -2699,11 +2754,12 @@
     router.update(rest);
     useRouterSubscription(router);
     React__namespace.useEffect(() => {
+      console.log('hello');
       return router.mount();
     }, [router]);
     return /*#__PURE__*/React__namespace.createElement(routerContext.Provider, {
       value: {
-        router
+        router: router
       }
     }, /*#__PURE__*/React__namespace.createElement(MatchesProvider, {
       value: router.state.matches
@@ -2718,6 +2774,10 @@
   function useMatches() {
     return React__namespace.useContext(matchesContext);
   }
+  function useMatch(routeId, opts) {
+    const router = useRouter();
+    return router.useMatch(routeId, opts);
+  }
   function Outlet() {
     var _ref3, _match$__$pendingComp, _match$__$errorCompon;
 
@@ -2749,12 +2809,8 @@
         return /*#__PURE__*/React__namespace.createElement((_ref4 = (_ref5 = match.__.component) != null ? _ref5 : router.options.defaultComponent) != null ? _ref4 : Outlet);
       }
 
-      if (match.__.loadPromise) {
-        console.log(match.matchId, 'suspend');
-        throw match.__.loadPromise;
-      }
-
-      invariant(false, 'This should never happen!');
+      console.log(match.matchId, 'suspend');
+      throw match.__.loadPromise;
     })())));
   }
 
@@ -2840,11 +2896,8 @@
     return children != null ? children : null;
   }
 
-  Object.defineProperty(exports, 'lazy', {
-    enumerable: true,
-    get: function () { return index.lazyWithPreload; }
-  });
   exports.DefaultErrorBoundary = DefaultErrorBoundary;
+  exports.Link = Link;
   exports.MatchesProvider = MatchesProvider;
   exports.Outlet = Outlet;
   exports.Prompt = Prompt;
@@ -2867,18 +2920,22 @@
   exports.invariant = invariant;
   exports.joinPaths = joinPaths;
   exports.last = last;
+  exports.lazy = lazy;
   exports.matchByPath = matchByPath;
   exports.matchPathname = matchPathname;
+  exports.matchesContext = matchesContext;
   exports.parsePathname = parsePathname;
   exports.parseSearchWith = parseSearchWith;
   exports.pick = pick;
   exports.replaceEqualDeep = replaceEqualDeep;
   exports.resolvePath = resolvePath;
   exports.rootRouteId = rootRouteId;
+  exports.routerContext = routerContext;
   exports.stringifySearchWith = stringifySearchWith;
   exports.trimPath = trimPath;
   exports.trimPathLeft = trimPathLeft;
   exports.trimPathRight = trimPathRight;
+  exports.useMatch = useMatch;
   exports.useMatches = useMatches;
   exports.usePrompt = usePrompt;
   exports.useRouter = useRouter;