@tanstack/preact-query-devtools 5.101.3 → 5.102.0

package/build/modern/PreactQueryDevtools.cjs

@@ -1,95 +1,58 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/PreactQueryDevtools.tsx
-var PreactQueryDevtools_exports = {};
-__export(PreactQueryDevtools_exports, {
-  PreactQueryDevtools: () => PreactQueryDevtools
-});
-module.exports = __toCommonJS(PreactQueryDevtools_exports);
-var import_hooks = require("preact/hooks");
-var import_preact_query = require("@tanstack/preact-query");
-var import_query_devtools = require("@tanstack/query-devtools");
-var import_jsx_runtime = require("preact/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let preact_hooks = require("preact/hooks");
+let _tanstack_preact_query = require("@tanstack/preact-query");
+let _tanstack_query_devtools = require("@tanstack/query-devtools");
+let preact_jsx_runtime = require("preact/jsx-runtime");
+//#region src/PreactQueryDevtools.tsx
 function PreactQueryDevtools(props) {
-  const queryClient = (0, import_preact_query.useQueryClient)(props.client);
-  const ref = (0, import_hooks.useRef)(null);
-  const {
-    buttonPosition,
-    position,
-    initialIsOpen,
-    errorTypes,
-    styleNonce,
-    shadowDOMTarget,
-    hideDisabledQueries,
-    theme
-  } = props;
-  const [devtools] = (0, import_hooks.useState)(
-    () => new import_query_devtools.TanstackQueryDevtools({
-      client: queryClient,
-      queryFlavor: "Preact Query",
-      version: "5",
-      onlineManager: import_preact_query.onlineManager,
-      buttonPosition,
-      position,
-      initialIsOpen,
-      errorTypes,
-      styleNonce,
-      shadowDOMTarget,
-      hideDisabledQueries,
-      theme
-    })
-  );
-  (0, import_hooks.useEffect)(() => {
-    devtools.setClient(queryClient);
-  }, [queryClient, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    if (buttonPosition) {
-      devtools.setButtonPosition(buttonPosition);
-    }
-  }, [buttonPosition, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    if (position) {
-      devtools.setPosition(position);
-    }
-  }, [position, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    devtools.setInitialIsOpen(initialIsOpen || false);
-  }, [initialIsOpen, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    devtools.setErrorTypes(errorTypes || []);
-  }, [errorTypes, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    devtools.setTheme(theme);
-  }, [theme, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    if (ref.current) {
-      devtools.mount(ref.current);
-    }
-    return () => {
-      devtools.unmount();
-    };
-  }, [devtools]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { dir: "ltr", className: "tsqd-parent-container", ref });
+	const queryClient = (0, _tanstack_preact_query.useQueryClient)(props.client);
+	const ref = (0, preact_hooks.useRef)(null);
+	const { buttonPosition, position, initialIsOpen, errorTypes, styleNonce, shadowDOMTarget, hideDisabledQueries, theme } = props;
+	const [devtools] = (0, preact_hooks.useState)(() => new _tanstack_query_devtools.TanstackQueryDevtools({
+		client: queryClient,
+		queryFlavor: "Preact Query",
+		version: "5",
+		onlineManager: _tanstack_preact_query.onlineManager,
+		buttonPosition,
+		position,
+		initialIsOpen,
+		errorTypes,
+		styleNonce,
+		shadowDOMTarget,
+		hideDisabledQueries,
+		theme
+	}));
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setClient(queryClient);
+	}, [queryClient, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		if (buttonPosition) devtools.setButtonPosition(buttonPosition);
+	}, [buttonPosition, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		if (position) devtools.setPosition(position);
+	}, [position, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setInitialIsOpen(initialIsOpen || false);
+	}, [initialIsOpen, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setErrorTypes(errorTypes || []);
+	}, [errorTypes, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setTheme(theme);
+	}, [theme, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		if (ref.current) devtools.mount(ref.current);
+		return () => {
+			devtools.unmount();
+		};
+	}, [devtools]);
+	return /* @__PURE__ */ (0, preact_jsx_runtime.jsx)("div", {
+		dir: "ltr",
+		className: "tsqd-parent-container",
+		ref
+	});
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  PreactQueryDevtools
-});
+//#endregion
+exports.PreactQueryDevtools = PreactQueryDevtools;
+
 //# sourceMappingURL=PreactQueryDevtools.cjs.map

