@tanstack/router-devtools-core 1.133.1 → 1.133.8

package/dist/{BaseTanStackRouterDevtoolsPanel-CiObEXSM.cjs → BaseTanStackRouterDevtoolsPanel-z0YMII09.cjs}

@@ -1,10 +1,8 @@
 "use strict";
-const web = require("solid-js/web");
+const index = require("./index-CC1CXbDA.cjs");
 const clsx = require("clsx");
 const invariant = require("tiny-invariant");
 const routerCore = require("@tanstack/router-core");
-const solidJs = require("solid-js");
-const index = require("./index-sVJ8jjbP.cjs");
 const goober = require("goober");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -40,8 +38,8 @@ function getRouteStatusColor(matches, route) {
   return getStatusColor(found);
 }
 function useIsMounted() {
-  const [isMounted, setIsMounted] = solidJs.createSignal(false);
-  const effect = isServer ? solidJs.createEffect : solidJs.createRenderEffect;
+  const [isMounted, setIsMounted] = index.createSignal(false);
+  const effect = isServer ? index.createEffect : index.createRenderEffect;
   effect(() => {
     setIsMounted(true);
   });
@@ -860,8 +858,8 @@ const stylesFactory$1 = (shadowDOMTarget) => {
   };
 };
 function useStyles$1() {
-  const shadowDomTarget = solidJs.useContext(index.ShadowDomTargetContext);
-  const [_styles] = solidJs.createSignal(stylesFactory$1(shadowDomTarget));
+  const shadowDomTarget = index.useContext(index.ShadowDomTargetContext);
+  const [_styles] = index.createSignal(stylesFactory$1(shadowDomTarget));
   return _styles;
 }
 const getItem = (key) => {
@@ -876,8 +874,8 @@ const getItem = (key) => {
   }
 };
 function useLocalStorage(key, defaultValue) {
-  const [value, setValue] = solidJs.createSignal();
-  solidJs.createEffect(() => {
+  const [value, setValue] = index.createSignal();
+  index.createEffect(() => {
     const initialValue = getItem(key);
     if (typeof initialValue === "undefined" || initialValue === null) {
       setValue(
@@ -902,7 +900,7 @@ function useLocalStorage(key, defaultValue) {
   };
   return [value, setter];
 }
-var _tmpl$$3 = /* @__PURE__ */ web.template(`<span><svg xmlns=http://www.w3.org/2000/svg width=12 height=12 fill=none viewBox="0 0 24 24"><path stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M9 18l6-6-6-6">`), _tmpl$2$1 = /* @__PURE__ */ web.template(`<div>`), _tmpl$3$1 = /* @__PURE__ */ web.template(`<button><span> `), _tmpl$4$1 = /* @__PURE__ */ web.template(`<div><div><button> [<!> ... <!>]`), _tmpl$5$1 = /* @__PURE__ */ web.template(`<button><span></span> 🔄 `), _tmpl$6$1 = /* @__PURE__ */ web.template(`<span>:`), _tmpl$7$1 = /* @__PURE__ */ web.template(`<span>`);
+var _tmpl$$3 = /* @__PURE__ */ index.template(`<span><svg xmlns=http://www.w3.org/2000/svg width=12 height=12 fill=none viewBox="0 0 24 24"><path stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M9 18l6-6-6-6">`), _tmpl$2$1 = /* @__PURE__ */ index.template(`<div>`), _tmpl$3$1 = /* @__PURE__ */ index.template(`<button><span> `), _tmpl$4$1 = /* @__PURE__ */ index.template(`<div><div><button> [<!> ... <!>]`), _tmpl$5$1 = /* @__PURE__ */ index.template(`<button><span></span> 🔄 `), _tmpl$6$1 = /* @__PURE__ */ index.template(`<span>:`), _tmpl$7$1 = /* @__PURE__ */ index.template(`<span>`);
 const Expander = ({
   expanded,
   style = {}
@@ -910,10 +908,10 @@ const Expander = ({
   const styles = useStyles();
   return (() => {
     var _el$ = _tmpl$$3(), _el$2 = _el$.firstChild;
-    web.effect((_p$) => {
+    index.createRenderEffect((_p$) => {
       var _v$ = styles().expander, _v$2 = clsx.clsx(styles().expanderIcon(expanded));
-      _v$ !== _p$.e && web.className(_el$, _p$.e = _v$);
-      _v$2 !== _p$.t && web.setAttribute(_el$2, "class", _p$.t = _v$2);
+      _v$ !== _p$.e && index.className(_el$, _p$.e = _v$);
+      _v$2 !== _p$.t && index.setAttribute(_el$2, "class", _p$.t = _v$2);
       return _p$;
     }, {
       e: void 0,
@@ -942,10 +940,10 @@ function Explorer({
   filterSubEntries,
   ...rest
 }) {
-  const [expanded, setExpanded] = solidJs.createSignal(Boolean(defaultExpanded));
+  const [expanded, setExpanded] = index.createSignal(Boolean(defaultExpanded));
   const toggleExpanded = () => setExpanded((old) => !old);
-  const type = solidJs.createMemo(() => typeof value());
-  const subEntries = solidJs.createMemo(() => {
+  const type = index.createMemo(() => typeof value());
+  const subEntries = index.createMemo(() => {
     let entries = [];
     const makeProperty = (sub) => {
       const subDefaultExpanded = defaultExpanded === true ? {
@@ -975,75 +973,75 @@ function Explorer({
     }
     return filterSubEntries ? filterSubEntries(entries) : entries;
   });
-  const subEntryPages = solidJs.createMemo(() => chunkArray(subEntries(), pageSize));
-  const [expandedPages, setExpandedPages] = solidJs.createSignal([]);
-  const [valueSnapshot, setValueSnapshot] = solidJs.createSignal(void 0);
+  const subEntryPages = index.createMemo(() => chunkArray(subEntries(), pageSize));
+  const [expandedPages, setExpandedPages] = index.createSignal([]);
+  const [valueSnapshot, setValueSnapshot] = index.createSignal(void 0);
   const styles = useStyles();
   const refreshValueSnapshot = () => {
     setValueSnapshot(value()());
   };
-  const handleEntry = (entry) => web.createComponent(Explorer, web.mergeProps({
+  const handleEntry = (entry) => index.createComponent(Explorer, index.mergeProps({
     value,
     filterSubEntries
   }, rest, entry));
   return (() => {
     var _el$3 = _tmpl$2$1();
-    web.insert(_el$3, (() => {
-      var _c$ = web.memo(() => !!subEntryPages().length);
+    index.insert(_el$3, (() => {
+      var _c$ = index.createMemo(() => !!subEntryPages().length);
       return () => _c$() ? [(() => {
         var _el$4 = _tmpl$3$1(), _el$5 = _el$4.firstChild, _el$6 = _el$5.firstChild;
         _el$4.$$click = () => toggleExpanded();
-        web.insert(_el$4, web.createComponent(Expander, {
+        index.insert(_el$4, index.createComponent(Expander, {
           get expanded() {
             return expanded() ?? false;
           }
         }), _el$5);
-        web.insert(_el$4, () => rest.label, _el$5);
-        web.insert(_el$5, () => String(type).toLowerCase() === "iterable" ? "(Iterable) " : "", _el$6);
-        web.insert(_el$5, () => subEntries().length, _el$6);
-        web.insert(_el$5, () => subEntries().length > 1 ? `items` : `item`, null);
-        web.effect((_p$) => {
+        index.insert(_el$4, () => rest.label, _el$5);
+        index.insert(_el$5, () => String(type).toLowerCase() === "iterable" ? "(Iterable) " : "", _el$6);
+        index.insert(_el$5, () => subEntries().length, _el$6);
+        index.insert(_el$5, () => subEntries().length > 1 ? `items` : `item`, null);
+        index.createRenderEffect((_p$) => {
           var _v$3 = styles().expandButton, _v$4 = styles().info;
-          _v$3 !== _p$.e && web.className(_el$4, _p$.e = _v$3);
-          _v$4 !== _p$.t && web.className(_el$5, _p$.t = _v$4);
+          _v$3 !== _p$.e && index.className(_el$4, _p$.e = _v$3);
+          _v$4 !== _p$.t && index.className(_el$5, _p$.t = _v$4);
           return _p$;
         }, {
           e: void 0,
           t: void 0
         });
         return _el$4;
-      })(), web.memo(() => web.memo(() => !!(expanded() ?? false))() ? web.memo(() => subEntryPages().length === 1)() ? (() => {
+      })(), index.createMemo(() => index.createMemo(() => !!(expanded() ?? false))() ? index.createMemo(() => subEntryPages().length === 1)() ? (() => {
         var _el$7 = _tmpl$2$1();
-        web.insert(_el$7, () => subEntries().map((entry, index2) => handleEntry(entry)));
-        web.effect(() => web.className(_el$7, styles().subEntries));
+        index.insert(_el$7, () => subEntries().map((entry, index2) => handleEntry(entry)));
+        index.createRenderEffect(() => index.className(_el$7, styles().subEntries));
         return _el$7;
       })() : (() => {
         var _el$8 = _tmpl$2$1();
-        web.insert(_el$8, () => subEntryPages().map((entries, index2) => {
+        index.insert(_el$8, () => subEntryPages().map((entries, index$1) => {
           return (() => {
             var _el$9 = _tmpl$4$1(), _el$0 = _el$9.firstChild, _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$15 = _el$10.nextSibling, _el$12 = _el$15.nextSibling, _el$16 = _el$12.nextSibling;
             _el$16.nextSibling;
-            _el$1.$$click = () => setExpandedPages((old) => old.includes(index2) ? old.filter((d) => d !== index2) : [...old, index2]);
-            web.insert(_el$1, web.createComponent(Expander, {
+            _el$1.$$click = () => setExpandedPages((old) => old.includes(index$1) ? old.filter((d) => d !== index$1) : [...old, index$1]);
+            index.insert(_el$1, index.createComponent(Expander, {
               get expanded() {
-                return expandedPages().includes(index2);
+                return expandedPages().includes(index$1);
               }
             }), _el$10);
-            web.insert(_el$1, index2 * pageSize, _el$15);
-            web.insert(_el$1, index2 * pageSize + pageSize - 1, _el$16);
-            web.insert(_el$0, (() => {
-              var _c$3 = web.memo(() => !!expandedPages().includes(index2));
+            index.insert(_el$1, index$1 * pageSize, _el$15);
+            index.insert(_el$1, index$1 * pageSize + pageSize - 1, _el$16);
+            index.insert(_el$0, (() => {
+              var _c$3 = index.createMemo(() => !!expandedPages().includes(index$1));
               return () => _c$3() ? (() => {
                 var _el$17 = _tmpl$2$1();
-                web.insert(_el$17, () => entries.map((entry) => handleEntry(entry)));
-                web.effect(() => web.className(_el$17, styles().subEntries));
+                index.insert(_el$17, () => entries.map((entry) => handleEntry(entry)));
+                index.createRenderEffect(() => index.className(_el$17, styles().subEntries));
                 return _el$17;
               })() : null;
             })(), null);
-            web.effect((_p$) => {
+            index.createRenderEffect((_p$) => {
               var _v$5 = styles().entry, _v$6 = clsx.clsx(styles().labelButton, "labelButton");
-              _v$5 !== _p$.e && web.className(_el$0, _p$.e = _v$5);
-              _v$6 !== _p$.t && web.className(_el$1, _p$.t = _v$6);
+              _v$5 !== _p$.e && index.className(_el$0, _p$.e = _v$5);
+              _v$6 !== _p$.t && index.className(_el$1, _p$.t = _v$6);
               return _p$;
             }, {
               e: void 0,
@@ -1052,17 +1050,17 @@ function Explorer({
             return _el$9;
           })();
         }));
-        web.effect(() => web.className(_el$8, styles().subEntries));
+        index.createRenderEffect(() => index.className(_el$8, styles().subEntries));
         return _el$8;
       })() : null)] : (() => {
-        var _c$2 = web.memo(() => type() === "function");
-        return () => _c$2() ? web.createComponent(Explorer, {
+        var _c$2 = index.createMemo(() => type() === "function");
+        return () => _c$2() ? index.createComponent(Explorer, {
           get label() {
             return (() => {
               var _el$18 = _tmpl$5$1(), _el$19 = _el$18.firstChild;
               _el$18.$$click = refreshValueSnapshot;
-              web.insert(_el$19, () => rest.label);
-              web.effect(() => web.className(_el$18, styles().refreshValueBtn));
+              index.insert(_el$19, () => rest.label);
+              index.createRenderEffect(() => index.className(_el$18, styles().refreshValueBtn));
               return _el$18;
             })();
           },
@@ -1070,17 +1068,17 @@ function Explorer({
           defaultExpanded: {}
         }) : [(() => {
           var _el$20 = _tmpl$6$1(), _el$21 = _el$20.firstChild;
-          web.insert(_el$20, () => rest.label, _el$21);
+          index.insert(_el$20, () => rest.label, _el$21);
           return _el$20;
         })(), " ", (() => {
           var _el$22 = _tmpl$7$1();
-          web.insert(_el$22, () => displayValue(value()));
-          web.effect(() => web.className(_el$22, styles().value));
+          index.insert(_el$22, () => displayValue(value()));
+          index.createRenderEffect(() => index.className(_el$22, styles().value));
           return _el$22;
         })()];
       })();
     })());
-    web.effect(() => web.className(_el$3, styles().entry));
+    index.createRenderEffect(() => index.className(_el$3, styles().entry));
     return _el$3;
   })();
 }
@@ -1174,12 +1172,12 @@ const stylesFactory = (shadowDOMTarget) => {
   };
 };
 function useStyles() {
-  const shadowDomTarget = solidJs.useContext(index.ShadowDomTargetContext);
-  const [_styles] = solidJs.createSignal(stylesFactory(shadowDomTarget));
+  const shadowDomTarget = index.useContext(index.ShadowDomTargetContext);
+  const [_styles] = index.createSignal(stylesFactory(shadowDomTarget));
   return _styles;
 }
-web.delegateEvents(["click"]);
-var _tmpl$$2 = /* @__PURE__ */ web.template(`<div><div></div><div>/</div><div></div><div>/</div><div>`);
+index.delegateEvents(["click"]);
+var _tmpl$$2 = /* @__PURE__ */ index.template(`<div><div></div><div>/</div><div></div><div>/</div><div>`);
 function formatTime(ms) {
   const units = ["s", "min", "h", "d"];
   const values = [ms / 1e3, ms / 6e4, ms / 36e5, ms / 864e5];
@@ -1212,14 +1210,14 @@ function AgeTicker({
   const gcTime = route.options.gcTime ?? router().options.defaultGcTime ?? 30 * 60 * 1e3;
   return (() => {
     var _el$ = _tmpl$$2(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling, _el$4 = _el$3.nextSibling, _el$5 = _el$4.nextSibling, _el$6 = _el$5.nextSibling;
-    web.insert(_el$2, () => formatTime(age));
-    web.insert(_el$4, () => formatTime(staleTime));
-    web.insert(_el$6, () => formatTime(gcTime));
-    web.effect(() => web.className(_el$, clsx.clsx(styles().ageTicker(age > staleTime))));
+    index.insert(_el$2, () => formatTime(age));
+    index.insert(_el$4, () => formatTime(staleTime));
+    index.insert(_el$6, () => formatTime(gcTime));
+    index.createRenderEffect(() => index.className(_el$, clsx.clsx(styles().ageTicker(age > staleTime))));
     return _el$;
   })();
 }
-var _tmpl$$1 = /* @__PURE__ */ web.template(`<button type=button>➔`);
+var _tmpl$$1 = /* @__PURE__ */ index.template(`<button type=button>➔`);
 function NavigateButton({
   to,
   params,
@@ -1237,13 +1235,13 @@ function NavigateButton({
         search
       });
     };
-    web.setAttribute(_el$, "title", `Navigate to ${to}`);
-    web.effect(() => web.className(_el$, styles().navigateButton));
+    index.setAttribute(_el$, "title", `Navigate to ${to}`);
+    index.createRenderEffect(() => index.className(_el$, styles().navigateButton));
     return _el$;
   })();
 }
-web.delegateEvents(["click"]);
-var _tmpl$ = /* @__PURE__ */ web.template(`<button><div>TANSTACK</div><div>TanStack Router v1`), _tmpl$2 = /* @__PURE__ */ web.template(`<div><div>`), _tmpl$3 = /* @__PURE__ */ web.template(`<code> `), _tmpl$4 = /* @__PURE__ */ web.template(`<code>`), _tmpl$5 = /* @__PURE__ */ web.template(`<div><div role=button><div>`), _tmpl$6 = /* @__PURE__ */ web.template(`<div>`), _tmpl$7 = /* @__PURE__ */ web.template(`<div><ul>`), _tmpl$8 = /* @__PURE__ */ web.template(`<div><button><svg xmlns=http://www.w3.org/2000/svg width=10 height=6 fill=none viewBox="0 0 10 6"><path stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=1.667 d="M1 1l4 4 4-4"></path></svg></button><div><div></div><div><div></div></div></div><div><div><div><span>Pathname</span></div><div><code></code></div><div><div><button type=button>Routes</button><button type=button>Matches</button><button type=button>History</button></div><div><div>age / staleTime / gcTime</div></div></div><div>`), _tmpl$9 = /* @__PURE__ */ web.template(`<div><span>masked`), _tmpl$0 = /* @__PURE__ */ web.template(`<div role=button><div>`), _tmpl$1 = /* @__PURE__ */ web.template(`<li><div>`), _tmpl$10 = /* @__PURE__ */ web.template(`<li>This panel displays the most recent 15 navigations.`), _tmpl$11 = /* @__PURE__ */ web.template(`<div><div><div>Cached Matches</div><div>age / staleTime / gcTime</div></div><div>`), _tmpl$12 = /* @__PURE__ */ web.template(`<div><div>Match Details</div><div><div><div><div></div></div><div><div>ID:</div><div><code></code></div></div><div><div>State:</div><div></div></div><div><div>Last Updated:</div><div></div></div></div></div><div>Explorer</div><div>`), _tmpl$13 = /* @__PURE__ */ web.template(`<div>Loader Data`), _tmpl$14 = /* @__PURE__ */ web.template(`<div><div><span>Search Params</span></div><div>`), _tmpl$15 = /* @__PURE__ */ web.template(`<span style=margin-left:0.5rem;>`), _tmpl$16 = /* @__PURE__ */ web.template(`<button type=button style=cursor:pointer; aria-label="Copy value to clipboard">`);
+index.delegateEvents(["click"]);
+var _tmpl$ = /* @__PURE__ */ index.template(`<button><div>TANSTACK</div><div>TanStack Router v1`), _tmpl$2 = /* @__PURE__ */ index.template(`<div><div>`), _tmpl$3 = /* @__PURE__ */ index.template(`<code> `), _tmpl$4 = /* @__PURE__ */ index.template(`<code>`), _tmpl$5 = /* @__PURE__ */ index.template(`<div><div role=button><div>`), _tmpl$6 = /* @__PURE__ */ index.template(`<div>`), _tmpl$7 = /* @__PURE__ */ index.template(`<div><ul>`), _tmpl$8 = /* @__PURE__ */ index.template(`<div><button><svg xmlns=http://www.w3.org/2000/svg width=10 height=6 fill=none viewBox="0 0 10 6"><path stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=1.667 d="M1 1l4 4 4-4"></path></svg></button><div><div></div><div><div></div></div></div><div><div><div><span>Pathname</span></div><div><code></code></div><div><div><button type=button>Routes</button><button type=button>Matches</button><button type=button>History</button></div><div><div>age / staleTime / gcTime</div></div></div><div>`), _tmpl$9 = /* @__PURE__ */ index.template(`<div><span>masked`), _tmpl$0 = /* @__PURE__ */ index.template(`<div role=button><div>`), _tmpl$1 = /* @__PURE__ */ index.template(`<li><div>`), _tmpl$10 = /* @__PURE__ */ index.template(`<li>This panel displays the most recent 15 navigations.`), _tmpl$11 = /* @__PURE__ */ index.template(`<div><div><div>Cached Matches</div><div>age / staleTime / gcTime</div></div><div>`), _tmpl$12 = /* @__PURE__ */ index.template(`<div><div>Match Details</div><div><div><div><div></div></div><div><div>ID:</div><div><code></code></div></div><div><div>State:</div><div></div></div><div><div>Last Updated:</div><div></div></div></div></div><div>Explorer</div><div>`), _tmpl$13 = /* @__PURE__ */ index.template(`<div>Loader Data`), _tmpl$14 = /* @__PURE__ */ index.template(`<div><div><span>Search Params</span></div><div>`), _tmpl$15 = /* @__PURE__ */ index.template(`<span style=margin-left:0.5rem;>`), _tmpl$16 = /* @__PURE__ */ index.template(`<button type=button style=cursor:pointer; aria-label="Copy value to clipboard">`);
 const HISTORY_LIMIT = 15;
 function Logo(props) {
   const {
@@ -1253,15 +1251,15 @@ function Logo(props) {
   const styles = useStyles$1();
   return (() => {
     var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
-    web.spread(_el$, web.mergeProps(rest, {
+    index.spread(_el$, index.mergeProps(rest, {
       get ["class"]() {
         return clsx.clsx(styles().logo, className ? className() : "");
       }
     }), false, true);
-    web.effect((_p$) => {
+    index.createRenderEffect((_p$) => {
       var _v$ = styles().tanstackLogo, _v$2 = styles().routerLogo;
-      _v$ !== _p$.e && web.className(_el$2, _p$.e = _v$);
-      _v$2 !== _p$.t && web.className(_el$3, _p$.t = _v$2);
+      _v$ !== _p$.e && index.className(_el$2, _p$.e = _v$);
+      _v$2 !== _p$.t && index.className(_el$3, _p$.t = _v$2);
       return _p$;
     }, {
       e: void 0,
@@ -1276,12 +1274,12 @@ function NavigateLink(props) {
     _el$4.style.setProperty("display", "flex");
     _el$4.style.setProperty("align-items", "center");
     _el$4.style.setProperty("width", "100%");
-    web.insert(_el$4, () => props.left, _el$5);
+    index.insert(_el$4, () => props.left, _el$5);
     _el$5.style.setProperty("flex-grow", "1");
     _el$5.style.setProperty("min-width", "0");
-    web.insert(_el$5, () => props.children);
-    web.insert(_el$4, () => props.right, null);
-    web.effect(() => web.className(_el$4, props.class));
+    index.insert(_el$5, () => props.children);
+    index.insert(_el$4, () => props.right, null);
+    index.createRenderEffect(() => index.className(_el$4, props.class));
     return _el$4;
   })();
 }
@@ -1294,9 +1292,9 @@ function RouteComp({
   setActiveId
 }) {
   const styles = useStyles$1();
-  const matches = solidJs.createMemo(() => routerState().pendingMatches || routerState().matches);
-  const match = solidJs.createMemo(() => routerState().matches.find((d) => d.routeId === route.id));
-  const param = solidJs.createMemo(() => {
+  const matches = index.createMemo(() => routerState().pendingMatches || routerState().matches);
+  const match = index.createMemo(() => routerState().matches.find((d) => d.routeId === route.id));
+  const param = index.createMemo(() => {
     try {
       if (match()?.params) {
         const p = match()?.params;
@@ -1313,7 +1311,7 @@ function RouteComp({
       return "";
     }
   });
-  const navigationTarget = solidJs.createMemo(() => {
+  const navigationTarget = index.createMemo(() => {
     if (isRoot) return void 0;
     if (!route.path) return void 0;
     const allParams = Object.assign({}, ...matches().map((m) => m.params));
@@ -1333,16 +1331,16 @@ function RouteComp({
         setActiveId(activeId() === route.id ? "" : route.id);
       }
     };
-    web.insert(_el$7, web.createComponent(NavigateLink, {
+    index.insert(_el$7, index.createComponent(NavigateLink, {
       get ["class"]() {
         return clsx.clsx(styles().routesRow(!!match()));
       },
       get left() {
-        return web.createComponent(solidJs.Show, {
+        return index.createComponent(index.Show, {
           get when() {
             return navigationTarget();
           },
-          children: (navigate) => web.createComponent(NavigateButton, {
+          children: (navigate) => index.createComponent(NavigateButton, {
             get to() {
               return navigate();
             },
@@ -1351,7 +1349,7 @@ function RouteComp({
         });
       },
       get right() {
-        return web.createComponent(AgeTicker, {
+        return index.createComponent(AgeTicker, {
           get match() {
             return match();
           },
@@ -1361,39 +1359,39 @@ function RouteComp({
       get children() {
         return [(() => {
           var _el$9 = _tmpl$3(), _el$0 = _el$9.firstChild;
-          web.insert(_el$9, () => isRoot ? routerCore.rootRouteId : route.path || routerCore.trimPath(route.id), _el$0);
-          web.effect(() => web.className(_el$9, styles().code));
+          index.insert(_el$9, () => isRoot ? routerCore.rootRouteId : route.path || routerCore.trimPath(route.id), _el$0);
+          index.createRenderEffect(() => index.className(_el$9, styles().code));
           return _el$9;
         })(), (() => {
           var _el$1 = _tmpl$4();
-          web.insert(_el$1, param);
-          web.effect(() => web.className(_el$1, styles().routeParamInfo));
+          index.insert(_el$1, param);
+          index.createRenderEffect(() => index.className(_el$1, styles().routeParamInfo));
           return _el$1;
         })()];
       }
     }), null);
-    web.insert(_el$6, (() => {
-      var _c$ = web.memo(() => !!route.children?.length);
+    index.insert(_el$6, (() => {
+      var _c$ = index.createMemo(() => !!route.children?.length);
       return () => _c$() ? (() => {
         var _el$10 = _tmpl$6();
-        web.insert(_el$10, () => [...route.children].sort((a, b) => {
+        index.insert(_el$10, () => [...route.children].sort((a, b) => {
           return a.rank - b.rank;
-        }).map((r) => web.createComponent(RouteComp, {
+        }).map((r) => index.createComponent(RouteComp, {
           routerState,
           router,
           route: r,
           activeId,
           setActiveId
         })));
-        web.effect(() => web.className(_el$10, styles().nestedRouteRow(!!isRoot)));
+        index.createRenderEffect(() => index.className(_el$10, styles().nestedRouteRow(!!isRoot)));
         return _el$10;
       })() : null;
     })(), null);
-    web.effect((_p$) => {
+    index.createRenderEffect((_p$) => {
       var _v$3 = `Open match details for ${route.id}`, _v$4 = clsx.clsx(styles().routesRowContainer(route.id === activeId(), !!match())), _v$5 = clsx.clsx(styles().matchIndicator(getRouteStatusColor(matches(), route)));
-      _v$3 !== _p$.e && web.setAttribute(_el$7, "aria-label", _p$.e = _v$3);
-      _v$4 !== _p$.t && web.className(_el$7, _p$.t = _v$4);
-      _v$5 !== _p$.a && web.className(_el$8, _p$.a = _v$5);
+      _v$3 !== _p$.e && index.setAttribute(_el$7, "aria-label", _p$.e = _v$3);
+      _v$4 !== _p$.t && index.className(_el$7, _p$.t = _v$4);
+      _v$5 !== _p$.a && index.className(_el$8, _p$.a = _v$5);
       return _p$;
     }, {
       e: void 0,
@@ -1427,15 +1425,15 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
   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 [currentTab, setCurrentTab] = useLocalStorage("tanstackRouterDevtoolsActiveTab", "routes");
   const [activeId, setActiveId] = useLocalStorage("tanstackRouterDevtoolsActiveRouteId", "");
-  const [history, setHistory] = solidJs.createSignal([]);
-  const [hasHistoryOverflowed, setHasHistoryOverflowed] = solidJs.createSignal(false);
-  solidJs.createEffect(() => {
+  const [history, setHistory] = index.createSignal([]);
+  const [hasHistoryOverflowed, setHasHistoryOverflowed] = index.createSignal(false);
+  index.createEffect(() => {
     const matches = routerState().matches;
     const currentMatch = matches[matches.length - 1];
     if (!currentMatch) {
       return;
     }
-    const historyUntracked = solidJs.untrack(() => history());
+    const historyUntracked = index.untrack(() => history());
     const lastMatch = historyUntracked[0];
     const sameLocation = lastMatch && lastMatch.pathname === currentMatch.pathname && JSON.stringify(lastMatch.search ?? {}) === JSON.stringify(currentMatch.search ?? {});
     if (!lastMatch || !sameLocation) {
@@ -1449,26 +1447,26 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
       });
     }
   });
-  const activeMatch = solidJs.createMemo(() => {
+  const activeMatch = index.createMemo(() => {
     const matches = [...routerState().pendingMatches ?? [], ...routerState().matches, ...routerState().cachedMatches];
     return matches.find((d) => d.routeId === activeId() || d.id === activeId());
   });
-  const hasSearch = solidJs.createMemo(() => Object.keys(routerState().location.search).length);
-  const explorerState = solidJs.createMemo(() => {
+  const hasSearch = index.createMemo(() => Object.keys(routerState().location.search).length);
+  const explorerState = index.createMemo(() => {
     return {
       ...router(),
       state: routerState()
     };
   });
-  const routerExplorerValue = solidJs.createMemo(() => Object.fromEntries(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]))));
-  const activeMatchLoaderData = solidJs.createMemo(() => activeMatch()?.loaderData);
-  const activeMatchValue = solidJs.createMemo(() => activeMatch());
-  const locationSearchValue = solidJs.createMemo(() => routerState().location.search);
+  const routerExplorerValue = index.createMemo(() => Object.fromEntries(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]))));
+  const activeMatchLoaderData = index.createMemo(() => activeMatch()?.loaderData);
+  const activeMatchValue = index.createMemo(() => activeMatch());
+  const locationSearchValue = index.createMemo(() => routerState().location.search);
   return (() => {
     var _el$11 = _tmpl$8(), _el$12 = _el$11.firstChild, _el$13 = _el$12.firstChild, _el$14 = _el$12.nextSibling, _el$15 = _el$14.firstChild, _el$16 = _el$15.nextSibling, _el$17 = _el$16.firstChild, _el$18 = _el$14.nextSibling, _el$19 = _el$18.firstChild, _el$20 = _el$19.firstChild;
     _el$20.firstChild;
     var _el$22 = _el$20.nextSibling, _el$23 = _el$22.firstChild, _el$24 = _el$22.nextSibling, _el$25 = _el$24.firstChild, _el$26 = _el$25.firstChild, _el$27 = _el$26.nextSibling, _el$28 = _el$27.nextSibling, _el$29 = _el$25.nextSibling, _el$30 = _el$24.nextSibling;
-    web.spread(_el$11, web.mergeProps({
+    index.spread(_el$11, index.mergeProps({
       get ["class"]() {
         return clsx.clsx(styles().devtoolsPanel, "TanStackRouterDevtoolsPanel", className ? className() : "");
       },
@@ -1476,10 +1474,10 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         return style ? style() : "";
       }
     }, otherPanelProps), false, true);
-    web.insert(_el$11, handleDragStart ? (() => {
+    index.insert(_el$11, handleDragStart ? (() => {
       var _el$34 = _tmpl$6();
-      web.addEventListener(_el$34, "mousedown", handleDragStart, true);
-      web.effect(() => web.className(_el$34, styles().dragHandle));
+      index.addEventListener(_el$34, "mousedown", handleDragStart, true);
+      index.createRenderEffect(() => index.className(_el$34, styles().dragHandle));
       return _el$34;
     })() : null, _el$12);
     _el$12.$$click = (e) => {
@@ -1488,7 +1486,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
       }
       onCloseClick(e);
     };
-    web.insert(_el$15, web.createComponent(Logo, {
+    index.insert(_el$15, index.createComponent(Logo, {
       "aria-hidden": true,
       onClick: (e) => {
         if (setIsOpen) {
@@ -1497,7 +1495,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         onCloseClick(e);
       }
     }));
-    web.insert(_el$17, web.createComponent(Explorer, {
+    index.insert(_el$17, index.createComponent(Explorer, {
       label: "Router",
       value: routerExplorerValue,
       defaultExpanded: {
@@ -1509,14 +1507,14 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         return subEntries.filter((d) => typeof d.value() !== "function");
       }
     }));
-    web.insert(_el$20, (() => {
-      var _c$2 = web.memo(() => !!routerState().location.maskedLocation);
+    index.insert(_el$20, (() => {
+      var _c$2 = index.createMemo(() => !!routerState().location.maskedLocation);
       return () => _c$2() ? (() => {
         var _el$35 = _tmpl$9(), _el$36 = _el$35.firstChild;
-        web.effect((_p$) => {
+        index.createRenderEffect((_p$) => {
           var _v$24 = styles().maskedBadgeContainer, _v$25 = styles().maskedBadge;
-          _v$24 !== _p$.e && web.className(_el$35, _p$.e = _v$24);
-          _v$25 !== _p$.t && web.className(_el$36, _p$.t = _v$25);
+          _v$24 !== _p$.e && index.className(_el$35, _p$.e = _v$24);
+          _v$25 !== _p$.t && index.className(_el$36, _p$.t = _v$25);
           return _p$;
         }, {
           e: void 0,
@@ -1525,13 +1523,13 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         return _el$35;
       })() : null;
     })(), null);
-    web.insert(_el$23, () => routerState().location.pathname);
-    web.insert(_el$22, (() => {
-      var _c$3 = web.memo(() => !!routerState().location.maskedLocation);
+    index.insert(_el$23, () => routerState().location.pathname);
+    index.insert(_el$22, (() => {
+      var _c$3 = index.createMemo(() => !!routerState().location.maskedLocation);
       return () => _c$3() ? (() => {
         var _el$37 = _tmpl$4();
-        web.insert(_el$37, () => routerState().location.maskedLocation?.pathname);
-        web.effect(() => web.className(_el$37, styles().maskedLocation));
+        index.insert(_el$37, () => routerState().location.maskedLocation?.pathname);
+        index.createRenderEffect(() => index.className(_el$37, styles().maskedLocation));
         return _el$37;
       })() : null;
     })(), null);
@@ -1544,14 +1542,14 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
     _el$28.$$click = () => {
       setCurrentTab("history");
     };
-    web.insert(_el$30, web.createComponent(solidJs.Switch, {
+    index.insert(_el$30, index.createComponent(index.Switch, {
       get children() {
-        return [web.createComponent(solidJs.Match, {
+        return [index.createComponent(index.Match, {
           get when() {
             return currentTab() === "routes";
           },
           get children() {
-            return web.createComponent(RouteComp, {
+            return index.createComponent(RouteComp, {
               routerState,
               router,
               get route() {
@@ -1562,19 +1560,19 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
               setActiveId
             });
           }
-        }), web.createComponent(solidJs.Match, {
+        }), index.createComponent(index.Match, {
           get when() {
             return currentTab() === "matches";
           },
           get children() {
             var _el$31 = _tmpl$6();
-            web.insert(_el$31, () => (routerState().pendingMatches?.length ? routerState().pendingMatches : routerState().matches)?.map((match, _i) => {
+            index.insert(_el$31, () => (routerState().pendingMatches?.length ? routerState().pendingMatches : routerState().matches)?.map((match, _i) => {
               return (() => {
                 var _el$38 = _tmpl$0(), _el$39 = _el$38.firstChild;
                 _el$38.$$click = () => setActiveId(activeId() === match.id ? "" : match.id);
-                web.insert(_el$38, web.createComponent(NavigateLink, {
+                index.insert(_el$38, index.createComponent(NavigateLink, {
                   get left() {
-                    return web.createComponent(NavigateButton, {
+                    return index.createComponent(NavigateButton, {
                       get to() {
                         return match.pathname;
                       },
@@ -1588,23 +1586,23 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
                     });
                   },
                   get right() {
-                    return web.createComponent(AgeTicker, {
+                    return index.createComponent(AgeTicker, {
                       match,
                       router
                     });
                   },
                   get children() {
                     var _el$40 = _tmpl$4();
-                    web.insert(_el$40, () => `${match.routeId === routerCore.rootRouteId ? routerCore.rootRouteId : match.pathname}`);
-                    web.effect(() => web.className(_el$40, styles().matchID));
+                    index.insert(_el$40, () => `${match.routeId === routerCore.rootRouteId ? routerCore.rootRouteId : match.pathname}`);
+                    index.createRenderEffect(() => index.className(_el$40, styles().matchID));
                     return _el$40;
                   }
                 }), null);
-                web.effect((_p$) => {
+                index.createRenderEffect((_p$) => {
                   var _v$26 = `Open match details for ${match.id}`, _v$27 = clsx.clsx(styles().matchRow(match === activeMatch())), _v$28 = clsx.clsx(styles().matchIndicator(getStatusColor(match)));
-                  _v$26 !== _p$.e && web.setAttribute(_el$38, "aria-label", _p$.e = _v$26);
-                  _v$27 !== _p$.t && web.className(_el$38, _p$.t = _v$27);
-                  _v$28 !== _p$.a && web.className(_el$39, _p$.a = _v$28);
+                  _v$26 !== _p$.e && index.setAttribute(_el$38, "aria-label", _p$.e = _v$26);
+                  _v$27 !== _p$.t && index.className(_el$38, _p$.t = _v$27);
+                  _v$28 !== _p$.a && index.className(_el$39, _p$.a = _v$28);
                   return _p$;
                 }, {
                   e: void 0,
@@ -1616,21 +1614,21 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
             }));
             return _el$31;
           }
-        }), web.createComponent(solidJs.Match, {
+        }), index.createComponent(index.Match, {
           get when() {
             return currentTab() === "history";
           },
           get children() {
             var _el$32 = _tmpl$7(), _el$33 = _el$32.firstChild;
-            web.insert(_el$33, web.createComponent(solidJs.For, {
+            index.insert(_el$33, index.createComponent(index.For, {
               get each() {
                 return history();
               },
-              children: (match, index2) => (() => {
+              children: (match, index$1) => (() => {
                 var _el$41 = _tmpl$1(), _el$42 = _el$41.firstChild;
-                web.insert(_el$41, web.createComponent(NavigateLink, {
+                index.insert(_el$41, index.createComponent(NavigateLink, {
                   get left() {
-                    return web.createComponent(NavigateButton, {
+                    return index.createComponent(NavigateButton, {
                       get to() {
                         return match.pathname;
                       },
@@ -1644,22 +1642,22 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
                     });
                   },
                   get right() {
-                    return web.createComponent(AgeTicker, {
+                    return index.createComponent(AgeTicker, {
                       match,
                       router
                     });
                   },
                   get children() {
                     var _el$43 = _tmpl$4();
-                    web.insert(_el$43, () => `${match.routeId === routerCore.rootRouteId ? routerCore.rootRouteId : match.pathname}`);
-                    web.effect(() => web.className(_el$43, styles().matchID));
+                    index.insert(_el$43, () => `${match.routeId === routerCore.rootRouteId ? routerCore.rootRouteId : match.pathname}`);
+                    index.createRenderEffect(() => index.className(_el$43, styles().matchID));
                     return _el$43;
                   }
                 }), null);
-                web.effect((_p$) => {
-                  var _v$29 = clsx.clsx(styles().matchRow(match === activeMatch())), _v$30 = clsx.clsx(styles().matchIndicator(index2() === 0 ? "green" : "gray"));
-                  _v$29 !== _p$.e && web.className(_el$41, _p$.e = _v$29);
-                  _v$30 !== _p$.t && web.className(_el$42, _p$.t = _v$30);
+                index.createRenderEffect((_p$) => {
+                  var _v$29 = clsx.clsx(styles().matchRow(match === activeMatch())), _v$30 = clsx.clsx(styles().matchIndicator(index$1() === 0 ? "green" : "gray"));
+                  _v$29 !== _p$.e && index.className(_el$41, _p$.e = _v$29);
+                  _v$30 !== _p$.t && index.className(_el$42, _p$.t = _v$30);
                   return _p$;
                 }, {
                   e: void 0,
@@ -1668,11 +1666,11 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
                 return _el$41;
               })()
             }), null);
-            web.insert(_el$33, (() => {
-              var _c$4 = web.memo(() => !!hasHistoryOverflowed());
+            index.insert(_el$33, (() => {
+              var _c$4 = index.createMemo(() => !!hasHistoryOverflowed());
               return () => _c$4() ? (() => {
                 var _el$44 = _tmpl$10();
-                web.effect(() => web.className(_el$44, styles().historyOverflowContainer));
+                index.createRenderEffect(() => index.className(_el$44, styles().historyOverflowContainer));
                 return _el$44;
               })() : null;
             })(), null);
@@ -1681,17 +1679,17 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         })];
       }
     }));
-    web.insert(_el$18, (() => {
-      var _c$5 = web.memo(() => !!routerState().cachedMatches.length);
+    index.insert(_el$18, (() => {
+      var _c$5 = index.createMemo(() => !!routerState().cachedMatches.length);
       return () => _c$5() ? (() => {
         var _el$45 = _tmpl$11(), _el$46 = _el$45.firstChild, _el$47 = _el$46.firstChild, _el$48 = _el$47.nextSibling, _el$49 = _el$46.nextSibling;
-        web.insert(_el$49, () => routerState().cachedMatches.map((match) => {
+        index.insert(_el$49, () => routerState().cachedMatches.map((match) => {
           return (() => {
             var _el$50 = _tmpl$0(), _el$51 = _el$50.firstChild;
             _el$50.$$click = () => setActiveId(activeId() === match.id ? "" : match.id);
-            web.insert(_el$50, web.createComponent(NavigateLink, {
+            index.insert(_el$50, index.createComponent(NavigateLink, {
               get left() {
-                return web.createComponent(NavigateButton, {
+                return index.createComponent(NavigateButton, {
                   get to() {
                     return match.pathname;
                   },
@@ -1705,23 +1703,23 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
                 });
               },
               get right() {
-                return web.createComponent(AgeTicker, {
+                return index.createComponent(AgeTicker, {
                   match,
                   router
                 });
               },
               get children() {
                 var _el$52 = _tmpl$4();
-                web.insert(_el$52, () => `${match.id}`);
-                web.effect(() => web.className(_el$52, styles().matchID));
+                index.insert(_el$52, () => `${match.id}`);
+                index.createRenderEffect(() => index.className(_el$52, styles().matchID));
                 return _el$52;
               }
             }), null);
-            web.effect((_p$) => {
+            index.createRenderEffect((_p$) => {
               var _v$34 = `Open match details for ${match.id}`, _v$35 = clsx.clsx(styles().matchRow(match === activeMatch())), _v$36 = clsx.clsx(styles().matchIndicator(getStatusColor(match)));
-              _v$34 !== _p$.e && web.setAttribute(_el$50, "aria-label", _p$.e = _v$34);
-              _v$35 !== _p$.t && web.className(_el$50, _p$.t = _v$35);
-              _v$36 !== _p$.a && web.className(_el$51, _p$.a = _v$36);
+              _v$34 !== _p$.e && index.setAttribute(_el$50, "aria-label", _p$.e = _v$34);
+              _v$35 !== _p$.t && index.className(_el$50, _p$.t = _v$35);
+              _v$36 !== _p$.a && index.className(_el$51, _p$.a = _v$36);
               return _p$;
             }, {
               e: void 0,
@@ -1731,11 +1729,11 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
             return _el$50;
           })();
         }));
-        web.effect((_p$) => {
+        index.createRenderEffect((_p$) => {
           var _v$31 = styles().cachedMatchesContainer, _v$32 = styles().detailsHeader, _v$33 = styles().detailsHeaderInfo;
-          _v$31 !== _p$.e && web.className(_el$45, _p$.e = _v$31);
-          _v$32 !== _p$.t && web.className(_el$46, _p$.t = _v$32);
-          _v$33 !== _p$.a && web.className(_el$48, _p$.a = _v$33);
+          _v$31 !== _p$.e && index.className(_el$45, _p$.e = _v$31);
+          _v$32 !== _p$.t && index.className(_el$46, _p$.t = _v$32);
+          _v$33 !== _p$.a && index.className(_el$48, _p$.a = _v$33);
           return _p$;
         }, {
           e: void 0,
@@ -1745,59 +1743,59 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         return _el$45;
       })() : null;
     })(), null);
-    web.insert(_el$11, (() => {
-      var _c$6 = web.memo(() => !!(activeMatch() && activeMatch()?.status));
+    index.insert(_el$11, (() => {
+      var _c$6 = index.createMemo(() => !!(activeMatch() && activeMatch()?.status));
       return () => _c$6() ? (() => {
         var _el$53 = _tmpl$12(), _el$54 = _el$53.firstChild, _el$55 = _el$54.nextSibling, _el$56 = _el$55.firstChild, _el$57 = _el$56.firstChild, _el$58 = _el$57.firstChild, _el$59 = _el$57.nextSibling, _el$60 = _el$59.firstChild, _el$61 = _el$60.nextSibling, _el$62 = _el$61.firstChild, _el$63 = _el$59.nextSibling, _el$64 = _el$63.firstChild, _el$65 = _el$64.nextSibling, _el$66 = _el$63.nextSibling, _el$67 = _el$66.firstChild, _el$68 = _el$67.nextSibling, _el$69 = _el$55.nextSibling, _el$70 = _el$69.nextSibling;
-        web.insert(_el$58, (() => {
-          var _c$8 = web.memo(() => !!(activeMatch()?.status === "success" && activeMatch()?.isFetching));
+        index.insert(_el$58, (() => {
+          var _c$8 = index.createMemo(() => !!(activeMatch()?.status === "success" && activeMatch()?.isFetching));
           return () => _c$8() ? "fetching" : activeMatch()?.status;
         })());
-        web.insert(_el$62, () => activeMatch()?.id);
-        web.insert(_el$65, (() => {
-          var _c$9 = web.memo(() => !!routerState().pendingMatches?.find((d) => d.id === activeMatch()?.id));
+        index.insert(_el$62, () => activeMatch()?.id);
+        index.insert(_el$65, (() => {
+          var _c$9 = index.createMemo(() => !!routerState().pendingMatches?.find((d) => d.id === activeMatch()?.id));
           return () => _c$9() ? "Pending" : routerState().matches.find((d) => d.id === activeMatch()?.id) ? "Active" : "Cached";
         })());
-        web.insert(_el$68, (() => {
-          var _c$0 = web.memo(() => !!activeMatch()?.updatedAt);
+        index.insert(_el$68, (() => {
+          var _c$0 = index.createMemo(() => !!activeMatch()?.updatedAt);
           return () => _c$0() ? new Date(activeMatch()?.updatedAt).toLocaleTimeString() : "N/A";
         })());
-        web.insert(_el$53, (() => {
-          var _c$1 = web.memo(() => !!activeMatchLoaderData());
+        index.insert(_el$53, (() => {
+          var _c$1 = index.createMemo(() => !!activeMatchLoaderData());
           return () => _c$1() ? [(() => {
             var _el$71 = _tmpl$13();
-            web.effect(() => web.className(_el$71, styles().detailsHeader));
+            index.createRenderEffect(() => index.className(_el$71, styles().detailsHeader));
             return _el$71;
           })(), (() => {
             var _el$72 = _tmpl$6();
-            web.insert(_el$72, web.createComponent(Explorer, {
+            index.insert(_el$72, index.createComponent(Explorer, {
               label: "loaderData",
               value: activeMatchLoaderData,
               defaultExpanded: {}
             }));
-            web.effect(() => web.className(_el$72, styles().detailsContent));
+            index.createRenderEffect(() => index.className(_el$72, styles().detailsContent));
             return _el$72;
           })()] : null;
         })(), _el$69);
-        web.insert(_el$70, web.createComponent(Explorer, {
+        index.insert(_el$70, index.createComponent(Explorer, {
           label: "Match",
           value: activeMatchValue,
           defaultExpanded: {}
         }));
-        web.effect((_p$) => {
+        index.createRenderEffect((_p$) => {
           var _v$37 = styles().thirdContainer, _v$38 = styles().detailsHeader, _v$39 = styles().matchDetails, _v$40 = styles().matchStatus(activeMatch()?.status, activeMatch()?.isFetching), _v$41 = styles().matchDetailsInfoLabel, _v$42 = styles().matchDetailsInfo, _v$43 = styles().matchDetailsInfoLabel, _v$44 = styles().matchDetailsInfo, _v$45 = styles().matchDetailsInfoLabel, _v$46 = styles().matchDetailsInfo, _v$47 = styles().detailsHeader, _v$48 = styles().detailsContent;
-          _v$37 !== _p$.e && web.className(_el$53, _p$.e = _v$37);
-          _v$38 !== _p$.t && web.className(_el$54, _p$.t = _v$38);
-          _v$39 !== _p$.a && web.className(_el$56, _p$.a = _v$39);
-          _v$40 !== _p$.o && web.className(_el$57, _p$.o = _v$40);
-          _v$41 !== _p$.i && web.className(_el$59, _p$.i = _v$41);
-          _v$42 !== _p$.n && web.className(_el$61, _p$.n = _v$42);
-          _v$43 !== _p$.s && web.className(_el$63, _p$.s = _v$43);
-          _v$44 !== _p$.h && web.className(_el$65, _p$.h = _v$44);
-          _v$45 !== _p$.r && web.className(_el$66, _p$.r = _v$45);
-          _v$46 !== _p$.d && web.className(_el$68, _p$.d = _v$46);
-          _v$47 !== _p$.l && web.className(_el$69, _p$.l = _v$47);
-          _v$48 !== _p$.u && web.className(_el$70, _p$.u = _v$48);
+          _v$37 !== _p$.e && index.className(_el$53, _p$.e = _v$37);
+          _v$38 !== _p$.t && index.className(_el$54, _p$.t = _v$38);
+          _v$39 !== _p$.a && index.className(_el$56, _p$.a = _v$39);
+          _v$40 !== _p$.o && index.className(_el$57, _p$.o = _v$40);
+          _v$41 !== _p$.i && index.className(_el$59, _p$.i = _v$41);
+          _v$42 !== _p$.n && index.className(_el$61, _p$.n = _v$42);
+          _v$43 !== _p$.s && index.className(_el$63, _p$.s = _v$43);
+          _v$44 !== _p$.h && index.className(_el$65, _p$.h = _v$44);
+          _v$45 !== _p$.r && index.className(_el$66, _p$.r = _v$45);
+          _v$46 !== _p$.d && index.className(_el$68, _p$.d = _v$46);
+          _v$47 !== _p$.l && index.className(_el$69, _p$.l = _v$47);
+          _v$48 !== _p$.u && index.className(_el$70, _p$.u = _v$48);
           return _p$;
         }, {
           e: void 0,
@@ -1816,15 +1814,15 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         return _el$53;
       })() : null;
     })(), null);
-    web.insert(_el$11, (() => {
-      var _c$7 = web.memo(() => !!hasSearch());
+    index.insert(_el$11, (() => {
+      var _c$7 = index.createMemo(() => !!hasSearch());
       return () => _c$7() ? (() => {
         var _el$73 = _tmpl$14(), _el$74 = _el$73.firstChild;
         _el$74.firstChild;
         var _el$76 = _el$74.nextSibling;
-        web.insert(_el$74, typeof navigator !== "undefined" ? (() => {
+        index.insert(_el$74, typeof navigator !== "undefined" ? (() => {
           var _el$77 = _tmpl$15();
-          web.insert(_el$77, web.createComponent(CopyButton, {
+          index.insert(_el$77, index.createComponent(CopyButton, {
             getValue: () => {
               const search = routerState().location.search;
               return JSON.stringify(search);
@@ -1832,7 +1830,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
           }));
           return _el$77;
         })() : null, null);
-        web.insert(_el$76, web.createComponent(Explorer, {
+        index.insert(_el$76, index.createComponent(Explorer, {
           value: locationSearchValue,
           get defaultExpanded() {
             return Object.keys(routerState().location.search).reduce((obj, next) => {
@@ -1841,11 +1839,11 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
             }, {});
           }
         }));
-        web.effect((_p$) => {
+        index.createRenderEffect((_p$) => {
           var _v$49 = styles().fourthContainer, _v$50 = styles().detailsHeader, _v$51 = styles().detailsContent;
-          _v$49 !== _p$.e && web.className(_el$73, _p$.e = _v$49);
-          _v$50 !== _p$.t && web.className(_el$74, _p$.t = _v$50);
-          _v$51 !== _p$.a && web.className(_el$76, _p$.a = _v$51);
+          _v$49 !== _p$.e && index.className(_el$73, _p$.e = _v$49);
+          _v$50 !== _p$.t && index.className(_el$74, _p$.t = _v$50);
+          _v$51 !== _p$.a && index.className(_el$76, _p$.a = _v$51);
           return _p$;
         }, {
           e: void 0,
@@ -1855,28 +1853,28 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
         return _el$73;
       })() : null;
     })(), null);
-    web.effect((_p$) => {
+    index.createRenderEffect((_p$) => {
       var _v$6 = styles().panelCloseBtn, _v$7 = styles().panelCloseBtnIcon, _v$8 = styles().firstContainer, _v$9 = styles().row, _v$0 = styles().routerExplorerContainer, _v$1 = styles().routerExplorer, _v$10 = styles().secondContainer, _v$11 = styles().matchesContainer, _v$12 = styles().detailsHeader, _v$13 = styles().detailsContent, _v$14 = styles().detailsHeader, _v$15 = styles().routeMatchesToggle, _v$16 = currentTab() === "routes", _v$17 = clsx.clsx(styles().routeMatchesToggleBtn(currentTab() === "routes", true)), _v$18 = currentTab() === "matches", _v$19 = clsx.clsx(styles().routeMatchesToggleBtn(currentTab() === "matches", true)), _v$20 = currentTab() === "history", _v$21 = clsx.clsx(styles().routeMatchesToggleBtn(currentTab() === "history", false)), _v$22 = styles().detailsHeaderInfo, _v$23 = clsx.clsx(styles().routesContainer);
-      _v$6 !== _p$.e && web.className(_el$12, _p$.e = _v$6);
-      _v$7 !== _p$.t && web.setAttribute(_el$13, "class", _p$.t = _v$7);
-      _v$8 !== _p$.a && web.className(_el$14, _p$.a = _v$8);
-      _v$9 !== _p$.o && web.className(_el$15, _p$.o = _v$9);
-      _v$0 !== _p$.i && web.className(_el$16, _p$.i = _v$0);
-      _v$1 !== _p$.n && web.className(_el$17, _p$.n = _v$1);
-      _v$10 !== _p$.s && web.className(_el$18, _p$.s = _v$10);
-      _v$11 !== _p$.h && web.className(_el$19, _p$.h = _v$11);
-      _v$12 !== _p$.r && web.className(_el$20, _p$.r = _v$12);
-      _v$13 !== _p$.d && web.className(_el$22, _p$.d = _v$13);
-      _v$14 !== _p$.l && web.className(_el$24, _p$.l = _v$14);
-      _v$15 !== _p$.u && web.className(_el$25, _p$.u = _v$15);
+      _v$6 !== _p$.e && index.className(_el$12, _p$.e = _v$6);
+      _v$7 !== _p$.t && index.setAttribute(_el$13, "class", _p$.t = _v$7);
+      _v$8 !== _p$.a && index.className(_el$14, _p$.a = _v$8);
+      _v$9 !== _p$.o && index.className(_el$15, _p$.o = _v$9);
+      _v$0 !== _p$.i && index.className(_el$16, _p$.i = _v$0);
+      _v$1 !== _p$.n && index.className(_el$17, _p$.n = _v$1);
+      _v$10 !== _p$.s && index.className(_el$18, _p$.s = _v$10);
+      _v$11 !== _p$.h && index.className(_el$19, _p$.h = _v$11);
+      _v$12 !== _p$.r && index.className(_el$20, _p$.r = _v$12);
+      _v$13 !== _p$.d && index.className(_el$22, _p$.d = _v$13);
+      _v$14 !== _p$.l && index.className(_el$24, _p$.l = _v$14);
+      _v$15 !== _p$.u && index.className(_el$25, _p$.u = _v$15);
       _v$16 !== _p$.c && (_el$26.disabled = _p$.c = _v$16);
-      _v$17 !== _p$.w && web.className(_el$26, _p$.w = _v$17);
+      _v$17 !== _p$.w && index.className(_el$26, _p$.w = _v$17);
       _v$18 !== _p$.m && (_el$27.disabled = _p$.m = _v$18);
-      _v$19 !== _p$.f && web.className(_el$27, _p$.f = _v$19);
+      _v$19 !== _p$.f && index.className(_el$27, _p$.f = _v$19);
       _v$20 !== _p$.y && (_el$28.disabled = _p$.y = _v$20);
-      _v$21 !== _p$.g && web.className(_el$28, _p$.g = _v$21);
-      _v$22 !== _p$.p && web.className(_el$29, _p$.p = _v$22);
-      _v$23 !== _p$.b && web.className(_el$30, _p$.b = _v$23);
+      _v$21 !== _p$.g && index.className(_el$28, _p$.g = _v$21);
+      _v$22 !== _p$.p && index.className(_el$29, _p$.p = _v$22);
+      _v$23 !== _p$.b && index.className(_el$30, _p$.b = _v$23);
       return _p$;
     }, {
       e: void 0,
@@ -1906,7 +1904,7 @@ const BaseTanStackRouterDevtoolsPanel = function BaseTanStackRouterDevtoolsPanel
 function CopyButton({
   getValue
 }) {
-  const [copied, setCopied] = solidJs.createSignal(false);
+  const [copied, setCopied] = index.createSignal(false);
   let timeoutId = null;
   const handleCopy = async () => {
     if (typeof navigator === "undefined" || !navigator.clipboard?.writeText) {
@@ -1923,18 +1921,18 @@ function CopyButton({
       console.error("TanStack Router Devtools: Failed to copy", e);
     }
   };
-  solidJs.onCleanup(() => {
+  index.onCleanup(() => {
     if (timeoutId) clearTimeout(timeoutId);
   });
   return (() => {
     var _el$78 = _tmpl$16();
     _el$78.$$click = handleCopy;
-    web.insert(_el$78, () => copied() ? "✅" : "📋");
-    web.effect(() => web.setAttribute(_el$78, "title", copied() ? "Copied!" : "Copy"));
+    index.insert(_el$78, () => copied() ? "✅" : "📋");
+    index.createRenderEffect(() => index.setAttribute(_el$78, "title", copied() ? "Copied!" : "Copy"));
     return _el$78;
   })();
 }
-web.delegateEvents(["click", "mousedown"]);
+index.delegateEvents(["click", "mousedown"]);
 const BaseTanStackRouterDevtoolsPanel$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   BaseTanStackRouterDevtoolsPanel,
@@ -1945,4 +1943,4 @@ exports.BaseTanStackRouterDevtoolsPanel$1 = BaseTanStackRouterDevtoolsPanel$1;
 exports.useIsMounted = useIsMounted;
 exports.useLocalStorage = useLocalStorage;
 exports.useStyles = useStyles$1;
-//# sourceMappingURL=BaseTanStackRouterDevtoolsPanel-CiObEXSM.cjs.map
+//# sourceMappingURL=BaseTanStackRouterDevtoolsPanel-z0YMII09.cjs.map