@tanstack/router-devtools 1.112.18 → 1.114.0

package/dist/cjs/index.cjs

@@ -1,7 +1,15 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const TanStackRouterDevtools = require("./TanStackRouterDevtools.cjs");
-const TanStackRouterDevtoolsPanel = require("./TanStackRouterDevtoolsPanel.cjs");
-exports.TanStackRouterDevtools = TanStackRouterDevtools.TanStackRouterDevtools;
-exports.TanStackRouterDevtoolsPanel = TanStackRouterDevtoolsPanel.TanStackRouterDevtoolsPanel;
+const reactRouterDevtools = require("@tanstack/react-router-devtools");
+console.warn(
+  "[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release."
+);
+Object.defineProperty(exports, "TanStackRouterDevtools", {
+  enumerable: true,
+  get: () => reactRouterDevtools.TanStackRouterDevtoolsInProd
+});
+Object.defineProperty(exports, "TanStackRouterDevtoolsPanel", {
+  enumerable: true,
+  get: () => reactRouterDevtools.TanStackRouterDevtoolsPanelInProd
+});
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.cjs","sources":["../../src/index.tsx"],"sourcesContent":["console.warn(\n  '[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release.',\n)\n\nexport { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools'\nexport { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'\n"],"names":[],"mappings":";;;AAAA,QAAQ;AAAA,EACN;AACF;;;;;;;;;"}

package/dist/cjs/index.d.cts

@@ -1,2 +1,2 @@
-export { TanStackRouterDevtools } from './TanStackRouterDevtools.cjs';
-export { TanStackRouterDevtoolsPanel } from './TanStackRouterDevtoolsPanel.cjs';
+export { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools';
+export { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools';

package/dist/esm/index.d.ts

@@ -1,2 +1,2 @@
-export { TanStackRouterDevtools } from './TanStackRouterDevtools.js';
-export { TanStackRouterDevtoolsPanel } from './TanStackRouterDevtoolsPanel.js';
+export { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools';
+export { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools';

package/dist/esm/index.js

@@ -1,7 +1,9 @@
-import { TanStackRouterDevtools } from "./TanStackRouterDevtools.js";
-import { TanStackRouterDevtoolsPanel } from "./TanStackRouterDevtoolsPanel.js";
+import { TanStackRouterDevtoolsInProd, TanStackRouterDevtoolsPanelInProd } from "@tanstack/react-router-devtools";
+console.warn(
+  "[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release."
+);
 export {
-  TanStackRouterDevtools,
-  TanStackRouterDevtoolsPanel
+  TanStackRouterDevtoolsInProd as TanStackRouterDevtools,
+  TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
+{"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["console.warn(\n  '[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release.',\n)\n\nexport { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools'\nexport { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'\n"],"names":[],"mappings":";AAAA,QAAQ;AAAA,EACN;AACF;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/router-devtools",
-  "version": "1.112.18",
+  "version": "1.114.0",
   "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",
@@ -50,7 +50,8 @@
   },
   "dependencies": {
     "clsx": "^2.1.1",
-    "goober": "^2.1.16"
+    "goober": "^2.1.16",
+    "@tanstack/react-router-devtools": "^1.114.0"
   },
   "devDependencies": {
     "@vitejs/plugin-react": "^4.3.4",

package/src/index.tsx

@@ -1,2 +1,6 @@
-export { TanStackRouterDevtools } from './TanStackRouterDevtools'
-export { TanStackRouterDevtoolsPanel } from './TanStackRouterDevtoolsPanel'
+console.warn(
+  '[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release.',
+)
+
+export { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools'
+export { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'

package/dist/cjs/AgeTicker.cjs

@@ -1,58 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const clsx = require("clsx");
-const React = require("react");
-const useStyles = require("./useStyles.cjs");
-function formatTime(ms) {
-  const units = ["s", "min", "h", "d"];
-  const values = [ms / 1e3, ms / 6e4, ms / 36e5, ms / 864e5];
-  let chosenUnitIndex = 0;
-  for (let i = 1; i < values.length; i++) {
-    if (values[i] < 1) break;
-    chosenUnitIndex = i;
-  }
-  const formatter = new Intl.NumberFormat(navigator.language, {
-    compactDisplay: "short",
-    notation: "compact",
-    maximumFractionDigits: 0
-  });
-  return formatter.format(values[chosenUnitIndex]) + units[chosenUnitIndex];
-}
-function AgeTicker({
-  match,
-  router
-}) {
-  const styles = useStyles.useStyles();
-  const rerender = React.useReducer(
-    () => ({}),
-    () => ({})
-  )[1];
-  React.useEffect(() => {
-    const interval = setInterval(() => {
-      rerender();
-    }, 1e3);
-    return () => {
-      clearInterval(interval);
-    };
-  }, [rerender]);
-  if (!match) {
-    return null;
-  }
-  const route = router.looseRoutesById[match.routeId];
-  if (!route.options.loader) {
-    return null;
-  }
-  const age = Date.now() - match.updatedAt;
-  const staleTime = route.options.staleTime ?? router.options.defaultStaleTime ?? 0;
-  const gcTime = route.options.gcTime ?? router.options.defaultGcTime ?? 30 * 60 * 1e3;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(styles.ageTicker(age > staleTime)), children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: formatTime(age) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: "/" }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: formatTime(staleTime) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: "/" }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { children: formatTime(gcTime) })
-  ] });
-}
-exports.AgeTicker = AgeTicker;
-//# sourceMappingURL=AgeTicker.cjs.map

package/dist/cjs/AgeTicker.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"AgeTicker.cjs","sources":["../../src/AgeTicker.tsx"],"sourcesContent":["import { clsx as cx } from 'clsx'\nimport React from 'react'\nimport { useStyles } from './useStyles'\nimport type { AnyRouteMatch, AnyRouter } from '@tanstack/react-router'\n\nfunction formatTime(ms: number) {\n  const units = ['s', 'min', 'h', 'd']\n  const values = [ms / 1000, ms / 60000, ms / 3600000, ms / 86400000]\n\n  let chosenUnitIndex = 0\n  for (let i = 1; i < values.length; i++) {\n    if (values[i]! < 1) break\n    chosenUnitIndex = i\n  }\n\n  const formatter = new Intl.NumberFormat(navigator.language, {\n    compactDisplay: 'short',\n    notation: 'compact',\n    maximumFractionDigits: 0,\n  })\n\n  return formatter.format(values[chosenUnitIndex]!) + units[chosenUnitIndex]\n}\n\nexport function AgeTicker({\n  match,\n  router,\n}: {\n  match?: AnyRouteMatch\n  router: AnyRouter\n}) {\n  const styles = useStyles()\n  const rerender = React.useReducer(\n    () => ({}),\n    () => ({}),\n  )[1]\n\n  React.useEffect(() => {\n    const interval = setInterval(() => {\n      rerender()\n    }, 1000)\n\n    return () => {\n      clearInterval(interval)\n    }\n  }, [rerender])\n\n  if (!match) {\n    return null\n  }\n\n  const route = router.looseRoutesById[match.routeId]!\n\n  if (!route.options.loader) {\n    return null\n  }\n\n  const age = Date.now() - match.updatedAt\n  const staleTime =\n    route.options.staleTime ?? router.options.defaultStaleTime ?? 0\n  const gcTime =\n    route.options.gcTime ?? router.options.defaultGcTime ?? 30 * 60 * 1000\n\n  return (\n    <div className={cx(styles.ageTicker(age > staleTime))}>\n      <div>{formatTime(age)}</div>\n      <div>/</div>\n      <div>{formatTime(staleTime)}</div>\n      <div>/</div>\n      <div>{formatTime(gcTime)}</div>\n    </div>\n  )\n}\n"],"names":["useStyles","jsxs","cx","jsx"],"mappings":";;;;;;AAKA,SAAS,WAAW,IAAY;AAC9B,QAAM,QAAQ,CAAC,KAAK,OAAO,KAAK,GAAG;AAC7B,QAAA,SAAS,CAAC,KAAK,KAAM,KAAK,KAAO,KAAK,MAAS,KAAK,KAAQ;AAElE,MAAI,kBAAkB;AACtB,WAAS,IAAI,GAAG,IAAI,OAAO,QAAQ,KAAK;AAClC,QAAA,OAAO,CAAC,IAAK,EAAG;AACF,sBAAA;AAAA,EAAA;AAGpB,QAAM,YAAY,IAAI,KAAK,aAAa,UAAU,UAAU;AAAA,IAC1D,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,uBAAuB;AAAA,EAAA,CACxB;AAED,SAAO,UAAU,OAAO,OAAO,eAAe,CAAE,IAAI,MAAM,eAAe;AAC3E;AAEO,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AACF,GAGG;AACD,QAAM,SAASA,UAAAA,UAAU;AACzB,QAAM,WAAW,MAAM;AAAA,IACrB,OAAO;IACP,OAAO,CAAC;AAAA,IACR,CAAC;AAEH,QAAM,UAAU,MAAM;AACd,UAAA,WAAW,YAAY,MAAM;AACxB,eAAA;AAAA,OACR,GAAI;AAEP,WAAO,MAAM;AACX,oBAAc,QAAQ;AAAA,IACxB;AAAA,EAAA,GACC,CAAC,QAAQ,CAAC;AAEb,MAAI,CAAC,OAAO;AACH,WAAA;AAAA,EAAA;AAGT,QAAM,QAAQ,OAAO,gBAAgB,MAAM,OAAO;AAE9C,MAAA,CAAC,MAAM,QAAQ,QAAQ;AAClB,WAAA;AAAA,EAAA;AAGT,QAAM,MAAM,KAAK,IAAI,IAAI,MAAM;AAC/B,QAAM,YACJ,MAAM,QAAQ,aAAa,OAAO,QAAQ,oBAAoB;AAC1D,QAAA,SACJ,MAAM,QAAQ,UAAU,OAAO,QAAQ,iBAAiB,KAAK,KAAK;AAGlE,SAAAC,gCAAC,SAAI,WAAWC,KAAA,KAAG,OAAO,UAAU,MAAM,SAAS,CAAC,GAClD,UAAA;AAAA,IAACC,2BAAA,IAAA,OAAA,EAAK,UAAW,WAAA,GAAG,EAAE,CAAA;AAAA,IACtBA,2BAAAA,IAAC,SAAI,UAAC,IAAA,CAAA;AAAA,IACLA,2BAAA,IAAA,OAAA,EAAK,UAAW,WAAA,SAAS,EAAE,CAAA;AAAA,IAC5BA,2BAAAA,IAAC,SAAI,UAAC,IAAA,CAAA;AAAA,IACLA,2BAAAA,IAAA,OAAA,EAAK,UAAW,WAAA,MAAM,EAAE,CAAA;AAAA,EAAA,GAC3B;AAEJ;;"}

package/dist/cjs/AgeTicker.d.cts

@@ -1,5 +0,0 @@
-import { AnyRouteMatch, AnyRouter } from '@tanstack/react-router';
-export declare function AgeTicker({ match, router, }: {
-    match?: AnyRouteMatch;
-    router: AnyRouter;
-}): import("react/jsx-runtime").JSX.Element | null;

package/dist/cjs/BaseTanStackRouterDevtoolsPanel.cjs

@@ -1,421 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const clsx = require("clsx");
-const reactRouter = require("@tanstack/react-router");
-const context = require("./context.cjs");
-const useStyles = require("./useStyles.cjs");
-const useLocalStorage = require("./useLocalStorage.cjs");
-const Explorer = require("./Explorer.cjs");
-const utils = require("./utils.cjs");
-const AgeTicker = require("./AgeTicker.cjs");
-function Logo(props) {
-  const { className, ...rest } = props;
-  const styles = useStyles.useStyles();
-  return /* @__PURE__ */ jsxRuntime.jsxs("button", { ...rest, className: clsx.clsx(styles.logo, className), children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.tanstackLogo, children: "TANSTACK" }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.routerLogo, children: "React Router v1" })
-  ] });
-}
-function RouteComp({
-  router,
-  route,
-  isRoot,
-  activeId,
-  setActiveId
-}) {
-  var _a;
-  const routerState = reactRouter.useRouterState({
-    router
-  });
-  const styles = useStyles.useStyles();
-  const matches = routerState.pendingMatches || routerState.matches;
-  const match = routerState.matches.find((d) => d.routeId === route.id);
-  const param = React.useMemo(() => {
-    try {
-      if (match == null ? void 0 : match.params) {
-        const p = match.params;
-        const r = route.path || reactRouter.trimPath(route.id);
-        if (r.startsWith("$")) {
-          const trimmed = r.slice(1);
-          if (p[trimmed]) {
-            return `(${p[trimmed]})`;
-          }
-        }
-      }
-      return "";
-    } catch (error) {
-      return "";
-    }
-  }, [match, route]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        role: "button",
-        "aria-label": `Open match details for ${route.id}`,
-        onClick: () => {
-          if (match) {
-            setActiveId(activeId === route.id ? "" : route.id);
-          }
-        },
-        className: clsx.clsx(
-          styles.routesRowContainer(route.id === activeId, !!match)
-        ),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: clsx.clsx(
-                styles.matchIndicator(utils.getRouteStatusColor(matches, route))
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx(styles.routesRow(!!match)), children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("code", { className: styles.code, children: [
-                isRoot ? reactRouter.rootRouteId : route.path || reactRouter.trimPath(route.id),
-                " "
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx("code", { className: styles.routeParamInfo, children: param })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(AgeTicker.AgeTicker, { match, router })
-          ] })
-        ]
-      }
-    ),
-    ((_a = route.children) == null ? void 0 : _a.length) ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.nestedRouteRow(!!isRoot), children: [...route.children].sort((a, b) => {
-      return a.rank - b.rank;
-    }).map((r) => /* @__PURE__ */ jsxRuntime.jsx(
-      RouteComp,
-      {
-        router,
-        route: r,
-        activeId,
-        setActiveId
-      },
-      r.id
-    )) }) : null
-  ] });
-}
-const BaseTanStackRouterDevtoolsPanel = React.forwardRef(function BaseTanStackRouterDevtoolsPanel2(props, ref) {
-  var _a, _b;
-  const {
-    isOpen = true,
-    setIsOpen,
-    handleDragStart,
-    router: userRouter,
-    shadowDOMTarget,
-    ...panelProps
-  } = props;
-  const { onCloseClick } = context.useDevtoolsOnClose();
-  const styles = useStyles.useStyles();
-  const { className, ...otherPanelProps } = panelProps;
-  const contextRouter = reactRouter.useRouter({ warn: false });
-  const router = userRouter ?? contextRouter;
-  const routerState = reactRouter.useRouterState({
-    router
-  });
-  reactRouter.invariant(
-    router,
-    "No router was found for the TanStack Router Devtools. Please place the devtools in the <RouterProvider> component tree or pass the router instance to the devtools manually."
-  );
-  const [showMatches, setShowMatches] = useLocalStorage(
-    "tanstackRouterDevtoolsShowMatches",
-    true
-  );
-  const [activeId, setActiveId] = useLocalStorage(
-    "tanstackRouterDevtoolsActiveRouteId",
-    ""
-  );
-  const activeMatch = React.useMemo(() => {
-    const matches = [
-      ...routerState.pendingMatches ?? [],
-      ...routerState.matches,
-      ...routerState.cachedMatches
-    ];
-    return matches.find((d) => d.routeId === activeId || d.id === activeId);
-  }, [
-    activeId,
-    routerState.cachedMatches,
-    routerState.matches,
-    routerState.pendingMatches
-  ]);
-  const hasSearch = Object.keys(routerState.location.search).length;
-  const explorerState = {
-    ...router,
-    state: router.state
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      ref,
-      className: clsx.clsx(
-        styles.devtoolsPanel,
-        "TanStackRouterDevtoolsPanel",
-        className
-      ),
-      ...otherPanelProps,
-      children: [
-        handleDragStart ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.dragHandle, onMouseDown: handleDragStart }) : null,
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "button",
-          {
-            className: styles.panelCloseBtn,
-            onClick: (e) => {
-              setIsOpen(false);
-              onCloseClick(e);
-            },
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              "svg",
-              {
-                xmlns: "http://www.w3.org/2000/svg",
-                width: "10",
-                height: "6",
-                fill: "none",
-                viewBox: "0 0 10 6",
-                className: styles.panelCloseBtnIcon,
-                children: /* @__PURE__ */ jsxRuntime.jsx(
-                  "path",
-                  {
-                    stroke: "currentColor",
-                    strokeLinecap: "round",
-                    strokeLinejoin: "round",
-                    strokeWidth: "1.667",
-                    d: "M1 1l4 4 4-4"
-                  }
-                )
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.firstContainer, children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.row, children: /* @__PURE__ */ jsxRuntime.jsx(
-            Logo,
-            {
-              "aria-hidden": true,
-              onClick: (e) => {
-                setIsOpen(false);
-                onCloseClick(e);
-              }
-            }
-          ) }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.routerExplorerContainer, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.routerExplorer, children: /* @__PURE__ */ jsxRuntime.jsx(
-            Explorer.default,
-            {
-              label: "Router",
-              value: Object.fromEntries(
-                utils.multiSortBy(
-                  Object.keys(explorerState),
-                  [
-                    "state",
-                    "routesById",
-                    "routesByPath",
-                    "flatRoutes",
-                    "options",
-                    "manifest"
-                  ].map((d) => (dd) => dd !== d)
-                ).map((key) => [key, explorerState[key]]).filter(
-                  (d) => typeof d[1] !== "function" && ![
-                    "__store",
-                    "basepath",
-                    "injectedHtml",
-                    "subscribers",
-                    "latestLoadPromise",
-                    "navigateTimeout",
-                    "resetNextScroll",
-                    "tempLocationKey",
-                    "latestLocation",
-                    "routeTree",
-                    "history"
-                  ].includes(d[0])
-                )
-              ),
-              defaultExpanded: {
-                state: {},
-                context: {},
-                options: {}
-              },
-              filterSubEntries: (subEntries) => {
-                return subEntries.filter((d) => typeof d.value !== "function");
-              }
-            }
-          ) }) })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.secondContainer, children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.matchesContainer, children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.detailsHeader, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Pathname" }),
-              routerState.location.maskedLocation ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.maskedBadgeContainer, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: styles.maskedBadge, children: "masked" }) }) : null
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.detailsContent, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("code", { children: routerState.location.pathname }),
-              routerState.location.maskedLocation ? /* @__PURE__ */ jsxRuntime.jsx("code", { className: styles.maskedLocation, children: routerState.location.maskedLocation.pathname }) : null
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.detailsHeader, children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.routeMatchesToggle, children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => {
-                      setShowMatches(false);
-                    },
-                    disabled: !showMatches,
-                    className: clsx.clsx(styles.routeMatchesToggleBtn(!showMatches, true)),
-                    children: "Routes"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => {
-                      setShowMatches(true);
-                    },
-                    disabled: showMatches,
-                    className: clsx.clsx(
-                      styles.routeMatchesToggleBtn(!!showMatches, false)
-                    ),
-                    children: "Matches"
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsHeaderInfo, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: "age / staleTime / gcTime" }) })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx(styles.routesContainer), children: !showMatches ? /* @__PURE__ */ jsxRuntime.jsx(
-              RouteComp,
-              {
-                router,
-                route: router.routeTree,
-                isRoot: true,
-                activeId,
-                setActiveId
-              }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { children: (((_a = routerState.pendingMatches) == null ? void 0 : _a.length) ? routerState.pendingMatches : routerState.matches).map((match, i) => {
-              return /* @__PURE__ */ jsxRuntime.jsxs(
-                "div",
-                {
-                  role: "button",
-                  "aria-label": `Open match details for ${match.id}`,
-                  onClick: () => setActiveId(activeId === match.id ? "" : match.id),
-                  className: clsx.clsx(styles.matchRow(match === activeMatch)),
-                  children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      "div",
-                      {
-                        className: clsx.clsx(
-                          styles.matchIndicator(utils.getStatusColor(match))
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      "code",
-                      {
-                        className: styles.matchID,
-                        children: `${match.routeId === reactRouter.rootRouteId ? reactRouter.rootRouteId : match.pathname}`
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsx(AgeTicker.AgeTicker, { match, router })
-                  ]
-                },
-                match.id || i
-              );
-            }) }) })
-          ] }),
-          routerState.cachedMatches.length ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.cachedMatchesContainer, children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.detailsHeader, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Cached Matches" }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsHeaderInfo, children: "age / staleTime / gcTime" })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { children: routerState.cachedMatches.map((match) => {
-              return /* @__PURE__ */ jsxRuntime.jsxs(
-                "div",
-                {
-                  role: "button",
-                  "aria-label": `Open match details for ${match.id}`,
-                  onClick: () => setActiveId(activeId === match.id ? "" : match.id),
-                  className: clsx.clsx(styles.matchRow(match === activeMatch)),
-                  children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      "div",
-                      {
-                        className: clsx.clsx(
-                          styles.matchIndicator(utils.getStatusColor(match))
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsx("code", { className: styles.matchID, children: `${match.id}` }),
-                    /* @__PURE__ */ jsxRuntime.jsx(AgeTicker.AgeTicker, { match, router })
-                  ]
-                },
-                match.id
-              );
-            }) })
-          ] }) : null
-        ] }),
-        activeMatch ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.thirdContainer, children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsHeader, children: "Match Details" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.matchDetails, children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: styles.matchStatus(
-                  activeMatch.status,
-                  activeMatch.isFetching
-                ),
-                children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: activeMatch.status === "success" && activeMatch.isFetching ? "fetching" : activeMatch.status })
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.matchDetailsInfoLabel, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { children: "ID:" }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.matchDetailsInfo, children: /* @__PURE__ */ jsxRuntime.jsx("code", { children: activeMatch.id }) })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.matchDetailsInfoLabel, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { children: "State:" }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.matchDetailsInfo, children: ((_b = routerState.pendingMatches) == null ? void 0 : _b.find(
-                (d) => d.id === activeMatch.id
-              )) ? "Pending" : routerState.matches.find((d) => d.id === activeMatch.id) ? "Active" : "Cached" })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.matchDetailsInfoLabel, children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { children: "Last Updated:" }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.matchDetailsInfo, children: activeMatch.updatedAt ? new Date(activeMatch.updatedAt).toLocaleTimeString() : "N/A" })
-            ] })
-          ] }) }),
-          activeMatch.loaderData ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsHeader, children: "Loader Data" }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsContent, children: /* @__PURE__ */ jsxRuntime.jsx(
-              Explorer.default,
-              {
-                label: "loaderData",
-                value: activeMatch.loaderData,
-                defaultExpanded: {}
-              }
-            ) })
-          ] }) : null,
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsHeader, children: "Explorer" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsContent, children: /* @__PURE__ */ jsxRuntime.jsx(Explorer.default, { label: "Match", value: activeMatch, defaultExpanded: {} }) })
-        ] }) : null,
-        hasSearch ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: styles.fourthContainer, children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsHeader, children: "Search Params" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.detailsContent, children: /* @__PURE__ */ jsxRuntime.jsx(
-            Explorer.default,
-            {
-              value: routerState.location.search,
-              defaultExpanded: Object.keys(routerState.location.search).reduce(
-                (obj, next) => {
-                  obj[next] = {};
-                  return obj;
-                },
-                {}
-              )
-            }
-          ) })
-        ] }) : null
-      ]
-    }
-  );
-});
-exports.BaseTanStackRouterDevtoolsPanel = BaseTanStackRouterDevtoolsPanel;
-//# sourceMappingURL=BaseTanStackRouterDevtoolsPanel.cjs.map

