@tanstack/react-router 1.7.0 → 1.8.0

package/dist/cjs/useNavigate.cjs

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const Matches = require("./Matches.cjs");
+const useRouter = require("./useRouter.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+function useNavigate(_defaultOpts) {
+  const { navigate } = useRouter.useRouter();
+  const matchPathname = Matches.useMatch({
+    strict: false,
+    select: (s) => s.pathname
+  });
+  return React__namespace.useCallback(
+    ({
+      from,
+      ...rest
+    }) => {
+      return navigate({
+        from: (rest == null ? void 0 : rest.to) ? matchPathname : void 0,
+        ...rest
+      });
+    },
+    []
+  );
+}
+function Navigate(props) {
+  const { navigate } = useRouter.useRouter();
+  const match = Matches.useMatch({ strict: false });
+  React__namespace.useEffect(() => {
+    navigate({
+      from: props.to ? match.pathname : void 0,
+      ...props
+    });
+  }, []);
+  return null;
+}
+exports.Navigate = Navigate;
+exports.useNavigate = useNavigate;
+//# sourceMappingURL=useNavigate.cjs.map

package/dist/cjs/useNavigate.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNavigate.cjs","sources":["../../src/useNavigate.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useMatch } from './Matches'\nimport { useRouter } from './useRouter'\nimport { LinkOptions, NavigateOptions } from './link'\nimport { AnyRoute } from './route'\nimport { RoutePaths } from './routeInfo'\nimport { RegisteredRouter } from './router'\nimport { StringLiteral } from './utils'\n\nexport function useNavigate<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TDefaultFrom extends RoutePaths<TRouteTree> | string = RoutePaths<TRouteTree>,\n>(_defaultOpts?: { from?: StringLiteral<TDefaultFrom> }) {\n  const { navigate } = useRouter()\n\n  const matchPathname = useMatch({\n    strict: false,\n    select: (s) => s.pathname,\n  })\n\n  return React.useCallback(\n    <\n      TFrom extends RoutePaths<TRouteTree> | string = TDefaultFrom,\n      TTo extends string = '',\n      TMaskFrom extends RoutePaths<TRouteTree> | string = TFrom,\n      TMaskTo extends string = '',\n    >({\n      from,\n      ...rest\n    }: NavigateOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>) => {\n      return navigate({\n        from: rest?.to ? matchPathname : undefined,\n        ...(rest as any),\n      })\n    },\n    [],\n  )\n}\n\n// NOTE: I don't know of anyone using this. It's undocumented, so let's wait until someone needs it\n// export function typedNavigate<\n//   TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n//   TDefaultFrom extends RoutePaths<TRouteTree> = '/',\n// >(navigate: (opts: NavigateOptions<any>) => Promise<void>) {\n//   return navigate as <\n//     TFrom extends RoutePaths<TRouteTree> = TDefaultFrom,\n//     TTo extends string = '',\n//     TMaskFrom extends RoutePaths<TRouteTree> = '/',\n//     TMaskTo extends string = '',\n//   >(\n//     opts?: NavigateOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>,\n//   ) => Promise<void>\n// } //\n\nexport function Navigate<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TFrom extends RoutePaths<TRouteTree> | string = string,\n  TTo extends string = '',\n  TMaskFrom extends RoutePaths<TRouteTree> | string = TFrom,\n  TMaskTo extends string = '',\n>(props: NavigateOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>): null {\n  const { navigate } = useRouter()\n  const match = useMatch({ strict: false })\n\n  React.useEffect(() => {\n    navigate({\n      from: props.to ? match.pathname : undefined,\n      ...props,\n    } as any)\n  }, [])\n\n  return null\n}\n\nexport type UseLinkPropsOptions<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TFrom extends RoutePaths<TRouteTree> | string = string,\n  TTo extends string = '',\n  TMaskFrom extends RoutePaths<TRouteTree> | string = TFrom,\n  TMaskTo extends string = '',\n> = ActiveLinkOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &\n  React.AnchorHTMLAttributes<HTMLAnchorElement>\n\nexport type LinkProps<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TFrom extends RoutePaths<TRouteTree> | string = string,\n  TTo extends string = '',\n  TMaskFrom extends RoutePaths<TRouteTree> | string = TFrom,\n  TMaskTo extends string = '',\n> = ActiveLinkOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> &\n  Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> & {\n    // If a function is passed as a child, it will be given the `isActive` boolean to aid in further styling on the element it returns\n    children?:\n      | React.ReactNode\n      | ((state: { isActive: boolean }) => React.ReactNode)\n  }\n\nexport type ActiveLinkOptions<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TFrom extends RoutePaths<TRouteTree> | string = string,\n  TTo extends string = '',\n  TMaskFrom extends RoutePaths<TRouteTree> | string = TFrom,\n  TMaskTo extends string = '',\n> = LinkOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> & {\n  // A function that returns additional props for the `active` state of this link. These props override other props passed to the link (`style`'s are merged, `className`'s are concatenated)\n  activeProps?:\n    | React.AnchorHTMLAttributes<HTMLAnchorElement>\n    | (() => React.AnchorHTMLAttributes<HTMLAnchorElement>)\n  // A function that returns additional props for the `inactive` state of this link. These props override other props passed to the link (`style`'s are merged, `className`'s are concatenated)\n  inactiveProps?:\n    | React.AnchorHTMLAttributes<HTMLAnchorElement>\n    | (() => React.AnchorHTMLAttributes<HTMLAnchorElement>)\n}\n"],"names":["useRouter","useMatch","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AASO,SAAS,YAGd,cAAuD;AACjD,QAAA,EAAE,aAAaA,UAAAA;AAErB,QAAM,gBAAgBC,QAAAA,SAAS;AAAA,IAC7B,QAAQ;AAAA,IACR,QAAQ,CAAC,MAAM,EAAE;AAAA,EAAA,CAClB;AAED,SAAOC,iBAAM;AAAA,IACX,CAKE;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IAAA,MAC8D;AACjE,aAAO,SAAS;AAAA,QACd,OAAM,6BAAM,MAAK,gBAAgB;AAAA,QACjC,GAAI;AAAA,MAAA,CACL;AAAA,IACH;AAAA,IACA,CAAC;AAAA,EAAA;AAEL;AAiBO,SAAS,SAMd,OAA0E;AACpE,QAAA,EAAE,aAAaF,UAAAA;AACrB,QAAM,QAAQC,QAAA,SAAS,EAAE,QAAQ,MAAO,CAAA;AAExCC,mBAAM,UAAU,MAAM;AACX,aAAA;AAAA,MACP,MAAM,MAAM,KAAK,MAAM,WAAW;AAAA,MAClC,GAAG;AAAA,IAAA,CACG;AAAA,EACV,GAAG,CAAE,CAAA;AAEE,SAAA;AACT;;;"}

