@tanstack/react-query-devtools 5.105.3 → 5.106.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/legacy/{ReactQueryDevtoolsPanel-DKrB7Z0x.d.cts → ReactQueryDevtoolsPanel-CNrIoVcr.d.cts} +2 -2
- package/build/{modern/ReactQueryDevtoolsPanel-DKrB7Z0x.d.cts.map → legacy/ReactQueryDevtoolsPanel-CNrIoVcr.d.cts.map} +1 -1
- package/build/legacy/{ReactQueryDevtoolsPanel-C2_VXpks.d.ts → ReactQueryDevtoolsPanel-ChIBbCUS.d.ts} +2 -2
- package/build/{modern/ReactQueryDevtoolsPanel-C2_VXpks.d.ts.map → legacy/ReactQueryDevtoolsPanel-ChIBbCUS.d.ts.map} +1 -1
- package/build/legacy/ReactQueryDevtoolsPanel.cjs +3 -1
- package/build/legacy/ReactQueryDevtoolsPanel.cjs.map +1 -1
- package/build/legacy/ReactQueryDevtoolsPanel.d.cts +1 -1
- package/build/legacy/ReactQueryDevtoolsPanel.d.ts +1 -1
- package/build/legacy/ReactQueryDevtoolsPanel.js +3 -1
- package/build/legacy/ReactQueryDevtoolsPanel.js.map +1 -1
- package/build/legacy/index.d.cts +1 -1
- package/build/legacy/index.d.ts +1 -1
- package/build/legacy/production.d.cts +1 -1
- package/build/legacy/production.d.ts +1 -1
- package/build/modern/{ReactQueryDevtoolsPanel-DKrB7Z0x.d.cts → ReactQueryDevtoolsPanel-CNrIoVcr.d.cts} +2 -2
- package/build/{legacy/ReactQueryDevtoolsPanel-DKrB7Z0x.d.cts.map → modern/ReactQueryDevtoolsPanel-CNrIoVcr.d.cts.map} +1 -1
- package/build/modern/{ReactQueryDevtoolsPanel-C2_VXpks.d.ts → ReactQueryDevtoolsPanel-ChIBbCUS.d.ts} +2 -2
- package/build/{legacy/ReactQueryDevtoolsPanel-C2_VXpks.d.ts.map → modern/ReactQueryDevtoolsPanel-ChIBbCUS.d.ts.map} +1 -1
- package/build/modern/ReactQueryDevtoolsPanel.cjs +3 -1
- package/build/modern/ReactQueryDevtoolsPanel.cjs.map +1 -1
- package/build/modern/ReactQueryDevtoolsPanel.d.cts +1 -1
- package/build/modern/ReactQueryDevtoolsPanel.d.ts +1 -1
- package/build/modern/ReactQueryDevtoolsPanel.js +3 -1
- package/build/modern/ReactQueryDevtoolsPanel.js.map +1 -1
- package/build/modern/index.d.cts +1 -1
- package/build/modern/index.d.ts +1 -1
- package/build/modern/production.d.cts +1 -1
- package/build/modern/production.d.ts +1 -1
- package/package.json +5 -5
- package/src/ReactQueryDevtoolsPanel.tsx +7 -2
|
@@ -27,7 +27,7 @@ interface DevtoolsPanelOptions {
|
|
|
27
27
|
shadowDOMTarget?: ShadowRoot;
|
|
28
28
|
/**
|
|
29
29
|
* Custom styles for the devtools panel
|
|
30
|
-
* @default { height: '
|
|
30
|
+
* @default { height: '100%', display: 'flex', flexDirection: 'column' }
|
|
31
31
|
* @example { height: '100%' }
|
|
32
32
|
* @example { height: '100%', width: '100%' }
|
|
33
33
|
*/
|
|
@@ -54,4 +54,4 @@ interface DevtoolsPanelOptions {
|
|
|
54
54
|
*/
|
|
55
55
|
declare function ReactQueryDevtoolsPanel(props: DevtoolsPanelOptions): React.ReactElement | null;
|
|
56
56
|
export { ReactQueryDevtoolsPanel as n, ReactQueryDevtoolsPanel_d_exports as r, DevtoolsPanelOptions as t };
|
|
57
|
-
//# sourceMappingURL=ReactQueryDevtoolsPanel-
|
|
57
|
+
//# sourceMappingURL=ReactQueryDevtoolsPanel-CNrIoVcr.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel-
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel-CNrIoVcr.d.cts","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"mappings":";;;;;;;;;UAUiB;;;;EAIf,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;;EAKA,kBAAkB;;;;;;;EAQlB,QAAQ,MAAM;;;;EAKd;;;;EAIA;;;;;;EAMA,QAAQ;;;;;;;iBAQM,wBACd,OAAO,uBACN,MAAM"}
|
package/build/legacy/{ReactQueryDevtoolsPanel-C2_VXpks.d.ts → ReactQueryDevtoolsPanel-ChIBbCUS.d.ts}
RENAMED
|
@@ -27,7 +27,7 @@ interface DevtoolsPanelOptions {
|
|
|
27
27
|
shadowDOMTarget?: ShadowRoot;
|
|
28
28
|
/**
|
|
29
29
|
* Custom styles for the devtools panel
|
|
30
|
-
* @default { height: '
|
|
30
|
+
* @default { height: '100%', display: 'flex', flexDirection: 'column' }
|
|
31
31
|
* @example { height: '100%' }
|
|
32
32
|
* @example { height: '100%', width: '100%' }
|
|
33
33
|
*/
|
|
@@ -54,4 +54,4 @@ interface DevtoolsPanelOptions {
|
|
|
54
54
|
*/
|
|
55
55
|
declare function ReactQueryDevtoolsPanel(props: DevtoolsPanelOptions): React.ReactElement | null;
|
|
56
56
|
export { ReactQueryDevtoolsPanel as n, ReactQueryDevtoolsPanel_d_exports as r, DevtoolsPanelOptions as t };
|
|
57
|
-
//# sourceMappingURL=ReactQueryDevtoolsPanel-
|
|
57
|
+
//# sourceMappingURL=ReactQueryDevtoolsPanel-ChIBbCUS.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel-
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel-ChIBbCUS.d.ts","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"mappings":";;;;;;;;;UAUiB;;;;EAIf,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;;EAKA,kBAAkB;;;;;;;EAQlB,QAAQ,MAAM;;;;EAKd;;;;EAIA;;;;;;EAMA,QAAQ;;;;;;;iBAQM,wBACd,OAAO,uBACN,MAAM"}
|
|
@@ -51,7 +51,9 @@ function ReactQueryDevtoolsPanel(props) {
|
|
|
51
51
|
}, [devtools]);
|
|
52
52
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
53
53
|
style: {
|
|
54
|
-
height: "
|
|
54
|
+
height: "100%",
|
|
55
|
+
display: "flex",
|
|
56
|
+
flexDirection: "column",
|
|
55
57
|
...props.style
|
|
56
58
|
},
|
|
57
59
|
className: "tsqd-parent-container",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel.cjs","names":["useQueryClient","React","TanstackQueryDevtoolsPanel"],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel.cjs","names":["useQueryClient","React","TanstackQueryDevtoolsPanel"],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '100%', display: 'flex', flexDirection: 'column' }\n * @example { height: '100%' }\n * @example { height: '100%', width: '100%' }\n */\n style?: React.CSSProperties\n\n /**\n * Callback function that is called when the devtools panel is closed\n */\n onClose?: () => void\n /**\n * Set this to true to hide disabled queries from the devtools panel.\n */\n hideDisabledQueries?: boolean\n /**\n * Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.\n * This overrides the theme selected in the devtools Settings menu. When omitted, the\n * selected theme is used, or `'system'` if none is selected.\n */\n theme?: Theme\n}\n\n/**\n * Renders the TanStack Query devtools panel inline, for the given or nearest `QueryClient`.\n * @param props - The devtools panel options.\n * @returns The element the devtools panel is mounted in.\n */\nexport function ReactQueryDevtoolsPanel(\n props: DevtoolsPanelOptions,\n): React.ReactElement | null {\n const queryClient = useQueryClient(props.client)\n const ref = React.useRef<HTMLDivElement>(null)\n const {\n errorTypes,\n styleNonce,\n shadowDOMTarget,\n hideDisabledQueries,\n theme,\n } = props\n const [devtools] = React.useState(\n () =>\n new TanstackQueryDevtoolsPanel({\n client: queryClient,\n queryFlavor: 'React 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 React.useEffect(() => {\n devtools.setClient(queryClient)\n }, [queryClient, devtools])\n\n React.useEffect(() => {\n devtools.setOnClose(props.onClose ?? (() => {}))\n }, [props.onClose, devtools])\n\n React.useEffect(() => {\n devtools.setErrorTypes(errorTypes || [])\n }, [errorTypes, devtools])\n\n React.useEffect(() => {\n devtools.setTheme(theme)\n }, [theme, devtools])\n\n React.useEffect(() => {\n if (ref.current) {\n devtools.mount(ref.current)\n }\n\n return () => {\n devtools.unmount()\n }\n }, [devtools])\n\n return (\n <div\n style={{\n height: '100%',\n display: 'flex',\n flexDirection: 'column',\n ...props.style,\n }}\n className=\"tsqd-parent-container\"\n ref={ref}\n ></div>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AA0DA,SAAgB,wBACd,OAC2B;CAC3B,MAAM,eAAA,GAAcA,sBAAAA,eAAAA,CAAe,MAAM,MAAM;CAC/C,MAAM,MAAMC,MAAM,OAAuB,IAAI;CAC7C,MAAM,EACJ,YACA,YACA,iBACA,qBACA,UACE;CACJ,MAAM,CAAC,YAAYA,MAAM,eAErB,IAAIC,yBAAAA,2BAA2B;EAC7B,QAAQ;EACR,aAAa;EACb,SAAS;EACT,eAAA,sBAAA;EACA,gBAAgB;EAChB,UAAU;EACV,eAAe;EACf;EACA;EACA;EACA,SAAS,MAAM;EACf;EACA;CACF,CAAC,CACL;CAEA,MAAM,gBAAgB;EACpB,SAAS,UAAU,WAAW;CAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;CAE1B,MAAM,gBAAgB;EACpB,SAAS,WAAW,MAAM,kBAAkB,CAAC,EAAE;CACjD,GAAG,CAAC,MAAM,SAAS,QAAQ,CAAC;CAE5B,MAAM,gBAAgB;EACpB,SAAS,cAAc,cAAc,CAAC,CAAC;CACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;CAEzB,MAAM,gBAAgB;EACpB,SAAS,SAAS,KAAK;CACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;CAEpB,MAAM,gBAAgB;EACpB,IAAI,IAAI,SACN,SAAS,MAAM,IAAI,OAAO;EAG5B,aAAa;GACX,SAAS,QAAQ;EACnB;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,OAAO;GACL,QAAQ;GACR,SAAS;GACT,eAAe;GACf,GAAG,MAAM;EACX;EACA,WAAU;EACL;CACD,CAAA;AAEV"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-
|
|
1
|
+
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-CNrIoVcr.cjs";
|
|
2
2
|
export { DevtoolsPanelOptions, ReactQueryDevtoolsPanel };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-
|
|
1
|
+
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-ChIBbCUS.js";
|
|
2
2
|
export { DevtoolsPanelOptions, ReactQueryDevtoolsPanel };
|
|
@@ -48,7 +48,9 @@ function ReactQueryDevtoolsPanel(props) {
|
|
|
48
48
|
}, [devtools]);
|
|
49
49
|
return /* @__PURE__ */ jsx("div", {
|
|
50
50
|
style: {
|
|
51
|
-
height: "
|
|
51
|
+
height: "100%",
|
|
52
|
+
display: "flex",
|
|
53
|
+
flexDirection: "column",
|
|
52
54
|
...props.style
|
|
53
55
|
},
|
|
54
56
|
className: "tsqd-parent-container",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel.js","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel.js","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '100%', display: 'flex', flexDirection: 'column' }\n * @example { height: '100%' }\n * @example { height: '100%', width: '100%' }\n */\n style?: React.CSSProperties\n\n /**\n * Callback function that is called when the devtools panel is closed\n */\n onClose?: () => void\n /**\n * Set this to true to hide disabled queries from the devtools panel.\n */\n hideDisabledQueries?: boolean\n /**\n * Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.\n * This overrides the theme selected in the devtools Settings menu. When omitted, the\n * selected theme is used, or `'system'` if none is selected.\n */\n theme?: Theme\n}\n\n/**\n * Renders the TanStack Query devtools panel inline, for the given or nearest `QueryClient`.\n * @param props - The devtools panel options.\n * @returns The element the devtools panel is mounted in.\n */\nexport function ReactQueryDevtoolsPanel(\n props: DevtoolsPanelOptions,\n): React.ReactElement | null {\n const queryClient = useQueryClient(props.client)\n const ref = React.useRef<HTMLDivElement>(null)\n const {\n errorTypes,\n styleNonce,\n shadowDOMTarget,\n hideDisabledQueries,\n theme,\n } = props\n const [devtools] = React.useState(\n () =>\n new TanstackQueryDevtoolsPanel({\n client: queryClient,\n queryFlavor: 'React 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 React.useEffect(() => {\n devtools.setClient(queryClient)\n }, [queryClient, devtools])\n\n React.useEffect(() => {\n devtools.setOnClose(props.onClose ?? (() => {}))\n }, [props.onClose, devtools])\n\n React.useEffect(() => {\n devtools.setErrorTypes(errorTypes || [])\n }, [errorTypes, devtools])\n\n React.useEffect(() => {\n devtools.setTheme(theme)\n }, [theme, devtools])\n\n React.useEffect(() => {\n if (ref.current) {\n devtools.mount(ref.current)\n }\n\n return () => {\n devtools.unmount()\n }\n }, [devtools])\n\n return (\n <div\n style={{\n height: '100%',\n display: 'flex',\n flexDirection: 'column',\n ...props.style,\n }}\n className=\"tsqd-parent-container\"\n ref={ref}\n ></div>\n )\n}\n"],"mappings":";;;;;;;;;;;AA0DA,SAAgB,wBACd,OAC2B;CAC3B,MAAM,cAAc,eAAe,MAAM,MAAM;CAC/C,MAAM,MAAM,MAAM,OAAuB,IAAI;CAC7C,MAAM,EACJ,YACA,YACA,iBACA,qBACA,UACE;CACJ,MAAM,CAAC,YAAY,MAAM,eAErB,IAAI,2BAA2B;EAC7B,QAAQ;EACR,aAAa;EACb,SAAS;EACT;EACA,gBAAgB;EAChB,UAAU;EACV,eAAe;EACf;EACA;EACA;EACA,SAAS,MAAM;EACf;EACA;CACF,CAAC,CACL;CAEA,MAAM,gBAAgB;EACpB,SAAS,UAAU,WAAW;CAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;CAE1B,MAAM,gBAAgB;EACpB,SAAS,WAAW,MAAM,kBAAkB,CAAC,EAAE;CACjD,GAAG,CAAC,MAAM,SAAS,QAAQ,CAAC;CAE5B,MAAM,gBAAgB;EACpB,SAAS,cAAc,cAAc,CAAC,CAAC;CACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;CAEzB,MAAM,gBAAgB;EACpB,SAAS,SAAS,KAAK;CACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;CAEpB,MAAM,gBAAgB;EACpB,IAAI,IAAI,SACN,SAAS,MAAM,IAAI,OAAO;EAG5B,aAAa;GACX,SAAS,QAAQ;EACnB;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,oBAAC,OAAD;EACE,OAAO;GACL,QAAQ;GACR,SAAS;GACT,eAAe;GACf,GAAG,MAAM;EACX;EACA,WAAU;EACL;CACD,CAAA;AAEV"}
|
package/build/legacy/index.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-BhjVbJyl.cjs";
|
|
2
|
-
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-CNrIoVcr.cjs";
|
|
3
3
|
export declare const ReactQueryDevtools: (typeof ReactQueryDevtools_d_exports)['ReactQueryDevtools'];
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: (typeof ReactQueryDevtoolsPanel_d_exports)['ReactQueryDevtoolsPanel'];
|
|
5
5
|
/**
|
package/build/legacy/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-CaecJz_D.js";
|
|
2
|
-
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-ChIBbCUS.js";
|
|
3
3
|
export declare const ReactQueryDevtools: (typeof ReactQueryDevtools_d_exports)['ReactQueryDevtools'];
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: (typeof ReactQueryDevtoolsPanel_d_exports)['ReactQueryDevtoolsPanel'];
|
|
5
5
|
/**
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as ReactQueryDevtools$1, r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-BhjVbJyl.cjs";
|
|
2
|
-
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-CNrIoVcr.cjs";
|
|
3
3
|
export declare const ReactQueryDevtools: typeof ReactQueryDevtools$1;
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: typeof ReactQueryDevtoolsPanel$1;
|
|
5
5
|
//# sourceMappingURL=production.d.cts.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as ReactQueryDevtools$1, r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-CaecJz_D.js";
|
|
2
|
-
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-ChIBbCUS.js";
|
|
3
3
|
export declare const ReactQueryDevtools: typeof ReactQueryDevtools$1;
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: typeof ReactQueryDevtoolsPanel$1;
|
|
5
5
|
//# sourceMappingURL=production.d.ts.map
|
|
@@ -27,7 +27,7 @@ interface DevtoolsPanelOptions {
|
|
|
27
27
|
shadowDOMTarget?: ShadowRoot;
|
|
28
28
|
/**
|
|
29
29
|
* Custom styles for the devtools panel
|
|
30
|
-
* @default { height: '
|
|
30
|
+
* @default { height: '100%', display: 'flex', flexDirection: 'column' }
|
|
31
31
|
* @example { height: '100%' }
|
|
32
32
|
* @example { height: '100%', width: '100%' }
|
|
33
33
|
*/
|
|
@@ -54,4 +54,4 @@ interface DevtoolsPanelOptions {
|
|
|
54
54
|
*/
|
|
55
55
|
declare function ReactQueryDevtoolsPanel(props: DevtoolsPanelOptions): React.ReactElement | null;
|
|
56
56
|
export { ReactQueryDevtoolsPanel as n, ReactQueryDevtoolsPanel_d_exports as r, DevtoolsPanelOptions as t };
|
|
57
|
-
//# sourceMappingURL=ReactQueryDevtoolsPanel-
|
|
57
|
+
//# sourceMappingURL=ReactQueryDevtoolsPanel-CNrIoVcr.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel-
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel-CNrIoVcr.d.cts","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"mappings":";;;;;;;;;UAUiB;;;;EAIf,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;;EAKA,kBAAkB;;;;;;;EAQlB,QAAQ,MAAM;;;;EAKd;;;;EAIA;;;;;;EAMA,QAAQ;;;;;;;iBAQM,wBACd,OAAO,uBACN,MAAM"}
|
package/build/modern/{ReactQueryDevtoolsPanel-C2_VXpks.d.ts → ReactQueryDevtoolsPanel-ChIBbCUS.d.ts}
RENAMED
|
@@ -27,7 +27,7 @@ interface DevtoolsPanelOptions {
|
|
|
27
27
|
shadowDOMTarget?: ShadowRoot;
|
|
28
28
|
/**
|
|
29
29
|
* Custom styles for the devtools panel
|
|
30
|
-
* @default { height: '
|
|
30
|
+
* @default { height: '100%', display: 'flex', flexDirection: 'column' }
|
|
31
31
|
* @example { height: '100%' }
|
|
32
32
|
* @example { height: '100%', width: '100%' }
|
|
33
33
|
*/
|
|
@@ -54,4 +54,4 @@ interface DevtoolsPanelOptions {
|
|
|
54
54
|
*/
|
|
55
55
|
declare function ReactQueryDevtoolsPanel(props: DevtoolsPanelOptions): React.ReactElement | null;
|
|
56
56
|
export { ReactQueryDevtoolsPanel as n, ReactQueryDevtoolsPanel_d_exports as r, DevtoolsPanelOptions as t };
|
|
57
|
-
//# sourceMappingURL=ReactQueryDevtoolsPanel-
|
|
57
|
+
//# sourceMappingURL=ReactQueryDevtoolsPanel-ChIBbCUS.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel-
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel-ChIBbCUS.d.ts","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"mappings":";;;;;;;;;UAUiB;;;;EAIf,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;;EAKA,kBAAkB;;;;;;;EAQlB,QAAQ,MAAM;;;;EAKd;;;;EAIA;;;;;;EAMA,QAAQ;;;;;;;iBAQM,wBACd,OAAO,uBACN,MAAM"}
|
|
@@ -51,7 +51,9 @@ function ReactQueryDevtoolsPanel(props) {
|
|
|
51
51
|
}, [devtools]);
|
|
52
52
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
53
53
|
style: {
|
|
54
|
-
height: "
|
|
54
|
+
height: "100%",
|
|
55
|
+
display: "flex",
|
|
56
|
+
flexDirection: "column",
|
|
55
57
|
...props.style
|
|
56
58
|
},
|
|
57
59
|
className: "tsqd-parent-container",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel.cjs","names":["useQueryClient","React","TanstackQueryDevtoolsPanel"],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel.cjs","names":["useQueryClient","React","TanstackQueryDevtoolsPanel"],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '100%', display: 'flex', flexDirection: 'column' }\n * @example { height: '100%' }\n * @example { height: '100%', width: '100%' }\n */\n style?: React.CSSProperties\n\n /**\n * Callback function that is called when the devtools panel is closed\n */\n onClose?: () => void\n /**\n * Set this to true to hide disabled queries from the devtools panel.\n */\n hideDisabledQueries?: boolean\n /**\n * Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.\n * This overrides the theme selected in the devtools Settings menu. When omitted, the\n * selected theme is used, or `'system'` if none is selected.\n */\n theme?: Theme\n}\n\n/**\n * Renders the TanStack Query devtools panel inline, for the given or nearest `QueryClient`.\n * @param props - The devtools panel options.\n * @returns The element the devtools panel is mounted in.\n */\nexport function ReactQueryDevtoolsPanel(\n props: DevtoolsPanelOptions,\n): React.ReactElement | null {\n const queryClient = useQueryClient(props.client)\n const ref = React.useRef<HTMLDivElement>(null)\n const {\n errorTypes,\n styleNonce,\n shadowDOMTarget,\n hideDisabledQueries,\n theme,\n } = props\n const [devtools] = React.useState(\n () =>\n new TanstackQueryDevtoolsPanel({\n client: queryClient,\n queryFlavor: 'React 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 React.useEffect(() => {\n devtools.setClient(queryClient)\n }, [queryClient, devtools])\n\n React.useEffect(() => {\n devtools.setOnClose(props.onClose ?? (() => {}))\n }, [props.onClose, devtools])\n\n React.useEffect(() => {\n devtools.setErrorTypes(errorTypes || [])\n }, [errorTypes, devtools])\n\n React.useEffect(() => {\n devtools.setTheme(theme)\n }, [theme, devtools])\n\n React.useEffect(() => {\n if (ref.current) {\n devtools.mount(ref.current)\n }\n\n return () => {\n devtools.unmount()\n }\n }, [devtools])\n\n return (\n <div\n style={{\n height: '100%',\n display: 'flex',\n flexDirection: 'column',\n ...props.style,\n }}\n className=\"tsqd-parent-container\"\n ref={ref}\n ></div>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;AA0DA,SAAgB,wBACd,OAC2B;CAC3B,MAAM,eAAA,GAAcA,sBAAAA,eAAAA,CAAe,MAAM,MAAM;CAC/C,MAAM,MAAMC,MAAM,OAAuB,IAAI;CAC7C,MAAM,EACJ,YACA,YACA,iBACA,qBACA,UACE;CACJ,MAAM,CAAC,YAAYA,MAAM,eAErB,IAAIC,yBAAAA,2BAA2B;EAC7B,QAAQ;EACR,aAAa;EACb,SAAS;EACT,eAAA,sBAAA;EACA,gBAAgB;EAChB,UAAU;EACV,eAAe;EACf;EACA;EACA;EACA,SAAS,MAAM;EACf;EACA;CACF,CAAC,CACL;CAEA,MAAM,gBAAgB;EACpB,SAAS,UAAU,WAAW;CAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;CAE1B,MAAM,gBAAgB;EACpB,SAAS,WAAW,MAAM,kBAAkB,CAAC,EAAE;CACjD,GAAG,CAAC,MAAM,SAAS,QAAQ,CAAC;CAE5B,MAAM,gBAAgB;EACpB,SAAS,cAAc,cAAc,CAAC,CAAC;CACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;CAEzB,MAAM,gBAAgB;EACpB,SAAS,SAAS,KAAK;CACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;CAEpB,MAAM,gBAAgB;EACpB,IAAI,IAAI,SACN,SAAS,MAAM,IAAI,OAAO;EAG5B,aAAa;GACX,SAAS,QAAQ;EACnB;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,OAAO;GACL,QAAQ;GACR,SAAS;GACT,eAAe;GACf,GAAG,MAAM;EACX;EACA,WAAU;EACL;CACD,CAAA;AAEV"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-
|
|
1
|
+
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-CNrIoVcr.cjs";
|
|
2
2
|
export { DevtoolsPanelOptions, ReactQueryDevtoolsPanel };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-
|
|
1
|
+
import { n as ReactQueryDevtoolsPanel, t as DevtoolsPanelOptions } from "./ReactQueryDevtoolsPanel-ChIBbCUS.js";
|
|
2
2
|
export { DevtoolsPanelOptions, ReactQueryDevtoolsPanel };
|
|
@@ -48,7 +48,9 @@ function ReactQueryDevtoolsPanel(props) {
|
|
|
48
48
|
}, [devtools]);
|
|
49
49
|
return /* @__PURE__ */ jsx("div", {
|
|
50
50
|
style: {
|
|
51
|
-
height: "
|
|
51
|
+
height: "100%",
|
|
52
|
+
display: "flex",
|
|
53
|
+
flexDirection: "column",
|
|
52
54
|
...props.style
|
|
53
55
|
},
|
|
54
56
|
className: "tsqd-parent-container",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryDevtoolsPanel.js","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '
|
|
1
|
+
{"version":3,"file":"ReactQueryDevtoolsPanel.js","names":[],"sources":["../../src/ReactQueryDevtoolsPanel.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\nimport { onlineManager, useQueryClient } from '@tanstack/react-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/react-query'\n\n/**\n * The props of `ReactQueryDevtoolsPanel`, which renders the devtools panel inline.\n */\nexport interface DevtoolsPanelOptions {\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?: Array<DevtoolsErrorType>\n /**\n * 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.\n */\n styleNonce?: string\n /**\n * Use this to pass a shadow DOM target to the devtools so that the styles will be applied\n * within the shadow DOM instead of within the head tag in the light DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '100%', display: 'flex', flexDirection: 'column' }\n * @example { height: '100%' }\n * @example { height: '100%', width: '100%' }\n */\n style?: React.CSSProperties\n\n /**\n * Callback function that is called when the devtools panel is closed\n */\n onClose?: () => void\n /**\n * Set this to true to hide disabled queries from the devtools panel.\n */\n hideDisabledQueries?: boolean\n /**\n * Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.\n * This overrides the theme selected in the devtools Settings menu. When omitted, the\n * selected theme is used, or `'system'` if none is selected.\n */\n theme?: Theme\n}\n\n/**\n * Renders the TanStack Query devtools panel inline, for the given or nearest `QueryClient`.\n * @param props - The devtools panel options.\n * @returns The element the devtools panel is mounted in.\n */\nexport function ReactQueryDevtoolsPanel(\n props: DevtoolsPanelOptions,\n): React.ReactElement | null {\n const queryClient = useQueryClient(props.client)\n const ref = React.useRef<HTMLDivElement>(null)\n const {\n errorTypes,\n styleNonce,\n shadowDOMTarget,\n hideDisabledQueries,\n theme,\n } = props\n const [devtools] = React.useState(\n () =>\n new TanstackQueryDevtoolsPanel({\n client: queryClient,\n queryFlavor: 'React 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 React.useEffect(() => {\n devtools.setClient(queryClient)\n }, [queryClient, devtools])\n\n React.useEffect(() => {\n devtools.setOnClose(props.onClose ?? (() => {}))\n }, [props.onClose, devtools])\n\n React.useEffect(() => {\n devtools.setErrorTypes(errorTypes || [])\n }, [errorTypes, devtools])\n\n React.useEffect(() => {\n devtools.setTheme(theme)\n }, [theme, devtools])\n\n React.useEffect(() => {\n if (ref.current) {\n devtools.mount(ref.current)\n }\n\n return () => {\n devtools.unmount()\n }\n }, [devtools])\n\n return (\n <div\n style={{\n height: '100%',\n display: 'flex',\n flexDirection: 'column',\n ...props.style,\n }}\n className=\"tsqd-parent-container\"\n ref={ref}\n ></div>\n )\n}\n"],"mappings":";;;;;;;;;;;AA0DA,SAAgB,wBACd,OAC2B;CAC3B,MAAM,cAAc,eAAe,MAAM,MAAM;CAC/C,MAAM,MAAM,MAAM,OAAuB,IAAI;CAC7C,MAAM,EACJ,YACA,YACA,iBACA,qBACA,UACE;CACJ,MAAM,CAAC,YAAY,MAAM,eAErB,IAAI,2BAA2B;EAC7B,QAAQ;EACR,aAAa;EACb,SAAS;EACT;EACA,gBAAgB;EAChB,UAAU;EACV,eAAe;EACf;EACA;EACA;EACA,SAAS,MAAM;EACf;EACA;CACF,CAAC,CACL;CAEA,MAAM,gBAAgB;EACpB,SAAS,UAAU,WAAW;CAChC,GAAG,CAAC,aAAa,QAAQ,CAAC;CAE1B,MAAM,gBAAgB;EACpB,SAAS,WAAW,MAAM,kBAAkB,CAAC,EAAE;CACjD,GAAG,CAAC,MAAM,SAAS,QAAQ,CAAC;CAE5B,MAAM,gBAAgB;EACpB,SAAS,cAAc,cAAc,CAAC,CAAC;CACzC,GAAG,CAAC,YAAY,QAAQ,CAAC;CAEzB,MAAM,gBAAgB;EACpB,SAAS,SAAS,KAAK;CACzB,GAAG,CAAC,OAAO,QAAQ,CAAC;CAEpB,MAAM,gBAAgB;EACpB,IAAI,IAAI,SACN,SAAS,MAAM,IAAI,OAAO;EAG5B,aAAa;GACX,SAAS,QAAQ;EACnB;CACF,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,oBAAC,OAAD;EACE,OAAO;GACL,QAAQ;GACR,SAAS;GACT,eAAe;GACf,GAAG,MAAM;EACX;EACA,WAAU;EACL;CACD,CAAA;AAEV"}
|
package/build/modern/index.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-BhjVbJyl.cjs";
|
|
2
|
-
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-CNrIoVcr.cjs";
|
|
3
3
|
export declare const ReactQueryDevtools: (typeof ReactQueryDevtools_d_exports)['ReactQueryDevtools'];
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: (typeof ReactQueryDevtoolsPanel_d_exports)['ReactQueryDevtoolsPanel'];
|
|
5
5
|
/**
|
package/build/modern/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-CaecJz_D.js";
|
|
2
|
-
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { r as ReactQueryDevtoolsPanel_d_exports, t as DevtoolsPanelOptions$1 } from "./ReactQueryDevtoolsPanel-ChIBbCUS.js";
|
|
3
3
|
export declare const ReactQueryDevtools: (typeof ReactQueryDevtools_d_exports)['ReactQueryDevtools'];
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: (typeof ReactQueryDevtoolsPanel_d_exports)['ReactQueryDevtoolsPanel'];
|
|
5
5
|
/**
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as ReactQueryDevtools$1, r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-BhjVbJyl.cjs";
|
|
2
|
-
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-CNrIoVcr.cjs";
|
|
3
3
|
export declare const ReactQueryDevtools: typeof ReactQueryDevtools$1;
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: typeof ReactQueryDevtoolsPanel$1;
|
|
5
5
|
//# sourceMappingURL=production.d.cts.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { n as ReactQueryDevtools$1, r as ReactQueryDevtools_d_exports } from "./ReactQueryDevtools-CaecJz_D.js";
|
|
2
|
-
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-
|
|
2
|
+
import { n as ReactQueryDevtoolsPanel$1, r as ReactQueryDevtoolsPanel_d_exports } from "./ReactQueryDevtoolsPanel-ChIBbCUS.js";
|
|
3
3
|
export declare const ReactQueryDevtools: typeof ReactQueryDevtools$1;
|
|
4
4
|
export declare const ReactQueryDevtoolsPanel: typeof ReactQueryDevtoolsPanel$1;
|
|
5
5
|
//# sourceMappingURL=production.d.ts.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/react-query-devtools",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.106.0",
|
|
4
4
|
"description": "Developer tools to interact with and visualize the TanStack/react-query cache",
|
|
5
5
|
"author": "tannerlinsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -59,20 +59,20 @@
|
|
|
59
59
|
"!src/__tests__"
|
|
60
60
|
],
|
|
61
61
|
"dependencies": {
|
|
62
|
-
"@tanstack/query-devtools": "5.
|
|
62
|
+
"@tanstack/query-devtools": "5.106.0"
|
|
63
63
|
},
|
|
64
64
|
"devDependencies": {
|
|
65
65
|
"@eslint-react/eslint-plugin": "^5.28.8",
|
|
66
|
-
"@tanstack/react-query": "5.
|
|
66
|
+
"@tanstack/react-query": "5.106.0",
|
|
67
67
|
"@testing-library/react": "^16.1.0",
|
|
68
68
|
"@types/react": "^19.3.0",
|
|
69
|
-
"@vitejs/plugin-react": "^6.
|
|
69
|
+
"@vitejs/plugin-react": "^6.2.1",
|
|
70
70
|
"eslint-plugin-react-hooks": "^7.1.1",
|
|
71
71
|
"react": "^19.3.1",
|
|
72
72
|
"typescript": "6.0.3"
|
|
73
73
|
},
|
|
74
74
|
"peerDependencies": {
|
|
75
|
-
"@tanstack/react-query": "^5.
|
|
75
|
+
"@tanstack/react-query": "^5.106.0",
|
|
76
76
|
"@types/react": "^18 || ^19",
|
|
77
77
|
"react": "^18 || ^19"
|
|
78
78
|
},
|
|
@@ -29,7 +29,7 @@ export interface DevtoolsPanelOptions {
|
|
|
29
29
|
|
|
30
30
|
/**
|
|
31
31
|
* Custom styles for the devtools panel
|
|
32
|
-
* @default { height: '
|
|
32
|
+
* @default { height: '100%', display: 'flex', flexDirection: 'column' }
|
|
33
33
|
* @example { height: '100%' }
|
|
34
34
|
* @example { height: '100%', width: '100%' }
|
|
35
35
|
*/
|
|
@@ -115,7 +115,12 @@ export function ReactQueryDevtoolsPanel(
|
|
|
115
115
|
|
|
116
116
|
return (
|
|
117
117
|
<div
|
|
118
|
-
style={{
|
|
118
|
+
style={{
|
|
119
|
+
height: '100%',
|
|
120
|
+
display: 'flex',
|
|
121
|
+
flexDirection: 'column',
|
|
122
|
+
...props.style,
|
|
123
|
+
}}
|
|
119
124
|
className="tsqd-parent-container"
|
|
120
125
|
ref={ref}
|
|
121
126
|
></div>
|