@tanstack/react-router 0.0.1-alpha.1 → 0.0.1-alpha.3

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":"cad9-21","name":"\u0000rollupPluginBabelHelpers.js"},{"name":"packages","children":[{"name":"router-core/build/esm/index.js","uid":"cad9-23"},{"name":"react-router/src/index.tsx","uid":"cad9-25"}]}]}],"isRoot":true},"nodeParts":{"cad9-21":{"renderedLength":798,"gzipLength":366,"brotliLength":0,"mainUid":"cad9-20"},"cad9-23":{"renderedLength":68622,"gzipLength":14235,"brotliLength":0,"mainUid":"cad9-22"},"cad9-25":{"renderedLength":11931,"gzipLength":3038,"brotliLength":0,"mainUid":"cad9-24"}},"nodeMetas":{"cad9-20":{"id":"\u0000rollupPluginBabelHelpers.js","moduleParts":{"index.production.js":"cad9-21"},"imported":[],"importedBy":[{"uid":"cad9-24"}]},"cad9-22":{"id":"/packages/router-core/build/esm/index.js","moduleParts":{"index.production.js":"cad9-23"},"imported":[],"importedBy":[{"uid":"cad9-24"}]},"cad9-24":{"id":"/packages/react-router/src/index.tsx","moduleParts":{"index.production.js":"cad9-25"},"imported":[{"uid":"cad9-20"},{"uid":"cad9-26"},{"uid":"cad9-27"},{"uid":"cad9-22"}],"importedBy":[],"isEntry":true},"cad9-26":{"id":"react","moduleParts":{},"imported":[],"importedBy":[{"uid":"cad9-24"}],"isExternal":true},"cad9-27":{"id":"use-sync-external-store/shim","moduleParts":{},"imported":[],"importedBy":[{"uid":"cad9-24"}],"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":"b6e9-21","name":"\u0000rollupPluginBabelHelpers.js"},{"name":"packages","children":[{"name":"router-core/build/esm/index.js","uid":"b6e9-23"},{"name":"react-router/src/index.tsx","uid":"b6e9-25"}]}]}],"isRoot":true},"nodeParts":{"b6e9-21":{"renderedLength":798,"gzipLength":366,"brotliLength":0,"mainUid":"b6e9-20"},"b6e9-23":{"renderedLength":68622,"gzipLength":14235,"brotliLength":0,"mainUid":"b6e9-22"},"b6e9-25":{"renderedLength":11932,"gzipLength":3067,"brotliLength":0,"mainUid":"b6e9-24"}},"nodeMetas":{"b6e9-20":{"id":"\u0000rollupPluginBabelHelpers.js","moduleParts":{"index.production.js":"b6e9-21"},"imported":[],"importedBy":[{"uid":"b6e9-24"}]},"b6e9-22":{"id":"/packages/router-core/build/esm/index.js","moduleParts":{"index.production.js":"b6e9-23"},"imported":[],"importedBy":[{"uid":"b6e9-24"}]},"b6e9-24":{"id":"/packages/react-router/src/index.tsx","moduleParts":{"index.production.js":"b6e9-25"},"imported":[{"uid":"b6e9-20"},{"uid":"b6e9-26"},{"uid":"b6e9-27"},{"uid":"b6e9-22"}],"importedBy":[],"isEntry":true},"b6e9-26":{"id":"react","moduleParts":{},"imported":[],"importedBy":[{"uid":"b6e9-24"}],"isExternal":true},"b6e9-27":{"id":"use-sync-external-store/shim","moduleParts":{},"imported":[],"importedBy":[{"uid":"b6e9-24"}],"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

