@tanstack/solid-query-devtools 5.94.5 → 6.0.0-alpha.1

package/build/devtools/{BCD44V6M.js → BK5V6NH3.js}

@@ -1,14 +1,13 @@
-import { use, template } from 'solid-js/web';
-import { createMemo, createEffect, onMount, onCleanup } from 'solid-js';
+import { ref, template } from '../chunk/AU2REB6C.js';
+import { createMemo, createEffect, onCleanup } from 'solid-js';
 import { useQueryClient, onlineManager } from '@tanstack/solid-query';
 import { TanstackQueryDevtools } from '@tanstack/query-devtools';
 
-// src/devtools.tsx
 var _tmpl$ = /* @__PURE__ */ template(`<div class=tsqd-parent-container>`);
 function SolidQueryDevtools(props) {
   const queryClient = useQueryClient(props.client);
   const client = createMemo(() => queryClient);
-  let ref;
+  let ref2;
   const devtools = new TanstackQueryDevtools({
     client: client(),
     queryFlavor: "Solid Query",
@@ -23,38 +22,45 @@ function SolidQueryDevtools(props) {
     hideDisabledQueries: props.hideDisabledQueries,
     theme: props.theme
   });
-  createEffect(() => {
-    devtools.setClient(client());
+  createEffect(() => client(), (c) => {
+    devtools.setClient(c);
   });
-  createEffect(() => {
-    const buttonPos = props.buttonPosition;
+  createEffect(() => props.buttonPosition, (buttonPos) => {
     if (buttonPos) {
       devtools.setButtonPosition(buttonPos);
     }
   });
-  createEffect(() => {
-    const pos = props.position;
+  createEffect(() => props.position, (pos) => {
     if (pos) {
       devtools.setPosition(pos);
     }
   });
-  createEffect(() => {
-    devtools.setInitialIsOpen(props.initialIsOpen || false);
+  createEffect(() => props.initialIsOpen, (initialIsOpen) => {
+    devtools.setInitialIsOpen(initialIsOpen || false);
   });
-  createEffect(() => {
-    devtools.setErrorTypes(props.errorTypes || []);
+  createEffect(() => props.errorTypes, (errorTypes) => {
+    devtools.setErrorTypes(errorTypes || []);
   });
-  createEffect(() => {
-    devtools.setTheme(props.theme || "system");
+  createEffect(() => props.theme, (theme) => {
+    devtools.setTheme(theme || "system");
   });
-  onMount(() => {
-    devtools.mount(ref);
-    onCleanup(() => devtools.unmount());
+  let isMounted = false;
+  let isDisposed = false;
+  queueMicrotask(() => {
+    if (isDisposed) return;
+    devtools.mount(ref2);
+    isMounted = true;
+  });
+  onCleanup(() => {
+    isDisposed = true;
+    if (isMounted) {
+      devtools.unmount();
+    }
   });
   return (() => {
     var _el$ = _tmpl$();
-    var _ref$ = ref;
-    typeof _ref$ === "function" ? use(_ref$, _el$) : ref = _el$;
+    var _ref$ = ref2;
+    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
     return _el$;
   })();
 }

package/build/devtools/CBPRJMAC.js

@@ -0,0 +1,68 @@
+import { ref, template } from '../chunk/75V4Q6CI.js';
+import { createMemo, createEffect, onCleanup } from 'solid-js';
+import { useQueryClient, onlineManager } from '@tanstack/solid-query';
+import { TanstackQueryDevtools } from '@tanstack/query-devtools';
+
+var _tmpl$ = /* @__PURE__ */ template(`<div class=tsqd-parent-container>`);
+function SolidQueryDevtools(props) {
+  const queryClient = useQueryClient(props.client);
+  const client = createMemo(() => queryClient);
+  let ref2;
+  const devtools = new TanstackQueryDevtools({
+    client: client(),
+    queryFlavor: "Solid Query",
+    version: "5",
+    onlineManager,
+    buttonPosition: props.buttonPosition,
+    position: props.position,
+    initialIsOpen: props.initialIsOpen,
+    errorTypes: props.errorTypes,
+    styleNonce: props.styleNonce,
+    shadowDOMTarget: props.shadowDOMTarget,
+    hideDisabledQueries: props.hideDisabledQueries,
+    theme: props.theme
+  });
+  createEffect(() => client(), (c) => {
+    devtools.setClient(c);
+  });
+  createEffect(() => props.buttonPosition, (buttonPos) => {
+    if (buttonPos) {
+      devtools.setButtonPosition(buttonPos);
+    }
+  });
+  createEffect(() => props.position, (pos) => {
+    if (pos) {
+      devtools.setPosition(pos);
+    }
+  });
+  createEffect(() => props.initialIsOpen, (initialIsOpen) => {
+    devtools.setInitialIsOpen(initialIsOpen || false);
+  });
+  createEffect(() => props.errorTypes, (errorTypes) => {
+    devtools.setErrorTypes(errorTypes || []);
+  });
+  createEffect(() => props.theme, (theme) => {
+    devtools.setTheme(theme || "system");
+  });
+  let isMounted = false;
+  let isDisposed = false;
+  queueMicrotask(() => {
+    if (isDisposed) return;
+    devtools.mount(ref2);
+    isMounted = true;
+  });
+  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$;
+  })();
+}
+
+export { SolidQueryDevtools as default };

package/build/devtools/R2AGYIME.jsx

@@ -0,0 +1,80 @@
+// src/devtools.tsx
+import { createEffect, createMemo, onCleanup } from "solid-js";
+import { onlineManager, useQueryClient } from "@tanstack/solid-query";
+import { TanstackQueryDevtools } from "@tanstack/query-devtools";
+function SolidQueryDevtools(props) {
+  const queryClient = useQueryClient(props.client);
+  const client = createMemo(() => queryClient);
+  let ref;
+  const devtools = new TanstackQueryDevtools({
+    client: client(),
+    queryFlavor: "Solid Query",
+    version: "5",
+    onlineManager,
+    buttonPosition: props.buttonPosition,
+    position: props.position,
+    initialIsOpen: props.initialIsOpen,
+    errorTypes: props.errorTypes,
+    styleNonce: props.styleNonce,
+    shadowDOMTarget: props.shadowDOMTarget,
+    hideDisabledQueries: props.hideDisabledQueries,
+    theme: props.theme
+  });
+  createEffect(
+    () => client(),
+    (c) => {
+      devtools.setClient(c);
+    }
+  );
+  createEffect(
+    () => props.buttonPosition,
+    (buttonPos) => {
+      if (buttonPos) {
+        devtools.setButtonPosition(buttonPos);
+      }
+    }
+  );
+  createEffect(
+    () => props.position,
+    (pos) => {
+      if (pos) {
+        devtools.setPosition(pos);
+      }
+    }
+  );
+  createEffect(
+    () => props.initialIsOpen,
+    (initialIsOpen) => {
+      devtools.setInitialIsOpen(initialIsOpen || false);
+    }
+  );
+  createEffect(
+    () => props.errorTypes,
+    (errorTypes) => {
+      devtools.setErrorTypes(errorTypes || []);
+    }
+  );
+  createEffect(
+    () => props.theme,
+    (theme) => {
+      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();
+    }
+  });
+  return <div class="tsqd-parent-container" ref={ref} />;
+}
+export {
+  SolidQueryDevtools as default
+};

package/build/devtoolsPanel/{VOW4J2DZ.js → A5BO2WVY.js}

@@ -1,14 +1,13 @@
-import { use, effect, style, template } from 'solid-js/web';
-import { createMemo, createEffect, onMount, onCleanup } from 'solid-js';
+import { ref, effect, style, template } from '../chunk/AU2REB6C.js';
+import { createMemo, createEffect, onCleanup } from 'solid-js';
 import { useQueryClient, onlineManager } from '@tanstack/solid-query';
 import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools';
 
-// src/devtoolsPanel.tsx
 var _tmpl$ = /* @__PURE__ */ template(`<div class=tsqd-parent-container style=height:500px>`);
 function SolidQueryDevtoolsPanel(props) {
   const queryClient = useQueryClient(props.client);
   const client = createMemo(() => queryClient);
-  let ref;
+  let ref2;
   const {
     errorTypes,
     styleNonce,
@@ -30,30 +29,41 @@ function SolidQueryDevtoolsPanel(props) {
     hideDisabledQueries,
     theme: props.theme
   });
-  createEffect(() => {
-    devtools.setClient(client());
+  createEffect(() => client(), (c) => {
+    devtools.setClient(c);
   });
-  createEffect(() => {
-    devtools.setOnClose(props.onClose ?? (() => {
+  createEffect(() => props.onClose, (onClose) => {
+    devtools.setOnClose(onClose ?? (() => {
     }));
   });
-  createEffect(() => {
-    devtools.setErrorTypes(props.errorTypes || []);
+  createEffect(() => props.errorTypes, (errorTypes2) => {
+    devtools.setErrorTypes(errorTypes2 || []);
   });
-  createEffect(() => {
-    devtools.setTheme(props.theme || "system");
+  createEffect(() => props.theme, (theme) => {
+    devtools.setTheme(theme || "system");
   });
-  onMount(() => {
-    devtools.mount(ref);
-    onCleanup(() => devtools.unmount());
+  let isMounted = false;
+  let isDisposed = false;
+  queueMicrotask(() => {
+    if (isDisposed) return;
+    devtools.mount(ref2);
+    isMounted = true;
+  });
+  onCleanup(() => {
+    isDisposed = true;
+    if (isMounted) {
+      devtools.unmount();
+    }
   });
   return (() => {
     var _el$ = _tmpl$();
-    var _ref$ = ref;
-    typeof _ref$ === "function" ? use(_ref$, _el$) : ref = _el$;
-    effect((_$p) => style(_el$, {
+    var _ref$ = ref2;
+    typeof _ref$ === "function" || Array.isArray(_ref$) ? ref(() => _ref$, _el$) : ref2 = _el$;
+    effect(() => ({
       ...props.style
-    }, _$p));
+    }), (_v$, _$p) => {
+      style(_el$, _v$, _$p);
+    });
     return _el$;
   })();
 }

package/build/devtoolsPanel/KNUODKZO.js

@@ -0,0 +1,71 @@
+import { ref, effect, style, template } from '../chunk/75V4Q6CI.js';
+import { createMemo, createEffect, onCleanup } from 'solid-js';
+import { useQueryClient, onlineManager } from '@tanstack/solid-query';
+import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools';
+
+var _tmpl$ = /* @__PURE__ */ template(`<div class=tsqd-parent-container style=height:500px>`);
+function SolidQueryDevtoolsPanel(props) {
+  const queryClient = useQueryClient(props.client);
+  const client = createMemo(() => queryClient);
+  let ref2;
+  const {
+    errorTypes,
+    styleNonce,
+    shadowDOMTarget,
+    hideDisabledQueries
+  } = props;
+  const devtools = new TanstackQueryDevtoolsPanel({
+    client: client(),
+    queryFlavor: "Solid Query",
+    version: "5",
+    onlineManager,
+    buttonPosition: "bottom-left",
+    position: "bottom",
+    initialIsOpen: true,
+    errorTypes,
+    styleNonce,
+    shadowDOMTarget,
+    onClose: props.onClose,
+    hideDisabledQueries,
+    theme: props.theme
+  });
+  createEffect(() => client(), (c) => {
+    devtools.setClient(c);
+  });
+  createEffect(() => props.onClose, (onClose) => {
+    devtools.setOnClose(onClose ?? (() => {
+    }));
+  });
+  createEffect(() => props.errorTypes, (errorTypes2) => {
+    devtools.setErrorTypes(errorTypes2 || []);
+  });
+  createEffect(() => props.theme, (theme) => {
+    devtools.setTheme(theme || "system");
+  });
+  let isMounted = false;
+  let isDisposed = false;
+  queueMicrotask(() => {
+    if (isDisposed) return;
+    devtools.mount(ref2);
+    isMounted = true;
+  });
+  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$;
+    effect(() => ({
+      ...props.style
+    }), (_v$, _$p) => {
+      style(_el$, _v$, _$p);
+    });
+    return _el$;
+  })();
+}
+
+export { SolidQueryDevtoolsPanel as default };

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

@@ -1,5 +1,5 @@
 // src/devtoolsPanel.tsx
-import { createEffect, createMemo, onCleanup, onMount } from "solid-js";
+import { createEffect, createMemo, onCleanup } from "solid-js";
 import { onlineManager, useQueryClient } from "@tanstack/solid-query";
 import { TanstackQueryDevtoolsPanel } from "@tanstack/query-devtools";
 function SolidQueryDevtoolsPanel(props) {
@@ -22,22 +22,43 @@ function SolidQueryDevtoolsPanel(props) {
     hideDisabledQueries,
     theme: props.theme
   });
-  createEffect(() => {
-    devtools.setClient(client());
-  });
-  createEffect(() => {
-    devtools.setOnClose(props.onClose ?? (() => {
-    }));
-  });
-  createEffect(() => {
-    devtools.setErrorTypes(props.errorTypes || []);
-  });
-  createEffect(() => {
-    devtools.setTheme(props.theme || "system");
-  });
-  onMount(() => {
+  createEffect(
+    () => client(),
+    (c) => {
+      devtools.setClient(c);
+    }
+  );
+  createEffect(
+    () => props.onClose,
+    (onClose) => {
+      devtools.setOnClose(onClose ?? (() => {
+      }));
+    }
+  );
+  createEffect(
+    () => props.errorTypes,
+    (errorTypes2) => {
+      devtools.setErrorTypes(errorTypes2 || []);
+    }
+  );
+  createEffect(
+    () => props.theme,
+    (theme) => {
+      devtools.setTheme(theme || "system");
+    }
+  );
+  let isMounted = false;
+  let isDisposed = false;
+  queueMicrotask(() => {
+    if (isDisposed) return;
     devtools.mount(ref);
-    onCleanup(() => devtools.unmount());
+    isMounted = true;
+  });
+  onCleanup(() => {
+    isDisposed = true;
+    if (isMounted) {
+      devtools.unmount();
+    }
   });
   return <div
     style={{ height: "500px", ...props.style }}