@tanstack/solid-query-devtools 6.0.0-beta.4 → 6.0.0-beta.5

package/build/_tsup-dts-rollup.d.cts

@@ -3,11 +3,9 @@ import type { ComponentProps } from 'solid-js';
 import type { DevtoolsButtonPosition } from '@tanstack/query-devtools';
 import type { DevtoolsErrorType } from '@tanstack/query-devtools';
 import type { DevtoolsPosition } from '@tanstack/query-devtools';
-import { JSX } from 'solid-js';
-import { Options } from 'tsup';
+import { JSX } from '@solidjs/web';
 import type { QueryClient } from '@tanstack/solid-query';
 import type { Theme } from '@tanstack/query-devtools';
-import { UserConfig } from 'vite';
 
 export declare function default_alias<T extends Component<any>>(fn: () => Promise<{
     default: T;
@@ -19,27 +17,19 @@ export declare function default_alias_1(props: DevtoolsOptions): JSX;
 
 export declare function default_alias_2(props: DevtoolsPanelOptions): JSX.Element;
 
-export declare const default_alias_3: any[];
-
-export declare const default_alias_4: any[];
-
-export declare const default_alias_5: Options | Options[] | ((overrideOptions: Options) => Options | Options[] | Promise<Options | Options[]>);
-
-export declare const default_alias_6: UserConfig;
-
 declare interface DevtoolsOptions {
     /**
      * Set this true if you want the dev tools to default to being open
      */
     initialIsOpen?: boolean;
     /**
-     * The position of the React Query logo to open and close the devtools panel.
-     * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'
+     * The position of the TanStack logo to open and close the devtools panel.
+     * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'
      * Defaults to 'bottom-right'.
      */
     buttonPosition?: DevtoolsButtonPosition;
     /**
-     * The position of the React Query devtools panel.
+     * The position of the Solid Query devtools panel.
      * 'top' | 'bottom' | 'left' | 'right'
      * Defaults to 'bottom'.
      */
@@ -98,7 +88,7 @@ declare interface DevtoolsPanelOptions {
     /**
      * Callback function that is called when the devtools panel is closed
      */
-    onClose?: () => unknown;
+    onClose?: () => void;
     /**
      * Set this to true to hide disabled queries from the devtools panel.
      */

package/build/_tsup-dts-rollup.d.ts

@@ -3,11 +3,9 @@ import type { ComponentProps } from 'solid-js';
 import type { DevtoolsButtonPosition } from '@tanstack/query-devtools';
 import type { DevtoolsErrorType } from '@tanstack/query-devtools';
 import type { DevtoolsPosition } from '@tanstack/query-devtools';
-import { JSX } from 'solid-js';
-import { Options } from 'tsup';
+import { JSX } from '@solidjs/web';
 import type { QueryClient } from '@tanstack/solid-query';
 import type { Theme } from '@tanstack/query-devtools';
-import { UserConfig } from 'vite';
 
 export declare function default_alias<T extends Component<any>>(fn: () => Promise<{
     default: T;
@@ -19,27 +17,19 @@ export declare function default_alias_1(props: DevtoolsOptions): JSX;
 
 export declare function default_alias_2(props: DevtoolsPanelOptions): JSX.Element;
 
-export declare const default_alias_3: any[];
-
-export declare const default_alias_4: any[];
-
-export declare const default_alias_5: Options | Options[] | ((overrideOptions: Options) => Options | Options[] | Promise<Options | Options[]>);
-
-export declare const default_alias_6: UserConfig;
-
 declare interface DevtoolsOptions {
     /**
      * Set this true if you want the dev tools to default to being open
      */
     initialIsOpen?: boolean;
     /**
-     * The position of the React Query logo to open and close the devtools panel.
-     * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'
+     * The position of the TanStack logo to open and close the devtools panel.
+     * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'
      * Defaults to 'bottom-right'.
      */
     buttonPosition?: DevtoolsButtonPosition;
     /**
-     * The position of the React Query devtools panel.
+     * The position of the Solid Query devtools panel.
      * 'top' | 'bottom' | 'left' | 'right'
      * Defaults to 'bottom'.
      */
@@ -98,7 +88,7 @@ declare interface DevtoolsPanelOptions {
     /**
      * Callback function that is called when the devtools panel is closed
      */
-    onClose?: () => unknown;
+    onClose?: () => void;
     /**
      * Set this to true to hide disabled queries from the devtools panel.
      */

package/build/chunk/{RNXRSYV2.js → 5YUDKRGO.js}

@@ -1,9 +1,15 @@
 import { createRenderEffect, untrack, runWithOwner, sharedConfig } from 'solid-js';
 
-// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.7_@solidjs+signals@2.0.0-beta.7_solid-js@2.0.0-beta.7/node_modules/@solidjs/web/dist/web.js
-var effect = (fn, effectFn) => createRenderEffect(fn, effectFn, {
-  transparent: true
-});
+// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.15_solid-js@2.0.0-beta.15/node_modules/@solidjs/web/dist/web.js
+var transparentOptions = {
+  transparent: true,
+  sync: true
+};
+var effect = (fn, effectFn, options) => createRenderEffect(fn, effectFn, options ? {
+  transparent: true,
+  sync: true,
+  ...options
+} : transparentOptions);
 function create(html, bypassGuard, flag) {
   const t = document.createElement("template");
   t.innerHTML = html;
@@ -27,7 +33,6 @@ function style(node, value, prev) {
   if (typeof value === "string") return nodeStyle.cssText = value;
   typeof prev === "string" && (nodeStyle.cssText = prev = void 0);
   prev || (prev = {});
-  value || (value = {});
   let v, s;
   for (s in value) {
     v = value[s];

package/build/chunk/{OUUOFKOT.js → OIFXIFGE.js}

@@ -1,9 +1,15 @@
 import { createRenderEffect, untrack, runWithOwner, sharedConfig } from 'solid-js';
 
-// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.7_@solidjs+signals@2.0.0-beta.7_solid-js@2.0.0-beta.7/node_modules/@solidjs/web/dist/dev.js
-var effect = (fn, effectFn) => createRenderEffect(fn, effectFn, {
-  transparent: true
-});
+// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.15_solid-js@2.0.0-beta.15/node_modules/@solidjs/web/dist/dev.js
+var transparentOptions = {
+  transparent: true,
+  sync: true
+};
+var effect = (fn, effectFn, options) => createRenderEffect(fn, effectFn, options ? {
+  transparent: true,
+  sync: true,
+  ...options
+} : transparentOptions);
 function create(html, bypassGuard, flag) {
   if (isHydrating() && !bypassGuard) throw new Error("Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration.");
   const t = document.createElement("template");
@@ -29,7 +35,6 @@ function style(node, value, prev) {
   if (typeof value === "string") return nodeStyle.cssText = value;
   typeof prev === "string" && (nodeStyle.cssText = prev = void 0);
   prev || (prev = {});
-  value || (value = {});
   let v, s;
   for (s in value) {
     v = value[s];

package/build/dev.cjs

@@ -38,7 +38,6 @@ function style(node, value, prev) {
   if (typeof value === "string") return nodeStyle.cssText = value;
   typeof prev === "string" && (nodeStyle.cssText = prev = void 0);
   prev || (prev = {});
-  value || (value = {});
   let v, s;
   for (s in value) {
     v = value[s];
@@ -57,12 +56,18 @@ function ref(fn, element) {
 function isHydrating(node) {
   return solidJs.sharedConfig.hydrating && (!node || node.isConnected);
 }
-var effect, isServer, isDev;
+var transparentOptions, effect, isServer, isDev;
 var init_dev = __esm({
-  "../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.7_@solidjs+signals@2.0.0-beta.7_solid-js@2.0.0-beta.7/node_modules/@solidjs/web/dist/dev.js"() {
-    effect = (fn, effectFn) => solidJs.createRenderEffect(fn, effectFn, {
-      transparent: true
-    });
+  "../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.15_solid-js@2.0.0-beta.15/node_modules/@solidjs/web/dist/dev.js"() {
+    transparentOptions = {
+      transparent: true,
+      sync: true
+    };
+    effect = (fn, effectFn, options) => solidJs.createRenderEffect(fn, effectFn, options ? {
+      transparent: true,
+      sync: true,
+      ...options
+    } : transparentOptions);
     isServer = false;
     isDev = true;
   }
@@ -113,25 +118,25 @@ function SolidQueryDevtools(props) {
   solidJs.createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
-  });
-  solidJs.onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
+  let mounted = false;
+  let disposed = false;
+  solidJs.onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      solidJs.runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
-  return (() => {
-    var _el$ = _tmpl$();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    return _el$;
-  })();
+  var _el$ = _tmpl$();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  return _el$;
 }
 var _tmpl$;
 var init_devtools = __esm({
@@ -185,30 +190,30 @@ function SolidQueryDevtoolsPanel(props) {
   solidJs.createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
+  let mounted = false;
+  let disposed = false;
+  solidJs.onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      solidJs.runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
-  solidJs.onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
+  var _el$ = _tmpl$2();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  effect(() => ({
+    ...props.style
+  }), (_v$, _$p) => {
+    style(_el$, _v$, _$p);
   });
-  return (() => {
-    var _el$ = _tmpl$2();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    effect(() => ({
-      ...props.style
-    }), (_v$, _$p) => {
-      style(_el$, _v$, _$p);
-    });
-    return _el$;
-  })();
+  return _el$;
 }
 var _tmpl$2;
 var init_devtoolsPanel = __esm({

package/build/dev.js

@@ -1,4 +1,4 @@
-import { isDev, isServer } from './chunk/OUUOFKOT.js';
+import { isDev, isServer } from './chunk/OIFXIFGE.js';
 import { createSignal, omit, sharedConfig, onSettled, createMemo, untrack } from 'solid-js';
 
 function clientOnly(fn) {
@@ -19,10 +19,10 @@ function clientOnly(fn) {
 }
 
 // src/index.tsx
-var SolidQueryDevtools = isDev ? clientOnly(() => import('./devtools/DAAYGNEN.js')) : function() {
+var SolidQueryDevtools = isDev ? clientOnly(() => import('./devtools/T3N3FX25.js')) : function() {
   return null;
 };
-var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import('./devtoolsPanel/SQHQ34QQ.js')) : function() {
+var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import('./devtoolsPanel/5CAQ2WGQ.js')) : function() {
   return null;
 };
 

package/build/dev.jsx

@@ -1,12 +1,12 @@
-// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.7_@solidjs+signals@2.0.0-beta.7_solid-js@2.0.0-beta.7/node_modules/@solidjs/web/dist/dev.js
-import { createRenderEffect, createMemo as createMemo$1, sharedConfig, untrack, runWithOwner, flatten, createRoot, omit, $DEVCOMP, enableHydration, enforceLoadingBoundary } from "solid-js";
-import { Errored, For, Hydration, Loading, Match, NoHydration, Repeat, Reveal, Show, Switch, createComponent, getOwner, merge, untrack as untrack2 } from "solid-js";
+// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.15_solid-js@2.0.0-beta.15/node_modules/@solidjs/web/dist/dev.js
+import { createRenderEffect, createMemo, sharedConfig, untrack, runWithOwner, flatten, createRoot, merge, createComponent, omit, getOwner, createEffect, $DEVCOMP, enableHydration, enforceLoadingBoundary, flush } from "solid-js";
+import { Errored, For, Hydration, Loading, Match, NoHydration, Repeat, Reveal, Show, Switch, createComponent as createComponent2, getOwner as getOwner2, untrack as untrack2 } from "solid-js";
 var isServer = false;
 var isDev = true;
 
 // src/clientOnly.tsx
 import {
-  createMemo,
+  createMemo as createMemo2,
   createSignal,
   omit as omit2,
   onSettled,
@@ -27,17 +27,17 @@ function clientOnly(fn) {
     onSettled(() => {
       setMounted(true);
     });
-    return createMemo(
+    return createMemo2(
       () => (Comp = comp(), m = mounted(), untrack3(() => Comp && m ? Comp(rest) : props.fallback))
     );
   };
 }
 
 // src/index.tsx
-var SolidQueryDevtools = isDev ? clientOnly(() => import("./devtools/R2AGYIME.jsx")) : function() {
+var SolidQueryDevtools = isDev ? clientOnly(() => import("./devtools/7WZM3IT7.jsx")) : function() {
   return null;
 };
-var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import("./devtoolsPanel/QZBU22C7.jsx")) : function() {
+var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import("./devtoolsPanel/FQC5JHFZ.jsx")) : function() {
   return null;
 };
 export {

package/build/devtools/{R2AGYIME.jsx → 7WZM3IT7.jsx}

@@ -1,5 +1,5 @@
 // src/devtools.tsx
-import { createEffect, createMemo, onCleanup } from "solid-js";
+import { createEffect, createMemo, onSettled, runWithOwner } from "solid-js";
 import { onlineManager, useQueryClient } from "@tanstack/solid-query";
 import { TanstackQueryDevtools } from "@tanstack/query-devtools";
 function SolidQueryDevtools(props) {
@@ -60,18 +60,20 @@ function SolidQueryDevtools(props) {
       devtools.setTheme(theme || "system");
     }
   );
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref);
-    isMounted = true;
-  });
-  onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
+  let mounted = false;
+  let disposed = false;
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      runWithOwner(null, () => devtools.mount(ref));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
   return <div class="tsqd-parent-container" ref={ref} />;
 }

package/build/devtools/{BN3QOQGH.js → FNDI35UR.js}

@@ -1,5 +1,5 @@
-import { ref, template } from '../chunk/RNXRSYV2.js';
-import { createMemo, createEffect, onCleanup } from 'solid-js';
+import { ref, template } from '../chunk/5YUDKRGO.js';
+import { createMemo, createEffect, onSettled, runWithOwner } from 'solid-js';
 import { useQueryClient, onlineManager } from '@tanstack/solid-query';
 import { TanstackQueryDevtools } from '@tanstack/query-devtools';
 
@@ -44,25 +44,25 @@ function SolidQueryDevtools(props) {
   createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
+  let mounted = false;
+  let disposed = false;
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
-  onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
-  });
-  return (() => {
-    var _el$ = _tmpl$();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    return _el$;
-  })();
+  var _el$ = _tmpl$();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  return _el$;
 }
 
 export { SolidQueryDevtools as default };

package/build/devtools/{DAAYGNEN.js → T3N3FX25.js}

@@ -1,5 +1,5 @@
-import { ref, template } from '../chunk/OUUOFKOT.js';
-import { createMemo, createEffect, onCleanup } from 'solid-js';
+import { ref, template } from '../chunk/OIFXIFGE.js';
+import { createMemo, createEffect, onSettled, runWithOwner } from 'solid-js';
 import { useQueryClient, onlineManager } from '@tanstack/solid-query';
 import { TanstackQueryDevtools } from '@tanstack/query-devtools';
 
@@ -44,25 +44,25 @@ function SolidQueryDevtools(props) {
   createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
+  let mounted = false;
+  let disposed = false;
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
-  onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
-  });
-  return (() => {
-    var _el$ = _tmpl$();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    return _el$;
-  })();
+  var _el$ = _tmpl$();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  return _el$;
 }
 
 export { SolidQueryDevtools as default };

package/build/devtoolsPanel/{SQHQ34QQ.js → 5CAQ2WGQ.js}

@@ -1,5 +1,5 @@
-import { ref, effect, style, template } from '../chunk/OUUOFKOT.js';
-import { createMemo, createEffect, onCleanup } from 'solid-js';
+import { ref, effect, style, template } from '../chunk/OIFXIFGE.js';
+import { createMemo, createEffect, onSettled, runWithOwner } from 'solid-js';
 import { useQueryClient, onlineManager } from '@tanstack/solid-query';
 import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools';
 
@@ -42,30 +42,30 @@ function SolidQueryDevtoolsPanel(props) {
   createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
+  let mounted = false;
+  let disposed = false;
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
-  onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
+  var _el$ = _tmpl$();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  effect(() => ({
+    ...props.style
+  }), (_v$, _$p) => {
+    style(_el$, _v$, _$p);
   });
-  return (() => {
-    var _el$ = _tmpl$();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    effect(() => ({
-      ...props.style
-    }), (_v$, _$p) => {
-      style(_el$, _v$, _$p);
-    });
-    return _el$;
-  })();
+  return _el$;
 }
 
 export { SolidQueryDevtoolsPanel as default };

package/build/devtoolsPanel/{FI3ZIJCV.js → DXOBITS6.js}

@@ -1,5 +1,5 @@
-import { ref, effect, style, template } from '../chunk/RNXRSYV2.js';
-import { createMemo, createEffect, onCleanup } from 'solid-js';
+import { ref, effect, style, template } from '../chunk/5YUDKRGO.js';
+import { createMemo, createEffect, onSettled, runWithOwner } from 'solid-js';
 import { useQueryClient, onlineManager } from '@tanstack/solid-query';
 import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools';
 
@@ -42,30 +42,30 @@ function SolidQueryDevtoolsPanel(props) {
   createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
+  let mounted = false;
+  let disposed = false;
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
-  onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
+  var _el$ = _tmpl$();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  effect(() => ({
+    ...props.style
+  }), (_v$, _$p) => {
+    style(_el$, _v$, _$p);
   });
-  return (() => {
-    var _el$ = _tmpl$();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    effect(() => ({
-      ...props.style
-    }), (_v$, _$p) => {
-      style(_el$, _v$, _$p);
-    });
-    return _el$;
-  })();
+  return _el$;
 }
 
 export { SolidQueryDevtoolsPanel as default };

package/build/devtoolsPanel/{QZBU22C7.jsx → FQC5JHFZ.jsx}

@@ -1,5 +1,5 @@
 // src/devtoolsPanel.tsx
-import { createEffect, createMemo, onCleanup } from "solid-js";
+import { createEffect, createMemo, onSettled, runWithOwner } from "solid-js";
 import { onlineManager, useQueryClient } from "@tanstack/solid-query";
 import { TanstackQueryDevtoolsPanel } from "@tanstack/query-devtools";
 function SolidQueryDevtoolsPanel(props) {
@@ -47,18 +47,20 @@ function SolidQueryDevtoolsPanel(props) {
       devtools.setTheme(theme || "system");
     }
   );
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref);
-    isMounted = true;
-  });
-  onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
+  let mounted = false;
+  let disposed = false;
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      runWithOwner(null, () => devtools.mount(ref));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
   });
   return <div
     style={{ height: "500px", ...props.style }}

package/build/index.cjs

@@ -36,7 +36,6 @@ function style(node, value, prev) {
   if (typeof value === "string") return nodeStyle.cssText = value;
   typeof prev === "string" && (nodeStyle.cssText = prev = void 0);
   prev || (prev = {});
-  value || (value = {});
   let v, s;
   for (s in value) {
     v = value[s];
@@ -55,12 +54,18 @@ function ref(fn, element) {
 function isHydrating(node) {
   return solidJs.sharedConfig.hydrating && (!node || node.isConnected);
 }
-var effect, isServer, isDev;
+var transparentOptions, effect, isServer, isDev;
 var init_web = __esm({
-  "../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.7_@solidjs+signals@2.0.0-beta.7_solid-js@2.0.0-beta.7/node_modules/@solidjs/web/dist/web.js"() {
-    effect = (fn, effectFn) => solidJs.createRenderEffect(fn, effectFn, {
-      transparent: true
-    });
+  "../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.15_solid-js@2.0.0-beta.15/node_modules/@solidjs/web/dist/web.js"() {
+    transparentOptions = {
+      transparent: true,
+      sync: true
+    };
+    effect = (fn, effectFn, options) => solidJs.createRenderEffect(fn, effectFn, options ? {
+      transparent: true,
+      sync: true,
+      ...options
+    } : transparentOptions);
     isServer = false;
     isDev = false;
   }
@@ -111,25 +116,25 @@ function SolidQueryDevtools(props) {
   solidJs.createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
-  });
-  solidJs.onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
-  });
-  return (() => {
-    var _el$ = _tmpl$();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    return _el$;
-  })();
+  let mounted = false;
+  let disposed = false;
+  solidJs.onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      solidJs.runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
+    });
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
+  });
+  var _el$ = _tmpl$();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  return _el$;
 }
 var _tmpl$;
 var init_devtools = __esm({
@@ -183,30 +188,30 @@ function SolidQueryDevtoolsPanel(props) {
   solidJs.createEffect(() => props.theme, (theme) => {
     devtools.setTheme(theme || "system");
   });
-  let isMounted = false;
-  let isDisposed = false;
-  queueMicrotask(() => {
-    if (isDisposed) return;
-    devtools.mount(ref2);
-    isMounted = true;
-  });
-  solidJs.onCleanup(() => {
-    isDisposed = true;
-    if (isMounted) {
-      devtools.unmount();
-    }
-  });
-  return (() => {
-    var _el$ = _tmpl$2();
-    var _ref$ = ref2;
-    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
-    effect(() => ({
-      ...props.style
-    }), (_v$, _$p) => {
-      style(_el$, _v$, _$p);
+  let mounted = false;
+  let disposed = false;
+  solidJs.onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return;
+      solidJs.runWithOwner(null, () => devtools.mount(ref2));
+      mounted = true;
     });
-    return _el$;
-  })();
+    return () => {
+      disposed = true;
+      if (mounted) {
+        devtools.unmount();
+      }
+    };
+  });
+  var _el$ = _tmpl$2();
+  var _ref$ = ref2;
+  typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+  effect(() => ({
+    ...props.style
+  }), (_v$, _$p) => {
+    style(_el$, _v$, _$p);
+  });
+  return _el$;
 }
 var _tmpl$2;
 var init_devtoolsPanel = __esm({

package/build/index.js

@@ -1,4 +1,4 @@
-import { isDev, isServer } from './chunk/RNXRSYV2.js';
+import { isDev, isServer } from './chunk/5YUDKRGO.js';
 import { createSignal, omit, sharedConfig, onSettled, createMemo, untrack } from 'solid-js';
 
 function clientOnly(fn) {
@@ -19,10 +19,10 @@ function clientOnly(fn) {
 }
 
 // src/index.tsx
-var SolidQueryDevtools = isDev ? clientOnly(() => import('./devtools/BN3QOQGH.js')) : function() {
+var SolidQueryDevtools = isDev ? clientOnly(() => import('./devtools/FNDI35UR.js')) : function() {
   return null;
 };
-var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import('./devtoolsPanel/FI3ZIJCV.js')) : function() {
+var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import('./devtoolsPanel/DXOBITS6.js')) : function() {
   return null;
 };
 

package/build/index.jsx

@@ -1,12 +1,12 @@
-// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.7_@solidjs+signals@2.0.0-beta.7_solid-js@2.0.0-beta.7/node_modules/@solidjs/web/dist/web.js
-import { createRenderEffect, createMemo as createMemo$1, sharedConfig, untrack, runWithOwner, flatten, createRoot, omit, enableHydration } from "solid-js";
-import { Errored, For, Hydration, Loading, Match, NoHydration, Repeat, Reveal, Show, Switch, createComponent, getOwner, merge, untrack as untrack2 } from "solid-js";
+// ../../node_modules/.pnpm/@solidjs+web@2.0.0-beta.15_solid-js@2.0.0-beta.15/node_modules/@solidjs/web/dist/web.js
+import { createRenderEffect, createMemo, sharedConfig, untrack, runWithOwner, flatten, createRoot, merge, createComponent, omit, getOwner, createEffect, enableHydration, flush } from "solid-js";
+import { Errored, For, Hydration, Loading, Match, NoHydration, Repeat, Reveal, Show, Switch, createComponent as createComponent2, getOwner as getOwner2, untrack as untrack2 } from "solid-js";
 var isServer = false;
 var isDev = false;
 
 // src/clientOnly.tsx
 import {
-  createMemo,
+  createMemo as createMemo2,
   createSignal,
   omit as omit2,
   onSettled,
@@ -27,17 +27,17 @@ function clientOnly(fn) {
     onSettled(() => {
       setMounted(true);
     });
-    return createMemo(
+    return createMemo2(
       () => (Comp = comp(), m = mounted(), untrack3(() => Comp && m ? Comp(rest) : props.fallback))
     );
   };
 }
 
 // src/index.tsx
-var SolidQueryDevtools = isDev ? clientOnly(() => import("./devtools/R2AGYIME.jsx")) : function() {
+var SolidQueryDevtools = isDev ? clientOnly(() => import("./devtools/7WZM3IT7.jsx")) : function() {
   return null;
 };
-var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import("./devtoolsPanel/QZBU22C7.jsx")) : function() {
+var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import("./devtoolsPanel/FQC5JHFZ.jsx")) : function() {
   return null;
 };
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/solid-query-devtools",
-  "version": "6.0.0-beta.4",
+  "version": "6.0.0-beta.5",
   "description": "Developer tools to interact with and visualize the TanStack/solid-query Query cache",
   "author": "tannerlinsley",
   "license": "MIT",
@@ -44,23 +44,23 @@
     "!src/__tests__"
   ],
   "dependencies": {
-    "@tanstack/query-devtools": "5.93.0"
+    "@tanstack/query-devtools": "5.101.0"
   },
   "devDependencies": {
     "@babel/core": "^7.28.0",
     "@babel/preset-typescript": "^7.18.6",
     "@solidjs/testing-library": "^0.8.10",
-    "@solidjs/web": "2.0.0-beta.7",
-    "babel-preset-solid": "2.0.0-beta.7",
+    "@solidjs/web": "2.0.0-beta.15",
+    "babel-preset-solid": "2.0.0-beta.15",
     "npm-run-all2": "^5.0.0",
-    "solid-js": "2.0.0-beta.7",
+    "solid-js": "2.0.0-beta.15",
     "tsup-preset-solid": "^2.2.0",
     "vite-plugin-solid": "3.0.0-next.5",
-    "@tanstack/solid-query": "6.0.0-beta.4"
+    "@tanstack/solid-query": "6.0.0-beta.5"
   },
   "peerDependencies": {
     "solid-js": ">=2.0.0-beta.0 <3.0.0",
-    "@tanstack/solid-query": "^6.0.0-beta.4"
+    "@tanstack/solid-query": "^6.0.0-beta.5"
   },
   "scripts": {
     "clean": "premove ./build ./coverage ./dist-ts",

package/src/clientOnly.tsx

@@ -7,7 +7,8 @@ import {
   untrack,
 } from 'solid-js'
 import { isServer } from '@solidjs/web'
-import type { Component, ComponentProps, JSX } from 'solid-js'
+import type { Component, ComponentProps } from 'solid-js'
+import type { JSX } from '@solidjs/web'
 
 /*
   This function has been taken from solid-start's codebase

package/src/devtools.tsx

@@ -1,4 +1,4 @@
-import { createEffect, createMemo, onCleanup } from 'solid-js'
+import { createEffect, createMemo, onSettled, runWithOwner } from 'solid-js'
 import { onlineManager, useQueryClient } from '@tanstack/solid-query'
 import { TanstackQueryDevtools } from '@tanstack/query-devtools'
 import type {
@@ -15,13 +15,13 @@ interface DevtoolsOptions {
    */
   initialIsOpen?: boolean
   /**
-   * The position of the React Query logo to open and close the devtools panel.
-   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'
+   * The position of the TanStack logo to open and close the devtools panel.
+   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'
    * Defaults to 'bottom-right'.
    */
   buttonPosition?: DevtoolsButtonPosition
   /**
-   * The position of the React Query devtools panel.
+   * The position of the Solid Query devtools panel.
    * 'top' | 'bottom' | 'left' | 'right'
    * Defaults to 'bottom'.
    */
@@ -118,19 +118,23 @@ export default function SolidQueryDevtools(props: DevtoolsOptions) {
     },
   )
 
-  let isMounted = false
-  let isDisposed = false
-
-  queueMicrotask(() => {
-    if (isDisposed) return
-    devtools.mount(ref)
-    isMounted = true
-  })
-
-  onCleanup(() => {
-    isDisposed = true
-    if (isMounted) {
-      devtools.unmount()
+  // devtools.mount() calls render() from solid-js/web, which calls flush().
+  // flush() is not reentrant inside onSettled, so defer the mount to a
+  // microtask. runWithOwner(null) escapes the owned scope because
+  // devtools.mount renders a nested Solid app (creating reactive primitives).
+  let mounted = false
+  let disposed = false
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return
+      runWithOwner(null, () => devtools.mount(ref))
+      mounted = true
+    })
+    return () => {
+      disposed = true
+      if (mounted) {
+        devtools.unmount()
+      }
     }
   })
 

package/src/devtoolsPanel.tsx

@@ -1,9 +1,9 @@
-import { createEffect, createMemo, onCleanup } from 'solid-js'
+import { createEffect, createMemo, onSettled, runWithOwner } from 'solid-js'
 import { onlineManager, useQueryClient } from '@tanstack/solid-query'
 import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'
 import type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'
 import type { QueryClient } from '@tanstack/solid-query'
-import type { JSX } from 'solid-js'
+import type { JSX } from '@solidjs/web'
 
 export interface DevtoolsPanelOptions {
   /**
@@ -34,7 +34,7 @@ export interface DevtoolsPanelOptions {
   /**
    * Callback function that is called when the devtools panel is closed
    */
-  onClose?: () => unknown
+  onClose?: () => void
   /**
    * Set this to true to hide disabled queries from the devtools panel.
    */
@@ -93,19 +93,23 @@ export default function SolidQueryDevtoolsPanel(props: DevtoolsPanelOptions) {
     },
   )
 
-  let isMounted = false
-  let isDisposed = false
-
-  queueMicrotask(() => {
-    if (isDisposed) return
-    devtools.mount(ref)
-    isMounted = true
-  })
-
-  onCleanup(() => {
-    isDisposed = true
-    if (isMounted) {
-      devtools.unmount()
+  // devtools.mount() calls render() from solid-js/web, which calls flush().
+  // flush() is not reentrant inside onSettled, so defer the mount to a
+  // microtask. runWithOwner(null) escapes the owned scope because
+  // devtools.mount renders a nested Solid app (creating reactive primitives).
+  let mounted = false
+  let disposed = false
+  onSettled(() => {
+    queueMicrotask(() => {
+      if (disposed) return
+      runWithOwner(null, () => devtools.mount(ref))
+      mounted = true
+    })
+    return () => {
+      disposed = true
+      if (mounted) {
+        devtools.unmount()
+      }
     }
   })