@@ -0,0 +1,129 @@
+{
+  "version": 2,
+  "tree": {
+    "name": "root",
+    "children": [
+      {
+        "name": "index.production.js",
+        "children": [
+          {
+            "uid": "b6e9-29",
+            "name": "\u0000rollupPluginBabelHelpers.js"
+          },
+          {
+            "name": "packages",
+            "children": [
+              {
+                "name": "router-core/build/esm/index.js",
+                "uid": "b6e9-31"
+              },
+              {
+                "name": "react-router/src/index.tsx",
+                "uid": "b6e9-33"
+              }
+            ]
+          }
+        ]
+      }
+    ],
+    "isRoot": true
+  },
+  "nodeParts": {
+    "b6e9-29": {
+      "renderedLength": 798,
+      "gzipLength": 366,
+      "brotliLength": 0,
+      "mainUid": "b6e9-28"
+    },
+    "b6e9-31": {
+      "renderedLength": 68622,
+      "gzipLength": 14235,
+      "brotliLength": 0,
+      "mainUid": "b6e9-30"
+    },
+    "b6e9-33": {
+      "renderedLength": 11932,
+      "gzipLength": 3067,
+      "brotliLength": 0,
+      "mainUid": "b6e9-32"
+    }
+  },
+  "nodeMetas": {
+    "b6e9-28": {
+      "id": "\u0000rollupPluginBabelHelpers.js",
+      "moduleParts": {
+        "index.production.js": "b6e9-29"
+      },
+      "imported": [],
+      "importedBy": [
+        {
+          "uid": "b6e9-32"
+        }
+      ]
+    },
+    "b6e9-30": {
+      "id": "/packages/router-core/build/esm/index.js",
+      "moduleParts": {
+        "index.production.js": "b6e9-31"
+      },
+      "imported": [],
+      "importedBy": [
+        {
+          "uid": "b6e9-32"
+        }
+      ]
+    },
+    "b6e9-32": {
+      "id": "/packages/react-router/src/index.tsx",
+      "moduleParts": {
+        "index.production.js": "b6e9-33"
+      },
+      "imported": [
+        {
+          "uid": "b6e9-28"
+        },
+        {
+          "uid": "b6e9-34"
+        },
+        {
+          "uid": "b6e9-35"
+        },
+        {
+          "uid": "b6e9-30"
+        }
+      ],
+      "importedBy": [],
+      "isEntry": true
+    },
+    "b6e9-34": {
+      "id": "react",
+      "moduleParts": {},
+      "imported": [],
+      "importedBy": [
+        {
+          "uid": "b6e9-32"
+        }
+      ],
+      "isExternal": true
+    },
+    "b6e9-35": {
+      "id": "use-sync-external-store/shim",
+      "moduleParts": {},
+      "imported": [],
+      "importedBy": [
+        {
+          "uid": "b6e9-32"
+        }
+      ],
+      "isExternal": true
+    }
+  },
+  "env": {
+    "rollup": "2.77.2"
+  },
+  "options": {
+    "gzip": true,
+    "brotli": false,
+    "sourcemap": false
+  }
+}

package/build/types/index.d.ts