package/build/modern/PreactQueryDevtools.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/PreactQueryDevtools.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'preact/hooks'\nimport { onlineManager, useQueryClient } from '@tanstack/preact-query'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsErrorType,\n  DevtoolsPosition,\n  Theme,\n} from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/preact-query'\nimport type { VNode } from 'preact'\n\nexport interface DevtoolsOptions {\n  /**\n   * Set this true if you want the dev tools to default to being open\n   */\n  initialIsOpen?: boolean\n  /**\n   * The position of the TanStack logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'\n   * Defaults to 'bottom-right'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the Preact Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Use this to provide a custom QueryClient. Otherwise, the one from the\n   * nearest QueryClientProvider will be used.\n   */\n  client?: QueryClient\n  /**\n   * Use this to provide custom error type handlers for the devtools panel.\n   */\n  errorTypes?: Array<DevtoolsErrorType>\n  /**\n   * Use this to pass a nonce to the style tag that is added to the document\n   * head. This is useful if you are using a Content Security Policy (CSP)\n   * nonce to allow inline styles.\n   */\n  styleNonce?: string\n  /**\n   * Use this to render the devtools inside a Shadow DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n  /**\n   * Use this to hide disabled queries from the devtools panel.\n   */\n  hideDisabledQueries?: boolean\n  /**\n   * Use this to set the theme of the devtools panel.\n   * Defaults to 'system'.\n   */\n  theme?: Theme\n}\n\nexport function PreactQueryDevtools(props: DevtoolsOptions): VNode | null {\n  const queryClient = useQueryClient(props.client)\n  const ref = useRef<HTMLDivElement>(null)\n  const {\n    buttonPosition,\n    position,\n    initialIsOpen,\n    errorTypes,\n    styleNonce,\n    shadowDOMTarget,\n    hideDisabledQueries,\n    theme,\n  } = props\n  const [devtools] = useState(\n    () =>\n      new TanstackQueryDevtools({\n        client: queryClient,\n        queryFlavor: 'Preact Query',\n        version: '5',\n        onlineManager,\n        buttonPosition,\n        position,\n        initialIsOpen,\n        errorTypes,\n        styleNonce,\n        shadowDOMTarget,\n        hideDisabledQueries,\n        theme,\n      }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(queryClient)\n  }, [queryClient, devtools])\n\n  useEffect(() => {\n    if (buttonPosition) {\n      devtools.setButtonPosition(buttonPosition)\n    }\n  }, [buttonPosition, devtools])\n\n  useEffect(() => {\n    if (position) {\n      devtools.setPosition(position)\n    }\n  }, [position, devtools])\n\n  useEffect(() => {\n    devtools.setInitialIsOpen(initialIsOpen || false)\n  }, [initialIsOpen, devtools])\n\n  useEffect(() => {\n    devtools.setErrorTypes(errorTypes || [])\n  }, [errorTypes, devtools])\n\n  useEffect(() => {\n    devtools.setTheme(theme)\n  }, [theme, devtools])\n\n  useEffect(() => {\n    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div dir=\"ltr\" className=\"tsqd-parent-container\" ref={ref} />\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA4C;AAC5C,0BAA8C;AAC9C,4BAAsC;AA6H7B;AApEF,SAAS,oBAAoB,OAAsC;AACxE,QAAM,kBAAc,oCAAe,MAAM,MAAM;AAC/C,QAAM,UAAM,qBAAuB,IAAI;AACvC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,CAAC,QAAQ,QAAI;AAAA,IACjB,MACE,IAAI,4CAAsB;AAAA,MACxB,QAAQ;AAAA,MACR,aAAa;AAAA,MACb,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACL;AAEA,8BAAU,MAAM;AACd,aAAS,UAAU,WAAW;AAAA,EAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;AAE1B,8BAAU,MAAM;AACd,QAAI,gBAAgB;AAClB,eAAS,kBAAkB,cAAc;AAAA,IAC3C;AAAA,EACF,GAAG,CAAC,gBAAgB,QAAQ,CAAC;AAE7B,8BAAU,MAAM;AACd,QAAI,UAAU;AACZ,eAAS,YAAY,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,8BAAU,MAAM;AACd,aAAS,iBAAiB,iBAAiB,KAAK;AAAA,EAClD,GAAG,CAAC,eAAe,QAAQ,CAAC;AAE5B,8BAAU,MAAM;AACd,aAAS,cAAc,cAAc,CAAC,CAAC;AAAA,EACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;AAEzB,8BAAU,MAAM;AACd,aAAS,SAAS,KAAK;AAAA,EACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB,8BAAU,MAAM;AACd,QAAI,IAAI,SAAS;AACf,eAAS,MAAM,IAAI,OAAO;AAAA,IAC5B;AACA,WAAO,MAAM;AACX,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO,4CAAC,SAAI,KAAI,OAAM,WAAU,yBAAwB,KAAU;AACpE;","names":[]}
+{"version":3,"file":"PreactQueryDevtools.cjs","names":["useQueryClient","useRef","useState","TanstackQueryDevtools"],"sources":["../../src/PreactQueryDevtools.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'preact/hooks'\nimport { onlineManager, useQueryClient } from '@tanstack/preact-query'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsErrorType,\n  DevtoolsPosition,\n  Theme,\n} from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/preact-query'\nimport type { VNode } from 'preact'\n\nexport interface DevtoolsOptions {\n  /**\n   * Set this true if you want the dev tools to default to being open\n   */\n  initialIsOpen?: boolean\n  /**\n   * The position of the TanStack logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'\n   * Defaults to 'bottom-right'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the Preact Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Use this to provide a custom QueryClient. Otherwise, the one from the\n   * nearest QueryClientProvider will be used.\n   */\n  client?: QueryClient\n  /**\n   * Use this to provide custom error type handlers for the devtools panel.\n   */\n  errorTypes?: Array<DevtoolsErrorType>\n  /**\n   * Use this to pass a nonce to the style tag that is added to the document\n   * head. This is useful if you are using a Content Security Policy (CSP)\n   * nonce to allow inline styles.\n   */\n  styleNonce?: string\n  /**\n   * Use this to render the devtools inside a Shadow DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n  /**\n   * Use this to hide disabled queries from the devtools panel.\n   */\n  hideDisabledQueries?: boolean\n  /**\n   * Use this to set the theme of the devtools panel.\n   * Defaults to 'system'.\n   */\n  theme?: Theme\n}\n\nexport function PreactQueryDevtools(props: DevtoolsOptions): VNode | null {\n  const queryClient = useQueryClient(props.client)\n  const ref = useRef<HTMLDivElement>(null)\n  const {\n    buttonPosition,\n    position,\n    initialIsOpen,\n    errorTypes,\n    styleNonce,\n    shadowDOMTarget,\n    hideDisabledQueries,\n    theme,\n  } = props\n  const [devtools] = useState(\n    () =>\n      new TanstackQueryDevtools({\n        client: queryClient,\n        queryFlavor: 'Preact Query',\n        version: '5',\n        onlineManager,\n        buttonPosition,\n        position,\n        initialIsOpen,\n        errorTypes,\n        styleNonce,\n        shadowDOMTarget,\n        hideDisabledQueries,\n        theme,\n      }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(queryClient)\n  }, [queryClient, devtools])\n\n  useEffect(() => {\n    if (buttonPosition) {\n      devtools.setButtonPosition(buttonPosition)\n    }\n  }, [buttonPosition, devtools])\n\n  useEffect(() => {\n    if (position) {\n      devtools.setPosition(position)\n    }\n  }, [position, devtools])\n\n  useEffect(() => {\n    devtools.setInitialIsOpen(initialIsOpen || false)\n  }, [initialIsOpen, devtools])\n\n  useEffect(() => {\n    devtools.setErrorTypes(errorTypes || [])\n  }, [errorTypes, devtools])\n\n  useEffect(() => {\n    devtools.setTheme(theme)\n  }, [theme, devtools])\n\n  useEffect(() => {\n    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div dir=\"ltr\" className=\"tsqd-parent-container\" ref={ref} />\n}\n"],"mappings":";;;;;;AA2DA,SAAgB,oBAAoB,OAAsC;CACxE,MAAM,eAAA,GAAcA,uBAAAA,eAAAA,CAAe,MAAM,MAAM;CAC/C,MAAM,OAAA,GAAMC,aAAAA,OAAAA,CAAuB,IAAI;CACvC,MAAM,EACJ,gBACA,UACA,eACA,YACA,YACA,iBACA,qBACA,UACE;CACJ,MAAM,CAAC,aAAA,GAAYC,aAAAA,SAAAA,OAEf,IAAIC,yBAAAA,sBAAsB;EACxB,QAAQ;EACR,aAAa;EACb,SAAS;EACT,eAAA,uBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CACL;CAEA,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,UAAU,WAAW;CAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;CAE1B,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,IAAI,gBACF,SAAS,kBAAkB,cAAc;CAE7C,GAAG,CAAC,gBAAgB,QAAQ,CAAC;CAE7B,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,IAAI,UACF,SAAS,YAAY,QAAQ;CAEjC,GAAG,CAAC,UAAU,QAAQ,CAAC;CAEvB,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,iBAAiB,iBAAiB,KAAK;CAClD,GAAG,CAAC,eAAe,QAAQ,CAAC;CAE5B,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,cAAc,cAAc,CAAC,CAAC;CACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;CAEzB,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,SAAS,KAAK;CACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;CAEpB,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,IAAI,IAAI,SACN,SAAS,MAAM,IAAI,OAAO;EAE5B,aAAa;GACX,SAAS,QAAQ;EACnB;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,OAAO,iBAAA,GAAA,mBAAA,IAAA,CAAC,OAAD;EAAK,KAAI;EAAM,WAAU;EAA6B;CAAM,CAAA;AACrE"}

package/build/modern/PreactQueryDevtools.d.cts

@@ -1,2 +1,56 @@
-export { PreactQueryDevtools } from './_tsup-dts-rollup.cjs';
-export { DevtoolsOptions } from './_tsup-dts-rollup.cjs';
+import { DevtoolsButtonPosition, DevtoolsErrorType, DevtoolsPosition, Theme } from "@tanstack/query-devtools";
+import { QueryClient } from "@tanstack/preact-query";
+import { VNode } from "preact";
+declare namespace PreactQueryDevtools_d_exports {
+  export { DevtoolsOptions, PreactQueryDevtools };
+}
+interface DevtoolsOptions {
+  /**
+   * Set this true if you want the dev tools to default to being open
+   */
+  initialIsOpen?: boolean;
+  /**
+   * 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 Preact Query devtools panel.
+   * 'top' | 'bottom' | 'left' | 'right'
+   * Defaults to 'bottom'.
+   */
+  position?: DevtoolsPosition;
+  /**
+   * Use this to provide a custom QueryClient. Otherwise, the one from the
+   * nearest QueryClientProvider will be used.
+   */
+  client?: QueryClient;
+  /**
+   * Use this to provide custom error type handlers for the devtools panel.
+   */
+  errorTypes?: Array<DevtoolsErrorType>;
+  /**
+   * Use this to pass a nonce to the style tag that is added to the document
+   * head. This is useful if you are using a Content Security Policy (CSP)
+   * nonce to allow inline styles.
+   */
+  styleNonce?: string;
+  /**
+   * Use this to render the devtools inside a Shadow DOM.
+   */
+  shadowDOMTarget?: ShadowRoot;
+  /**
+   * Use this to hide disabled queries from the devtools panel.
+   */
+  hideDisabledQueries?: boolean;
+  /**
+   * Use this to set the theme of the devtools panel.
+   * Defaults to 'system'.
+   */
+  theme?: Theme;
+}
+declare function PreactQueryDevtools(props: DevtoolsOptions): VNode | null;
+//#endregion
+export { DevtoolsOptions, PreactQueryDevtools, PreactQueryDevtools_d_exports as t };
+//# sourceMappingURL=PreactQueryDevtools.d.cts.map

package/build/modern/PreactQueryDevtools.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreactQueryDevtools.d.cts","names":[],"sources":["../../src/PreactQueryDevtools.tsx"],"mappings":";;;;;;UAYiB;;;;EAIf;;;;;;EAMA,iBAAiB;;;;;;EAMjB,WAAW;;;;;EAKX,SAAS;;;;EAIT,aAAa,MAAM;;;;;;EAMnB;;;;EAIA,kBAAkB;;;;EAIlB;;;;;EAKA,QAAQ;;iBAGM,oBAAoB,OAAO,kBAAkB"}

package/build/modern/PreactQueryDevtools.d.ts

@@ -1,2 +1,56 @@
-export { PreactQueryDevtools } from './_tsup-dts-rollup.js';
-export { DevtoolsOptions } from './_tsup-dts-rollup.js';
+import { QueryClient } from "@tanstack/preact-query";
+import { DevtoolsButtonPosition, DevtoolsErrorType, DevtoolsPosition, Theme } from "@tanstack/query-devtools";
+import { VNode } from "preact";
+declare namespace PreactQueryDevtools_d_exports {
+  export { DevtoolsOptions, PreactQueryDevtools };
+}
+interface DevtoolsOptions {
+  /**
+   * Set this true if you want the dev tools to default to being open
+   */
+  initialIsOpen?: boolean;
+  /**
+   * 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 Preact Query devtools panel.
+   * 'top' | 'bottom' | 'left' | 'right'
+   * Defaults to 'bottom'.
+   */
+  position?: DevtoolsPosition;
+  /**
+   * Use this to provide a custom QueryClient. Otherwise, the one from the
+   * nearest QueryClientProvider will be used.
+   */
+  client?: QueryClient;
+  /**
+   * Use this to provide custom error type handlers for the devtools panel.
+   */
+  errorTypes?: Array<DevtoolsErrorType>;
+  /**
+   * Use this to pass a nonce to the style tag that is added to the document
+   * head. This is useful if you are using a Content Security Policy (CSP)
+   * nonce to allow inline styles.
+   */
+  styleNonce?: string;
+  /**
+   * Use this to render the devtools inside a Shadow DOM.
+   */
+  shadowDOMTarget?: ShadowRoot;
+  /**
+   * Use this to hide disabled queries from the devtools panel.
+   */
+  hideDisabledQueries?: boolean;
+  /**
+   * Use this to set the theme of the devtools panel.
+   * Defaults to 'system'.
+   */
+  theme?: Theme;
+}
+declare function PreactQueryDevtools(props: DevtoolsOptions): VNode | null;
+//#endregion
+export { DevtoolsOptions, PreactQueryDevtools, PreactQueryDevtools_d_exports as t };
+//# sourceMappingURL=PreactQueryDevtools.d.ts.map

package/build/modern/PreactQueryDevtools.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreactQueryDevtools.d.ts","names":[],"sources":["../../src/PreactQueryDevtools.tsx"],"mappings":";;;;;;UAYiB;;;;EAIf;;;;;;EAMA,iBAAiB;;;;;;EAMjB,WAAW;;;;;EAKX,SAAS;;;;EAIT,aAAa,MAAM;;;;;;EAMnB;;;;EAIA,kBAAkB;;;;EAIlB;;;;;EAKA,QAAQ;;iBAGM,oBAAoB,OAAO,kBAAkB"}

package/build/modern/PreactQueryDevtools.js

@@ -1,70 +1,57 @@
-// src/PreactQueryDevtools.tsx
-import { useRef, useState, useEffect } from "preact/hooks";
+import { useEffect, useRef, useState } from "preact/hooks";
 import { onlineManager, useQueryClient } from "@tanstack/preact-query";
 import { TanstackQueryDevtools } from "@tanstack/query-devtools";
 import { jsx } from "preact/jsx-runtime";
+//#region src/PreactQueryDevtools.tsx
 function PreactQueryDevtools(props) {
-  const queryClient = useQueryClient(props.client);
-  const ref = useRef(null);
-  const {
-    buttonPosition,
-    position,
-    initialIsOpen,
-    errorTypes,
-    styleNonce,
-    shadowDOMTarget,
-    hideDisabledQueries,
-    theme
-  } = props;
-  const [devtools] = useState(
-    () => new TanstackQueryDevtools({
-      client: queryClient,
-      queryFlavor: "Preact Query",
-      version: "5",
-      onlineManager,
-      buttonPosition,
-      position,
-      initialIsOpen,
-      errorTypes,
-      styleNonce,
-      shadowDOMTarget,
-      hideDisabledQueries,
-      theme
-    })
-  );
-  useEffect(() => {
-    devtools.setClient(queryClient);
-  }, [queryClient, devtools]);
-  useEffect(() => {
-    if (buttonPosition) {
-      devtools.setButtonPosition(buttonPosition);
-    }
-  }, [buttonPosition, devtools]);
-  useEffect(() => {
-    if (position) {
-      devtools.setPosition(position);
-    }
-  }, [position, devtools]);
-  useEffect(() => {
-    devtools.setInitialIsOpen(initialIsOpen || false);
-  }, [initialIsOpen, devtools]);
-  useEffect(() => {
-    devtools.setErrorTypes(errorTypes || []);
-  }, [errorTypes, devtools]);
-  useEffect(() => {
-    devtools.setTheme(theme);
-  }, [theme, devtools]);
-  useEffect(() => {
-    if (ref.current) {
-      devtools.mount(ref.current);
-    }
-    return () => {
-      devtools.unmount();
-    };
-  }, [devtools]);
-  return /* @__PURE__ */ jsx("div", { dir: "ltr", className: "tsqd-parent-container", ref });
+	const queryClient = useQueryClient(props.client);
+	const ref = useRef(null);
+	const { buttonPosition, position, initialIsOpen, errorTypes, styleNonce, shadowDOMTarget, hideDisabledQueries, theme } = props;
+	const [devtools] = useState(() => new TanstackQueryDevtools({
+		client: queryClient,
+		queryFlavor: "Preact Query",
+		version: "5",
+		onlineManager,
+		buttonPosition,
+		position,
+		initialIsOpen,
+		errorTypes,
+		styleNonce,
+		shadowDOMTarget,
+		hideDisabledQueries,
+		theme
+	}));
+	useEffect(() => {
+		devtools.setClient(queryClient);
+	}, [queryClient, devtools]);
+	useEffect(() => {
+		if (buttonPosition) devtools.setButtonPosition(buttonPosition);
+	}, [buttonPosition, devtools]);
+	useEffect(() => {
+		if (position) devtools.setPosition(position);
+	}, [position, devtools]);
+	useEffect(() => {
+		devtools.setInitialIsOpen(initialIsOpen || false);
+	}, [initialIsOpen, devtools]);
+	useEffect(() => {
+		devtools.setErrorTypes(errorTypes || []);
+	}, [errorTypes, devtools]);
+	useEffect(() => {
+		devtools.setTheme(theme);
+	}, [theme, devtools]);
+	useEffect(() => {
+		if (ref.current) devtools.mount(ref.current);
+		return () => {
+			devtools.unmount();
+		};
+	}, [devtools]);
+	return /* @__PURE__ */ jsx("div", {
+		dir: "ltr",
+		className: "tsqd-parent-container",
+		ref
+	});
 }
-export {
-  PreactQueryDevtools
-};
+//#endregion
+export { PreactQueryDevtools };
+
 //# sourceMappingURL=PreactQueryDevtools.js.map

package/build/modern/PreactQueryDevtools.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/PreactQueryDevtools.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'preact/hooks'\nimport { onlineManager, useQueryClient } from '@tanstack/preact-query'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsErrorType,\n  DevtoolsPosition,\n  Theme,\n} from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/preact-query'\nimport type { VNode } from 'preact'\n\nexport interface DevtoolsOptions {\n  /**\n   * Set this true if you want the dev tools to default to being open\n   */\n  initialIsOpen?: boolean\n  /**\n   * The position of the TanStack logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'\n   * Defaults to 'bottom-right'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the Preact Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Use this to provide a custom QueryClient. Otherwise, the one from the\n   * nearest QueryClientProvider will be used.\n   */\n  client?: QueryClient\n  /**\n   * Use this to provide custom error type handlers for the devtools panel.\n   */\n  errorTypes?: Array<DevtoolsErrorType>\n  /**\n   * Use this to pass a nonce to the style tag that is added to the document\n   * head. This is useful if you are using a Content Security Policy (CSP)\n   * nonce to allow inline styles.\n   */\n  styleNonce?: string\n  /**\n   * Use this to render the devtools inside a Shadow DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n  /**\n   * Use this to hide disabled queries from the devtools panel.\n   */\n  hideDisabledQueries?: boolean\n  /**\n   * Use this to set the theme of the devtools panel.\n   * Defaults to 'system'.\n   */\n  theme?: Theme\n}\n\nexport function PreactQueryDevtools(props: DevtoolsOptions): VNode | null {\n  const queryClient = useQueryClient(props.client)\n  const ref = useRef<HTMLDivElement>(null)\n  const {\n    buttonPosition,\n    position,\n    initialIsOpen,\n    errorTypes,\n    styleNonce,\n    shadowDOMTarget,\n    hideDisabledQueries,\n    theme,\n  } = props\n  const [devtools] = useState(\n    () =>\n      new TanstackQueryDevtools({\n        client: queryClient,\n        queryFlavor: 'Preact Query',\n        version: '5',\n        onlineManager,\n        buttonPosition,\n        position,\n        initialIsOpen,\n        errorTypes,\n        styleNonce,\n        shadowDOMTarget,\n        hideDisabledQueries,\n        theme,\n      }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(queryClient)\n  }, [queryClient, devtools])\n\n  useEffect(() => {\n    if (buttonPosition) {\n      devtools.setButtonPosition(buttonPosition)\n    }\n  }, [buttonPosition, devtools])\n\n  useEffect(() => {\n    if (position) {\n      devtools.setPosition(position)\n    }\n  }, [position, devtools])\n\n  useEffect(() => {\n    devtools.setInitialIsOpen(initialIsOpen || false)\n  }, [initialIsOpen, devtools])\n\n  useEffect(() => {\n    devtools.setErrorTypes(errorTypes || [])\n  }, [errorTypes, devtools])\n\n  useEffect(() => {\n    devtools.setTheme(theme)\n  }, [theme, devtools])\n\n  useEffect(() => {\n    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div dir=\"ltr\" className=\"tsqd-parent-container\" ref={ref} />\n}\n"],"mappings":";AAAA,SAAS,QAAQ,UAAU,iBAAiB;AAC5C,SAAS,eAAe,sBAAsB;AAC9C,SAAS,6BAA6B;AA6H7B;AApEF,SAAS,oBAAoB,OAAsC;AACxE,QAAM,cAAc,eAAe,MAAM,MAAM;AAC/C,QAAM,MAAM,OAAuB,IAAI;AACvC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,CAAC,QAAQ,IAAI;AAAA,IACjB,MACE,IAAI,sBAAsB;AAAA,MACxB,QAAQ;AAAA,MACR,aAAa;AAAA,MACb,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACL;AAEA,YAAU,MAAM;AACd,aAAS,UAAU,WAAW;AAAA,EAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;AAE1B,YAAU,MAAM;AACd,QAAI,gBAAgB;AAClB,eAAS,kBAAkB,cAAc;AAAA,IAC3C;AAAA,EACF,GAAG,CAAC,gBAAgB,QAAQ,CAAC;AAE7B,YAAU,MAAM;AACd,QAAI,UAAU;AACZ,eAAS,YAAY,QAAQ;AAAA,IAC/B;AAAA,EACF,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,YAAU,MAAM;AACd,aAAS,iBAAiB,iBAAiB,KAAK;AAAA,EAClD,GAAG,CAAC,eAAe,QAAQ,CAAC;AAE5B,YAAU,MAAM;AACd,aAAS,cAAc,cAAc,CAAC,CAAC;AAAA,EACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;AAEzB,YAAU,MAAM;AACd,aAAS,SAAS,KAAK;AAAA,EACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB,YAAU,MAAM;AACd,QAAI,IAAI,SAAS;AACf,eAAS,MAAM,IAAI,OAAO;AAAA,IAC5B;AACA,WAAO,MAAM;AACX,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO,oBAAC,SAAI,KAAI,OAAM,WAAU,yBAAwB,KAAU;AACpE;","names":[]}
+{"version":3,"file":"PreactQueryDevtools.js","names":[],"sources":["../../src/PreactQueryDevtools.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'preact/hooks'\nimport { onlineManager, useQueryClient } from '@tanstack/preact-query'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsErrorType,\n  DevtoolsPosition,\n  Theme,\n} from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/preact-query'\nimport type { VNode } from 'preact'\n\nexport interface DevtoolsOptions {\n  /**\n   * Set this true if you want the dev tools to default to being open\n   */\n  initialIsOpen?: boolean\n  /**\n   * The position of the TanStack logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'\n   * Defaults to 'bottom-right'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the Preact Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Use this to provide a custom QueryClient. Otherwise, the one from the\n   * nearest QueryClientProvider will be used.\n   */\n  client?: QueryClient\n  /**\n   * Use this to provide custom error type handlers for the devtools panel.\n   */\n  errorTypes?: Array<DevtoolsErrorType>\n  /**\n   * Use this to pass a nonce to the style tag that is added to the document\n   * head. This is useful if you are using a Content Security Policy (CSP)\n   * nonce to allow inline styles.\n   */\n  styleNonce?: string\n  /**\n   * Use this to render the devtools inside a Shadow DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n  /**\n   * Use this to hide disabled queries from the devtools panel.\n   */\n  hideDisabledQueries?: boolean\n  /**\n   * Use this to set the theme of the devtools panel.\n   * Defaults to 'system'.\n   */\n  theme?: Theme\n}\n\nexport function PreactQueryDevtools(props: DevtoolsOptions): VNode | null {\n  const queryClient = useQueryClient(props.client)\n  const ref = useRef<HTMLDivElement>(null)\n  const {\n    buttonPosition,\n    position,\n    initialIsOpen,\n    errorTypes,\n    styleNonce,\n    shadowDOMTarget,\n    hideDisabledQueries,\n    theme,\n  } = props\n  const [devtools] = useState(\n    () =>\n      new TanstackQueryDevtools({\n        client: queryClient,\n        queryFlavor: 'Preact Query',\n        version: '5',\n        onlineManager,\n        buttonPosition,\n        position,\n        initialIsOpen,\n        errorTypes,\n        styleNonce,\n        shadowDOMTarget,\n        hideDisabledQueries,\n        theme,\n      }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(queryClient)\n  }, [queryClient, devtools])\n\n  useEffect(() => {\n    if (buttonPosition) {\n      devtools.setButtonPosition(buttonPosition)\n    }\n  }, [buttonPosition, devtools])\n\n  useEffect(() => {\n    if (position) {\n      devtools.setPosition(position)\n    }\n  }, [position, devtools])\n\n  useEffect(() => {\n    devtools.setInitialIsOpen(initialIsOpen || false)\n  }, [initialIsOpen, devtools])\n\n  useEffect(() => {\n    devtools.setErrorTypes(errorTypes || [])\n  }, [errorTypes, devtools])\n\n  useEffect(() => {\n    devtools.setTheme(theme)\n  }, [theme, devtools])\n\n  useEffect(() => {\n    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div dir=\"ltr\" className=\"tsqd-parent-container\" ref={ref} />\n}\n"],"mappings":";;;;;AA2DA,SAAgB,oBAAoB,OAAsC;CACxE,MAAM,cAAc,eAAe,MAAM,MAAM;CAC/C,MAAM,MAAM,OAAuB,IAAI;CACvC,MAAM,EACJ,gBACA,UACA,eACA,YACA,YACA,iBACA,qBACA,UACE;CACJ,MAAM,CAAC,YAAY,eAEf,IAAI,sBAAsB;EACxB,QAAQ;EACR,aAAa;EACb,SAAS;EACT;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC,CACL;CAEA,gBAAgB;EACd,SAAS,UAAU,WAAW;CAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;CAE1B,gBAAgB;EACd,IAAI,gBACF,SAAS,kBAAkB,cAAc;CAE7C,GAAG,CAAC,gBAAgB,QAAQ,CAAC;CAE7B,gBAAgB;EACd,IAAI,UACF,SAAS,YAAY,QAAQ;CAEjC,GAAG,CAAC,UAAU,QAAQ,CAAC;CAEvB,gBAAgB;EACd,SAAS,iBAAiB,iBAAiB,KAAK;CAClD,GAAG,CAAC,eAAe,QAAQ,CAAC;CAE5B,gBAAgB;EACd,SAAS,cAAc,cAAc,CAAC,CAAC;CACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;CAEzB,gBAAgB;EACd,SAAS,SAAS,KAAK;CACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;CAEpB,gBAAgB;EACd,IAAI,IAAI,SACN,SAAS,MAAM,IAAI,OAAO;EAE5B,aAAa;GACX,SAAS,QAAQ;EACnB;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,OAAO,oBAAC,OAAD;EAAK,KAAI;EAAM,WAAU;EAA6B;CAAM,CAAA;AACrE"}

package/build/modern/PreactQueryDevtoolsPanel.cjs

@@ -1,91 +1,56 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-// src/PreactQueryDevtoolsPanel.tsx
-var PreactQueryDevtoolsPanel_exports = {};
-__export(PreactQueryDevtoolsPanel_exports, {
-  PreactQueryDevtoolsPanel: () => PreactQueryDevtoolsPanel
-});
-module.exports = __toCommonJS(PreactQueryDevtoolsPanel_exports);
-var import_hooks = require("preact/hooks");
-var import_preact_query = require("@tanstack/preact-query");
-var import_query_devtools = require("@tanstack/query-devtools");
-var import_jsx_runtime = require("preact/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let preact_hooks = require("preact/hooks");
+let _tanstack_preact_query = require("@tanstack/preact-query");
+let _tanstack_query_devtools = require("@tanstack/query-devtools");
+let preact_jsx_runtime = require("preact/jsx-runtime");
+//#region src/PreactQueryDevtoolsPanel.tsx
 function PreactQueryDevtoolsPanel(props) {
-  const queryClient = (0, import_preact_query.useQueryClient)(props.client);
-  const ref = (0, import_hooks.useRef)(null);
-  const {
-    errorTypes,
-    styleNonce,
-    shadowDOMTarget,
-    hideDisabledQueries,
-    theme
-  } = props;
-  const [devtools] = (0, import_hooks.useState)(
-    () => new import_query_devtools.TanstackQueryDevtoolsPanel({
-      client: queryClient,
-      queryFlavor: "Preact Query",
-      version: "5",
-      onlineManager: import_preact_query.onlineManager,
-      buttonPosition: "bottom-left",
-      position: "bottom",
-      initialIsOpen: true,
-      errorTypes,
-      styleNonce,
-      shadowDOMTarget,
-      onClose: props.onClose,
-      hideDisabledQueries,
-      theme
-    })
-  );
-  (0, import_hooks.useEffect)(() => {
-    devtools.setClient(queryClient);
-  }, [queryClient, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    devtools.setOnClose(props.onClose ?? (() => {
-    }));
-  }, [props.onClose, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    devtools.setErrorTypes(errorTypes || []);
-  }, [errorTypes, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    devtools.setTheme(theme);
-  }, [theme, devtools]);
-  (0, import_hooks.useEffect)(() => {
-    if (ref.current) {
-      devtools.mount(ref.current);
-    }
-    return () => {
-      devtools.unmount();
-    };
-  }, [devtools]);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    "div",
-    {
-      style: { height: "500px", ...props.style },
-      className: "tsqd-parent-container",
-      ref
-    }
-  );
+	const queryClient = (0, _tanstack_preact_query.useQueryClient)(props.client);
+	const ref = (0, preact_hooks.useRef)(null);
+	const { errorTypes, styleNonce, shadowDOMTarget, hideDisabledQueries, theme } = props;
+	const [devtools] = (0, preact_hooks.useState)(() => new _tanstack_query_devtools.TanstackQueryDevtoolsPanel({
+		client: queryClient,
+		queryFlavor: "Preact Query",
+		version: "5",
+		onlineManager: _tanstack_preact_query.onlineManager,
+		buttonPosition: "bottom-left",
+		position: "bottom",
+		initialIsOpen: true,
+		errorTypes,
+		styleNonce,
+		shadowDOMTarget,
+		onClose: props.onClose,
+		hideDisabledQueries,
+		theme
+	}));
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setClient(queryClient);
+	}, [queryClient, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setOnClose(props.onClose ?? (() => {}));
+	}, [props.onClose, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setErrorTypes(errorTypes || []);
+	}, [errorTypes, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		devtools.setTheme(theme);
+	}, [theme, devtools]);
+	(0, preact_hooks.useEffect)(() => {
+		if (ref.current) devtools.mount(ref.current);
+		return () => {
+			devtools.unmount();
+		};
+	}, [devtools]);
+	return /* @__PURE__ */ (0, preact_jsx_runtime.jsx)("div", {
+		style: {
+			height: "500px",
+			...props.style
+		},
+		className: "tsqd-parent-container",
+		ref
+	});
 }
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  PreactQueryDevtoolsPanel
-});
+//#endregion
+exports.PreactQueryDevtoolsPanel = PreactQueryDevtoolsPanel;
+
 //# sourceMappingURL=PreactQueryDevtoolsPanel.cjs.map