package/dist/cjs/useParams.cjs

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const utils = require("./utils.cjs");
+const useRouterState = require("./useRouterState.cjs");
+const Matches = require("./Matches.cjs");
+function useParams(opts) {
+  return useRouterState.useRouterState({
+    select: (state) => {
+      var _a;
+      const params = (_a = utils.last(Matches.getRenderedMatches(state))) == null ? void 0 : _a.params;
+      return (opts == null ? void 0 : opts.select) ? opts.select(params) : params;
+    }
+  });
+}
+exports.useParams = useParams;
+//# sourceMappingURL=useParams.cjs.map

package/dist/cjs/useParams.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useParams.cjs","sources":["../../src/useParams.tsx"],"sourcesContent":["import { AnyRoute } from './route'\nimport { RouteIds, RouteById } from './routeInfo'\nimport { RegisteredRouter } from './router'\nimport { last } from './utils'\nimport { useRouterState } from './useRouterState'\nimport { StrictOrFrom } from './utils'\nimport { getRenderedMatches } from './Matches'\n\nexport function useParams<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TFrom extends RouteIds<TRouteTree> = RouteIds<TRouteTree>,\n  TParams = RouteById<TRouteTree, TFrom>['types']['allParams'],\n  TSelected = TParams,\n>(\n  opts: StrictOrFrom<TFrom> & {\n    select?: (params: TParams) => TSelected\n  },\n): TSelected {\n  return useRouterState({\n    select: (state: any) => {\n      const params = (last(getRenderedMatches(state)) as any)?.params\n      return opts?.select ? opts.select(params) : params\n    },\n  })\n}\n"],"names":["useRouterState","last","getRenderedMatches"],"mappings":";;;;;AAQO,SAAS,UAMd,MAGW;AACX,SAAOA,8BAAe;AAAA,IACpB,QAAQ,CAAC,UAAe;;AACtB,YAAM,UAAUC,WAAAA,KAAKC,QAAAA,mBAAmB,KAAK,CAAC,MAA9BD,mBAAyC;AACzD,cAAO,6BAAM,UAAS,KAAK,OAAO,MAAM,IAAI;AAAA,IAC9C;AAAA,EAAA,CACD;AACH;;"}

package/dist/cjs/useRouteContext.cjs

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const Matches = require("./Matches.cjs");
+function useRouteContext(opts) {
+  return Matches.useMatch({
+    ...opts,
+    select: (match) => (opts == null ? void 0 : opts.select) ? opts.select(match.context) : match.context
+  });
+}
+exports.useRouteContext = useRouteContext;
+//# sourceMappingURL=useRouteContext.cjs.map

package/dist/cjs/useRouteContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRouteContext.cjs","sources":["../../src/useRouteContext.ts"],"sourcesContent":["import { useMatch, RouteMatch } from './Matches'\nimport { AnyRoute } from './route'\nimport { RouteIds, RouteById } from './routeInfo'\nimport { RegisteredRouter } from './router'\nimport { StrictOrFrom } from './utils'\n\nexport function useRouteContext<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TFrom extends RouteIds<TRouteTree> = RouteIds<TRouteTree>,\n  TRouteContext = RouteById<TRouteTree, TFrom>['types']['allContext'],\n  TSelected = TRouteContext,\n>(\n  opts: StrictOrFrom<TFrom> & {\n    select?: (search: TRouteContext) => TSelected\n  },\n): TSelected {\n  return useMatch({\n    ...(opts as any),\n    select: (match: RouteMatch) =>\n      opts?.select\n        ? opts.select(match.context as TRouteContext)\n        : match.context,\n  })\n}\n"],"names":["useMatch"],"mappings":";;;AAMO,SAAS,gBAMd,MAGW;AACX,SAAOA,iBAAS;AAAA,IACd,GAAI;AAAA,IACJ,QAAQ,CAAC,WACP,6BAAM,UACF,KAAK,OAAO,MAAM,OAAwB,IAC1C,MAAM;AAAA,EAAA,CACb;AACH;;"}

package/dist/cjs/useRouter.cjs

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const warning = require("tiny-warning");
+const routerContext = require("./routerContext.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+function useRouter(opts) {
+  const resolvedContext = typeof document !== "undefined" ? window.__TSR_ROUTER_CONTEXT__ || routerContext.routerContext : routerContext.routerContext;
+  const value = React__namespace.useContext(resolvedContext);
+  warning(
+    !(((opts == null ? void 0 : opts.warn) ?? true) && !value),
+    "useRouter must be used inside a <RouterProvider> component!"
+  );
+  return value;
+}
+exports.useRouter = useRouter;
+//# sourceMappingURL=useRouter.cjs.map

