@tanstack/react-query-devtools 5.0.0-alpha.50 → 5.0.0-alpha.51

package/build/lib/{devtools.mjs → devtools.cjs}

@@ -1,48 +1,50 @@
 'use client';
-import React, { useRef, useState, useEffect } from 'react';
-import { useQueryClient, onlineManager } from '@tanstack/react-query';
-import { TanstackQueryDevtools } from '@tanstack/query-devtools';
+'use strict';
+
+var React = require('react');
+var reactQuery = require('@tanstack/react-query');
+var queryDevtools = require('@tanstack/query-devtools');
 
 function ReactQueryDevtools(props) {
-  const queryClient = useQueryClient();
+  const queryClient = reactQuery.useQueryClient();
   const client = props.client || queryClient;
-  const ref = useRef(null);
+  const ref = React.useRef(null);
   const {
     buttonPosition,
     position,
     initialIsOpen,
     errorTypes
   } = props;
-  const [devtools] = useState(new TanstackQueryDevtools({
+  const [devtools] = React.useState(new queryDevtools.TanstackQueryDevtools({
     client: client,
     queryFlavor: 'React Query',
     version: '5',
-    onlineManager,
+    onlineManager: reactQuery.onlineManager,
     buttonPosition,
     position,
     initialIsOpen,
     errorTypes
   }));
-  useEffect(() => {
+  React.useEffect(() => {
     devtools.setClient(client);
   }, [client, devtools]);
-  useEffect(() => {
+  React.useEffect(() => {
     if (buttonPosition) {
       devtools.setButtonPosition(buttonPosition);
     }
   }, [buttonPosition, devtools]);
-  useEffect(() => {
+  React.useEffect(() => {
     if (position) {
       devtools.setPosition(position);
     }
   }, [position, devtools]);
-  useEffect(() => {
+  React.useEffect(() => {
     devtools.setInitialIsOpen(initialIsOpen || false);
   }, [initialIsOpen, devtools]);
-  useEffect(() => {
+  React.useEffect(() => {
     devtools.setErrorTypes(errorTypes || []);
   }, [errorTypes, devtools]);
-  useEffect(() => {
+  React.useEffect(() => {
     if (ref.current) {
       devtools.mount(ref.current);
     }
@@ -55,5 +57,5 @@ function ReactQueryDevtools(props) {
   });
 }
 
-export { ReactQueryDevtools };
-//# sourceMappingURL=devtools.mjs.map
+exports.ReactQueryDevtools = ReactQueryDevtools;
+//# sourceMappingURL=devtools.cjs.map

package/build/lib/{devtools.mjs.map → devtools.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"devtools.mjs","sources":["../../src/devtools.tsx"],"sourcesContent":["'use client'\nimport { useRef, useState, useEffect } from 'react'\nimport type { QueryClient } from '@tanstack/react-query'\nimport { useQueryClient, onlineManager } from '@tanstack/react-query'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsPosition,\n  DevToolsErrorType,\n} from '@tanstack/query-devtools'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport React from 'react'\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 React Query logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n   * Defaults to 'bottom-left'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the React Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Custom instance of QueryClient\n   */\n  client?: QueryClient\n  /**\n   * Use this so you can define custom errors that can be shown in the devtools.\n   */\n  errorTypes?: DevToolsErrorType[]\n}\n\nexport function ReactQueryDevtools(\n  props: DevtoolsOptions,\n): React.ReactElement | null {\n  const queryClient = useQueryClient()\n  const client = props.client || queryClient\n  const ref = useRef<HTMLDivElement>(null)\n  const { buttonPosition, position, initialIsOpen, errorTypes } = props\n  const [devtools] = useState(\n    new TanstackQueryDevtools({\n      client: client,\n      queryFlavor: 'React Query',\n      version: '5',\n      onlineManager,\n      buttonPosition,\n      position,\n      initialIsOpen,\n      errorTypes,\n    }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(client)\n  }, [client, 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    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div ref={ref}></div>\n}\n"],"names":["errorTypes","client","queryFlavor","version","useEffect","devtools","ref"],"mappings":";;;;;AAuCO;AAGL;AACA;AACA;;;;;AACiDA;AAAW;;AAGxDC;AACAC;AACAC;;;;;AAKAH;AACF;AAGFI;AACEC;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACEC;AACF;AAEAD;AACEC;AACF;AAEAD;;AAEIC;AACF;AAEA;;;AAGF;;AAEYC;AAAS;AACvB;;"}
+{"version":3,"file":"devtools.cjs","sources":["../../src/devtools.tsx"],"sourcesContent":["'use client'\nimport { useRef, useState, useEffect } from 'react'\nimport type { QueryClient } from '@tanstack/react-query'\nimport { useQueryClient, onlineManager } from '@tanstack/react-query'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsPosition,\n  DevToolsErrorType,\n} from '@tanstack/query-devtools'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport React from 'react'\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 React Query logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n   * Defaults to 'bottom-left'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the React Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Custom instance of QueryClient\n   */\n  client?: QueryClient\n  /**\n   * Use this so you can define custom errors that can be shown in the devtools.\n   */\n  errorTypes?: DevToolsErrorType[]\n}\n\nexport function ReactQueryDevtools(\n  props: DevtoolsOptions,\n): React.ReactElement | null {\n  const queryClient = useQueryClient()\n  const client = props.client || queryClient\n  const ref = useRef<HTMLDivElement>(null)\n  const { buttonPosition, position, initialIsOpen, errorTypes } = props\n  const [devtools] = useState(\n    new TanstackQueryDevtools({\n      client: client,\n      queryFlavor: 'React Query',\n      version: '5',\n      onlineManager,\n      buttonPosition,\n      position,\n      initialIsOpen,\n      errorTypes,\n    }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(client)\n  }, [client, 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    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div ref={ref}></div>\n}\n"],"names":["errorTypes","client","queryFlavor","version","useEffect","devtools","ref"],"mappings":";;;;;;;AAuCO;AAGL;AACA;AACA;;;;;AACiDA;AAAW;;AAGxDC;AACAC;AACAC;;;;;AAKAH;AACF;AAGFI;AACEC;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACEC;AACF;AAEAD;AACEC;AACF;AAEAD;;AAEIC;AACF;AAEA;;;AAGF;;AAEYC;AAAS;AACvB;;"}

package/build/lib/devtools.js

@@ -1,50 +1,48 @@
 'use client';
-'use strict';
-
-var React = require('react');
-var reactQuery = require('@tanstack/react-query');
-var queryDevtools = require('@tanstack/query-devtools');
+import React, { useRef, useState, useEffect } from 'react';
+import { useQueryClient, onlineManager } from '@tanstack/react-query';
+import { TanstackQueryDevtools } from '@tanstack/query-devtools';
 
 function ReactQueryDevtools(props) {
-  const queryClient = reactQuery.useQueryClient();
+  const queryClient = useQueryClient();
   const client = props.client || queryClient;
-  const ref = React.useRef(null);
+  const ref = useRef(null);
   const {
     buttonPosition,
     position,
     initialIsOpen,
     errorTypes
   } = props;
-  const [devtools] = React.useState(new queryDevtools.TanstackQueryDevtools({
+  const [devtools] = useState(new TanstackQueryDevtools({
     client: client,
     queryFlavor: 'React Query',
     version: '5',
-    onlineManager: reactQuery.onlineManager,
+    onlineManager,
     buttonPosition,
     position,
     initialIsOpen,
     errorTypes
   }));
-  React.useEffect(() => {
+  useEffect(() => {
     devtools.setClient(client);
   }, [client, devtools]);
-  React.useEffect(() => {
+  useEffect(() => {
     if (buttonPosition) {
       devtools.setButtonPosition(buttonPosition);
     }
   }, [buttonPosition, devtools]);
-  React.useEffect(() => {
+  useEffect(() => {
     if (position) {
       devtools.setPosition(position);
     }
   }, [position, devtools]);
-  React.useEffect(() => {
+  useEffect(() => {
     devtools.setInitialIsOpen(initialIsOpen || false);
   }, [initialIsOpen, devtools]);
-  React.useEffect(() => {
+  useEffect(() => {
     devtools.setErrorTypes(errorTypes || []);
   }, [errorTypes, devtools]);
-  React.useEffect(() => {
+  useEffect(() => {
     if (ref.current) {
       devtools.mount(ref.current);
     }
@@ -57,5 +55,5 @@ function ReactQueryDevtools(props) {
   });
 }
 
-exports.ReactQueryDevtools = ReactQueryDevtools;
+export { ReactQueryDevtools };
 //# sourceMappingURL=devtools.js.map

package/build/lib/devtools.js.map

@@ -1 +1 @@
-{"version":3,"file":"devtools.js","sources":["../../src/devtools.tsx"],"sourcesContent":["'use client'\nimport { useRef, useState, useEffect } from 'react'\nimport type { QueryClient } from '@tanstack/react-query'\nimport { useQueryClient, onlineManager } from '@tanstack/react-query'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsPosition,\n  DevToolsErrorType,\n} from '@tanstack/query-devtools'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport React from 'react'\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 React Query logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n   * Defaults to 'bottom-left'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the React Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Custom instance of QueryClient\n   */\n  client?: QueryClient\n  /**\n   * Use this so you can define custom errors that can be shown in the devtools.\n   */\n  errorTypes?: DevToolsErrorType[]\n}\n\nexport function ReactQueryDevtools(\n  props: DevtoolsOptions,\n): React.ReactElement | null {\n  const queryClient = useQueryClient()\n  const client = props.client || queryClient\n  const ref = useRef<HTMLDivElement>(null)\n  const { buttonPosition, position, initialIsOpen, errorTypes } = props\n  const [devtools] = useState(\n    new TanstackQueryDevtools({\n      client: client,\n      queryFlavor: 'React Query',\n      version: '5',\n      onlineManager,\n      buttonPosition,\n      position,\n      initialIsOpen,\n      errorTypes,\n    }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(client)\n  }, [client, 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    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div ref={ref}></div>\n}\n"],"names":["errorTypes","client","queryFlavor","version","useEffect","devtools","ref"],"mappings":";;;;;;;AAuCO;AAGL;AACA;AACA;;;;;AACiDA;AAAW;;AAGxDC;AACAC;AACAC;;;;;AAKAH;AACF;AAGFI;AACEC;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACEC;AACF;AAEAD;AACEC;AACF;AAEAD;;AAEIC;AACF;AAEA;;;AAGF;;AAEYC;AAAS;AACvB;;"}
+{"version":3,"file":"devtools.js","sources":["../../src/devtools.tsx"],"sourcesContent":["'use client'\nimport { useRef, useState, useEffect } from 'react'\nimport type { QueryClient } from '@tanstack/react-query'\nimport { useQueryClient, onlineManager } from '@tanstack/react-query'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsPosition,\n  DevToolsErrorType,\n} from '@tanstack/query-devtools'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport React from 'react'\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 React Query logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n   * Defaults to 'bottom-left'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the React Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Custom instance of QueryClient\n   */\n  client?: QueryClient\n  /**\n   * Use this so you can define custom errors that can be shown in the devtools.\n   */\n  errorTypes?: DevToolsErrorType[]\n}\n\nexport function ReactQueryDevtools(\n  props: DevtoolsOptions,\n): React.ReactElement | null {\n  const queryClient = useQueryClient()\n  const client = props.client || queryClient\n  const ref = useRef<HTMLDivElement>(null)\n  const { buttonPosition, position, initialIsOpen, errorTypes } = props\n  const [devtools] = useState(\n    new TanstackQueryDevtools({\n      client: client,\n      queryFlavor: 'React Query',\n      version: '5',\n      onlineManager,\n      buttonPosition,\n      position,\n      initialIsOpen,\n      errorTypes,\n    }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(client)\n  }, [client, 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    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div ref={ref}></div>\n}\n"],"names":["errorTypes","client","queryFlavor","version","useEffect","devtools","ref"],"mappings":";;;;;AAuCO;AAGL;AACA;AACA;;;;;AACiDA;AAAW;;AAGxDC;AACAC;AACAC;;;;;AAKAH;AACF;AAGFI;AACEC;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACE;AACEC;AACF;AACF;AAEAD;AACEC;AACF;AAEAD;AACEC;AACF;AAEAD;;AAEIC;AACF;AAEA;;;AAGF;;AAEYC;AAAS;AACvB;;"}

package/build/lib/{index.mjs → index.cjs}

@@ -1,9 +1,11 @@
 'use client';
-import { ReactQueryDevtools as ReactQueryDevtools$1 } from './devtools.mjs';
+'use strict';
+
+var devtools = require('./devtools.cjs');
 
 const ReactQueryDevtools = process.env.NODE_ENV !== 'development' ? function () {
   return null;
-} : ReactQueryDevtools$1;
+} : devtools.ReactQueryDevtools;
 
 // export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =
 //   process.env.NODE_ENV !== 'development'
@@ -12,5 +14,5 @@ const ReactQueryDevtools = process.env.NODE_ENV !== 'development' ? function ()
 //       } as any)
 //     : devtools.ReactQueryDevtoolsPanel
 
-export { ReactQueryDevtools };
-//# sourceMappingURL=index.mjs.map
+exports.ReactQueryDevtools = ReactQueryDevtools;
+//# sourceMappingURL=index.cjs.map

package/build/lib/{index.mjs.map → index.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../src/index.ts"],"sourcesContent":["'use client'\n\nimport * as devtools from './devtools'\n\nexport const ReactQueryDevtools: (typeof devtools)['ReactQueryDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : devtools.ReactQueryDevtools\n\n// export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =\n//   process.env.NODE_ENV !== 'development'\n//     ? (function () {\n//         return null\n//       } as any)\n//     : devtools.ReactQueryDevtoolsPanel\n"],"names":[],"mappings":";;;AAIO;AAGC;AACF;;AAGN;AACA;AACA;AACA;AACA;AACA;;"}
+{"version":3,"file":"index.cjs","sources":["../../src/index.ts"],"sourcesContent":["'use client'\n\nimport * as devtools from './devtools'\n\nexport const ReactQueryDevtools: (typeof devtools)['ReactQueryDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : devtools.ReactQueryDevtools\n\n// export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =\n//   process.env.NODE_ENV !== 'development'\n//     ? (function () {\n//         return null\n//       } as any)\n//     : devtools.ReactQueryDevtoolsPanel\n"],"names":[],"mappings":";;;;;AAIO;AAGC;AACF;;AAGN;AACA;AACA;AACA;AACA;AACA;;"}

package/build/lib/index.js

@@ -1,11 +1,9 @@
 'use client';
-'use strict';
-
-var devtools = require('./devtools.js');
+import { ReactQueryDevtools as ReactQueryDevtools$1 } from './devtools.js';
 
 const ReactQueryDevtools = process.env.NODE_ENV !== 'development' ? function () {
   return null;
-} : devtools.ReactQueryDevtools;
+} : ReactQueryDevtools$1;
 
 // export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =
 //   process.env.NODE_ENV !== 'development'
@@ -14,5 +12,5 @@ const ReactQueryDevtools = process.env.NODE_ENV !== 'development' ? function ()
 //       } as any)
 //     : devtools.ReactQueryDevtoolsPanel
 
-exports.ReactQueryDevtools = ReactQueryDevtools;
+export { ReactQueryDevtools };
 //# sourceMappingURL=index.js.map

package/build/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/index.ts"],"sourcesContent":["'use client'\n\nimport * as devtools from './devtools'\n\nexport const ReactQueryDevtools: (typeof devtools)['ReactQueryDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : devtools.ReactQueryDevtools\n\n// export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =\n//   process.env.NODE_ENV !== 'development'\n//     ? (function () {\n//         return null\n//       } as any)\n//     : devtools.ReactQueryDevtoolsPanel\n"],"names":[],"mappings":";;;;;AAIO;AAGC;AACF;;AAGN;AACA;AACA;AACA;AACA;AACA;;"}
+{"version":3,"file":"index.js","sources":["../../src/index.ts"],"sourcesContent":["'use client'\n\nimport * as devtools from './devtools'\n\nexport const ReactQueryDevtools: (typeof devtools)['ReactQueryDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : devtools.ReactQueryDevtools\n\n// export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =\n//   process.env.NODE_ENV !== 'development'\n//     ? (function () {\n//         return null\n//       } as any)\n//     : devtools.ReactQueryDevtoolsPanel\n"],"names":[],"mappings":";;;AAIO;AAGC;AACF;;AAGN;AACA;AACA;AACA;AACA;AACA;;"}

package/build/lib/index.prod.cjs

@@ -0,0 +1,69 @@
+'use strict';
+
+var React = require('react');
+var reactQuery = require('@tanstack/react-query');
+var queryDevtools = require('@tanstack/query-devtools');
+
+function ReactQueryDevtools$1(props) {
+  const queryClient = reactQuery.useQueryClient();
+  const client = props.client || queryClient;
+  const ref = React.useRef(null);
+  const {
+    buttonPosition,
+    position,
+    initialIsOpen,
+    errorTypes
+  } = props;
+  const [devtools] = React.useState(new queryDevtools.TanstackQueryDevtools({
+    client: client,
+    queryFlavor: 'React Query',
+    version: '5',
+    onlineManager: reactQuery.onlineManager,
+    buttonPosition,
+    position,
+    initialIsOpen,
+    errorTypes
+  }));
+  React.useEffect(() => {
+    devtools.setClient(client);
+  }, [client, devtools]);
+  React.useEffect(() => {
+    if (buttonPosition) {
+      devtools.setButtonPosition(buttonPosition);
+    }
+  }, [buttonPosition, devtools]);
+  React.useEffect(() => {
+    if (position) {
+      devtools.setPosition(position);
+    }
+  }, [position, devtools]);
+  React.useEffect(() => {
+    devtools.setInitialIsOpen(initialIsOpen || false);
+  }, [initialIsOpen, devtools]);
+  React.useEffect(() => {
+    devtools.setErrorTypes(errorTypes || []);
+  }, [errorTypes, devtools]);
+  React.useEffect(() => {
+    if (ref.current) {
+      devtools.mount(ref.current);
+    }
+    return () => {
+      devtools.unmount();
+    };
+  }, [devtools]);
+  return /*#__PURE__*/React.createElement("div", {
+    ref: ref
+  });
+}
+
+const ReactQueryDevtools = ReactQueryDevtools$1;
+
+// export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =
+//   "development" !== 'development'
+//     ? (function () {
+//         return null
+//       } as any)
+//     : devtools.ReactQueryDevtoolsPanel
+
+exports.ReactQueryDevtools = ReactQueryDevtools;
+//# sourceMappingURL=index.prod.cjs.map

package/build/lib/index.prod.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.prod.cjs","sources":["../../src/devtools.tsx","../../src/index.ts"],"sourcesContent":["'use client'\nimport { useRef, useState, useEffect } from 'react'\nimport type { QueryClient } from '@tanstack/react-query'\nimport { useQueryClient, onlineManager } from '@tanstack/react-query'\nimport type {\n  DevtoolsButtonPosition,\n  DevtoolsPosition,\n  DevToolsErrorType,\n} from '@tanstack/query-devtools'\nimport { TanstackQueryDevtools } from '@tanstack/query-devtools'\nimport React from 'react'\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 React Query logo to open and close the devtools panel.\n   * 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n   * Defaults to 'bottom-left'.\n   */\n  buttonPosition?: DevtoolsButtonPosition\n  /**\n   * The position of the React Query devtools panel.\n   * 'top' | 'bottom' | 'left' | 'right'\n   * Defaults to 'bottom'.\n   */\n  position?: DevtoolsPosition\n  /**\n   * Custom instance of QueryClient\n   */\n  client?: QueryClient\n  /**\n   * Use this so you can define custom errors that can be shown in the devtools.\n   */\n  errorTypes?: DevToolsErrorType[]\n}\n\nexport function ReactQueryDevtools(\n  props: DevtoolsOptions,\n): React.ReactElement | null {\n  const queryClient = useQueryClient()\n  const client = props.client || queryClient\n  const ref = useRef<HTMLDivElement>(null)\n  const { buttonPosition, position, initialIsOpen, errorTypes } = props\n  const [devtools] = useState(\n    new TanstackQueryDevtools({\n      client: client,\n      queryFlavor: 'React Query',\n      version: '5',\n      onlineManager,\n      buttonPosition,\n      position,\n      initialIsOpen,\n      errorTypes,\n    }),\n  )\n\n  useEffect(() => {\n    devtools.setClient(client)\n  }, [client, 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    if (ref.current) {\n      devtools.mount(ref.current)\n    }\n\n    return () => {\n      devtools.unmount()\n    }\n  }, [devtools])\n\n  return <div ref={ref}></div>\n}\n","'use client'\n\nimport * as devtools from './devtools'\n\nexport const ReactQueryDevtools: (typeof devtools)['ReactQueryDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : devtools.ReactQueryDevtools\n\n// export const ReactQueryDevtoolsPanel: (typeof devtools)['ReactQueryDevtoolsPanel'] =\n//   process.env.NODE_ENV !== 'development'\n//     ? (function () {\n//         return null\n//       } as any)\n//     : devtools.ReactQueryDevtoolsPanel\n"],"names":["ReactQueryDevtools","props","queryClient","useQueryClient","client","ref","useRef","buttonPosition","position","initialIsOpen","errorTypes","devtools","useState","TanstackQueryDevtools","queryFlavor","version","onlineManager","useEffect","setClient","setButtonPosition","setPosition","setInitialIsOpen","setErrorTypes","current","mount","unmount","React","createElement"],"mappings":";;;;;;AAuCO,SAASA,oBAAkBA,CAChCC,KAAsB,EACK;AAC3B,EAAA,MAAMC,WAAW,GAAGC,yBAAc,EAAE,CAAA;AACpC,EAAA,MAAMC,MAAM,GAAGH,KAAK,CAACG,MAAM,IAAIF,WAAW,CAAA;AAC1C,EAAA,MAAMG,GAAG,GAAGC,YAAM,CAAiB,IAAI,CAAC,CAAA;EACxC,MAAM;IAAEC,cAAc;IAAEC,QAAQ;IAAEC,aAAa;AAAEC,IAAAA,UAAAA;AAAW,GAAC,GAAGT,KAAK,CAAA;EACrE,MAAM,CAACU,QAAQ,CAAC,GAAGC,cAAQ,CACzB,IAAIC,mCAAqB,CAAC;AACxBT,IAAAA,MAAM,EAAEA,MAAM;AACdU,IAAAA,WAAW,EAAE,aAAa;AAC1BC,IAAAA,OAAO,EAAE,GAAG;mBACZC,wBAAa;IACbT,cAAc;IACdC,QAAQ;IACRC,aAAa;AACbC,IAAAA,UAAAA;AACF,GAAC,CACH,CAAC,CAAA;AAEDO,EAAAA,eAAS,CAAC,MAAM;AACdN,IAAAA,QAAQ,CAACO,SAAS,CAACd,MAAM,CAAC,CAAA;AAC5B,GAAC,EAAE,CAACA,MAAM,EAAEO,QAAQ,CAAC,CAAC,CAAA;AAEtBM,EAAAA,eAAS,CAAC,MAAM;AACd,IAAA,IAAIV,cAAc,EAAE;AAClBI,MAAAA,QAAQ,CAACQ,iBAAiB,CAACZ,cAAc,CAAC,CAAA;AAC5C,KAAA;AACF,GAAC,EAAE,CAACA,cAAc,EAAEI,QAAQ,CAAC,CAAC,CAAA;AAE9BM,EAAAA,eAAS,CAAC,MAAM;AACd,IAAA,IAAIT,QAAQ,EAAE;AACZG,MAAAA,QAAQ,CAACS,WAAW,CAACZ,QAAQ,CAAC,CAAA;AAChC,KAAA;AACF,GAAC,EAAE,CAACA,QAAQ,EAAEG,QAAQ,CAAC,CAAC,CAAA;AAExBM,EAAAA,eAAS,CAAC,MAAM;AACdN,IAAAA,QAAQ,CAACU,gBAAgB,CAACZ,aAAa,IAAI,KAAK,CAAC,CAAA;AACnD,GAAC,EAAE,CAACA,aAAa,EAAEE,QAAQ,CAAC,CAAC,CAAA;AAE7BM,EAAAA,eAAS,CAAC,MAAM;AACdN,IAAAA,QAAQ,CAACW,aAAa,CAACZ,UAAU,IAAI,EAAE,CAAC,CAAA;AAC1C,GAAC,EAAE,CAACA,UAAU,EAAEC,QAAQ,CAAC,CAAC,CAAA;AAE1BM,EAAAA,eAAS,CAAC,MAAM;IACd,IAAIZ,GAAG,CAACkB,OAAO,EAAE;AACfZ,MAAAA,QAAQ,CAACa,KAAK,CAACnB,GAAG,CAACkB,OAAO,CAAC,CAAA;AAC7B,KAAA;AAEA,IAAA,OAAO,MAAM;MACXZ,QAAQ,CAACc,OAAO,EAAE,CAAA;KACnB,CAAA;AACH,GAAC,EAAE,CAACd,QAAQ,CAAC,CAAC,CAAA;EAEd,oBAAOe,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKtB,IAAAA,GAAG,EAAEA,GAAAA;AAAI,GAAM,CAAC,CAAA;AAC9B;;AC1FO,MAAML,kBAA2D,GAKlEW,qBAA2B;;AAEjC;AACA;AACA;AACA;AACA;AACA;;;;"}