package/build/modern/PreactQueryDevtoolsPanel.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/PreactQueryDevtoolsPanel.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'preact/hooks'\nimport { onlineManager, useQueryClient } from '@tanstack/preact-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/preact-query'\nimport type { CSSProperties, VNode } from 'preact'\n\nexport interface DevtoolsPanelOptions {\n  /**\n   * Use this to provide a custom QueryClient. Otherwise, the one from the\n   * nearest QueryClientProvider will be used.\n   */\n  client?: QueryClient\n  /**\n   * Custom error types to be shown in the devtools.\n   */\n  errorTypes?: Array<DevtoolsErrorType>\n  /**\n   * Use this to pass a nonce to the style tag that is added to the document\n   * head. This is useful if you are using a Content Security Policy (CSP)\n   * nonce to allow inline styles.\n   */\n  styleNonce?: string\n  /**\n   * Use this to render the devtools inside a Shadow DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n  /**\n   * Custom styles for the devtools panel container.\n   */\n  style?: CSSProperties\n  /**\n   * Callback function when the devtools panel is closed.\n   */\n  onClose?: () => unknown\n  /**\n   * Use this to hide disabled queries from the devtools panel.\n   */\n  hideDisabledQueries?: boolean\n  /**\n   * Use this to set the theme of the devtools panel.\n   * Defaults to 'system'.\n   */\n  theme?: Theme\n}\n\nexport function PreactQueryDevtoolsPanel(\n  props: DevtoolsPanelOptions,\n): VNode | null {\n  const queryClient = useQueryClient(props.client)\n  const ref = useRef<HTMLDivElement>(null)\n  const {\n    errorTypes,\n    styleNonce,\n    shadowDOMTarget,\n    hideDisabledQueries,\n    theme,\n  } = props\n  const [devtools] = useState(\n    () =>\n      new TanstackQueryDevtoolsPanel({\n        client: queryClient,\n        queryFlavor: 'Preact Query',\n        version: '5',\n        onlineManager,\n        buttonPosition: 'bottom-left',\n        position: 'bottom',\n        initialIsOpen: true,\n        errorTypes,\n        styleNonce,\n        shadowDOMTarget,\n        onClose: props.onClose,\n        hideDisabledQueries,\n        theme,\n      }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(queryClient)\n  }, [queryClient, devtools])\n\n  useEffect(() => {\n    devtools.setOnClose(props.onClose ?? (() => {}))\n  }, [props.onClose, devtools])\n\n  useEffect(() => {\n    devtools.setErrorTypes(errorTypes || [])\n  }, [errorTypes, devtools])\n\n  useEffect(() => {\n    devtools.setTheme(theme)\n  }, [theme, devtools])\n\n  useEffect(() => {\n    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return (\n    <div\n      style={{ height: '500px', ...props.style }}\n      className=\"tsqd-parent-container\"\n      ref={ref}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA4C;AAC5C,0BAA8C;AAC9C,4BAA2C;AAqGvC;AAzDG,SAAS,yBACd,OACc;AACd,QAAM,kBAAc,oCAAe,MAAM,MAAM;AAC/C,QAAM,UAAM,qBAAuB,IAAI;AACvC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,CAAC,QAAQ,QAAI;AAAA,IACjB,MACE,IAAI,iDAA2B;AAAA,MAC7B,QAAQ;AAAA,MACR,aAAa;AAAA,MACb,SAAS;AAAA,MACT;AAAA,MACA,gBAAgB;AAAA,MAChB,UAAU;AAAA,MACV,eAAe;AAAA,MACf;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,MAAM;AAAA,MACf;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACL;AAEA,8BAAU,MAAM;AACd,aAAS,UAAU,WAAW;AAAA,EAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;AAE1B,8BAAU,MAAM;AACd,aAAS,WAAW,MAAM,YAAY,MAAM;AAAA,IAAC,EAAE;AAAA,EACjD,GAAG,CAAC,MAAM,SAAS,QAAQ,CAAC;AAE5B,8BAAU,MAAM;AACd,aAAS,cAAc,cAAc,CAAC,CAAC;AAAA,EACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;AAEzB,8BAAU,MAAM;AACd,aAAS,SAAS,KAAK;AAAA,EACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB,8BAAU,MAAM;AACd,QAAI,IAAI,SAAS;AACf,eAAS,MAAM,IAAI,OAAO;AAAA,IAC5B;AACA,WAAO,MAAM;AACX,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,EAAE,QAAQ,SAAS,GAAG,MAAM,MAAM;AAAA,MACzC,WAAU;AAAA,MACV;AAAA;AAAA,EACF;AAEJ;","names":[]}
+{"version":3,"file":"PreactQueryDevtoolsPanel.cjs","names":["useQueryClient","useRef","useState","TanstackQueryDevtoolsPanel"],"sources":["../../src/PreactQueryDevtoolsPanel.tsx"],"sourcesContent":["import { useRef, useState, useEffect } from 'preact/hooks'\nimport { onlineManager, useQueryClient } from '@tanstack/preact-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/preact-query'\nimport type { CSSProperties, VNode } from 'preact'\n\nexport interface DevtoolsPanelOptions {\n  /**\n   * Use this to provide a custom QueryClient. Otherwise, the one from the\n   * nearest QueryClientProvider will be used.\n   */\n  client?: QueryClient\n  /**\n   * Custom error types to be shown in the devtools.\n   */\n  errorTypes?: Array<DevtoolsErrorType>\n  /**\n   * Use this to pass a nonce to the style tag that is added to the document\n   * head. This is useful if you are using a Content Security Policy (CSP)\n   * nonce to allow inline styles.\n   */\n  styleNonce?: string\n  /**\n   * Use this to render the devtools inside a Shadow DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n  /**\n   * Custom styles for the devtools panel container.\n   */\n  style?: CSSProperties\n  /**\n   * Callback function when the devtools panel is closed.\n   */\n  onClose?: () => unknown\n  /**\n   * Use this to hide disabled queries from the devtools panel.\n   */\n  hideDisabledQueries?: boolean\n  /**\n   * Use this to set the theme of the devtools panel.\n   * Defaults to 'system'.\n   */\n  theme?: Theme\n}\n\nexport function PreactQueryDevtoolsPanel(\n  props: DevtoolsPanelOptions,\n): VNode | null {\n  const queryClient = useQueryClient(props.client)\n  const ref = useRef<HTMLDivElement>(null)\n  const {\n    errorTypes,\n    styleNonce,\n    shadowDOMTarget,\n    hideDisabledQueries,\n    theme,\n  } = props\n  const [devtools] = useState(\n    () =>\n      new TanstackQueryDevtoolsPanel({\n        client: queryClient,\n        queryFlavor: 'Preact Query',\n        version: '5',\n        onlineManager,\n        buttonPosition: 'bottom-left',\n        position: 'bottom',\n        initialIsOpen: true,\n        errorTypes,\n        styleNonce,\n        shadowDOMTarget,\n        onClose: props.onClose,\n        hideDisabledQueries,\n        theme,\n      }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(queryClient)\n  }, [queryClient, devtools])\n\n  useEffect(() => {\n    devtools.setOnClose(props.onClose ?? (() => {}))\n  }, [props.onClose, devtools])\n\n  useEffect(() => {\n    devtools.setErrorTypes(errorTypes || [])\n  }, [errorTypes, devtools])\n\n  useEffect(() => {\n    devtools.setTheme(theme)\n  }, [theme, devtools])\n\n  useEffect(() => {\n    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return (\n    <div\n      style={{ height: '500px', ...props.style }}\n      className=\"tsqd-parent-container\"\n      ref={ref}\n    />\n  )\n}\n"],"mappings":";;;;;;AA8CA,SAAgB,yBACd,OACc;CACd,MAAM,eAAA,GAAcA,uBAAAA,eAAAA,CAAe,MAAM,MAAM;CAC/C,MAAM,OAAA,GAAMC,aAAAA,OAAAA,CAAuB,IAAI;CACvC,MAAM,EACJ,YACA,YACA,iBACA,qBACA,UACE;CACJ,MAAM,CAAC,aAAA,GAAYC,aAAAA,SAAAA,OAEf,IAAIC,yBAAAA,2BAA2B;EAC7B,QAAQ;EACR,aAAa;EACb,SAAS;EACT,eAAA,uBAAA;EACA,gBAAgB;EAChB,UAAU;EACV,eAAe;EACf;EACA;EACA;EACA,SAAS,MAAM;EACf;EACA;CACF,CAAC,CACL;CAEA,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,UAAU,WAAW;CAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;CAE1B,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,WAAW,MAAM,kBAAkB,CAAC,EAAE;CACjD,GAAG,CAAC,MAAM,SAAS,QAAQ,CAAC;CAE5B,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,cAAc,cAAc,CAAC,CAAC;CACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;CAEzB,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,SAAS,SAAS,KAAK;CACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;CAEpB,CAAA,GAAA,aAAA,UAAA,OAAgB;EACd,IAAI,IAAI,SACN,SAAS,MAAM,IAAI,OAAO;EAE5B,aAAa;GACX,SAAS,QAAQ;EACnB;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,iBAAA,GAAA,mBAAA,IAAA,CAAC,OAAD;EACE,OAAO;GAAE,QAAQ;GAAS,GAAG,MAAM;EAAM;EACzC,WAAU;EACL;CACN,CAAA;AAEL"}