package/dist/cjs/useRouter.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRouter.cjs","sources":["../../src/useRouter.tsx"],"sourcesContent":["import * as React from 'react'\nimport warning from 'tiny-warning'\nimport { AnyRoute } from './route'\nimport { RegisteredRouter, Router } from './router'\nimport { routerContext } from './routerContext'\n\nexport function useRouter<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n>(opts?: { warn?: boolean }): Router<TRouteTree> {\n  const resolvedContext =\n    typeof document !== 'undefined'\n      ? window.__TSR_ROUTER_CONTEXT__ || routerContext\n      : routerContext\n  const value = React.useContext(resolvedContext)\n  warning(\n    !((opts?.warn ?? true) && !value),\n    'useRouter must be used inside a <RouterProvider> component!',\n  )\n  return value as any\n}\n"],"names":["routerContext","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAMO,SAAS,UAEd,MAA+C;AAC/C,QAAM,kBACJ,OAAO,aAAa,cAChB,OAAO,0BAA0BA,cACjC,gBAAAA;AACA,QAAA,QAAQC,iBAAM,WAAW,eAAe;AAC9C;AAAA,IACE,IAAG,6BAAM,SAAQ,SAAS,CAAC;AAAA,IAC3B;AAAA,EAAA;AAEK,SAAA;AACT;;"}

package/dist/cjs/useRouterState.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const reactStore = require("@tanstack/react-store");
+const useRouter = require("./useRouter.cjs");
+function useRouterState(opts) {
+  const contextRouter = useRouter.useRouter({
+    warn: (opts == null ? void 0 : opts.router) === void 0
+  });
+  return reactStore.useStore(((opts == null ? void 0 : opts.router) || contextRouter).__store, opts == null ? void 0 : opts.select);
+}
+exports.useRouterState = useRouterState;
+//# sourceMappingURL=useRouterState.cjs.map

package/dist/cjs/useRouterState.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRouterState.cjs","sources":["../../src/useRouterState.tsx"],"sourcesContent":["import { useStore } from '@tanstack/react-store'\nimport { AnyRoute } from './route'\nimport { RegisteredRouter, Router, RouterState } from './router'\nimport { useRouter } from './useRouter'\n\nexport function useRouterState<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TSelected = RouterState<TRouteTree>,\n>(opts?: {\n  router?: Router<TRouteTree>\n  select: (state: RouterState<RegisteredRouter['routeTree']>) => TSelected\n}): TSelected {\n  const contextRouter = useRouter<TRouteTree>({\n    warn: opts?.router === undefined,\n  })\n  return useStore((opts?.router || contextRouter).__store, opts?.select as any)\n}\n"],"names":["useRouter","useStore"],"mappings":";;;;AAKO,SAAS,eAGd,MAGY;AACZ,QAAM,gBAAgBA,UAAAA,UAAsB;AAAA,IAC1C,OAAM,6BAAM,YAAW;AAAA,EAAA,CACxB;AACD,SAAOC,sBAAU,6BAAM,WAAU,eAAe,SAAS,6BAAM,MAAa;AAC9E;;"}

package/dist/cjs/useSearch.cjs

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const Matches = require("./Matches.cjs");
+function useSearch(opts) {
+  return Matches.useMatch({
+    ...opts,
+    select: (match) => {
+      return (opts == null ? void 0 : opts.select) ? opts.select(match.search) : match.search;
+    }
+  });
+}
+exports.useSearch = useSearch;
+//# sourceMappingURL=useSearch.cjs.map

package/dist/cjs/useSearch.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSearch.cjs","sources":["../../src/useSearch.tsx"],"sourcesContent":["import { AnyRoute, RootSearchSchema } from './route'\nimport { RouteIds, RouteById } from './routeInfo'\nimport { RegisteredRouter } from './router'\nimport { RouteMatch } from './Matches'\nimport { useMatch } from './Matches'\nimport { StrictOrFrom } from './utils'\n\nexport function useSearch<\n  TRouteTree extends AnyRoute = RegisteredRouter['routeTree'],\n  TFrom extends RouteIds<TRouteTree> = RouteIds<TRouteTree>,\n  TSearch = Exclude<\n    RouteById<TRouteTree, TFrom>['types']['fullSearchSchema'],\n    RootSearchSchema\n  >,\n  TSelected = TSearch,\n>(\n  opts: StrictOrFrom<TFrom> & {\n    select?: (search: TSearch) => TSelected\n  },\n): TSelected {\n  return useMatch({\n    ...opts,\n    select: (match: RouteMatch) => {\n      return opts?.select ? opts.select(match.search as TSearch) : match.search\n    },\n  })\n}\n"],"names":["useMatch"],"mappings":";;;AAOO,SAAS,UASd,MAGW;AACX,SAAOA,iBAAS;AAAA,IACd,GAAG;AAAA,IACH,QAAQ,CAAC,UAAsB;AAC7B,cAAO,6BAAM,UAAS,KAAK,OAAO,MAAM,MAAiB,IAAI,MAAM;AAAA,IACrE;AAAA,EAAA,CACD;AACH;;"}

package/{build/cjs/utils.js → dist/cjs/utils.cjs}

@@ -1,102 +1,29 @@
-/**
- * @tanstack/react-router/src/index.tsx
- *
- * Copyright (c) TanStack
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE.md file in the root directory of this source tree.
- *
- * @license MIT
- */
-'use strict';
-
-var React = require('react');
-
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
 function _interopNamespaceDefault(e) {
-  var n = Object.create(null);
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
         Object.defineProperty(n, k, d.get ? d : {
           enumerable: true,
-          get: function () { return e[k]; }
+          get: () => e[k]
         });
       }
-    });
+    }
   }
   n.default = e;
   return Object.freeze(n);
 }