@@ -0,0 +1,77 @@
+/**
+ * react-router
+ *
+ * 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
+ */
+import * as React from 'react';
+import { AnyRouteConfig, RouteConfig, AnyAllRouteInfo, AllRouteInfo, RootRouteId, RouteMatch, ToOptions, MatchRouteOptions, RouteInfoByPath, ResolveRelativePath, NoInfer, DefaultAllRouteInfo, AnyRouteInfo, RouteInfo, ValidFromPath, LinkOptions, RouterOptions, Router } from '@tanstack/router-core';
+export * from '@tanstack/router-core';
+
+declare module '@tanstack/router-core' {
+    interface FrameworkGenerics {
+        Element: React.ReactNode;
+        AsyncElement: (opts: {
+            params: Record<string, string>;
+        }) => Promise<React.ReactNode>;
+        SyncOrAsyncElement: React.ReactNode | FrameworkGenerics['AsyncElement'];
+    }
+    interface Router<TRouteConfig extends AnyRouteConfig = RouteConfig, TAllRouteInfo extends AnyAllRouteInfo = AllRouteInfo<TRouteConfig>> extends Pick<Route<TAllRouteInfo, TAllRouteInfo['routeInfoById'][RootRouteId]>, 'linkProps' | 'Link' | 'MatchRoute'> {
+        useRoute: <TId extends keyof TAllRouteInfo['routeInfoById']>(routeId: TId) => Route<TAllRouteInfo, TAllRouteInfo['routeInfoById'][TId]>;
+        useMatch: <TId extends keyof TAllRouteInfo['routeInfoById']>(routeId: TId) => RouteMatch<TAllRouteInfo, TAllRouteInfo['routeInfoById'][TId]>;
+        linkProps: <TTo extends string = '.'>(props: LinkPropsOptions<TAllRouteInfo, '/', TTo> & React.AnchorHTMLAttributes<HTMLAnchorElement>) => React.AnchorHTMLAttributes<HTMLAnchorElement>;
+        Link: <TTo extends string = '.'>(props: LinkPropsOptions<TAllRouteInfo, '/', TTo> & React.AnchorHTMLAttributes<HTMLAnchorElement> & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> & {
+            children?: React.ReactNode | ((state: {
+                isActive: boolean;
+            }) => React.ReactNode);
+        }) => JSX.Element;
+        MatchRoute: <TTo extends string = '.'>(props: ToOptions<TAllRouteInfo, '/', TTo> & MatchRouteOptions & {
+            children?: React.ReactNode | ((params: RouteInfoByPath<TAllRouteInfo, ResolveRelativePath<'/', NoInfer<TTo>>>['allParams']) => React.ReactNode);
+        }) => JSX.Element;
+    }
+    interface Route<TAllRouteInfo extends AnyAllRouteInfo = DefaultAllRouteInfo, TRouteInfo extends AnyRouteInfo = RouteInfo> {
+        linkProps: <TTo extends string = '.'>(props: LinkPropsOptions<TAllRouteInfo, TRouteInfo['fullPath'], TTo> & React.AnchorHTMLAttributes<HTMLAnchorElement>) => React.AnchorHTMLAttributes<HTMLAnchorElement>;
+        Link: <TTo extends string = '.'>(props: LinkPropsOptions<TAllRouteInfo, TRouteInfo['fullPath'], TTo> & React.AnchorHTMLAttributes<HTMLAnchorElement> & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, 'children'> & {
+            children?: React.ReactNode | ((state: {
+                isActive: boolean;
+            }) => React.ReactNode);
+        }) => JSX.Element;
+        MatchRoute: <TTo extends string = '.'>(props: ToOptions<TAllRouteInfo, TRouteInfo['fullPath'], TTo> & MatchRouteOptions & {
+            children?: React.ReactNode | ((params: RouteInfoByPath<TAllRouteInfo, ResolveRelativePath<TRouteInfo['fullPath'], NoInfer<TTo>>>['allParams']) => React.ReactNode);
+        }) => JSX.Element;
+    }
+}
+declare 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 = {
+    message: string;
+    when?: boolean | any;
+    children?: React.ReactNode;
+};
+declare 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> & {
+    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 useMatches(): RouteMatch[];
+declare function useParentMatches(): RouteMatch[];
+declare function useMatch<T>(): RouteMatch;
+declare function Outlet(): JSX.Element | null;
+declare function DefaultCatchBoundary({ error }: {
+    error: any;
+}): JSX.Element;
+
+export { DefaultCatchBoundary, MatchesProvider, MatchesProviderProps, Outlet, PromptProps, RouterProps, RouterProvider, createReactRouter, useMatch, useMatches, useParentMatches, useRouter };

package/build/umd/index.development.js

@@ -2375,6 +2375,108 @@
   };
 
   function createReactRouter(opts) {
+    const makeRouteExt = (route, router) => {
+      return {
+        linkProps: options => {
+          var _functionalUpdate, _functionalUpdate2;
+
+          const {
+            // custom props
+            target,
+            activeProps = () => ({
+              className: 'active'
+            }),
+            inactiveProps = () => ({}),
+            disabled,
+            // element props
+            style,
+            className,
+            onClick,
+            onFocus,
+            onMouseEnter,
+            onMouseLeave
+          } = options,
+                rest = _objectWithoutPropertiesLoose(options, _excluded);
+
+          const linkInfo = route.buildLink(options);
+
+          if (linkInfo.type === 'external') {
+            const {
+              href
+            } = linkInfo;
+            return {
+              href
+            };
+          }
+
+          const {
+            handleClick,
+            handleFocus,
+            handleEnter,
+            handleLeave,
+            isActive,
+            next
+          } = linkInfo;
+
+          const composeHandlers = handlers => e => {
+            e.persist();
+            handlers.forEach(handler => {
+              if (handler) handler(e);
+            });
+          }; // Get the active props
+
+
+          const resolvedActiveProps = isActive ? (_functionalUpdate = functionalUpdate(activeProps)) != null ? _functionalUpdate : {} : {}; // Get the inactive props
+
+          const resolvedInactiveProps = isActive ? {} : (_functionalUpdate2 = functionalUpdate(inactiveProps)) != null ? _functionalUpdate2 : {};
+          return _extends$2({}, resolvedActiveProps, resolvedInactiveProps, rest, {
+            href: disabled ? undefined : next.href,
+            onClick: composeHandlers([handleClick, onClick]),
+            onFocus: composeHandlers([handleFocus, onFocus]),
+            onMouseEnter: composeHandlers([handleEnter, onMouseEnter]),
+            onMouseLeave: composeHandlers([handleLeave, onMouseLeave]),
+            target,
+            style: _extends$2({}, style, resolvedActiveProps.style, resolvedInactiveProps.style),
+            className: [className, resolvedActiveProps.className, resolvedInactiveProps.className].filter(Boolean).join(' ') || undefined
+          }, disabled ? {
+            role: 'link',
+            'aria-disabled': true
+          } : undefined, {
+            ['data-status']: isActive ? 'active' : undefined
+          });
+        },
+        Link: /*#__PURE__*/React__namespace.forwardRef((props, ref) => {
+          const linkProps = route.linkProps(props);
+          useRouterSubscription(router);
+          return /*#__PURE__*/React__namespace.createElement("a", _extends$2({
+            ref: ref
+          }, linkProps, {
+            children: typeof props.children === 'function' ? props.children({
+              isActive: linkProps['data-status'] === 'active'
+            }) : props.children
+          }));
+        }),
+        MatchRoute: opts => {
+          const {
+            pending,
+            caseSensitive
+          } = opts,
+                rest = _objectWithoutPropertiesLoose(opts, _excluded2);
+
+          const params = route.matchRoute(rest, {
+            pending,
+            caseSensitive
+          }); // useRouterSubscription(router)
+
+          if (!params) {
+            return null;
+          }
+
+          return typeof opts.children === 'function' ? opts.children(params) : opts.children;
+        }
+      };
+    };
+
     const coreRouter = createRouter(_extends$2({}, opts, {
       createRouter: router => {
         const routerExt = {
@@ -2414,112 +2516,15 @@
             return match;
           }
         };
-        Object.assign(router, routerExt);
+        const routeExt = makeRouteExt(router.getRoute('/'), router);
+        Object.assign(router, routerExt, routeExt);
       },
       createRoute: _ref => {
         let {
           router,
           route
         } = _ref;
-        const routeExt = {
-          linkProps: options => {
-            var _functionalUpdate, _functionalUpdate2;
-
-            const {
-              // custom props
-              target,
-              activeProps = () => ({
-                className: 'active'
-              }),
-              inactiveProps = () => ({}),
-              disabled,
-              // element props
-              style,
-              className,
-              onClick,
-              onFocus,
-              onMouseEnter,
-              onMouseLeave
-            } = options,
-                  rest = _objectWithoutPropertiesLoose(options, _excluded);
-
-            const linkInfo = route.buildLink(options);
-
-            if (linkInfo.type === 'external') {
-              const {
-                href
-              } = linkInfo;
-              return {
-                href
-              };
-            }
-
-            const {
-              handleClick,
-              handleFocus,
-              handleEnter,
-              handleLeave,
-              isActive,
-              next
-            } = linkInfo;
-
-            const composeHandlers = handlers => e => {
-              e.persist();
-              handlers.forEach(handler => {
-                if (handler) handler(e);
-              });
-            }; // Get the active props
-
-
-            const resolvedActiveProps = isActive ? (_functionalUpdate = functionalUpdate(activeProps)) != null ? _functionalUpdate : {} : {}; // Get the inactive props
-
-            const resolvedInactiveProps = isActive ? {} : (_functionalUpdate2 = functionalUpdate(inactiveProps)) != null ? _functionalUpdate2 : {};
-            return _extends$2({}, resolvedActiveProps, resolvedInactiveProps, rest, {
-              href: disabled ? undefined : next.href,
-              onClick: composeHandlers([handleClick, onClick]),
-              onFocus: composeHandlers([handleFocus, onFocus]),
-              onMouseEnter: composeHandlers([handleEnter, onMouseEnter]),
-              onMouseLeave: composeHandlers([handleLeave, onMouseLeave]),
-              target,
-              style: _extends$2({}, style, resolvedActiveProps.style, resolvedInactiveProps.style),
-              className: [className, resolvedActiveProps.className, resolvedInactiveProps.className].filter(Boolean).join(' ') || undefined
-            }, disabled ? {
-              role: 'link',
-              'aria-disabled': true
-            } : undefined, {
-              ['data-status']: isActive ? 'active' : undefined
-            });
-          },
-          Link: /*#__PURE__*/React__namespace.forwardRef((props, ref) => {
-            const linkProps = route.linkProps(props);
-            useRouterSubscription(router);
-            return /*#__PURE__*/React__namespace.createElement("a", _extends$2({
-              ref: ref
-            }, linkProps, {
-              children: typeof props.children === 'function' ? props.children({
-                isActive: linkProps['data-status'] === 'active'
-              }) : props.children
-            }));
-          }),
-          MatchRoute: opts => {
-            const {
-              pending,
-              caseSensitive
-            } = opts,
-                  rest = _objectWithoutPropertiesLoose(opts, _excluded2);
-
-            const params = route.matchRoute(rest, {
-              pending,
-              caseSensitive
-            }); // useRouterSubscription(router)
-
-            if (!params) {
-              return null;
-            }
-
-            return typeof opts.children === 'function' ? opts.children(params) : opts.children;
-          }
-        };
+        const routeExt = makeRouteExt(route, router);
         Object.assign(route, routeExt);
       }
     }));