@tanstack/solid-query-devtools 5.101.4 → 5.102.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/dev.cjs +25 -163
- package/build/dev.js +22 -23
- package/build/dev.jsx +23 -38
- package/build/devtools-BFGGY7dV.cjs +57 -0
- package/build/devtools-C2-vOvXZ.js +57 -0
- package/build/devtools-CXrmuwV8.jsx +50 -0
- package/build/devtools-ZLm3XMpi.js +2 -0
- package/build/devtools-ZLm3XMpi.js.map +1 -0
- package/build/devtools-g4uuc_il.cjs +1 -0
- package/build/devtoolsPanel-BrOMNzf2.cjs +1 -0
- package/build/devtoolsPanel-CLvDG9kV.cjs +52 -0
- package/build/devtoolsPanel-CjUh_Osq.jsx +47 -0
- package/build/devtoolsPanel-Dk1_K0ko.js +52 -0
- package/build/devtoolsPanel-GNd-i8LJ.js +2 -0
- package/build/devtoolsPanel-GNd-i8LJ.js.map +1 -0
- package/build/index.cjs +1 -167
- package/build/index.d.cts +88 -86
- package/build/index.d.cts.map +1 -0
- package/build/index.d.ts +88 -86
- package/build/index.d.ts.map +1 -0
- package/build/index.js +2 -28
- package/build/index.js.map +1 -0
- package/build/index.jsx +23 -38
- package/package.json +8 -10
- package/build/devtools/32HRKFKI.jsx +0 -55
- package/build/devtools/BCD44V6M.js +0 -62
- package/build/devtoolsPanel/NDFIDQLQ.jsx +0 -50
- package/build/devtoolsPanel/VOW4J2DZ.js +0 -61
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"devtoolsPanel-GNd-i8LJ.js","names":["createEffect","createMemo","onCleanup","onMount","onlineManager","useQueryClient","TanstackQueryDevtoolsPanel","DevtoolsErrorType","Theme","QueryClient","JSX","DevtoolsPanelOptions","client","errorTypes","Array","styleNonce","shadowDOMTarget","ShadowRoot","style","CSSProperties","onClose","hideDisabledQueries","theme","SolidQueryDevtoolsPanel","props","queryClient","ref","HTMLDivElement","devtools","queryFlavor","version","buttonPosition","position","initialIsOpen","setClient","setOnClose","setErrorTypes","setTheme","mount","unmount","_el$","_tmpl$","_ref$","_$use","_$effect","_$p","_$style"],"sources":["../src/devtoolsPanel.tsx"],"sourcesContent":["import { createEffect, createMemo, onCleanup, onMount } from 'solid-js'\nimport { onlineManager, useQueryClient } from '@tanstack/solid-query'\nimport { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type { DevtoolsErrorType, Theme } from '@tanstack/query-devtools'\nimport type { QueryClient } from '@tanstack/solid-query'\nimport type { JSX } from 'solid-js'\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 so you can attach the devtool's styles to specific element in the DOM.\n */\n shadowDOMTarget?: ShadowRoot\n\n /**\n * Custom styles for the devtools panel\n * @default { height: '500px' }\n * @example { height: '100%' }\n * @example { height: '100%', width: '100%' }\n */\n style?: JSX.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 * Defaults to 'system'.\n */\n theme?: Theme\n}\n\nexport default function SolidQueryDevtoolsPanel(props: DevtoolsPanelOptions) {\n const queryClient = useQueryClient(props.client)\n const client = createMemo(() => queryClient)\n let ref!: HTMLDivElement\n const { errorTypes, styleNonce, shadowDOMTarget, hideDisabledQueries } = props\n const devtools = new TanstackQueryDevtoolsPanel({\n client: client(),\n queryFlavor: 'Solid 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: props.theme,\n })\n createEffect(() => {\n devtools.setClient(client())\n })\n createEffect(() => {\n devtools.setOnClose(props.onClose ?? (() => {}))\n })\n\n createEffect(() => {\n devtools.setErrorTypes(props.errorTypes || [])\n })\n\n createEffect(() => {\n devtools.setTheme(props.theme || 'system')\n })\n\n onMount(() => {\n devtools.mount(ref)\n onCleanup(() => devtools.unmount())\n })\n\n return (\n <div\n style={{ height: '500px', ...props.style }}\n class=\"tsqd-parent-container\"\n ref={ref}\n />\n )\n}\n"],"mappings":"4WAgDA,SAAwBuB,EAAwBC,EAA6B,CAC3E,IAAMC,EAAcpB,EAAemB,EAAMZ,MAAM,EACzCA,EAASX,MAAiBwB,CAAW,EACvCC,EACE,CAAEb,aAAYE,aAAYC,kBAAiBK,uBAAwBG,EACnEI,EAAW,IAAItB,EAA2B,CAC9CM,OAAQA,EAAO,EACfiB,YAAa,cACbC,QAAS,IACT1B,gBACA2B,eAAgB,cAChBC,SAAU,SACVC,cAAe,GACfpB,aACAE,aACAC,kBACAI,QAASI,EAAMJ,QACfC,sBACAC,MAAOE,EAAMF,KACf,CAAC,EAqBD,OApBAtB,MAAmB,CACjB4B,EAASM,UAAUtB,EAAO,CAAC,CAC7B,CAAC,EACDZ,MAAmB,CACjB4B,EAASO,WAAWX,EAAMJ,cAAkB,CAAC,EAAE,CACjD,CAAC,EAEDpB,MAAmB,CACjB4B,EAASQ,cAAcZ,EAAMX,YAAc,CAAA,CAAE,CAC/C,CAAC,EAEDb,MAAmB,CACjB4B,EAASS,SAASb,EAAMF,OAAS,QAAQ,CAC3C,CAAC,EAEDnB,MAAc,CACZyB,EAASU,MAAMZ,CAAG,EAClBxB,MAAgB0B,EAASW,QAAQ,CAAC,CACpC,CAAC,OAED,CAAA,IAAAC,EAAAC,EAAA,EAAAC,EAIShB,EAFqC,OAElC,OAAAgB,GAAA,WAAAC,EAAAD,EAAAF,CAAA,EAAHd,EAAGc,EAAAI,EAAAC,GAAAC,EAAAN,EAFD,CAAmB,GAAGhB,EAAMN,KAAM,EAAC2B,CAAA,CAAA,EAAAL,CAAA,EAAA,CAAA,CAKhD"}
|
package/build/index.cjs
CHANGED
|
@@ -1,167 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
var web = require('solid-js/web');
|
|
4
|
-
var solidJs = require('solid-js');
|
|
5
|
-
var solidQuery = require('@tanstack/solid-query');
|
|
6
|
-
var queryDevtools = require('@tanstack/query-devtools');
|
|
7
|
-
|
|
8
|
-
var __defProp = Object.defineProperty;
|
|
9
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
10
|
-
var __esm = (fn, res) => function __init() {
|
|
11
|
-
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
12
|
-
};
|
|
13
|
-
var __export = (target, all) => {
|
|
14
|
-
for (var name in all)
|
|
15
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
// src/devtools.tsx
|
|
19
|
-
var devtools_exports = {};
|
|
20
|
-
__export(devtools_exports, {
|
|
21
|
-
default: () => SolidQueryDevtools
|
|
22
|
-
});
|
|
23
|
-
function SolidQueryDevtools(props) {
|
|
24
|
-
const queryClient = solidQuery.useQueryClient(props.client);
|
|
25
|
-
const client = solidJs.createMemo(() => queryClient);
|
|
26
|
-
let ref;
|
|
27
|
-
const devtools = new queryDevtools.TanstackQueryDevtools({
|
|
28
|
-
client: client(),
|
|
29
|
-
queryFlavor: "Solid Query",
|
|
30
|
-
version: "5",
|
|
31
|
-
onlineManager: solidQuery.onlineManager,
|
|
32
|
-
buttonPosition: props.buttonPosition,
|
|
33
|
-
position: props.position,
|
|
34
|
-
initialIsOpen: props.initialIsOpen,
|
|
35
|
-
errorTypes: props.errorTypes,
|
|
36
|
-
styleNonce: props.styleNonce,
|
|
37
|
-
shadowDOMTarget: props.shadowDOMTarget,
|
|
38
|
-
hideDisabledQueries: props.hideDisabledQueries,
|
|
39
|
-
theme: props.theme
|
|
40
|
-
});
|
|
41
|
-
solidJs.createEffect(() => {
|
|
42
|
-
devtools.setClient(client());
|
|
43
|
-
});
|
|
44
|
-
solidJs.createEffect(() => {
|
|
45
|
-
const buttonPos = props.buttonPosition;
|
|
46
|
-
if (buttonPos) {
|
|
47
|
-
devtools.setButtonPosition(buttonPos);
|
|
48
|
-
}
|
|
49
|
-
});
|
|
50
|
-
solidJs.createEffect(() => {
|
|
51
|
-
const pos = props.position;
|
|
52
|
-
if (pos) {
|
|
53
|
-
devtools.setPosition(pos);
|
|
54
|
-
}
|
|
55
|
-
});
|
|
56
|
-
solidJs.createEffect(() => {
|
|
57
|
-
devtools.setInitialIsOpen(props.initialIsOpen || false);
|
|
58
|
-
});
|
|
59
|
-
solidJs.createEffect(() => {
|
|
60
|
-
devtools.setErrorTypes(props.errorTypes || []);
|
|
61
|
-
});
|
|
62
|
-
solidJs.createEffect(() => {
|
|
63
|
-
devtools.setTheme(props.theme || "system");
|
|
64
|
-
});
|
|
65
|
-
solidJs.onMount(() => {
|
|
66
|
-
devtools.mount(ref);
|
|
67
|
-
solidJs.onCleanup(() => devtools.unmount());
|
|
68
|
-
});
|
|
69
|
-
return (() => {
|
|
70
|
-
var _el$ = _tmpl$();
|
|
71
|
-
var _ref$ = ref;
|
|
72
|
-
typeof _ref$ === "function" ? web.use(_ref$, _el$) : ref = _el$;
|
|
73
|
-
return _el$;
|
|
74
|
-
})();
|
|
75
|
-
}
|
|
76
|
-
var _tmpl$;
|
|
77
|
-
var init_devtools = __esm({
|
|
78
|
-
"src/devtools.tsx"() {
|
|
79
|
-
_tmpl$ = /* @__PURE__ */ web.template(`<div class=tsqd-parent-container>`);
|
|
80
|
-
}
|
|
81
|
-
});
|
|
82
|
-
|
|
83
|
-
// src/devtoolsPanel.tsx
|
|
84
|
-
var devtoolsPanel_exports = {};
|
|
85
|
-
__export(devtoolsPanel_exports, {
|
|
86
|
-
default: () => SolidQueryDevtoolsPanel
|
|
87
|
-
});
|
|
88
|
-
function SolidQueryDevtoolsPanel(props) {
|
|
89
|
-
const queryClient = solidQuery.useQueryClient(props.client);
|
|
90
|
-
const client = solidJs.createMemo(() => queryClient);
|
|
91
|
-
let ref;
|
|
92
|
-
const {
|
|
93
|
-
errorTypes,
|
|
94
|
-
styleNonce,
|
|
95
|
-
shadowDOMTarget,
|
|
96
|
-
hideDisabledQueries
|
|
97
|
-
} = props;
|
|
98
|
-
const devtools = new queryDevtools.TanstackQueryDevtoolsPanel({
|
|
99
|
-
client: client(),
|
|
100
|
-
queryFlavor: "Solid Query",
|
|
101
|
-
version: "5",
|
|
102
|
-
onlineManager: solidQuery.onlineManager,
|
|
103
|
-
buttonPosition: "bottom-left",
|
|
104
|
-
position: "bottom",
|
|
105
|
-
initialIsOpen: true,
|
|
106
|
-
errorTypes,
|
|
107
|
-
styleNonce,
|
|
108
|
-
shadowDOMTarget,
|
|
109
|
-
onClose: props.onClose,
|
|
110
|
-
hideDisabledQueries,
|
|
111
|
-
theme: props.theme
|
|
112
|
-
});
|
|
113
|
-
solidJs.createEffect(() => {
|
|
114
|
-
devtools.setClient(client());
|
|
115
|
-
});
|
|
116
|
-
solidJs.createEffect(() => {
|
|
117
|
-
devtools.setOnClose(props.onClose ?? (() => {
|
|
118
|
-
}));
|
|
119
|
-
});
|
|
120
|
-
solidJs.createEffect(() => {
|
|
121
|
-
devtools.setErrorTypes(props.errorTypes || []);
|
|
122
|
-
});
|
|
123
|
-
solidJs.createEffect(() => {
|
|
124
|
-
devtools.setTheme(props.theme || "system");
|
|
125
|
-
});
|
|
126
|
-
solidJs.onMount(() => {
|
|
127
|
-
devtools.mount(ref);
|
|
128
|
-
solidJs.onCleanup(() => devtools.unmount());
|
|
129
|
-
});
|
|
130
|
-
return (() => {
|
|
131
|
-
var _el$ = _tmpl$2();
|
|
132
|
-
var _ref$ = ref;
|
|
133
|
-
typeof _ref$ === "function" ? web.use(_ref$, _el$) : ref = _el$;
|
|
134
|
-
web.effect((_$p) => web.style(_el$, {
|
|
135
|
-
...props.style
|
|
136
|
-
}, _$p));
|
|
137
|
-
return _el$;
|
|
138
|
-
})();
|
|
139
|
-
}
|
|
140
|
-
var _tmpl$2;
|
|
141
|
-
var init_devtoolsPanel = __esm({
|
|
142
|
-
"src/devtoolsPanel.tsx"() {
|
|
143
|
-
_tmpl$2 = /* @__PURE__ */ web.template(`<div class=tsqd-parent-container style=height:500px>`);
|
|
144
|
-
}
|
|
145
|
-
});
|
|
146
|
-
function clientOnly(fn) {
|
|
147
|
-
if (web.isServer) return (props) => props.fallback;
|
|
148
|
-
const [comp, setComp] = solidJs.createSignal();
|
|
149
|
-
fn().then((m) => setComp(() => m.default));
|
|
150
|
-
return (props) => {
|
|
151
|
-
let Comp;
|
|
152
|
-
let m;
|
|
153
|
-
const [, rest] = solidJs.splitProps(props, ["fallback"]);
|
|
154
|
-
if ((Comp = comp()) && !solidJs.sharedConfig.context) return Comp(rest);
|
|
155
|
-
const [mounted, setMounted] = solidJs.createSignal(!solidJs.sharedConfig.context);
|
|
156
|
-
solidJs.onMount(() => setMounted(true));
|
|
157
|
-
return solidJs.createMemo(() => (Comp = comp(), m = mounted(), solidJs.untrack(() => Comp && m ? Comp(rest) : props.fallback)));
|
|
158
|
-
};
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
// src/index.tsx
|
|
162
|
-
exports.SolidQueryDevtools = web.isDev ? clientOnly(() => Promise.resolve().then(() => (init_devtools(), devtools_exports))) : function() {
|
|
163
|
-
return null;
|
|
164
|
-
};
|
|
165
|
-
exports.SolidQueryDevtoolsPanel = web.isDev ? clientOnly(() => Promise.resolve().then(() => (init_devtoolsPanel(), devtoolsPanel_exports))) : function() {
|
|
166
|
-
return null;
|
|
167
|
-
};
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("solid-js/web"),t=require("solid-js");function n(n){if(e.isServer)return e=>e.fallback;let[r,i]=(0,t.createSignal)();return n().then(e=>i(()=>e.default)),e=>{let n,i,[,a]=(0,t.splitProps)(e,[`fallback`]);if((n=r())&&!t.sharedConfig.context)return n(a);let[o,s]=(0,t.createSignal)(!t.sharedConfig.context);return(0,t.onMount)(()=>s(!0)),(0,t.createMemo)(()=>(n=r(),i=o(),(0,t.untrack)(()=>n&&i?n(a):e.fallback)))}}const r=e.isDev?n(()=>Promise.resolve().then(()=>require("./devtools-g4uuc_il.cjs"))):function(){return null},i=e.isDev?n(()=>Promise.resolve().then(()=>require("./devtoolsPanel-BrOMNzf2.cjs"))):function(){return null};exports.SolidQueryDevtools=r,exports.SolidQueryDevtoolsPanel=i;
|
package/build/index.d.cts
CHANGED
|
@@ -1,94 +1,96 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import { DevtoolsButtonPosition, DevtoolsErrorType, DevtoolsPosition, Theme } from "@tanstack/query-devtools";
|
|
2
|
+
import { QueryClient } from "@tanstack/solid-query";
|
|
3
|
+
import { JSX } from "solid-js";
|
|
4
|
+
//#region src/devtools.d.ts
|
|
6
5
|
interface DevtoolsOptions {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
6
|
+
/**
|
|
7
|
+
* Set this true if you want the dev tools to default to being open
|
|
8
|
+
*/
|
|
9
|
+
initialIsOpen?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* The position of the TanStack logo to open and close the devtools panel.
|
|
12
|
+
* 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'
|
|
13
|
+
* Defaults to 'bottom-right'.
|
|
14
|
+
*/
|
|
15
|
+
buttonPosition?: DevtoolsButtonPosition;
|
|
16
|
+
/**
|
|
17
|
+
* The position of the Solid Query devtools panel.
|
|
18
|
+
* 'top' | 'bottom' | 'left' | 'right'
|
|
19
|
+
* Defaults to 'bottom'.
|
|
20
|
+
*/
|
|
21
|
+
position?: DevtoolsPosition;
|
|
22
|
+
/**
|
|
23
|
+
* Custom instance of QueryClient
|
|
24
|
+
*/
|
|
25
|
+
client?: QueryClient;
|
|
26
|
+
/**
|
|
27
|
+
* Use this so you can define custom errors that can be shown in the devtools.
|
|
28
|
+
*/
|
|
29
|
+
errorTypes?: Array<DevtoolsErrorType>;
|
|
30
|
+
/**
|
|
31
|
+
* 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.
|
|
32
|
+
*/
|
|
33
|
+
styleNonce?: string;
|
|
34
|
+
/**
|
|
35
|
+
* Use this so you can attach the devtool's styles to specific element in the DOM.
|
|
36
|
+
*/
|
|
37
|
+
shadowDOMTarget?: ShadowRoot;
|
|
38
|
+
/**
|
|
39
|
+
* Set this to true to hide disabled queries from the devtools panel.
|
|
40
|
+
*/
|
|
41
|
+
hideDisabledQueries?: boolean;
|
|
42
|
+
/**
|
|
43
|
+
* Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.
|
|
44
|
+
* Defaults to 'system'.
|
|
45
|
+
*/
|
|
46
|
+
theme?: Theme;
|
|
48
47
|
}
|
|
49
|
-
declare function SolidQueryDevtools$1(props: DevtoolsOptions):
|
|
50
|
-
|
|
48
|
+
declare function SolidQueryDevtools$1(props: DevtoolsOptions): import("solid-js").JSX.Element;
|
|
49
|
+
//#endregion
|
|
50
|
+
//#region src/devtoolsPanel.d.ts
|
|
51
51
|
interface DevtoolsPanelOptions {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
52
|
+
/**
|
|
53
|
+
* Custom instance of QueryClient
|
|
54
|
+
*/
|
|
55
|
+
client?: QueryClient;
|
|
56
|
+
/**
|
|
57
|
+
* Use this so you can define custom errors that can be shown in the devtools.
|
|
58
|
+
*/
|
|
59
|
+
errorTypes?: Array<DevtoolsErrorType>;
|
|
60
|
+
/**
|
|
61
|
+
* 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.
|
|
62
|
+
*/
|
|
63
|
+
styleNonce?: string;
|
|
64
|
+
/**
|
|
65
|
+
* Use this so you can attach the devtool's styles to specific element in the DOM.
|
|
66
|
+
*/
|
|
67
|
+
shadowDOMTarget?: ShadowRoot;
|
|
68
|
+
/**
|
|
69
|
+
* Custom styles for the devtools panel
|
|
70
|
+
* @default { height: '500px' }
|
|
71
|
+
* @example { height: '100%' }
|
|
72
|
+
* @example { height: '100%', width: '100%' }
|
|
73
|
+
*/
|
|
74
|
+
style?: JSX.CSSProperties;
|
|
75
|
+
/**
|
|
76
|
+
* Callback function that is called when the devtools panel is closed
|
|
77
|
+
*/
|
|
78
|
+
onClose?: () => void;
|
|
79
|
+
/**
|
|
80
|
+
* Set this to true to hide disabled queries from the devtools panel.
|
|
81
|
+
*/
|
|
82
|
+
hideDisabledQueries?: boolean;
|
|
83
|
+
/**
|
|
84
|
+
* Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.
|
|
85
|
+
* Defaults to 'system'.
|
|
86
|
+
*/
|
|
87
|
+
theme?: Theme;
|
|
88
88
|
}
|
|
89
89
|
declare function SolidQueryDevtoolsPanel$1(props: DevtoolsPanelOptions): JSX.Element;
|
|
90
|
-
|
|
90
|
+
//#endregion
|
|
91
|
+
//#region src/index.d.ts
|
|
91
92
|
declare const SolidQueryDevtools: typeof SolidQueryDevtools$1;
|
|
92
93
|
declare const SolidQueryDevtoolsPanel: typeof SolidQueryDevtoolsPanel$1;
|
|
93
|
-
|
|
94
|
+
//#endregion
|
|
94
95
|
export { type DevtoolsPanelOptions, SolidQueryDevtools, SolidQueryDevtoolsPanel };
|
|
96
|
+
//# sourceMappingURL=index.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","names":[],"sources":["../src/devtools.tsx","../src/devtoolsPanel.tsx","../src/index.tsx"],"mappings":";;;;UAWU;;;;EAIR;;;;;;EAMA,iBAAiB;;;;;;EAMjB,WAAW;;;;EAIX,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;EAIA,kBAAkB;;;;EAIlB;;;;;EAKA,QAAQ;;iBAGc,qBAAmB,OAAO,qCAAe,IAAA;;;UChDhD;;;;EAIf,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;EAIA,kBAAkB;;;;;;;EAQlB,QAAQ,IAAI;;;;EAKZ;;;;EAIA;;;;;EAKA,QAAQ;;iBAGc,0BAAwB,OAAO,uBAAoB,IAAA;;;cC3C9D,2BAA2B;cAM3B,gCAAgC"}
|
package/build/index.d.ts
CHANGED
|
@@ -1,94 +1,96 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
import { DevtoolsButtonPosition,
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
import { JSX } from "solid-js";
|
|
2
|
+
import { QueryClient } from "@tanstack/solid-query";
|
|
3
|
+
import { DevtoolsButtonPosition, DevtoolsErrorType, DevtoolsPosition, Theme } from "@tanstack/query-devtools";
|
|
4
|
+
//#region src/devtools.d.ts
|
|
6
5
|
interface DevtoolsOptions {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
6
|
+
/**
|
|
7
|
+
* Set this true if you want the dev tools to default to being open
|
|
8
|
+
*/
|
|
9
|
+
initialIsOpen?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* The position of the TanStack logo to open and close the devtools panel.
|
|
12
|
+
* 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'relative'
|
|
13
|
+
* Defaults to 'bottom-right'.
|
|
14
|
+
*/
|
|
15
|
+
buttonPosition?: DevtoolsButtonPosition;
|
|
16
|
+
/**
|
|
17
|
+
* The position of the Solid Query devtools panel.
|
|
18
|
+
* 'top' | 'bottom' | 'left' | 'right'
|
|
19
|
+
* Defaults to 'bottom'.
|
|
20
|
+
*/
|
|
21
|
+
position?: DevtoolsPosition;
|
|
22
|
+
/**
|
|
23
|
+
* Custom instance of QueryClient
|
|
24
|
+
*/
|
|
25
|
+
client?: QueryClient;
|
|
26
|
+
/**
|
|
27
|
+
* Use this so you can define custom errors that can be shown in the devtools.
|
|
28
|
+
*/
|
|
29
|
+
errorTypes?: Array<DevtoolsErrorType>;
|
|
30
|
+
/**
|
|
31
|
+
* 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.
|
|
32
|
+
*/
|
|
33
|
+
styleNonce?: string;
|
|
34
|
+
/**
|
|
35
|
+
* Use this so you can attach the devtool's styles to specific element in the DOM.
|
|
36
|
+
*/
|
|
37
|
+
shadowDOMTarget?: ShadowRoot;
|
|
38
|
+
/**
|
|
39
|
+
* Set this to true to hide disabled queries from the devtools panel.
|
|
40
|
+
*/
|
|
41
|
+
hideDisabledQueries?: boolean;
|
|
42
|
+
/**
|
|
43
|
+
* Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.
|
|
44
|
+
* Defaults to 'system'.
|
|
45
|
+
*/
|
|
46
|
+
theme?: Theme;
|
|
48
47
|
}
|
|
49
|
-
declare function SolidQueryDevtools$1(props: DevtoolsOptions):
|
|
50
|
-
|
|
48
|
+
declare function SolidQueryDevtools$1(props: DevtoolsOptions): import("solid-js").JSX.Element;
|
|
49
|
+
//#endregion
|
|
50
|
+
//#region src/devtoolsPanel.d.ts
|
|
51
51
|
interface DevtoolsPanelOptions {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
52
|
+
/**
|
|
53
|
+
* Custom instance of QueryClient
|
|
54
|
+
*/
|
|
55
|
+
client?: QueryClient;
|
|
56
|
+
/**
|
|
57
|
+
* Use this so you can define custom errors that can be shown in the devtools.
|
|
58
|
+
*/
|
|
59
|
+
errorTypes?: Array<DevtoolsErrorType>;
|
|
60
|
+
/**
|
|
61
|
+
* 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.
|
|
62
|
+
*/
|
|
63
|
+
styleNonce?: string;
|
|
64
|
+
/**
|
|
65
|
+
* Use this so you can attach the devtool's styles to specific element in the DOM.
|
|
66
|
+
*/
|
|
67
|
+
shadowDOMTarget?: ShadowRoot;
|
|
68
|
+
/**
|
|
69
|
+
* Custom styles for the devtools panel
|
|
70
|
+
* @default { height: '500px' }
|
|
71
|
+
* @example { height: '100%' }
|
|
72
|
+
* @example { height: '100%', width: '100%' }
|
|
73
|
+
*/
|
|
74
|
+
style?: JSX.CSSProperties;
|
|
75
|
+
/**
|
|
76
|
+
* Callback function that is called when the devtools panel is closed
|
|
77
|
+
*/
|
|
78
|
+
onClose?: () => void;
|
|
79
|
+
/**
|
|
80
|
+
* Set this to true to hide disabled queries from the devtools panel.
|
|
81
|
+
*/
|
|
82
|
+
hideDisabledQueries?: boolean;
|
|
83
|
+
/**
|
|
84
|
+
* Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.
|
|
85
|
+
* Defaults to 'system'.
|
|
86
|
+
*/
|
|
87
|
+
theme?: Theme;
|
|
88
88
|
}
|
|
89
89
|
declare function SolidQueryDevtoolsPanel$1(props: DevtoolsPanelOptions): JSX.Element;
|
|
90
|
-
|
|
90
|
+
//#endregion
|
|
91
|
+
//#region src/index.d.ts
|
|
91
92
|
declare const SolidQueryDevtools: typeof SolidQueryDevtools$1;
|
|
92
93
|
declare const SolidQueryDevtoolsPanel: typeof SolidQueryDevtoolsPanel$1;
|
|
93
|
-
|
|
94
|
+
//#endregion
|
|
94
95
|
export { type DevtoolsPanelOptions, SolidQueryDevtools, SolidQueryDevtoolsPanel };
|
|
96
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","names":[],"sources":["../src/devtools.tsx","../src/devtoolsPanel.tsx","../src/index.tsx"],"mappings":";;;;UAWU;;;;EAIR;;;;;;EAMA,iBAAiB;;;;;;EAMjB,WAAW;;;;EAIX,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;EAIA,kBAAkB;;;;EAIlB;;;;;EAKA,QAAQ;;iBAGc,qBAAmB,OAAO,qCAAe,IAAA;;;UChDhD;;;;EAIf,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;EAIA,kBAAkB;;;;;;;EAQlB,QAAQ,IAAI;;;;EAKZ;;;;EAIA;;;;;EAKA,QAAQ;;iBAGc,0BAAwB,OAAO,uBAAoB,IAAA;;;cC3C9D,2BAA2B;cAM3B,gCAAgC"}
|
package/build/index.js
CHANGED
|
@@ -1,28 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
// src/index.tsx
|
|
5
|
-
function clientOnly(fn) {
|
|
6
|
-
if (isServer) return (props) => props.fallback;
|
|
7
|
-
const [comp, setComp] = createSignal();
|
|
8
|
-
fn().then((m) => setComp(() => m.default));
|
|
9
|
-
return (props) => {
|
|
10
|
-
let Comp;
|
|
11
|
-
let m;
|
|
12
|
-
const [, rest] = splitProps(props, ["fallback"]);
|
|
13
|
-
if ((Comp = comp()) && !sharedConfig.context) return Comp(rest);
|
|
14
|
-
const [mounted, setMounted] = createSignal(!sharedConfig.context);
|
|
15
|
-
onMount(() => setMounted(true));
|
|
16
|
-
return createMemo(() => (Comp = comp(), m = mounted(), untrack(() => Comp && m ? Comp(rest) : props.fallback)));
|
|
17
|
-
};
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
// src/index.tsx
|
|
21
|
-
var SolidQueryDevtools = isDev ? clientOnly(() => import('./devtools/BCD44V6M.js')) : function() {
|
|
22
|
-
return null;
|
|
23
|
-
};
|
|
24
|
-
var SolidQueryDevtoolsPanel = isDev ? clientOnly(() => import('./devtoolsPanel/VOW4J2DZ.js')) : function() {
|
|
25
|
-
return null;
|
|
26
|
-
};
|
|
27
|
-
|
|
28
|
-
export { SolidQueryDevtools, SolidQueryDevtoolsPanel };
|
|
1
|
+
import{isDev as e,isServer as t}from"solid-js/web";import{createMemo as n,createSignal as r,onMount as i,sharedConfig as a,splitProps as o,untrack as s}from"solid-js";function c(e){if(t)return e=>e.fallback;let[c,l]=r();return e().then(e=>l(()=>e.default)),e=>{let t,l,[,u]=o(e,[`fallback`]);if((t=c())&&!a.context)return t(u);let[d,f]=r(!a.context);return i(()=>f(!0)),n(()=>(t=c(),l=d(),s(()=>t&&l?t(u):e.fallback)))}}const l=e?c(()=>import(`./devtools-ZLm3XMpi.js`)):function(){return null},u=e?c(()=>import(`./devtoolsPanel-GNd-i8LJ.js`)):function(){return null};export{l as SolidQueryDevtools,u as SolidQueryDevtoolsPanel};
|
|
2
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["createMemo","createSignal","onMount","sharedConfig","splitProps","untrack","isServer","Component","ComponentProps","JSX","clientOnly","fn","Promise","default","T","props","fallback","Element","comp","setComp","then","m","Comp","rest","context","mounted","setMounted","isDev","clientOnly","SolidQueryDevtoolsComp","SolidQueryDevtoolsCompPanel","SolidQueryDevtools","SolidQueryDevtoolsPanel","DevtoolsPanelOptions"],"sources":["../src/clientOnly.tsx","../src/index.tsx"],"sourcesContent":["import {\n createMemo,\n createSignal,\n onMount,\n sharedConfig,\n splitProps,\n untrack,\n} from 'solid-js'\nimport { isServer } from 'solid-js/web'\nimport type { Component, ComponentProps, JSX } from 'solid-js'\n\n/*\n This function has been taken from solid-start's codebase\n This allows the devtools to be loaded only on the client and bypasses any server side rendering\n https://github.com/solidjs/solid-start/blob/2967fc2db3f0df826f061020231dbdafdfa0746b/packages/start/islands/clientOnly.tsx\n*/\nexport default function clientOnly<T extends Component<any>>(\n fn: () => Promise<{\n default: T\n }>,\n) {\n if (isServer)\n return (props: ComponentProps<T> & { fallback?: JSX.Element }) =>\n props.fallback\n\n const [comp, setComp] = createSignal<T>()\n fn().then((m) => setComp(() => m.default))\n return (props: ComponentProps<T>) => {\n let Comp: T | undefined\n let m: boolean\n const [, rest] = splitProps(props, ['fallback'])\n if ((Comp = comp()) && !sharedConfig.context) return Comp(rest)\n const [mounted, setMounted] = createSignal(!sharedConfig.context)\n onMount(() => setMounted(true))\n return createMemo(\n () => (\n (Comp = comp()),\n (m = mounted()),\n untrack(() => (Comp && m ? Comp(rest) : props.fallback))\n ),\n )\n }\n}\n","import { isDev } from 'solid-js/web'\nimport clientOnly from './clientOnly'\nimport type SolidQueryDevtoolsComp from './devtools'\nimport type SolidQueryDevtoolsCompPanel from './devtoolsPanel'\n\nexport const SolidQueryDevtools: typeof SolidQueryDevtoolsComp = isDev\n ? clientOnly(() => import('./devtools'))\n : function () {\n return null\n }\n\nexport const SolidQueryDevtoolsPanel: typeof SolidQueryDevtoolsCompPanel = isDev\n ? clientOnly(() => import('./devtoolsPanel'))\n : function () {\n return null\n }\n\nexport type { DevtoolsPanelOptions } from './devtoolsPanel'\n"],"mappings":"uKAgBA,SAAwBU,EACtBC,EAGA,CACA,GAAIL,EACF,MAAQS,IACNA,EAAMC,SAEV,GAAM,CAACE,EAAMC,GAAWlB,EAAgB,EAExC,OADAU,EAAG,CAAC,CAACS,KAAMC,GAAMF,MAAcE,EAAER,OAAO,CAAC,EACjCE,GAA6B,CACnC,IAAIO,EACAD,EACE,EAAGE,GAAQnB,EAAWW,EAAO,CAAC,UAAU,CAAC,EAC/C,IAAKO,EAAOJ,EAAK,IAAM,CAACf,EAAaqB,QAAS,OAAOF,EAAKC,CAAI,EAC9D,GAAM,CAACE,EAASC,GAAczB,EAAa,CAACE,EAAaqB,OAAO,EAEhE,OADAtB,MAAcwB,EAAW,EAAI,CAAC,EACvB1B,OAEFsB,EAAOJ,EAAK,EACZG,EAAII,EAAQ,EACbpB,MAAeiB,GAAQD,EAAIC,EAAKC,CAAI,EAAIR,EAAMC,QAAS,EAE3D,CACF,CACF,CCrCA,MAAae,EAAoDJ,EAC7DC,MAAiB,OAAO,yBAAa,EACrC,UAAY,CACV,OAAO,IACT,EAESI,EAA8DL,EACvEC,MAAiB,OAAO,8BAAkB,EAC1C,UAAY,CACV,OAAO,IACT"}
|