-
-var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
-
-// from https://stackoverflow.com/a/76458160
-
-// export type Expand<T> = T
-
-// type Compute<T> = { [K in keyof T]: T[K] } | never
-
-// type AllKeys<T> = T extends any ? keyof T : never
-
-// export type MergeUnion<T, Keys extends keyof T = keyof T> = Compute<
-//   {
-//     [K in Keys]: T[Keys]
-//   } & {
-//     [K in AllKeys<T>]?: T extends any
-//       ? K extends keyof T
-//         ? T[K]
-//         : never
-//       : never
-//   }
-// >
-
-// // Sample types to merge
-// type TypeA = {
-//   shared: string
-//   onlyInA: string
-//   nested: {
-//     shared: string
-//     aProp: string
-//   }
-//   array: string[]
-// }
-
-// type TypeB = {
-//   shared: number
-//   onlyInB: number
-//   nested: {
-//     shared: number
-//     bProp: number
-//   }
-//   array: number[]
-// }
-
-// type TypeC = {
-//   shared: boolean
-//   onlyInC: boolean
-//   nested: {
-//     shared: boolean
-//     cProp: boolean
-//   }
-//   array: boolean[]
-// }
-
-// type Test = Expand<Assign<TypeA, TypeB>>
-
-// // Using DeepMerge to merge TypeA and TypeB
-// type MergedType = Expand<AssignAll<[TypeA, TypeB, TypeC]>>
-
-// from https://github.com/type-challenges/type-challenges/issues/737
-
-//
-
-const isServer = typeof document === 'undefined';
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const isServer = typeof document === "undefined";
 function last(arr) {
   return arr[arr.length - 1];
 }
 function isFunction(d) {
-  return typeof d === 'function';
+  return typeof d === "function";
 }
 function functionalUpdate(updater, previous) {
   if (isFunction(updater)) {
@@ -110,13 +37,6 @@ function pick(parent, keys) {
     return obj;
   }, {});
 }