package/dist/cjs/BaseTanStackRouterDevtoolsPanel.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseTanStackRouterDevtoolsPanel.cjs","sources":["../../src/BaseTanStackRouterDevtoolsPanel.tsx"],"sourcesContent":["import React from 'react'\nimport { clsx as cx } from 'clsx'\nimport {\n  invariant,\n  rootRouteId,\n  trimPath,\n  useRouter,\n  useRouterState,\n} from '@tanstack/react-router'\nimport { useDevtoolsOnClose } from './context'\nimport { useStyles } from './useStyles'\nimport useLocalStorage from './useLocalStorage'\nimport Explorer from './Explorer'\nimport { getRouteStatusColor, getStatusColor, multiSortBy } from './utils'\nimport { AgeTicker } from './AgeTicker'\nimport type { DevtoolsPanelOptions } from './TanStackRouterDevtoolsPanel'\n\nimport type {\n  AnyRootRoute,\n  AnyRoute,\n  AnyRouter,\n  Route,\n} from '@tanstack/react-router'\n\nfunction Logo(props: React.HTMLAttributes<HTMLButtonElement>) {\n  const { className, ...rest } = props\n  const styles = useStyles()\n  return (\n    <button {...rest} className={cx(styles.logo, className)}>\n      <div className={styles.tanstackLogo}>TANSTACK</div>\n      <div className={styles.routerLogo}>React Router v1</div>\n    </button>\n  )\n}\n\nfunction RouteComp({\n  router,\n  route,\n  isRoot,\n  activeId,\n  setActiveId,\n}: {\n  router: AnyRouter\n  route: AnyRootRoute | AnyRoute\n  isRoot?: boolean\n  activeId: string | undefined\n  setActiveId: (id: string) => void\n}) {\n  const routerState = useRouterState({\n    router,\n  } as any)\n  const styles = useStyles()\n  const matches = routerState.pendingMatches || routerState.matches\n  const match = routerState.matches.find((d) => d.routeId === route.id)\n\n  const param = React.useMemo(() => {\n    try {\n      if (match?.params) {\n        const p = match.params\n        const r: string = route.path || trimPath(route.id)\n        if (r.startsWith('$')) {\n          const trimmed = r.slice(1)\n          if (p[trimmed]) {\n            return `(${p[trimmed]})`\n          }\n        }\n      }\n      return ''\n    } catch (error) {\n      return ''\n    }\n  }, [match, route])\n\n  return (\n    <div>\n      <div\n        role=\"button\"\n        aria-label={`Open match details for ${route.id}`}\n        onClick={() => {\n          if (match) {\n            setActiveId(activeId === route.id ? '' : route.id)\n          }\n        }}\n        className={cx(\n          styles.routesRowContainer(route.id === activeId, !!match),\n        )}\n      >\n        <div\n          className={cx(\n            styles.matchIndicator(getRouteStatusColor(matches, route)),\n          )}\n        />\n        <div className={cx(styles.routesRow(!!match))}>\n          <div>\n            <code className={styles.code}>\n              {isRoot ? rootRouteId : route.path || trimPath(route.id)}{' '}\n            </code>\n            <code className={styles.routeParamInfo}>{param}</code>\n          </div>\n          <AgeTicker match={match} router={router} />\n        </div>\n      </div>\n      {route.children?.length ? (\n        <div className={styles.nestedRouteRow(!!isRoot)}>\n          {[...(route.children as Array<Route>)]\n            .sort((a, b) => {\n              return a.rank - b.rank\n            })\n            .map((r) => (\n              <RouteComp\n                key={r.id}\n                router={router}\n                route={r}\n                activeId={activeId}\n                setActiveId={setActiveId}\n              />\n            ))}\n        </div>\n      ) : null}\n    </div>\n  )\n}\n\nexport const BaseTanStackRouterDevtoolsPanel = React.forwardRef<\n  HTMLDivElement,\n  DevtoolsPanelOptions\n>(function BaseTanStackRouterDevtoolsPanel(props, ref): React.ReactElement {\n  const {\n    isOpen = true,\n    setIsOpen,\n    handleDragStart,\n    router: userRouter,\n    shadowDOMTarget,\n    ...panelProps\n  } = props\n\n  const { onCloseClick } = useDevtoolsOnClose()\n  const styles = useStyles()\n  const { className, ...otherPanelProps } = panelProps\n\n  const contextRouter = useRouter({ warn: false })\n  const router = userRouter ?? contextRouter\n  const routerState = useRouterState({\n    router,\n  } as any)\n\n  invariant(\n    router,\n    'No router was found for the TanStack Router Devtools. Please place the devtools in the <RouterProvider> component tree or pass the router instance to the devtools manually.',\n  )\n\n  // useStore(router.__store)\n\n  const [showMatches, setShowMatches] = useLocalStorage(\n    'tanstackRouterDevtoolsShowMatches',\n    true,\n  )\n\n  const [activeId, setActiveId] = useLocalStorage(\n    'tanstackRouterDevtoolsActiveRouteId',\n    '',\n  )\n\n  const activeMatch = React.useMemo(() => {\n    const matches = [\n      ...(routerState.pendingMatches ?? []),\n      ...routerState.matches,\n      ...routerState.cachedMatches,\n    ]\n    return matches.find((d) => d.routeId === activeId || d.id === activeId)\n  }, [\n    activeId,\n    routerState.cachedMatches,\n    routerState.matches,\n    routerState.pendingMatches,\n  ])\n\n  const hasSearch = Object.keys(routerState.location.search).length\n\n  const explorerState = {\n    ...router,\n    state: router.state,\n  }\n\n  return (\n    <div\n      ref={ref}\n      className={cx(\n        styles.devtoolsPanel,\n        'TanStackRouterDevtoolsPanel',\n        className,\n      )}\n      {...otherPanelProps}\n    >\n      {handleDragStart ? (\n        <div className={styles.dragHandle} onMouseDown={handleDragStart}></div>\n      ) : null}\n      <button\n        className={styles.panelCloseBtn}\n        onClick={(e) => {\n          setIsOpen(false)\n          onCloseClick(e)\n        }}\n      >\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"10\"\n          height=\"6\"\n          fill=\"none\"\n          viewBox=\"0 0 10 6\"\n          className={styles.panelCloseBtnIcon}\n        >\n          <path\n            stroke=\"currentColor\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n            strokeWidth=\"1.667\"\n            d=\"M1 1l4 4 4-4\"\n          ></path>\n        </svg>\n      </button>\n      <div className={styles.firstContainer}>\n        <div className={styles.row}>\n          <Logo\n            aria-hidden\n            onClick={(e) => {\n              setIsOpen(false)\n              onCloseClick(e)\n            }}\n          />\n        </div>\n        <div className={styles.routerExplorerContainer}>\n          <div className={styles.routerExplorer}>\n            <Explorer\n              label=\"Router\"\n              value={Object.fromEntries(\n                multiSortBy(\n                  Object.keys(explorerState),\n                  (\n                    [\n                      'state',\n                      'routesById',\n                      'routesByPath',\n                      'flatRoutes',\n                      'options',\n                      'manifest',\n                    ] as const\n                  ).map((d) => (dd) => dd !== d),\n                )\n                  .map((key) => [key, (explorerState as any)[key]])\n                  .filter(\n                    (d) =>\n                      typeof d[1] !== 'function' &&\n                      ![\n                        '__store',\n                        'basepath',\n                        'injectedHtml',\n                        'subscribers',\n                        'latestLoadPromise',\n                        'navigateTimeout',\n                        'resetNextScroll',\n                        'tempLocationKey',\n                        'latestLocation',\n                        'routeTree',\n                        'history',\n                      ].includes(d[0]),\n                  ),\n              )}\n              defaultExpanded={{\n                state: {} as any,\n                context: {} as any,\n                options: {} as any,\n              }}\n              filterSubEntries={(subEntries) => {\n                return subEntries.filter((d) => typeof d.value !== 'function')\n              }}\n            />\n          </div>\n        </div>\n      </div>\n      <div className={styles.secondContainer}>\n        <div className={styles.matchesContainer}>\n          <div className={styles.detailsHeader}>\n            <span>Pathname</span>\n            {routerState.location.maskedLocation ? (\n              <div className={styles.maskedBadgeContainer}>\n                <span className={styles.maskedBadge}>masked</span>\n              </div>\n            ) : null}\n          </div>\n          <div className={styles.detailsContent}>\n            <code>{routerState.location.pathname}</code>\n            {routerState.location.maskedLocation ? (\n              <code className={styles.maskedLocation}>\n                {routerState.location.maskedLocation.pathname}\n              </code>\n            ) : null}\n          </div>\n          <div className={styles.detailsHeader}>\n            <div className={styles.routeMatchesToggle}>\n              <button\n                type=\"button\"\n                onClick={() => {\n                  setShowMatches(false)\n                }}\n                disabled={!showMatches}\n                className={cx(styles.routeMatchesToggleBtn(!showMatches, true))}\n              >\n                Routes\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => {\n                  setShowMatches(true)\n                }}\n                disabled={showMatches}\n                className={cx(\n                  styles.routeMatchesToggleBtn(!!showMatches, false),\n                )}\n              >\n                Matches\n              </button>\n            </div>\n            <div className={styles.detailsHeaderInfo}>\n              <div>age / staleTime / gcTime</div>\n            </div>\n          </div>\n          <div className={cx(styles.routesContainer)}>\n            {!showMatches ? (\n              <RouteComp\n                router={router}\n                route={router.routeTree}\n                isRoot\n                activeId={activeId}\n                setActiveId={setActiveId}\n              />\n            ) : (\n              <div>\n                {(routerState.pendingMatches?.length\n                  ? routerState.pendingMatches\n                  : routerState.matches\n                ).map((match, i) => {\n                  return (\n                    <div\n                      key={match.id || i}\n                      role=\"button\"\n                      aria-label={`Open match details for ${match.id}`}\n                      onClick={() =>\n                        setActiveId(activeId === match.id ? '' : match.id)\n                      }\n                      className={cx(styles.matchRow(match === activeMatch))}\n                    >\n                      <div\n                        className={cx(\n                          styles.matchIndicator(getStatusColor(match)),\n                        )}\n                      />\n\n                      <code\n                        className={styles.matchID}\n                      >{`${match.routeId === rootRouteId ? rootRouteId : match.pathname}`}</code>\n                      <AgeTicker match={match} router={router} />\n                    </div>\n                  )\n                })}\n              </div>\n            )}\n          </div>\n        </div>\n        {routerState.cachedMatches.length ? (\n          <div className={styles.cachedMatchesContainer}>\n            <div className={styles.detailsHeader}>\n              <div>Cached Matches</div>\n              <div className={styles.detailsHeaderInfo}>\n                age / staleTime / gcTime\n              </div>\n            </div>\n            <div>\n              {routerState.cachedMatches.map((match) => {\n                return (\n                  <div\n                    key={match.id}\n                    role=\"button\"\n                    aria-label={`Open match details for ${match.id}`}\n                    onClick={() =>\n                      setActiveId(activeId === match.id ? '' : match.id)\n                    }\n                    className={cx(styles.matchRow(match === activeMatch))}\n                  >\n                    <div\n                      className={cx(\n                        styles.matchIndicator(getStatusColor(match)),\n                      )}\n                    />\n\n                    <code className={styles.matchID}>{`${match.id}`}</code>\n\n                    <AgeTicker match={match} router={router} />\n                  </div>\n                )\n              })}\n            </div>\n          </div>\n        ) : null}\n      </div>\n      {activeMatch ? (\n        <div className={styles.thirdContainer}>\n          <div className={styles.detailsHeader}>Match Details</div>\n          <div>\n            <div className={styles.matchDetails}>\n              <div\n                className={styles.matchStatus(\n                  activeMatch.status,\n                  activeMatch.isFetching,\n                )}\n              >\n                <div>\n                  {activeMatch.status === 'success' && activeMatch.isFetching\n                    ? 'fetching'\n                    : activeMatch.status}\n                </div>\n              </div>\n              <div className={styles.matchDetailsInfoLabel}>\n                <div>ID:</div>\n                <div className={styles.matchDetailsInfo}>\n                  <code>{activeMatch.id}</code>\n                </div>\n              </div>\n              <div className={styles.matchDetailsInfoLabel}>\n                <div>State:</div>\n                <div className={styles.matchDetailsInfo}>\n                  {routerState.pendingMatches?.find(\n                    (d) => d.id === activeMatch.id,\n                  )\n                    ? 'Pending'\n                    : routerState.matches.find((d) => d.id === activeMatch.id)\n                      ? 'Active'\n                      : 'Cached'}\n                </div>\n              </div>\n              <div className={styles.matchDetailsInfoLabel}>\n                <div>Last Updated:</div>\n                <div className={styles.matchDetailsInfo}>\n                  {activeMatch.updatedAt\n                    ? new Date(activeMatch.updatedAt).toLocaleTimeString()\n                    : 'N/A'}\n                </div>\n              </div>\n            </div>\n          </div>\n          {activeMatch.loaderData ? (\n            <>\n              <div className={styles.detailsHeader}>Loader Data</div>\n              <div className={styles.detailsContent}>\n                <Explorer\n                  label=\"loaderData\"\n                  value={activeMatch.loaderData}\n                  defaultExpanded={{}}\n                />\n              </div>\n            </>\n          ) : null}\n          <div className={styles.detailsHeader}>Explorer</div>\n          <div className={styles.detailsContent}>\n            <Explorer label=\"Match\" value={activeMatch} defaultExpanded={{}} />\n          </div>\n        </div>\n      ) : null}\n      {hasSearch ? (\n        <div className={styles.fourthContainer}>\n          <div className={styles.detailsHeader}>Search Params</div>\n          <div className={styles.detailsContent}>\n            <Explorer\n              value={routerState.location.search}\n              defaultExpanded={Object.keys(routerState.location.search).reduce(\n                (obj: any, next) => {\n                  obj[next] = {}\n                  return obj\n                },\n                {},\n              )}\n            />\n          </div>\n        </div>\n      ) : null}\n    </div>\n  )\n})\n"],"names":["useStyles","jsxs","cx","jsx","useRouterState","trimPath","getRouteStatusColor","rootRouteId","AgeTicker","BaseTanStackRouterDevtoolsPanel","useDevtoolsOnClose","useRouter","invariant","Explorer","multiSortBy","getStatusColor","Fragment"],"mappings":";;;;;;;;;;;;AAwBA,SAAS,KAAK,OAAgD;AAC5D,QAAM,EAAE,WAAW,GAAG,KAAA,IAAS;AAC/B,QAAM,SAASA,UAAAA,UAAU;AAEvB,SAAAC,gCAAC,YAAQ,GAAG,MAAM,WAAWC,KAAG,KAAA,OAAO,MAAM,SAAS,GACpD,UAAA;AAAA,IAAAC,2BAAA,IAAC,OAAI,EAAA,WAAW,OAAO,cAAc,UAAQ,YAAA;AAAA,IAC5CA,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,YAAY,UAAe,kBAAA,CAAA;AAAA,EAAA,GACpD;AAEJ;AAEA,SAAS,UAAU;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;;AACD,QAAM,cAAcC,YAAAA,eAAe;AAAA,IACjC;AAAA,EAAA,CACM;AACR,QAAM,SAASJ,UAAAA,UAAU;AACnB,QAAA,UAAU,YAAY,kBAAkB,YAAY;AACpD,QAAA,QAAQ,YAAY,QAAQ,KAAK,CAAC,MAAM,EAAE,YAAY,MAAM,EAAE;AAE9D,QAAA,QAAQ,MAAM,QAAQ,MAAM;AAC5B,QAAA;AACF,UAAI,+BAAO,QAAQ;AACjB,cAAM,IAAI,MAAM;AAChB,cAAM,IAAY,MAAM,QAAQK,YAAAA,SAAS,MAAM,EAAE;AAC7C,YAAA,EAAE,WAAW,GAAG,GAAG;AACf,gBAAA,UAAU,EAAE,MAAM,CAAC;AACrB,cAAA,EAAE,OAAO,GAAG;AACP,mBAAA,IAAI,EAAE,OAAO,CAAC;AAAA,UAAA;AAAA,QACvB;AAAA,MACF;AAEK,aAAA;AAAA,aACA,OAAO;AACP,aAAA;AAAA,IAAA;AAAA,EACT,GACC,CAAC,OAAO,KAAK,CAAC;AAEjB,yCACG,OACC,EAAA,UAAA;AAAA,IAAAJ,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,cAAY,0BAA0B,MAAM,EAAE;AAAA,QAC9C,SAAS,MAAM;AACb,cAAI,OAAO;AACT,wBAAY,aAAa,MAAM,KAAK,KAAK,MAAM,EAAE;AAAA,UAAA;AAAA,QAErD;AAAA,QACA,WAAWC,KAAA;AAAA,UACT,OAAO,mBAAmB,MAAM,OAAO,UAAU,CAAC,CAAC,KAAK;AAAA,QAC1D;AAAA,QAEA,UAAA;AAAA,UAAAC,2BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWD,KAAA;AAAA,gBACT,OAAO,eAAeI,0BAAoB,SAAS,KAAK,CAAC;AAAA,cAAA;AAAA,YAC3D;AAAA,UACF;AAAA,UACAL,2BAAAA,KAAC,OAAI,EAAA,WAAWC,UAAG,OAAO,UAAU,CAAC,CAAC,KAAK,CAAC,GAC1C,UAAA;AAAA,YAAAD,gCAAC,OACC,EAAA,UAAA;AAAA,cAACA,2BAAA,KAAA,QAAA,EAAK,WAAW,OAAO,MACrB,UAAA;AAAA,gBAAA,SAASM,YAAc,cAAA,MAAM,QAAQF,YAAA,SAAS,MAAM,EAAE;AAAA,gBAAG;AAAA,cAAA,GAC5D;AAAA,cACCF,2BAAA,IAAA,QAAA,EAAK,WAAW,OAAO,gBAAiB,UAAM,MAAA,CAAA;AAAA,YAAA,GACjD;AAAA,YACAA,2BAAAA,IAACK,UAAU,WAAA,EAAA,OAAc,OAAgB,CAAA;AAAA,UAAA,EAC3C,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,MACC,WAAM,aAAN,mBAAgB,UACfL,2BAAA,IAAC,SAAI,WAAW,OAAO,eAAe,CAAC,CAAC,MAAM,GAC3C,UAAA,CAAC,GAAI,MAAM,QAAyB,EAClC,KAAK,CAAC,GAAG,MAAM;AACP,aAAA,EAAE,OAAO,EAAE;AAAA,IAAA,CACnB,EACA,IAAI,CAAC,MACJA,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC;AAAA,QACA,OAAO;AAAA,QACP;AAAA,QACA;AAAA,MAAA;AAAA,MAJK,EAAE;AAAA,IAMV,CAAA,EACL,CAAA,IACE;AAAA,EAAA,GACN;AAEJ;AAEO,MAAM,kCAAkC,MAAM,WAGnD,SAASM,iCAAgC,OAAO,KAAyB;;AACnE,QAAA;AAAA,IACJ,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEE,QAAA,EAAE,aAAa,IAAIC,2BAAmB;AAC5C,QAAM,SAASV,UAAAA,UAAU;AACzB,QAAM,EAAE,WAAW,GAAG,gBAAA,IAAoB;AAE1C,QAAM,gBAAgBW,YAAA,UAAU,EAAE,MAAM,OAAO;AAC/C,QAAM,SAAS,cAAc;AAC7B,QAAM,cAAcP,YAAAA,eAAe;AAAA,IACjC;AAAA,EAAA,CACM;AAERQ,cAAA;AAAA,IACE;AAAA,IACA;AAAA,EACF;AAIM,QAAA,CAAC,aAAa,cAAc,IAAI;AAAA,IACpC;AAAA,IACA;AAAA,EACF;AAEM,QAAA,CAAC,UAAU,WAAW,IAAI;AAAA,IAC9B;AAAA,IACA;AAAA,EACF;AAEM,QAAA,cAAc,MAAM,QAAQ,MAAM;AACtC,UAAM,UAAU;AAAA,MACd,GAAI,YAAY,kBAAkB,CAAC;AAAA,MACnC,GAAG,YAAY;AAAA,MACf,GAAG,YAAY;AAAA,IACjB;AACO,WAAA,QAAQ,KAAK,CAAC,MAAM,EAAE,YAAY,YAAY,EAAE,OAAO,QAAQ;AAAA,EAAA,GACrE;AAAA,IACD;AAAA,IACA,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,YAAY;AAAA,EAAA,CACb;AAED,QAAM,YAAY,OAAO,KAAK,YAAY,SAAS,MAAM,EAAE;AAE3D,QAAM,gBAAgB;AAAA,IACpB,GAAG;AAAA,IACH,OAAO,OAAO;AAAA,EAChB;AAGE,SAAAX,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,WAAWC,KAAA;AAAA,QACT,OAAO;AAAA,QACP;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH,UAAA;AAAA,QAAA,iDACE,OAAI,EAAA,WAAW,OAAO,YAAY,aAAa,gBAAiB,CAAA,IAC/D;AAAA,QACJC,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,OAAO;AAAA,YAClB,SAAS,CAAC,MAAM;AACd,wBAAU,KAAK;AACf,2BAAa,CAAC;AAAA,YAChB;AAAA,YAEA,UAAAA,2BAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,OAAM;AAAA,gBACN,OAAM;AAAA,gBACN,QAAO;AAAA,gBACP,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,WAAW,OAAO;AAAA,gBAElB,UAAAA,2BAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,QAAO;AAAA,oBACP,eAAc;AAAA,oBACd,gBAAe;AAAA,oBACf,aAAY;AAAA,oBACZ,GAAE;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACH;AAAA,YAAA;AAAA,UACH;AAAA,QACF;AAAA,QACCF,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,gBACrB,UAAA;AAAA,UAACE,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,KACrB,UAAAA,2BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,eAAW;AAAA,cACX,SAAS,CAAC,MAAM;AACd,0BAAU,KAAK;AACf,6BAAa,CAAC;AAAA,cAAA;AAAA,YAChB;AAAA,UAAA,GAEJ;AAAA,UACAA,2BAAAA,IAAC,SAAI,WAAW,OAAO,yBACrB,UAACA,+BAAA,OAAA,EAAI,WAAW,OAAO,gBACrB,UAAAA,2BAAA;AAAA,YAACU,SAAA;AAAA,YAAA;AAAA,cACC,OAAM;AAAA,cACN,OAAO,OAAO;AAAA,gBACZC,MAAA;AAAA,kBACE,OAAO,KAAK,aAAa;AAAA,kBAEvB;AAAA,oBACE;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBAEF,IAAI,CAAC,MAAM,CAAC,OAAO,OAAO,CAAC;AAAA,gBAAA,EAE5B,IAAI,CAAC,QAAQ,CAAC,KAAM,cAAsB,GAAG,CAAC,CAAC,EAC/C;AAAA,kBACC,CAAC,MACC,OAAO,EAAE,CAAC,MAAM,cAChB,CAAC;AAAA,oBACC;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,oBACA;AAAA,kBAAA,EACA,SAAS,EAAE,CAAC,CAAC;AAAA,gBAAA;AAAA,cAEvB;AAAA,cACA,iBAAiB;AAAA,gBACf,OAAO,CAAC;AAAA,gBACR,SAAS,CAAC;AAAA,gBACV,SAAS,CAAA;AAAA,cACX;AAAA,cACA,kBAAkB,CAAC,eAAe;AAChC,uBAAO,WAAW,OAAO,CAAC,MAAM,OAAO,EAAE,UAAU,UAAU;AAAA,cAAA;AAAA,YAC/D;AAAA,aAEJ,EACF,CAAA;AAAA,QAAA,GACF;AAAA,QACCb,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,iBACrB,UAAA;AAAA,UAACA,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,kBACrB,UAAA;AAAA,YAACA,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,eACrB,UAAA;AAAA,cAAAE,2BAAAA,IAAC,UAAK,UAAQ,WAAA,CAAA;AAAA,cACb,YAAY,SAAS,iBACpBA,2BAAA,IAAC,SAAI,WAAW,OAAO,sBACrB,UAAAA,2BAAAA,IAAC,UAAK,WAAW,OAAO,aAAa,UAAA,UAAM,GAC7C,IACE;AAAA,YAAA,GACN;AAAA,YACCF,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,gBACrB,UAAA;AAAA,cAACE,2BAAA,IAAA,QAAA,EAAM,UAAY,YAAA,SAAS,UAAS;AAAA,cACpC,YAAY,SAAS,iBACpBA,2BAAA,IAAC,QAAK,EAAA,WAAW,OAAO,gBACrB,UAAY,YAAA,SAAS,eAAe,SACvC,CAAA,IACE;AAAA,YAAA,GACN;AAAA,YACCF,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,eACrB,UAAA;AAAA,cAACA,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,oBACrB,UAAA;AAAA,gBAAAE,2BAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL,SAAS,MAAM;AACb,qCAAe,KAAK;AAAA,oBACtB;AAAA,oBACA,UAAU,CAAC;AAAA,oBACX,WAAWD,KAAG,KAAA,OAAO,sBAAsB,CAAC,aAAa,IAAI,CAAC;AAAA,oBAC/D,UAAA;AAAA,kBAAA;AAAA,gBAED;AAAA,gBACAC,2BAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL,SAAS,MAAM;AACb,qCAAe,IAAI;AAAA,oBACrB;AAAA,oBACA,UAAU;AAAA,oBACV,WAAWD,KAAA;AAAA,sBACT,OAAO,sBAAsB,CAAC,CAAC,aAAa,KAAK;AAAA,oBACnD;AAAA,oBACD,UAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAED,GACF;AAAA,cACAC,2BAAAA,IAAC,SAAI,WAAW,OAAO,mBACrB,UAACA,2BAAAA,IAAA,OAAA,EAAI,qCAAwB,CAAA,EAC/B,CAAA;AAAA,YAAA,GACF;AAAA,YACAA,+BAAC,SAAI,WAAWD,KAAA,KAAG,OAAO,eAAe,GACtC,WAAC,cACAC,2BAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC;AAAA,gBACA,OAAO,OAAO;AAAA,gBACd,QAAM;AAAA,gBACN;AAAA,gBACA;AAAA,cAAA;AAAA,YAAA,IAGFA,2BAAAA,IAAC,OACG,EAAA,aAAA,iBAAY,mBAAZ,mBAA4B,UAC1B,YAAY,iBACZ,YAAY,SACd,IAAI,CAAC,OAAO,MAAM;AAEhB,qBAAAF,2BAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,MAAK;AAAA,kBACL,cAAY,0BAA0B,MAAM,EAAE;AAAA,kBAC9C,SAAS,MACP,YAAY,aAAa,MAAM,KAAK,KAAK,MAAM,EAAE;AAAA,kBAEnD,WAAWC,KAAG,KAAA,OAAO,SAAS,UAAU,WAAW,CAAC;AAAA,kBAEpD,UAAA;AAAA,oBAAAC,2BAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,WAAWD,KAAA;AAAA,0BACT,OAAO,eAAea,MAAe,eAAA,KAAK,CAAC;AAAA,wBAAA;AAAA,sBAC7C;AAAA,oBACF;AAAA,oBAEAZ,2BAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,WAAW,OAAO;AAAA,wBAClB,aAAG,MAAM,YAAYI,YAAAA,cAAcA,YAAA,cAAc,MAAM,QAAQ;AAAA,sBAAA;AAAA,oBAAG;AAAA,oBACpEJ,2BAAAA,IAACK,UAAU,WAAA,EAAA,OAAc,OAAgB,CAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAjBpC,MAAM,MAAM;AAAA,cAkBnB;AAAA,YAEH,CAAA,EACH,CAAA,EAEJ,CAAA;AAAA,UAAA,GACF;AAAA,UACC,YAAY,cAAc,yCACxB,OAAI,EAAA,WAAW,OAAO,wBACrB,UAAA;AAAA,YAACP,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,eACrB,UAAA;AAAA,cAAAE,2BAAAA,IAAC,SAAI,UAAc,iBAAA,CAAA;AAAA,cAClBA,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,mBAAmB,UAE1C,2BAAA,CAAA;AAAA,YAAA,GACF;AAAA,2CACC,OACE,EAAA,UAAA,YAAY,cAAc,IAAI,CAAC,UAAU;AAEtC,qBAAAF,2BAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBAEC,MAAK;AAAA,kBACL,cAAY,0BAA0B,MAAM,EAAE;AAAA,kBAC9C,SAAS,MACP,YAAY,aAAa,MAAM,KAAK,KAAK,MAAM,EAAE;AAAA,kBAEnD,WAAWC,KAAG,KAAA,OAAO,SAAS,UAAU,WAAW,CAAC;AAAA,kBAEpD,UAAA;AAAA,oBAAAC,2BAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,WAAWD,KAAA;AAAA,0BACT,OAAO,eAAea,MAAe,eAAA,KAAK,CAAC;AAAA,wBAAA;AAAA,sBAC7C;AAAA,oBACF;AAAA,oBAEAZ,2BAAAA,IAAC,UAAK,WAAW,OAAO,SAAU,UAAG,GAAA,MAAM,EAAE,GAAG,CAAA;AAAA,oBAEhDA,2BAAAA,IAACK,UAAU,WAAA,EAAA,OAAc,OAAgB,CAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAhBpC,MAAM;AAAA,cAiBb;AAAA,YAAA,CAEH,EACH,CAAA;AAAA,UAAA,EAAA,CACF,IACE;AAAA,QAAA,GACN;AAAA,QACC,cACCP,2BAAA,KAAC,OAAI,EAAA,WAAW,OAAO,gBACrB,UAAA;AAAA,UAAAE,2BAAA,IAAC,OAAI,EAAA,WAAW,OAAO,eAAe,UAAa,iBAAA;AAAA,yCAClD,OACC,EAAA,UAAAF,2BAAA,KAAC,OAAI,EAAA,WAAW,OAAO,cACrB,UAAA;AAAA,YAAAE,2BAAA;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAW,OAAO;AAAA,kBAChB,YAAY;AAAA,kBACZ,YAAY;AAAA,gBACd;AAAA,gBAEA,UAAAA,2BAAAA,IAAC,SACE,UAAY,YAAA,WAAW,aAAa,YAAY,aAC7C,aACA,YAAY,OAClB,CAAA;AAAA,cAAA;AAAA,YACF;AAAA,YACCF,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,uBACrB,UAAA;AAAA,cAAAE,2BAAAA,IAAC,SAAI,UAAG,MAAA,CAAA;AAAA,cACRA,2BAAAA,IAAC,SAAI,WAAW,OAAO,kBACrB,UAACA,2BAAA,IAAA,QAAA,EAAM,UAAY,YAAA,GAAG,CAAA,EACxB,CAAA;AAAA,YAAA,GACF;AAAA,YACCF,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,uBACrB,UAAA;AAAA,cAAAE,2BAAAA,IAAC,SAAI,UAAM,SAAA,CAAA;AAAA,6CACV,OAAI,EAAA,WAAW,OAAO,kBACpB,6BAAY,sCAAgB;AAAA,gBAC3B,CAAC,MAAM,EAAE,OAAO,YAAY;AAAA,mBAE1B,YACA,YAAY,QAAQ,KAAK,CAAC,MAAM,EAAE,OAAO,YAAY,EAAE,IACrD,WACA,SACR,CAAA;AAAA,YAAA,GACF;AAAA,YACCF,2BAAA,KAAA,OAAA,EAAI,WAAW,OAAO,uBACrB,UAAA;AAAA,cAAAE,2BAAAA,IAAC,SAAI,UAAa,gBAAA,CAAA;AAAA,cACjBA,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,kBACpB,UAAY,YAAA,YACT,IAAI,KAAK,YAAY,SAAS,EAAE,uBAChC,MACN,CAAA;AAAA,YAAA,EACF,CAAA;AAAA,UAAA,EAAA,CACF,EACF,CAAA;AAAA,UACC,YAAY,aAETF,2BAAAA,KAAAe,WAAA,UAAA,EAAA,UAAA;AAAA,YAAAb,2BAAA,IAAC,OAAI,EAAA,WAAW,OAAO,eAAe,UAAW,eAAA;AAAA,YAChDA,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,gBACrB,UAAAA,2BAAA;AAAA,cAACU,SAAA;AAAA,cAAA;AAAA,gBACC,OAAM;AAAA,gBACN,OAAO,YAAY;AAAA,gBACnB,iBAAiB,CAAA;AAAA,cAAC;AAAA,YAAA,EAEtB,CAAA;AAAA,UAAA,EAAA,CACF,IACE;AAAA,UACHV,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,eAAe,UAAQ,YAAA;AAAA,UAC7CA,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,gBACrB,UAACA,2BAAA,IAAAU,SAAA,SAAA,EAAS,OAAM,SAAQ,OAAO,aAAa,iBAAiB,IAAI,EACnE,CAAA;AAAA,QAAA,EAAA,CACF,IACE;AAAA,QACH,YACCZ,2BAAA,KAAC,OAAI,EAAA,WAAW,OAAO,iBACrB,UAAA;AAAA,UAAAE,2BAAA,IAAC,OAAI,EAAA,WAAW,OAAO,eAAe,UAAa,iBAAA;AAAA,UAClDA,2BAAA,IAAA,OAAA,EAAI,WAAW,OAAO,gBACrB,UAAAA,2BAAA;AAAA,YAACU,SAAA;AAAA,YAAA;AAAA,cACC,OAAO,YAAY,SAAS;AAAA,cAC5B,iBAAiB,OAAO,KAAK,YAAY,SAAS,MAAM,EAAE;AAAA,gBACxD,CAAC,KAAU,SAAS;AACd,sBAAA,IAAI,IAAI,CAAC;AACN,yBAAA;AAAA,gBACT;AAAA,gBACA,CAAA;AAAA,cAAC;AAAA,YACH;AAAA,UAAA,EAEJ,CAAA;AAAA,QAAA,EAAA,CACF,IACE;AAAA,MAAA;AAAA,IAAA;AAAA,EACN;AAEJ,CAAC;;"}

package/dist/cjs/BaseTanStackRouterDevtoolsPanel.d.cts

@@ -1,3 +0,0 @@
-import { default as React } from 'react';
-import { DevtoolsPanelOptions } from './TanStackRouterDevtoolsPanel.cjs';
-export declare const BaseTanStackRouterDevtoolsPanel: React.ForwardRefExoticComponent<DevtoolsPanelOptions & React.RefAttributes<HTMLDivElement>>;