@tanstack/query-devtools 5.8.4 → 5.10.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/Devtools/{4HZPHOEU.js → ANE6OXOK.js} +4 -3
- package/build/Devtools/{RC3HOX77.js → E3UEEC63.js} +4 -3
- package/build/Devtools/{3NHE6LPY.jsx → OG2NFD3H.jsx} +2 -9
- package/build/Devtools/{W6R25HSA.jsx → Y6OLANNQ.jsx} +2 -9
- package/build/dev.cjs +2 -9
- package/build/dev.js +2 -2
- package/build/dev.jsx +2 -2
- package/build/index.cjs +2 -9
- package/build/index.d.cts +1 -1
- package/build/index.d.ts +1 -1
- package/build/index.js +2 -2
- package/build/index.jsx +2 -2
- package/package.json +2 -2
- package/src/Devtools.tsx +10 -8
- package/src/Explorer.tsx +2 -1
- package/src/index.tsx +3 -3
- package/src/theme.ts +0 -12
- package/src/utils.tsx +2 -11
- /package/build/chunk/{2CFRQNPI.js → 7TPOKDOT.js} +0 -0
- /package/build/chunk/{SPPEWFNK.jsx → EFDUVU65.jsx} +0 -0
- /package/build/chunk/{MJH6GUJH.jsx → LRQXE5TJ.jsx} +0 -0
- /package/build/chunk/{3V52ZCRQ.js → NCBN5K2V.js} +0 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createContext, delegateEvents, sortFns, mutationSortFns, createSignal, getPreferredColorScheme, createMemo, createComponent, createEffect, onMount, onCleanup, use, insert, Show, createRenderEffect, className, on, setAttribute, getQueryStatusColor, getMutationStatusColor, getQueryStatusLabel, spread, mergeProps, getQueryStatusColorByLabel, displayValue, For, isServer,
|
|
1
|
+
import { createContext, delegateEvents, sortFns, mutationSortFns, createSignal, $PROXY, $TRACK, getListener, batch, getPreferredColorScheme, createMemo, createComponent, createEffect, onMount, onCleanup, use, insert, Show, createRenderEffect, className, on, setAttribute, getQueryStatusColor, getMutationStatusColor, getQueryStatusLabel, spread, mergeProps, getQueryStatusColorByLabel, displayValue, For, isServer, createUniqueId, useContext, Index, updateNestedDataByPath, template, convertRemToPixels, getSidedProp, untrack, useTransition, createRoot, splitProps, Portal, addEventListener, stringify, Switch, Match, deleteNestedDataByPath, Dynamic, children, createComputed, getOwner, DEV } from '../chunk/NCBN5K2V.js';
|
|
2
2
|
|
|
3
3
|
// ../../node_modules/.pnpm/@tanstack+match-sorter-utils@8.8.4/node_modules/@tanstack/match-sorter-utils/build/lib/index.mjs
|
|
4
4
|
var characterMap = {
|
|
@@ -1243,7 +1243,7 @@ var cookieStorage = addClearMethod({
|
|
|
1243
1243
|
},
|
|
1244
1244
|
removeItem: (key) => {
|
|
1245
1245
|
cookieStorage._cookies[0][cookieStorage._cookies[1]] = `${key}=deleted${serializeCookieOptions({
|
|
1246
|
-
expires:
|
|
1246
|
+
expires: /* @__PURE__ */ new Date(0)
|
|
1247
1247
|
})}`;
|
|
1248
1248
|
},
|
|
1249
1249
|
key: (index) => {
|
|
@@ -9433,6 +9433,7 @@ var stylesFactory = (theme) => {
|
|
|
9433
9433
|
`,
|
|
9434
9434
|
label: u`
|
|
9435
9435
|
color: ${t2(colors.gray[700], colors.gray[300])};
|
|
9436
|
+
white-space: nowrap;
|
|
9436
9437
|
`,
|
|
9437
9438
|
value: u`
|
|
9438
9439
|
color: ${t2(colors.purple[600], colors.purple[400])};
|
|
@@ -12645,4 +12646,4 @@ delegateEvents(["click", "mousedown", "input"]);
|
|
|
12645
12646
|
*)
|
|
12646
12647
|
*/
|
|
12647
12648
|
|
|
12648
|
-
export {
|
|
12649
|
+
export { Devtools_default as default };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createContext, delegateEvents, sortFns, mutationSortFns, createSignal, getPreferredColorScheme, createMemo, createComponent, createEffect, onMount, onCleanup, use, insert, Show, createRenderEffect, className, on, setAttribute, getQueryStatusColor, getMutationStatusColor, getQueryStatusLabel, spread, mergeProps, getQueryStatusColorByLabel, displayValue, For, isServer,
|
|
1
|
+
import { createContext, delegateEvents, sortFns, mutationSortFns, createSignal, $PROXY, $TRACK, getListener, batch, getPreferredColorScheme, createMemo, createComponent, createEffect, onMount, onCleanup, use, insert, Show, createRenderEffect, className, on, setAttribute, getQueryStatusColor, getMutationStatusColor, getQueryStatusLabel, spread, mergeProps, getQueryStatusColorByLabel, displayValue, For, isServer, createUniqueId, useContext, Index, updateNestedDataByPath, template, convertRemToPixels, getSidedProp, untrack, useTransition, createRoot, splitProps, Portal, addEventListener, stringify, Switch, Match, deleteNestedDataByPath, Dynamic, children, createComputed, getOwner, DEV } from '../chunk/7TPOKDOT.js';
|
|
2
2
|
|
|
3
3
|
// ../../node_modules/.pnpm/@tanstack+match-sorter-utils@8.8.4/node_modules/@tanstack/match-sorter-utils/build/lib/index.mjs
|
|
4
4
|
var characterMap = {
|
|
@@ -1243,7 +1243,7 @@ var cookieStorage = addClearMethod({
|
|
|
1243
1243
|
},
|
|
1244
1244
|
removeItem: (key) => {
|
|
1245
1245
|
cookieStorage._cookies[0][cookieStorage._cookies[1]] = `${key}=deleted${serializeCookieOptions({
|
|
1246
|
-
expires:
|
|
1246
|
+
expires: /* @__PURE__ */ new Date(0)
|
|
1247
1247
|
})}`;
|
|
1248
1248
|
},
|
|
1249
1249
|
key: (index) => {
|
|
@@ -9432,6 +9432,7 @@ var stylesFactory = (theme) => {
|
|
|
9432
9432
|
`,
|
|
9433
9433
|
label: u`
|
|
9434
9434
|
color: ${t2(colors.gray[700], colors.gray[300])};
|
|
9435
|
+
white-space: nowrap;
|
|
9435
9436
|
`,
|
|
9436
9437
|
value: u`
|
|
9437
9438
|
color: ${t2(colors.purple[600], colors.purple[400])};
|
|
@@ -12644,4 +12645,4 @@ delegateEvents(["click", "mousedown", "input"]);
|
|
|
12644
12645
|
*)
|
|
12645
12646
|
*/
|
|
12646
12647
|
|
|
12647
|
-
export {
|
|
12648
|
+
export { Devtools_default as default };
|
|
@@ -49,7 +49,7 @@ import {
|
|
|
49
49
|
use,
|
|
50
50
|
useContext,
|
|
51
51
|
useTransition
|
|
52
|
-
} from "../chunk/
|
|
52
|
+
} from "../chunk/EFDUVU65.jsx";
|
|
53
53
|
|
|
54
54
|
// ../../node_modules/.pnpm/@tanstack+match-sorter-utils@8.8.4/node_modules/@tanstack/match-sorter-utils/build/lib/index.mjs
|
|
55
55
|
var characterMap = {
|
|
@@ -10364,6 +10364,7 @@ var stylesFactory = (theme) => {
|
|
|
10364
10364
|
`,
|
|
10365
10365
|
label: u`
|
|
10366
10366
|
color: ${t2(colors.gray[700], colors.gray[300])};
|
|
10367
|
+
white-space: nowrap;
|
|
10367
10368
|
`,
|
|
10368
10369
|
value: u`
|
|
10369
10370
|
color: ${t2(colors.purple[600], colors.purple[400])};
|
|
@@ -12884,14 +12885,6 @@ var stylesFactory2 = (theme) => {
|
|
|
12884
12885
|
var lightStyles2 = stylesFactory2("light");
|
|
12885
12886
|
var darkStyles2 = stylesFactory2("dark");
|
|
12886
12887
|
export {
|
|
12887
|
-
Devtools,
|
|
12888
|
-
DevtoolsComponent,
|
|
12889
|
-
DevtoolsPanel,
|
|
12890
|
-
MutationRow,
|
|
12891
|
-
MutationStatusCount,
|
|
12892
|
-
QueryRow,
|
|
12893
|
-
QueryStatus,
|
|
12894
|
-
QueryStatusCount,
|
|
12895
12888
|
Devtools_default as default
|
|
12896
12889
|
};
|
|
12897
12890
|
/*! Bundled license information:
|
|
@@ -49,7 +49,7 @@ import {
|
|
|
49
49
|
use,
|
|
50
50
|
useContext,
|
|
51
51
|
useTransition
|
|
52
|
-
} from "../chunk/
|
|
52
|
+
} from "../chunk/LRQXE5TJ.jsx";
|
|
53
53
|
|
|
54
54
|
// ../../node_modules/.pnpm/@tanstack+match-sorter-utils@8.8.4/node_modules/@tanstack/match-sorter-utils/build/lib/index.mjs
|
|
55
55
|
var characterMap = {
|
|
@@ -10363,6 +10363,7 @@ var stylesFactory = (theme) => {
|
|
|
10363
10363
|
`,
|
|
10364
10364
|
label: u`
|
|
10365
10365
|
color: ${t2(colors.gray[700], colors.gray[300])};
|
|
10366
|
+
white-space: nowrap;
|
|
10366
10367
|
`,
|
|
10367
10368
|
value: u`
|
|
10368
10369
|
color: ${t2(colors.purple[600], colors.purple[400])};
|
|
@@ -12883,14 +12884,6 @@ var stylesFactory2 = (theme) => {
|
|
|
12883
12884
|
var lightStyles2 = stylesFactory2("light");
|
|
12884
12885
|
var darkStyles2 = stylesFactory2("dark");
|
|
12885
12886
|
export {
|
|
12886
|
-
Devtools,
|
|
12887
|
-
DevtoolsComponent,
|
|
12888
|
-
DevtoolsPanel,
|
|
12889
|
-
MutationRow,
|
|
12890
|
-
MutationStatusCount,
|
|
12891
|
-
QueryRow,
|
|
12892
|
-
QueryStatus,
|
|
12893
|
-
QueryStatusCount,
|
|
12894
12887
|
Devtools_default as default
|
|
12895
12888
|
};
|
|
12896
12889
|
/*! Bundled license information:
|
package/build/dev.cjs
CHANGED
|
@@ -4635,7 +4635,7 @@ var init_dist7 = __esm({
|
|
|
4635
4635
|
},
|
|
4636
4636
|
removeItem: (key) => {
|
|
4637
4637
|
cookieStorage._cookies[0][cookieStorage._cookies[1]] = `${key}=deleted${serializeCookieOptions({
|
|
4638
|
-
expires:
|
|
4638
|
+
expires: /* @__PURE__ */ new Date(0)
|
|
4639
4639
|
})}`;
|
|
4640
4640
|
},
|
|
4641
4641
|
key: (index) => {
|
|
@@ -12916,6 +12916,7 @@ var init_Explorer = __esm({
|
|
|
12916
12916
|
`,
|
|
12917
12917
|
label: u`
|
|
12918
12918
|
color: ${t2(colors.gray[700], colors.gray[300])};
|
|
12919
|
+
white-space: nowrap;
|
|
12919
12920
|
`,
|
|
12920
12921
|
value: u`
|
|
12921
12922
|
color: ${t2(colors.purple[600], colors.purple[400])};
|
|
@@ -12993,14 +12994,6 @@ var init_fonts = __esm({
|
|
|
12993
12994
|
// src/Devtools.tsx
|
|
12994
12995
|
var Devtools_exports = {};
|
|
12995
12996
|
__export(Devtools_exports, {
|
|
12996
|
-
Devtools: () => Devtools,
|
|
12997
|
-
DevtoolsComponent: () => DevtoolsComponent,
|
|
12998
|
-
DevtoolsPanel: () => DevtoolsPanel,
|
|
12999
|
-
MutationRow: () => MutationRow,
|
|
13000
|
-
MutationStatusCount: () => MutationStatusCount,
|
|
13001
|
-
QueryRow: () => QueryRow,
|
|
13002
|
-
QueryStatus: () => QueryStatus,
|
|
13003
|
-
QueryStatusCount: () => QueryStatusCount,
|
|
13004
12997
|
default: () => Devtools_default
|
|
13005
12998
|
});
|
|
13006
12999
|
var _tmpl$24, _tmpl$25, _tmpl$33, _tmpl$43, _tmpl$53, _tmpl$63, _tmpl$73, _tmpl$83, _tmpl$93, _tmpl$103, _tmpl$113, _tmpl$122, _tmpl$132, _tmpl$142, _tmpl$152, _tmpl$162, _tmpl$172, _tmpl$182, _tmpl$192, _tmpl$202, _tmpl$212, _tmpl$222, _tmpl$232, _tmpl$242, _tmpl$252, _tmpl$26, _tmpl$27, _tmpl$28, _tmpl$29, _tmpl$30, firstBreakpoint, secondBreakpoint, thirdBreakpoint, BUTTON_POSITION, POSITION, THEME_PREFERENCE, INITIAL_IS_OPEN, DEFAULT_HEIGHT, DEFAULT_WIDTH, DEFAULT_SORT_FN_NAME, DEFAULT_SORT_ORDER, DEFAULT_MUTATION_SORT_FN_NAME, selectedQueryHash, setSelectedQueryHash, selectedMutationId, setSelectedMutationId, panelWidth, setPanelWidth, DevtoolsComponent, Devtools_default, Devtools, DevtoolsPanel, ContentView, QueryRow, MutationRow, QueryStatusCount, MutationStatusCount, QueryStatus, QueryDetails, MutationDetails, queryCacheMap, setupQueryCacheSubscription, createSubscribeToQueryCacheBatcher, mutationCacheMap, setupMutationCacheSubscription, createSubscribeToMutationCacheBatcher, stylesFactory2, lightStyles2, darkStyles2;
|
package/build/dev.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createSignal, render, lazy, setupStyleSheet, createComponent, mergeProps } from './chunk/
|
|
1
|
+
import { createSignal, render, lazy, setupStyleSheet, createComponent, mergeProps } from './chunk/NCBN5K2V.js';
|
|
2
2
|
|
|
3
3
|
// src/index.tsx
|
|
4
4
|
var TanstackQueryDevtools = class {
|
|
@@ -65,7 +65,7 @@ var TanstackQueryDevtools = class {
|
|
|
65
65
|
if (this.#Component) {
|
|
66
66
|
Devtools = this.#Component;
|
|
67
67
|
} else {
|
|
68
|
-
Devtools = lazy(() => import('./Devtools/
|
|
68
|
+
Devtools = lazy(() => import('./Devtools/ANE6OXOK.js'));
|
|
69
69
|
this.#Component = Devtools;
|
|
70
70
|
}
|
|
71
71
|
setupStyleSheet(this.#styleNonce);
|
package/build/dev.jsx
CHANGED
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
lazy,
|
|
4
4
|
render,
|
|
5
5
|
setupStyleSheet
|
|
6
|
-
} from "./chunk/
|
|
6
|
+
} from "./chunk/EFDUVU65.jsx";
|
|
7
7
|
|
|
8
8
|
// src/index.tsx
|
|
9
9
|
var TanstackQueryDevtools = class {
|
|
@@ -70,7 +70,7 @@ var TanstackQueryDevtools = class {
|
|
|
70
70
|
if (this.#Component) {
|
|
71
71
|
Devtools = this.#Component;
|
|
72
72
|
} else {
|
|
73
|
-
Devtools = lazy(() => import("./Devtools/
|
|
73
|
+
Devtools = lazy(() => import("./Devtools/OG2NFD3H.jsx"));
|
|
74
74
|
this.#Component = Devtools;
|
|
75
75
|
}
|
|
76
76
|
setupStyleSheet(this.#styleNonce);
|
package/build/index.cjs
CHANGED
|
@@ -4634,7 +4634,7 @@ var init_dist7 = __esm({
|
|
|
4634
4634
|
},
|
|
4635
4635
|
removeItem: (key) => {
|
|
4636
4636
|
cookieStorage._cookies[0][cookieStorage._cookies[1]] = `${key}=deleted${serializeCookieOptions({
|
|
4637
|
-
expires:
|
|
4637
|
+
expires: /* @__PURE__ */ new Date(0)
|
|
4638
4638
|
})}`;
|
|
4639
4639
|
},
|
|
4640
4640
|
key: (index) => {
|
|
@@ -12914,6 +12914,7 @@ var init_Explorer = __esm({
|
|
|
12914
12914
|
`,
|
|
12915
12915
|
label: u`
|
|
12916
12916
|
color: ${t2(colors.gray[700], colors.gray[300])};
|
|
12917
|
+
white-space: nowrap;
|
|
12917
12918
|
`,
|
|
12918
12919
|
value: u`
|
|
12919
12920
|
color: ${t2(colors.purple[600], colors.purple[400])};
|
|
@@ -12991,14 +12992,6 @@ var init_fonts = __esm({
|
|
|
12991
12992
|
// src/Devtools.tsx
|
|
12992
12993
|
var Devtools_exports = {};
|
|
12993
12994
|
__export(Devtools_exports, {
|
|
12994
|
-
Devtools: () => Devtools,
|
|
12995
|
-
DevtoolsComponent: () => DevtoolsComponent,
|
|
12996
|
-
DevtoolsPanel: () => DevtoolsPanel,
|
|
12997
|
-
MutationRow: () => MutationRow,
|
|
12998
|
-
MutationStatusCount: () => MutationStatusCount,
|
|
12999
|
-
QueryRow: () => QueryRow,
|
|
13000
|
-
QueryStatus: () => QueryStatus,
|
|
13001
|
-
QueryStatusCount: () => QueryStatusCount,
|
|
13002
12995
|
default: () => Devtools_default
|
|
13003
12996
|
});
|
|
13004
12997
|
var _tmpl$24, _tmpl$25, _tmpl$33, _tmpl$43, _tmpl$53, _tmpl$63, _tmpl$73, _tmpl$83, _tmpl$93, _tmpl$103, _tmpl$113, _tmpl$122, _tmpl$132, _tmpl$142, _tmpl$152, _tmpl$162, _tmpl$172, _tmpl$182, _tmpl$192, _tmpl$202, _tmpl$212, _tmpl$222, _tmpl$232, _tmpl$242, _tmpl$252, _tmpl$26, _tmpl$27, _tmpl$28, _tmpl$29, _tmpl$30, firstBreakpoint, secondBreakpoint, thirdBreakpoint, BUTTON_POSITION, POSITION, THEME_PREFERENCE, INITIAL_IS_OPEN, DEFAULT_HEIGHT, DEFAULT_WIDTH, DEFAULT_SORT_FN_NAME, DEFAULT_SORT_ORDER, DEFAULT_MUTATION_SORT_FN_NAME, selectedQueryHash, setSelectedQueryHash, selectedMutationId, setSelectedMutationId, panelWidth, setPanelWidth, DevtoolsComponent, Devtools_default, Devtools, DevtoolsPanel, ContentView, QueryRow, MutationRow, QueryStatusCount, MutationStatusCount, QueryStatus, QueryDetails, MutationDetails, queryCacheMap, setupQueryCacheSubscription, createSubscribeToQueryCacheBatcher, mutationCacheMap, setupMutationCacheSubscription, createSubscribeToMutationCacheBatcher, stylesFactory2, lightStyles2, darkStyles2;
|
package/build/index.d.cts
CHANGED
|
@@ -40,4 +40,4 @@ declare class TanstackQueryDevtools {
|
|
|
40
40
|
unmount(): void;
|
|
41
41
|
}
|
|
42
42
|
|
|
43
|
-
export { DevToolsErrorType, DevtoolsButtonPosition, DevtoolsPosition, TanstackQueryDevtools, TanstackQueryDevtoolsConfig };
|
|
43
|
+
export { type DevToolsErrorType, type DevtoolsButtonPosition, type DevtoolsPosition, TanstackQueryDevtools, type TanstackQueryDevtoolsConfig };
|
package/build/index.d.ts
CHANGED
|
@@ -40,4 +40,4 @@ declare class TanstackQueryDevtools {
|
|
|
40
40
|
unmount(): void;
|
|
41
41
|
}
|
|
42
42
|
|
|
43
|
-
export { DevToolsErrorType, DevtoolsButtonPosition, DevtoolsPosition, TanstackQueryDevtools, TanstackQueryDevtoolsConfig };
|
|
43
|
+
export { type DevToolsErrorType, type DevtoolsButtonPosition, type DevtoolsPosition, TanstackQueryDevtools, type TanstackQueryDevtoolsConfig };
|
package/build/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createSignal, render, lazy, setupStyleSheet, createComponent, mergeProps } from './chunk/
|
|
1
|
+
import { createSignal, render, lazy, setupStyleSheet, createComponent, mergeProps } from './chunk/7TPOKDOT.js';
|
|
2
2
|
|
|
3
3
|
// src/index.tsx
|
|
4
4
|
var TanstackQueryDevtools = class {
|
|
@@ -65,7 +65,7 @@ var TanstackQueryDevtools = class {
|
|
|
65
65
|
if (this.#Component) {
|
|
66
66
|
Devtools = this.#Component;
|
|
67
67
|
} else {
|
|
68
|
-
Devtools = lazy(() => import('./Devtools/
|
|
68
|
+
Devtools = lazy(() => import('./Devtools/E3UEEC63.js'));
|
|
69
69
|
this.#Component = Devtools;
|
|
70
70
|
}
|
|
71
71
|
setupStyleSheet(this.#styleNonce);
|
package/build/index.jsx
CHANGED
|
@@ -3,7 +3,7 @@ import {
|
|
|
3
3
|
lazy,
|
|
4
4
|
render,
|
|
5
5
|
setupStyleSheet
|
|
6
|
-
} from "./chunk/
|
|
6
|
+
} from "./chunk/LRQXE5TJ.jsx";
|
|
7
7
|
|
|
8
8
|
// src/index.tsx
|
|
9
9
|
var TanstackQueryDevtools = class {
|
|
@@ -70,7 +70,7 @@ var TanstackQueryDevtools = class {
|
|
|
70
70
|
if (this.#Component) {
|
|
71
71
|
Devtools = this.#Component;
|
|
72
72
|
} else {
|
|
73
|
-
Devtools = lazy(() => import("./Devtools/
|
|
73
|
+
Devtools = lazy(() => import("./Devtools/Y6OLANNQ.jsx"));
|
|
74
74
|
this.#Component = Devtools;
|
|
75
75
|
}
|
|
76
76
|
setupStyleSheet(this.#styleNonce);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/query-devtools",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.10.0",
|
|
4
4
|
"description": "Developer tools to interact with and visualize the TanStack Query cache",
|
|
5
5
|
"author": "tannerlinsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"superjson": "^1.12.4",
|
|
51
51
|
"tsup-preset-solid": "^2.1.0",
|
|
52
52
|
"vite-plugin-solid": "^2.7.2",
|
|
53
|
-
"@tanstack/query-core": "5.
|
|
53
|
+
"@tanstack/query-core": "5.10.0"
|
|
54
54
|
},
|
|
55
55
|
"scripts": {
|
|
56
56
|
"clean": "rimraf ./build && rimraf ./coverage",
|
package/src/Devtools.tsx
CHANGED
|
@@ -106,7 +106,9 @@ const [selectedMutationId, setSelectedMutationId] = createSignal<number | null>(
|
|
|
106
106
|
)
|
|
107
107
|
const [panelWidth, setPanelWidth] = createSignal(0)
|
|
108
108
|
|
|
109
|
-
export
|
|
109
|
+
export type DevtoolsComponentType = Component<QueryDevtoolsProps>
|
|
110
|
+
|
|
111
|
+
const DevtoolsComponent: DevtoolsComponentType = (props) => {
|
|
110
112
|
const [localStore, setLocalStore] = createLocalStorage({
|
|
111
113
|
prefix: 'TanstackQueryDevtools',
|
|
112
114
|
})
|
|
@@ -133,7 +135,7 @@ export const DevtoolsComponent: Component<QueryDevtoolsProps> = (props) => {
|
|
|
133
135
|
|
|
134
136
|
export default DevtoolsComponent
|
|
135
137
|
|
|
136
|
-
|
|
138
|
+
const Devtools: Component<DevtoolsPanelProps> = (props) => {
|
|
137
139
|
loadFonts()
|
|
138
140
|
|
|
139
141
|
const theme = useTheme()
|
|
@@ -265,7 +267,7 @@ export const Devtools: Component<DevtoolsPanelProps> = (props) => {
|
|
|
265
267
|
)
|
|
266
268
|
}
|
|
267
269
|
|
|
268
|
-
|
|
270
|
+
const DevtoolsPanel: Component<DevtoolsPanelProps> = (props) => {
|
|
269
271
|
const theme = useTheme()
|
|
270
272
|
const styles = createMemo(() => {
|
|
271
273
|
return theme() === 'dark' ? darkStyles : lightStyles
|
|
@@ -1037,7 +1039,7 @@ const ContentView: Component<DevtoolsPanelProps> = (props) => {
|
|
|
1037
1039
|
)
|
|
1038
1040
|
}
|
|
1039
1041
|
|
|
1040
|
-
|
|
1042
|
+
const QueryRow: Component<{ query: Query }> = (props) => {
|
|
1041
1043
|
const theme = useTheme()
|
|
1042
1044
|
const styles = createMemo(() => {
|
|
1043
1045
|
return theme() === 'dark' ? darkStyles : lightStyles
|
|
@@ -1137,7 +1139,7 @@ export const QueryRow: Component<{ query: Query }> = (props) => {
|
|
|
1137
1139
|
)
|
|
1138
1140
|
}
|
|
1139
1141
|
|
|
1140
|
-
|
|
1142
|
+
const MutationRow: Component<{ mutation: Mutation }> = (props) => {
|
|
1141
1143
|
const theme = useTheme()
|
|
1142
1144
|
const styles = createMemo(() => {
|
|
1143
1145
|
return theme() === 'dark' ? darkStyles : lightStyles
|
|
@@ -1245,7 +1247,7 @@ export const MutationRow: Component<{ mutation: Mutation }> = (props) => {
|
|
|
1245
1247
|
)
|
|
1246
1248
|
}
|
|
1247
1249
|
|
|
1248
|
-
|
|
1250
|
+
const QueryStatusCount: Component = () => {
|
|
1249
1251
|
const stale = createSubscribeToQueryCacheBatcher(
|
|
1250
1252
|
(queryCache) =>
|
|
1251
1253
|
queryCache()
|
|
@@ -1299,7 +1301,7 @@ export const QueryStatusCount: Component = () => {
|
|
|
1299
1301
|
)
|
|
1300
1302
|
}
|
|
1301
1303
|
|
|
1302
|
-
|
|
1304
|
+
const MutationStatusCount: Component = () => {
|
|
1303
1305
|
const success = createSubscribeToMutationCacheBatcher(
|
|
1304
1306
|
(mutationCache) =>
|
|
1305
1307
|
mutationCache()
|
|
@@ -1369,7 +1371,7 @@ export const MutationStatusCount: Component = () => {
|
|
|
1369
1371
|
)
|
|
1370
1372
|
}
|
|
1371
1373
|
|
|
1372
|
-
|
|
1374
|
+
const QueryStatus: Component<QueryStatusProps> = (props) => {
|
|
1373
1375
|
const theme = useTheme()
|
|
1374
1376
|
const styles = createMemo(() => {
|
|
1375
1377
|
return theme() === 'dark' ? darkStyles : lightStyles
|
package/src/Explorer.tsx
CHANGED
|
@@ -22,7 +22,7 @@ import type { Query } from '@tanstack/query-core'
|
|
|
22
22
|
* @example
|
|
23
23
|
* chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]
|
|
24
24
|
*/
|
|
25
|
-
|
|
25
|
+
function chunkArray<T extends { label: string; value: unknown }>(
|
|
26
26
|
array: Array<T>,
|
|
27
27
|
size: number,
|
|
28
28
|
): Array<Array<T>> {
|
|
@@ -554,6 +554,7 @@ const stylesFactory = (theme: 'light' | 'dark') => {
|
|
|
554
554
|
`,
|
|
555
555
|
label: css`
|
|
556
556
|
color: ${t(colors.gray[700], colors.gray[300])};
|
|
557
|
+
white-space: nowrap;
|
|
557
558
|
`,
|
|
558
559
|
value: css`
|
|
559
560
|
color: ${t(colors.purple[600], colors.purple[400])};
|
package/src/index.tsx
CHANGED
|
@@ -5,7 +5,7 @@ import type {
|
|
|
5
5
|
QueryClient,
|
|
6
6
|
onlineManager as TonlineManager,
|
|
7
7
|
} from '@tanstack/query-core'
|
|
8
|
-
import type {
|
|
8
|
+
import type { DevtoolsComponentType } from './Devtools'
|
|
9
9
|
import type {
|
|
10
10
|
DevToolsErrorType,
|
|
11
11
|
DevtoolsButtonPosition,
|
|
@@ -30,7 +30,7 @@ class TanstackQueryDevtools {
|
|
|
30
30
|
#position: Signal<DevtoolsPosition | undefined>
|
|
31
31
|
#initialIsOpen: Signal<boolean | undefined>
|
|
32
32
|
#errorTypes: Signal<Array<DevToolsErrorType> | undefined>
|
|
33
|
-
#Component:
|
|
33
|
+
#Component: DevtoolsComponentType | undefined
|
|
34
34
|
#dispose?: () => void
|
|
35
35
|
|
|
36
36
|
constructor(config: TanstackQueryDevtoolsConfig) {
|
|
@@ -86,7 +86,7 @@ class TanstackQueryDevtools {
|
|
|
86
86
|
const [isOpen] = this.#initialIsOpen
|
|
87
87
|
const [errors] = this.#errorTypes
|
|
88
88
|
const [queryClient] = this.#client
|
|
89
|
-
let Devtools:
|
|
89
|
+
let Devtools: DevtoolsComponentType
|
|
90
90
|
|
|
91
91
|
if (this.#Component) {
|
|
92
92
|
Devtools = this.#Component
|
package/src/theme.ts
CHANGED
|
@@ -309,15 +309,3 @@ export const tokens = {
|
|
|
309
309
|
tooltip: 1800,
|
|
310
310
|
},
|
|
311
311
|
}
|
|
312
|
-
|
|
313
|
-
export type ThemeConfigType = typeof tokens
|
|
314
|
-
export type ThemeColorsAll = {
|
|
315
|
-
[key in keyof ThemeConfigType['colors']]: key
|
|
316
|
-
}[keyof ThemeConfigType['colors']]
|
|
317
|
-
export type AtomicThemeColors =
|
|
318
|
-
| 'white'
|
|
319
|
-
| 'black'
|
|
320
|
-
| 'transparent'
|
|
321
|
-
| 'current'
|
|
322
|
-
| 'inherit'
|
|
323
|
-
export type ThemeColors = Exclude<ThemeColorsAll, AtomicThemeColors>
|
package/src/utils.tsx
CHANGED
|
@@ -15,14 +15,7 @@ export function getQueryStatusLabel(query: Query) {
|
|
|
15
15
|
: 'fresh'
|
|
16
16
|
}
|
|
17
17
|
|
|
18
|
-
|
|
19
|
-
'fresh',
|
|
20
|
-
'stale',
|
|
21
|
-
'paused',
|
|
22
|
-
'inactive',
|
|
23
|
-
'fetching',
|
|
24
|
-
] as const
|
|
25
|
-
export type IQueryStatusLabel = (typeof queryStatusLabels)[number]
|
|
18
|
+
type QueryStatusLabel = 'fresh' | 'stale' | 'paused' | 'inactive' | 'fetching'
|
|
26
19
|
|
|
27
20
|
export function getSidedProp<T extends string>(
|
|
28
21
|
prop: T,
|
|
@@ -71,7 +64,7 @@ export function getMutationStatusColor({
|
|
|
71
64
|
: 'gray'
|
|
72
65
|
}
|
|
73
66
|
|
|
74
|
-
export function getQueryStatusColorByLabel(label:
|
|
67
|
+
export function getQueryStatusColorByLabel(label: QueryStatusLabel) {
|
|
75
68
|
return label === 'fresh'
|
|
76
69
|
? 'green'
|
|
77
70
|
: label === 'stale'
|
|
@@ -156,8 +149,6 @@ export const convertRemToPixels = (rem: number) => {
|
|
|
156
149
|
return rem * parseFloat(getComputedStyle(document.documentElement).fontSize)
|
|
157
150
|
}
|
|
158
151
|
|
|
159
|
-
export const convertPixelsToRem = (px: number) => px / convertRemToPixels(1)
|
|
160
|
-
|
|
161
152
|
export const getPreferredColorScheme = () => {
|
|
162
153
|
const [colorScheme, setColorScheme] = createSignal<'light' | 'dark'>('dark')
|
|
163
154
|
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|