-
-/**
- * This function returns `prev` if `_next` is deeply equal.
- * If not, it will replace any deeply equal children of `b` with those of `a`.
- * This can be used for structural sharing between immutable JSON values for example.
- * Do not use this with signals
- */
 function replaceEqualDeep(prev, _next) {
   if (prev === _next) {
     return prev;
@@ -132,12 +52,12 @@ function replaceEqualDeep(prev, _next) {
     let equalItems = 0;
     for (let i = 0; i < nextSize; i++) {
       const key = array ? i : nextItems[i];
-      if (!array && prev[key] === undefined && next[key] === undefined && prevItems.includes(key)) {
-        copy[key] = undefined;
+      if (!array && prev[key] === void 0 && next[key] === void 0 && prevItems.includes(key)) {
+        copy[key] = void 0;
         equalItems++;
       } else {
         copy[key] = replaceEqualDeep(prev[key], next[key]);
-        if (copy[key] === prev[key] && prev[key] !== undefined) {
+        if (copy[key] === prev[key] && prev[key] !== void 0) {
           equalItems++;
         }
       }
@@ -146,35 +66,25 @@ function replaceEqualDeep(prev, _next) {
   }
   return next;
 }
-
-// Copied from: https://github.com/jonschlinkert/is-plain-object
 function isPlainObject(o) {
   if (!hasObjectPrototype(o)) {
     return false;
   }
-
-  // If has modified constructor
   const ctor = o.constructor;
-  if (typeof ctor === 'undefined') {
+  if (typeof ctor === "undefined") {
     return true;
   }
-
-  // If has modified prototype
   const prot = ctor.prototype;
   if (!hasObjectPrototype(prot)) {
     return false;
   }
-
-  // If constructor does not have an Object-specific method
-  if (!prot.hasOwnProperty('isPrototypeOf')) {
+  if (!prot.hasOwnProperty("isPrototypeOf")) {
     return false;
   }
-
-  // Most likely a plain Object
   return true;
 }
 function hasObjectPrototype(o) {
-  return Object.prototype.toString.call(o) === '[object Object]';
+  return Object.prototype.toString.call(o) === "[object Object]";
 }
 function isPlainArray(value) {
   return Array.isArray(value) && value.length === Object.keys(value).length;
@@ -192,7 +102,9 @@ function deepEqual(a, b, partial = false) {
     if (!partial && aKeys.length !== bKeys.length) {
       return false;
     }
-    return !bKeys.some(key => !(key in a) || !deepEqual(a[key], b[key], partial));
+    return !bKeys.some(
+      (key) => !(key in a) || !deepEqual(a[key], b[key], partial)
+    );
   }
   if (Array.isArray(a) && Array.isArray(b)) {
     return !a.some((item, index) => !deepEqual(item, b[index], partial));
@@ -209,7 +121,7 @@ function shallow(objA, objB) {
   if (Object.is(objA, objB)) {
     return true;
   }
-  if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
+  if (typeof objA !== "object" || objA === null || typeof objB !== "object" || objB === null) {
     return false;
   }
   const keysA = Object.keys(objA);
@@ -223,13 +135,10 @@ function shallow(objA, objB) {
   }
   return true;
 }
-const useLayoutEffect = typeof window !== 'undefined' ? React__namespace.useLayoutEffect : React__namespace.useEffect;
+const useLayoutEffect = typeof window !== "undefined" ? React__namespace.useLayoutEffect : React__namespace.useEffect;
 function escapeJSON(jsonString) {
-  return jsonString.replace(/\\/g, '\\\\') // Escape backslashes
-  .replace(/'/g, "\\'") // Escape single quotes
-  .replace(/"/g, '\\"'); // Escape double quotes
+  return jsonString.replace(/\\/g, "\\\\").replace(/'/g, "\\'").replace(/"/g, '\\"');
 }
-
 exports.deepEqual = deepEqual;
 exports.escapeJSON = escapeJSON;
 exports.functionalUpdate = functionalUpdate;
@@ -242,4 +151,4 @@ exports.replaceEqualDeep = replaceEqualDeep;
 exports.shallow = shallow;
 exports.useLayoutEffect = useLayoutEffect;
 exports.useStableCallback = useStableCallback;
-//# sourceMappingURL=utils.js.map
+//# sourceMappingURL=utils.cjs.map

package/dist/cjs/utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.cjs","sources":["../../src/utils.ts"],"sourcesContent":["import * as React from 'react'\n\nexport type NoInfer<T> = [T][T extends any ? 0 : never]\nexport type IsAny<T, Y, N = T> = 1 extends 0 & T ? Y : N\nexport type PickAsRequired<T, K extends keyof T> = Omit<T, K> &\n  Required<Pick<T, K>>\n\nexport type PickRequired<T> = {\n  [K in keyof T as undefined extends T[K] ? never : K]: T[K]\n}\n\n// from https://stackoverflow.com/a/76458160\nexport type WithoutEmpty<T> = T extends T ? ({} extends T ? never : T) : never\n\n// export type Expand<T> = T\nexport type Expand<T> = T extends object\n  ? T extends infer O\n    ? { [K in keyof O]: O[K] }\n    : never\n  : T\n\nexport type UnionToIntersection<U> = (\n  U extends any ? (k: U) => void : never\n) extends (k: infer I) => any\n  ? I\n  : never\n\n// type Compute<T> = { [K in keyof T]: T[K] } | never\n\n// type AllKeys<T> = T extends any ? keyof T : never\n\n// export type MergeUnion<T, Keys extends keyof T = keyof T> = Compute<\n//   {\n//     [K in Keys]: T[Keys]\n//   } & {\n//     [K in AllKeys<T>]?: T extends any\n//       ? K extends keyof T\n//         ? T[K]\n//         : never\n//       : never\n//   }\n// >\n\nexport type Assign<Left, Right> = Omit<Left, keyof Right> & Right\n\nexport type AssignAll<T extends any[]> = T extends [infer Left, ...infer Right]\n  ? Right extends any[]\n    ? Assign<Left, AssignAll<Right>>\n    : Left\n  : {}\n\n// // Sample types to merge\n// type TypeA = {\n//   shared: string\n//   onlyInA: string\n//   nested: {\n//     shared: string\n//     aProp: string\n//   }\n//   array: string[]\n// }\n\n// type TypeB = {\n//   shared: number\n//   onlyInB: number\n//   nested: {\n//     shared: number\n//     bProp: number\n//   }\n//   array: number[]\n// }\n\n// type TypeC = {\n//   shared: boolean\n//   onlyInC: boolean\n//   nested: {\n//     shared: boolean\n//     cProp: boolean\n//   }\n//   array: boolean[]\n// }\n\n// type Test = Expand<Assign<TypeA, TypeB>>\n\n// // Using DeepMerge to merge TypeA and TypeB\n// type MergedType = Expand<AssignAll<[TypeA, TypeB, TypeC]>>\n\nexport type Timeout = ReturnType<typeof setTimeout>\n\nexport type Updater<TPrevious, TResult = TPrevious> =\n  | TResult\n  | ((prev?: TPrevious) => TResult)\n\nexport type NonNullableUpdater<TPrevious, TResult = TPrevious> =\n  | TResult\n  | ((prev: TPrevious) => TResult)\n\n// from https://github.com/type-challenges/type-challenges/issues/737\ntype LastInUnion<U> = UnionToIntersection<\n  U extends unknown ? (x: U) => 0 : never\n> extends (x: infer L) => 0\n  ? L\n  : never\nexport type UnionToTuple<U, Last = LastInUnion<U>> = [U] extends [never]\n  ? []\n  : [...UnionToTuple<Exclude<U, Last>>, Last]\n\n//\n\nexport const isServer = typeof document === 'undefined'\n\nexport function last<T>(arr: T[]) {\n  return arr[arr.length - 1]\n}\n\nfunction isFunction(d: any): d is Function {\n  return typeof d === 'function'\n}\n\nexport function functionalUpdate<TResult>(\n  updater: Updater<TResult> | NonNullableUpdater<TResult>,\n  previous: TResult,\n): TResult {\n  if (isFunction(updater)) {\n    return updater(previous as TResult)\n  }\n\n  return updater\n}\n\nexport function pick<T, K extends keyof T>(parent: T, keys: K[]): Pick<T, K> {\n  return keys.reduce((obj: any, key: K) => {\n    obj[key] = parent[key]\n    return obj\n  }, {} as any)\n}\n\n/**\n * This function returns `prev` if `_next` is deeply equal.\n * If not, it will replace any deeply equal children of `b` with those of `a`.\n * This can be used for structural sharing between immutable JSON values for example.\n * Do not use this with signals\n */\nexport function replaceEqualDeep<T>(prev: any, _next: T): T {\n  if (prev === _next) {\n    return prev\n  }\n\n  const next = _next as any\n\n  const array = isPlainArray(prev) && isPlainArray(next)\n\n  if (array || (isPlainObject(prev) && isPlainObject(next))) {\n    const prevItems = array ? prev : Object.keys(prev)\n    const prevSize = prevItems.length\n    const nextItems = array ? next : Object.keys(next)\n    const nextSize = nextItems.length\n    const copy: any = array ? [] : {}\n\n    let equalItems = 0\n\n    for (let i = 0; i < nextSize; i++) {\n      const key = array ? i : nextItems[i]\n      if (\n        !array &&\n        prev[key] === undefined &&\n        next[key] === undefined &&\n        prevItems.includes(key)\n      ) {\n        copy[key] = undefined\n        equalItems++\n      } else {\n        copy[key] = replaceEqualDeep(prev[key], next[key])\n        if (copy[key] === prev[key] && prev[key] !== undefined) {\n          equalItems++\n        }\n      }\n    }\n\n    return prevSize === nextSize && equalItems === prevSize ? prev : copy\n  }\n\n  return next\n}\n\n// Copied from: https://github.com/jonschlinkert/is-plain-object\nexport function isPlainObject(o: any) {\n  if (!hasObjectPrototype(o)) {\n    return false\n  }\n\n  // If has modified constructor\n  const ctor = o.constructor\n  if (typeof ctor === 'undefined') {\n    return true\n  }\n\n  // If has modified prototype\n  const prot = ctor.prototype\n  if (!hasObjectPrototype(prot)) {\n    return false\n  }\n\n  // If constructor does not have an Object-specific method\n  if (!prot.hasOwnProperty('isPrototypeOf')) {\n    return false\n  }\n\n  // Most likely a plain Object\n  return true\n}\n\nfunction hasObjectPrototype(o: any) {\n  return Object.prototype.toString.call(o) === '[object Object]'\n}\n\nexport function isPlainArray(value: unknown) {\n  return Array.isArray(value) && value.length === Object.keys(value).length\n}\n\nexport function deepEqual(a: any, b: any, partial: boolean = false): boolean {\n  if (a === b) {\n    return true\n  }\n\n  if (typeof a !== typeof b) {\n    return false\n  }\n\n  if (isPlainObject(a) && isPlainObject(b)) {\n    const aKeys = Object.keys(a)\n    const bKeys = Object.keys(b)\n\n    if (!partial && aKeys.length !== bKeys.length) {\n      return false\n    }\n\n    return !bKeys.some(\n      (key) => !(key in a) || !deepEqual(a[key], b[key], partial),\n    )\n  }\n\n  if (Array.isArray(a) && Array.isArray(b)) {\n    return !a.some((item, index) => !deepEqual(item, b[index], partial))\n  }\n\n  return false\n}\n\nexport function useStableCallback<T extends (...args: any[]) => any>(fn: T): T {\n  const fnRef = React.useRef(fn)\n  fnRef.current = fn\n\n  const ref = React.useRef((...args: any[]) => fnRef.current(...args))\n  return ref.current as T\n}\n\nexport function shallow<T>(objA: T, objB: T) {\n  if (Object.is(objA, objB)) {\n    return true\n  }\n\n  if (\n    typeof objA !== 'object' ||\n    objA === null ||\n    typeof objB !== 'object' ||\n    objB === null\n  ) {\n    return false\n  }\n\n  const keysA = Object.keys(objA)\n  if (keysA.length !== Object.keys(objB).length) {\n    return false\n  }\n\n  for (let i = 0; i < keysA.length; i++) {\n    if (\n      !Object.prototype.hasOwnProperty.call(objB, keysA[i] as string) ||\n      !Object.is(objA[keysA[i] as keyof T], objB[keysA[i] as keyof T])\n    ) {\n      return false\n    }\n  }\n  return true\n}\n\nexport type StringLiteral<T> = T extends string\n  ? string extends T\n    ? string\n    : T\n  : never\n\nexport type StrictOrFrom<TFrom> =\n  | {\n      from: StringLiteral<TFrom> | TFrom\n      strict?: true\n    }\n  | {\n      from?: never\n      strict: false\n    }\n\nexport const useLayoutEffect =\n  typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect\n\nexport function escapeJSON(jsonString: string) {\n  return jsonString\n    .replace(/\\\\/g, '\\\\\\\\') // Escape backslashes\n    .replace(/'/g, \"\\\\'\") // Escape single quotes\n    .replace(/\"/g, '\\\\\"') // Escape double quotes\n}\n"],"names":["React"],"mappings":"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"}

package/dist/esm/CatchBoundary.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+export declare function CatchBoundary(props: {
+    getResetKey: () => string;
+    children: any;
+    errorComponent?: any;
+    onCatch?: (error: any) => void;
+}): React.JSX.Element;
+export declare class CatchBoundaryImpl extends React.Component<{
+    getResetKey: () => string;
+    children: (props: {
+        error: any;
+        reset: () => void;
+    }) => any;
+    onCatch?: (error: any) => void;
+}> {
+    state: any;
+    static getDerivedStateFromProps(props: any): {
+        resetKey: any;
+    };
+    static getDerivedStateFromError(error: any): {
+        error: any;
+    };
+    componentDidUpdate(prevProps: Readonly<{
+        getResetKey: () => string;
+        children: (props: {
+            error: any;
+            reset: () => void;
+        }) => any;
+        onCatch?: ((error: any, info: any) => void) | undefined;
+    }>, prevState: any): void;
+    componentDidCatch(error: any): void;
+    render(): any;
+}
+export declare function ErrorComponent({ error }: {
+    error: any;
+}): React.JSX.Element;

package/dist/esm/CatchBoundary.js

@@ -0,0 +1,89 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+function CatchBoundary(props) {
+  const errorComponent = props.errorComponent ?? ErrorComponent;
+  return /* @__PURE__ */ jsx(
+    CatchBoundaryImpl,
+    {
+      getResetKey: props.getResetKey,
+      onCatch: props.onCatch,
+      children: ({ error }) => {
+        if (error) {
+          return React.createElement(errorComponent, {
+            error
+          });
+        }
+        return props.children;
+      }
+    }
+  );
+}
+class CatchBoundaryImpl extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.state = { error: null };
+  }
+  static getDerivedStateFromProps(props) {
+    return { resetKey: props.getResetKey() };
+  }
+  static getDerivedStateFromError(error) {
+    return { error };
+  }
+  componentDidUpdate(prevProps, prevState) {
+    if (prevState.error && prevState.resetKey !== this.state.resetKey) {
+      this.setState({ error: null });
+    }
+  }
+  componentDidCatch(error) {
+    var _a, _b;
+    console.error(error);
+    (_b = (_a = this.props).onCatch) == null ? void 0 : _b.call(_a, error);
+  }
+  render() {
+    return this.props.children(this.state);
+  }
+}
+function ErrorComponent({ error }) {
+  const [show, setShow] = React.useState(process.env.NODE_ENV !== "production");
+  return /* @__PURE__ */ jsxs("div", { style: { padding: ".5rem", maxWidth: "100%" }, children: [
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: ".5rem" }, children: [
+      /* @__PURE__ */ jsx("strong", { style: { fontSize: "1rem" }, children: "Something went wrong!" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          style: {
+            appearance: "none",
+            fontSize: ".6em",
+            border: "1px solid currentColor",
+            padding: ".1rem .2rem",
+            fontWeight: "bold",
+            borderRadius: ".25rem"
+          },
+          onClick: () => setShow((d) => !d),
+          children: show ? "Hide Error" : "Show Error"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { style: { height: ".25rem" } }),
+    show ? /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+      "pre",
+      {
+        style: {
+          fontSize: ".7em",
+          border: "1px solid red",
+          borderRadius: ".25rem",
+          padding: ".3rem",
+          color: "red",
+          overflow: "auto"
+        },
+        children: error.message ? /* @__PURE__ */ jsx("code", { children: error.message }) : null
+      }
+    ) }) : null
+  ] });
+}
+export {
+  CatchBoundary,
+  CatchBoundaryImpl,
+  ErrorComponent
+};
+//# sourceMappingURL=CatchBoundary.js.map

package/dist/esm/CatchBoundary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CatchBoundary.js","sources":["../../src/CatchBoundary.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport function CatchBoundary(props: {\n  getResetKey: () => string\n  children: any\n  errorComponent?: any\n  onCatch?: (error: any) => void\n}) {\n  const errorComponent = props.errorComponent ?? ErrorComponent\n\n  return (\n    <CatchBoundaryImpl\n      getResetKey={props.getResetKey}\n      onCatch={props.onCatch}\n      children={({ error }) => {\n        if (error) {\n          return React.createElement(errorComponent, {\n            error,\n          })\n        }\n\n        return props.children\n      }}\n    />\n  )\n}\n\nexport class CatchBoundaryImpl extends React.Component<{\n  getResetKey: () => string\n  children: (props: { error: any; reset: () => void }) => any\n  onCatch?: (error: any) => void\n}> {\n  state = { error: null } as any\n  static getDerivedStateFromProps(props: any) {\n    return { resetKey: props.getResetKey() }\n  }\n  static getDerivedStateFromError(error: any) {\n    return { error }\n  }\n  componentDidUpdate(\n    prevProps: Readonly<{\n      getResetKey: () => string\n      children: (props: { error: any; reset: () => void }) => any\n      onCatch?: ((error: any, info: any) => void) | undefined\n    }>,\n    prevState: any,\n  ): void {\n    if (prevState.error && prevState.resetKey !== this.state.resetKey) {\n      this.setState({ error: null })\n    }\n  }\n  componentDidCatch(error: any) {\n    console.error(error)\n    this.props.onCatch?.(error)\n  }\n  render() {\n    return this.props.children(this.state)\n  }\n}\n\nexport function ErrorComponent({ error }: { error: any }) {\n  const [show, setShow] = React.useState(process.env.NODE_ENV !== 'production')\n\n  return (\n    <div style={{ padding: '.5rem', maxWidth: '100%' }}>\n      <div style={{ display: 'flex', alignItems: 'center', gap: '.5rem' }}>\n        <strong style={{ fontSize: '1rem' }}>Something went wrong!</strong>\n        <button\n          style={{\n            appearance: 'none',\n            fontSize: '.6em',\n            border: '1px solid currentColor',\n            padding: '.1rem .2rem',\n            fontWeight: 'bold',\n            borderRadius: '.25rem',\n          }}\n          onClick={() => setShow((d) => !d)}\n        >\n          {show ? 'Hide Error' : 'Show Error'}\n        </button>\n      </div>\n      <div style={{ height: '.25rem' }} />\n      {show ? (\n        <div>\n          <pre\n            style={{\n              fontSize: '.7em',\n              border: '1px solid red',\n              borderRadius: '.25rem',\n              padding: '.3rem',\n              color: 'red',\n              overflow: 'auto',\n            }}\n          >\n            {error.message ? <code>{error.message}</code> : null}\n          </pre>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n"],"names":[],"mappings":";;AAEO,SAAS,cAAc,OAK3B;AACK,QAAA,iBAAiB,MAAM,kBAAkB;AAG7C,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAa,MAAM;AAAA,MACnB,SAAS,MAAM;AAAA,MACf,UAAU,CAAC,EAAE,YAAY;AACvB,YAAI,OAAO;AACF,iBAAA,MAAM,cAAc,gBAAgB;AAAA,YACzC;AAAA,UAAA,CACD;AAAA,QACH;AAEA,eAAO,MAAM;AAAA,MACf;AAAA,IAAA;AAAA,EAAA;AAGN;AAEa,MAAA,0BAA0B,MAAM,UAI1C;AAAA,EAJI,cAAA;AAAA,UAAA,GAAA,SAAA;AAKG,SAAA,QAAA,EAAE,OAAO,KAAK;AAAA,EAAA;AAAA,EACtB,OAAO,yBAAyB,OAAY;AAC1C,WAAO,EAAE,UAAU,MAAM,YAAc,EAAA;AAAA,EACzC;AAAA,EACA,OAAO,yBAAyB,OAAY;AAC1C,WAAO,EAAE,MAAM;AAAA,EACjB;AAAA,EACA,mBACE,WAKA,WACM;AACN,QAAI,UAAU,SAAS,UAAU,aAAa,KAAK,MAAM,UAAU;AACjE,WAAK,SAAS,EAAE,OAAO,KAAM,CAAA;AAAA,IAC/B;AAAA,EACF;AAAA,EACA,kBAAkB,OAAY;;AAC5B,YAAQ,MAAM,KAAK;AACd,qBAAA,OAAM,YAAN,4BAAgB;AAAA,EACvB;AAAA,EACA,SAAS;AACP,WAAO,KAAK,MAAM,SAAS,KAAK,KAAK;AAAA,EACvC;AACF;AAEgB,SAAA,eAAe,EAAE,SAAyB;AAClD,QAAA,CAAC,MAAM,OAAO,IAAI,MAAM,SAAS,QAAQ,IAAI,aAAa,YAAY;AAG1E,SAAA,qBAAC,SAAI,OAAO,EAAE,SAAS,SAAS,UAAU,OACxC,GAAA,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,OAAO,EAAE,SAAS,QAAQ,YAAY,UAAU,KAAK,QAAA,GACxD,UAAA;AAAA,MAAA,oBAAC,YAAO,OAAO,EAAE,UAAU,UAAU,UAAqB,yBAAA;AAAA,MAC1D;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,YACL,YAAY;AAAA,YACZ,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,YAAY;AAAA,YACZ,cAAc;AAAA,UAChB;AAAA,UACA,SAAS,MAAM,QAAQ,CAAC,MAAM,CAAC,CAAC;AAAA,UAE/B,iBAAO,eAAe;AAAA,QAAA;AAAA,MACzB;AAAA,IAAA,GACF;AAAA,wBACC,OAAI,EAAA,OAAO,EAAE,QAAQ,YAAY;AAAA,IACjC,2BACE,OACC,EAAA,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,QAAQ;AAAA,UACR,cAAc;AAAA,UACd,SAAS;AAAA,UACT,OAAO;AAAA,UACP,UAAU;AAAA,QACZ;AAAA,QAEC,gBAAM,UAAU,oBAAC,QAAM,EAAA,UAAA,MAAM,QAAQ,CAAA,IAAU;AAAA,MAAA;AAAA,OAEpD,IACE;AAAA,EACN,EAAA,CAAA;AAEJ;"}

package/dist/esm/Matches.d.ts

@@ -0,0 +1,71 @@
+import * as React from 'react';
+import { ResolveRelativePath, ToOptions } from './link';
+import { AnyRoute, ReactNode, RootSearchSchema } from './route';
+import { ParseRoute, RouteById, RouteByPath, RouteIds, RoutePaths } from './routeInfo';
+import { RegisteredRouter, RouterState } from './router';
+import { NoInfer, StrictOrFrom } from './utils';
+export declare const matchContext: React.Context<string | undefined>;
+export interface RouteMatch<TRouteTree extends AnyRoute = AnyRoute, TRouteId extends RouteIds<TRouteTree> = ParseRoute<TRouteTree>['id']> {
+    id: string;
+    routeId: TRouteId;
+    pathname: string;
+    params: RouteById<TRouteTree, TRouteId>['types']['allParams'];
+    status: 'pending' | 'success' | 'error';
+    isFetching: boolean;
+    showPending: boolean;
+    error: unknown;
+    paramsError: unknown;
+    searchError: unknown;
+    updatedAt: number;
+    loadPromise?: Promise<void>;
+    loaderData?: RouteById<TRouteTree, TRouteId>['types']['loaderData'];
+    routeContext: RouteById<TRouteTree, TRouteId>['types']['routeContext'];
+    context: RouteById<TRouteTree, TRouteId>['types']['allContext'];
+    search: Exclude<RouteById<TRouteTree, TRouteId>['types']['fullSearchSchema'], RootSearchSchema>;
+    fetchCount: number;
+    abortController: AbortController;
+    cause: 'preload' | 'enter' | 'stay';
+    loaderDeps: RouteById<TRouteTree, TRouteId>['types']['loaderDeps'];
+    preload: boolean;
+    invalid: boolean;
+    pendingPromise?: Promise<void>;
+}
+export type AnyRouteMatch = RouteMatch<any, any>;
+export declare function Matches(): React.JSX.Element;
+export declare function Match({ matchId }: {
+    matchId: string;
+}): React.JSX.Element;
+export declare const Outlet: React.NamedExoticComponent<object>;
+export interface MatchRouteOptions {
+    pending?: boolean;
+    caseSensitive?: boolean;
+    includeSearch?: boolean;
+    fuzzy?: boolean;
+}
+export type UseMatchRouteOptions<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TFrom extends RoutePaths<TRouteTree> = '/', TTo extends string = '', TMaskFrom extends RoutePaths<TRouteTree> = '/', TMaskTo extends string = ''> = ToOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> & MatchRouteOptions;
+export declare function useMatchRoute<TRouteTree extends AnyRoute = RegisteredRouter['routeTree']>(): <TFrom extends RoutePaths<TRouteTree> = "/", TTo extends string = "", TMaskFrom extends RoutePaths<TRouteTree> = "/", TMaskTo extends string = "", TResolved extends string = ResolveRelativePath<TFrom, NoInfer<TTo>>>(opts: UseMatchRouteOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>) => false | RouteById<TRouteTree, TResolved>["types"]["allParams"];
+export type MakeMatchRouteOptions<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TFrom extends RoutePaths<TRouteTree> = '/', TTo extends string = '', TMaskFrom extends RoutePaths<TRouteTree> = '/', TMaskTo extends string = ''> = ToOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo> & MatchRouteOptions & {
+    children?: ((params?: RouteByPath<TRouteTree, ResolveRelativePath<TFrom, NoInfer<TTo>>>['types']['allParams']) => ReactNode) | React.ReactNode;
+};
+export declare function MatchRoute<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TFrom extends RoutePaths<TRouteTree> = '/', TTo extends string = '', TMaskFrom extends RoutePaths<TRouteTree> = '/', TMaskTo extends string = ''>(props: MakeMatchRouteOptions<TRouteTree, TFrom, TTo, TMaskFrom, TMaskTo>): any;
+export declare function getRenderedMatches(state: RouterState): RouteMatch<AnyRoute, any>[];
+export declare function useMatch<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TFrom extends RouteIds<TRouteTree> = RouteIds<TRouteTree>, TRouteMatchState = RouteMatch<TRouteTree, TFrom>, TSelected = TRouteMatchState>(opts: StrictOrFrom<TFrom> & {
+    select?: (match: TRouteMatchState) => TSelected;
+}): TSelected;
+export declare function useMatches<T = RouteMatch[]>(opts?: {
+    select?: (matches: RouteMatch[]) => T;
+}): T;
+export declare function useParentMatches<T = RouteMatch[]>(opts?: {
+    select?: (matches: RouteMatch[]) => T;
+}): T;
+export declare function useLoaderDeps<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TFrom extends RouteIds<TRouteTree> = RouteIds<TRouteTree>, TRouteMatch extends RouteMatch<TRouteTree, TFrom> = RouteMatch<TRouteTree, TFrom>, TSelected = Required<TRouteMatch>['loaderDeps']>(opts: StrictOrFrom<TFrom> & {
+    select?: (match: TRouteMatch) => TSelected;
+}): TSelected;
+export declare function useLoaderData<TRouteTree extends AnyRoute = RegisteredRouter['routeTree'], TFrom extends RouteIds<TRouteTree> = RouteIds<TRouteTree>, TRouteMatch extends RouteMatch<TRouteTree, TFrom> = RouteMatch<TRouteTree, TFrom>, TSelected = Required<TRouteMatch>['loaderData']>(opts: StrictOrFrom<TFrom> & {
+    select?: (match: TRouteMatch) => TSelected;
+}): TSelected;
+export declare function isServerSideError(error: unknown): error is {
+    __isServerError: true;
+    data: Record<string, any>;
+};
+export declare function defaultDeserializeError(serializedData: Record<string, any>): any;