@tanstack/query-devtools 5.91.0 → 5.92.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/DevtoolsComponent/{TO44TVBA.js → CDWEKZTF.js} +1 -1
- package/build/DevtoolsComponent/{3Y4HR3WR.js → WDYDFRGG.js} +1 -1
- package/build/DevtoolsPanelComponent/{NZQXYXX4.js → 2SSKDMRQ.js} +1 -1
- package/build/DevtoolsPanelComponent/{YK4QRCEX.js → 5A54IY5X.js} +1 -1
- package/build/chunk/{ZDWCUMSJ.js → AP7HFJJL.js} +313 -246
- package/build/chunk/{2LDRPXKC.js → LZRB7T7H.js} +314 -246
- package/build/dev.cjs +314 -246
- package/build/dev.js +2 -2
- package/build/index.cjs +313 -246
- package/build/index.js +2 -2
- package/package.json +3 -3
- package/src/Devtools.tsx +286 -164
- package/src/Explorer.tsx +16 -2
- package/src/contexts/PiPContext.tsx +17 -5
package/build/dev.cjs
CHANGED
|
@@ -11950,7 +11950,7 @@ var init_QueryDevtoolsContext = __esm({
|
|
|
11950
11950
|
});
|
|
11951
11951
|
|
|
11952
11952
|
// src/contexts/PiPContext.tsx
|
|
11953
|
-
var PiPContext, PiPProvider, usePiPWindow;
|
|
11953
|
+
var PipOpenError, PiPContext, PiPProvider, usePiPWindow;
|
|
11954
11954
|
var init_PiPContext = __esm({
|
|
11955
11955
|
"src/contexts/PiPContext.tsx"() {
|
|
11956
11956
|
init_web();
|
|
@@ -11958,6 +11958,8 @@ var init_PiPContext = __esm({
|
|
|
11958
11958
|
init_web();
|
|
11959
11959
|
init_constants();
|
|
11960
11960
|
init_QueryDevtoolsContext();
|
|
11961
|
+
PipOpenError = class extends Error {
|
|
11962
|
+
};
|
|
11961
11963
|
PiPContext = createContext(void 0);
|
|
11962
11964
|
PiPProvider = (props) => {
|
|
11963
11965
|
const [pipWindow, setPipWindow] = createSignal(null);
|
|
@@ -11974,7 +11976,7 @@ var init_PiPContext = __esm({
|
|
|
11974
11976
|
}
|
|
11975
11977
|
const pip = window.open("", "TSQD-Devtools-Panel", `width=${width},height=${height},popup`);
|
|
11976
11978
|
if (!pip) {
|
|
11977
|
-
throw new
|
|
11979
|
+
throw new PipOpenError("Failed to open popup. Please allow popups for this site to view the devtools in picture-in-picture mode.");
|
|
11978
11980
|
}
|
|
11979
11981
|
pip.document.head.innerHTML = "";
|
|
11980
11982
|
pip.document.body.innerHTML = "";
|
|
@@ -12018,7 +12020,17 @@ var init_PiPContext = __esm({
|
|
|
12018
12020
|
createEffect(() => {
|
|
12019
12021
|
const pip_open = props.localStore.pip_open ?? "false";
|
|
12020
12022
|
if (pip_open === "true" && !props.disabled) {
|
|
12021
|
-
|
|
12023
|
+
try {
|
|
12024
|
+
requestPipWindow(Number(window.innerWidth), Number(props.localStore.height || PIP_DEFAULT_HEIGHT));
|
|
12025
|
+
} catch (error) {
|
|
12026
|
+
if (error instanceof PipOpenError) {
|
|
12027
|
+
console.error(error.message);
|
|
12028
|
+
props.setLocalStore("pip_open", "false");
|
|
12029
|
+
props.setLocalStore("open", "false");
|
|
12030
|
+
return;
|
|
12031
|
+
}
|
|
12032
|
+
throw error;
|
|
12033
|
+
}
|
|
12022
12034
|
}
|
|
12023
12035
|
});
|
|
12024
12036
|
createEffect(() => {
|
|
@@ -12155,6 +12167,7 @@ function Explorer(props) {
|
|
|
12155
12167
|
});
|
|
12156
12168
|
const subEntryPages = createMemo(() => chunkArray(subEntries(), 100));
|
|
12157
12169
|
const currentDataPath = props.dataPath ?? [];
|
|
12170
|
+
const inputId = createUniqueId();
|
|
12158
12171
|
return (() => {
|
|
12159
12172
|
var _el$6 = _tmpl$72();
|
|
12160
12173
|
insert(_el$6, createComponent(Show, {
|
|
@@ -12230,15 +12243,17 @@ function Explorer(props) {
|
|
|
12230
12243
|
}
|
|
12231
12244
|
}), null);
|
|
12232
12245
|
createRenderEffect((_p$) => {
|
|
12233
|
-
var _v$3 = styles().expanderButtonContainer, _v$4 = styles().expanderButton, _v$5 = styles().info;
|
|
12246
|
+
var _v$3 = styles().expanderButtonContainer, _v$4 = styles().expanderButton, _v$5 = expanded() ? "true" : "false", _v$6 = styles().info;
|
|
12234
12247
|
_v$3 !== _p$.e && className(_el$7, _p$.e = _v$3);
|
|
12235
12248
|
_v$4 !== _p$.t && className(_el$8, _p$.t = _v$4);
|
|
12236
|
-
_v$5 !== _p$.a &&
|
|
12249
|
+
_v$5 !== _p$.a && setAttribute(_el$8, "aria-expanded", _p$.a = _v$5);
|
|
12250
|
+
_v$6 !== _p$.o && className(_el$10, _p$.o = _v$6);
|
|
12237
12251
|
return _p$;
|
|
12238
12252
|
}, {
|
|
12239
12253
|
e: void 0,
|
|
12240
12254
|
t: void 0,
|
|
12241
|
-
a: void 0
|
|
12255
|
+
a: void 0,
|
|
12256
|
+
o: void 0
|
|
12242
12257
|
});
|
|
12243
12258
|
return _el$7;
|
|
12244
12259
|
})(), createComponent(Show, {
|
|
@@ -12343,9 +12358,9 @@ function Explorer(props) {
|
|
|
12343
12358
|
}
|
|
12344
12359
|
}), null);
|
|
12345
12360
|
createRenderEffect((_p$) => {
|
|
12346
|
-
var _v$
|
|
12347
|
-
_v$
|
|
12348
|
-
_v$
|
|
12361
|
+
var _v$1 = styles().entry, _v$10 = styles().expanderButton;
|
|
12362
|
+
_v$1 !== _p$.e && className(_el$22, _p$.e = _v$1);
|
|
12363
|
+
_v$10 !== _p$.t && className(_el$23, _p$.t = _v$10);
|
|
12349
12364
|
return _p$;
|
|
12350
12365
|
}, {
|
|
12351
12366
|
e: void 0,
|
|
@@ -12368,6 +12383,7 @@ function Explorer(props) {
|
|
|
12368
12383
|
},
|
|
12369
12384
|
get children() {
|
|
12370
12385
|
var _el$16 = _tmpl$110(), _el$17 = _el$16.firstChild, _el$18 = _el$17.firstChild;
|
|
12386
|
+
setAttribute(_el$17, "for", inputId);
|
|
12371
12387
|
insert(_el$17, () => props.label, _el$18);
|
|
12372
12388
|
insert(_el$16, createComponent(Show, {
|
|
12373
12389
|
get when() {
|
|
@@ -12393,10 +12409,11 @@ function Explorer(props) {
|
|
|
12393
12409
|
const newData = updateNestedDataByPath(oldData, currentDataPath, type() === "number" ? changeEvent.target.valueAsNumber : changeEvent.target.value);
|
|
12394
12410
|
queryClient.setQueryData(props.activeQuery.queryKey, newData);
|
|
12395
12411
|
});
|
|
12412
|
+
setAttribute(_el$19, "id", inputId);
|
|
12396
12413
|
createRenderEffect((_p$) => {
|
|
12397
|
-
var _v$
|
|
12398
|
-
_v$
|
|
12399
|
-
_v$
|
|
12414
|
+
var _v$7 = type() === "number" ? "number" : "text", _v$8 = clsx(styles().value, styles().editableInput);
|
|
12415
|
+
_v$7 !== _p$.e && setAttribute(_el$19, "type", _p$.e = _v$7);
|
|
12416
|
+
_v$8 !== _p$.t && className(_el$19, _p$.t = _v$8);
|
|
12400
12417
|
return _p$;
|
|
12401
12418
|
}, {
|
|
12402
12419
|
e: void 0,
|
|
@@ -12441,9 +12458,9 @@ function Explorer(props) {
|
|
|
12441
12458
|
}
|
|
12442
12459
|
}), null);
|
|
12443
12460
|
createRenderEffect((_p$) => {
|
|
12444
|
-
var _v$
|
|
12445
|
-
_v$
|
|
12446
|
-
_v$
|
|
12461
|
+
var _v$9 = styles().row, _v$0 = styles().label;
|
|
12462
|
+
_v$9 !== _p$.e && className(_el$16, _p$.e = _v$9);
|
|
12463
|
+
_v$0 !== _p$.t && className(_el$17, _p$.t = _v$0);
|
|
12447
12464
|
return _p$;
|
|
12448
12465
|
}, {
|
|
12449
12466
|
e: void 0,
|
|
@@ -12487,7 +12504,7 @@ var init_Explorer = __esm({
|
|
|
12487
12504
|
_tmpl$82 = /* @__PURE__ */ template(`<div><button> <span></span> <span> `);
|
|
12488
12505
|
_tmpl$92 = /* @__PURE__ */ template(`<input>`);
|
|
12489
12506
|
_tmpl$02 = /* @__PURE__ */ template(`<span>`);
|
|
12490
|
-
_tmpl$110 = /* @__PURE__ */ template(`<div><
|
|
12507
|
+
_tmpl$110 = /* @__PURE__ */ template(`<div><label>:`);
|
|
12491
12508
|
_tmpl$102 = /* @__PURE__ */ template(`<div><div><button> [<!>...<!>]`);
|
|
12492
12509
|
Expander = (props) => {
|
|
12493
12510
|
const theme = useTheme();
|
|
@@ -12822,9 +12839,9 @@ var init_Devtools = __esm({
|
|
|
12822
12839
|
init_constants();
|
|
12823
12840
|
_tmpl$25 = /* @__PURE__ */ template(`<div><div aria-hidden=true></div><button type=button aria-label="Open Tanstack query devtools"class=tsqd-open-btn>`);
|
|
12824
12841
|
_tmpl$26 = /* @__PURE__ */ template(`<div>`);
|
|
12825
|
-
_tmpl$33 = /* @__PURE__ */ template(`<aside aria-label="Tanstack query devtools"><div></div><button aria-label="Close tanstack query devtools">`);
|
|
12826
|
-
_tmpl$43 = /* @__PURE__ */ template(`<select name=tsqd-queries-filter-sort>`);
|
|
12827
|
-
_tmpl$53 = /* @__PURE__ */ template(`<select name=tsqd-mutations-filter-sort>`);
|
|
12842
|
+
_tmpl$33 = /* @__PURE__ */ template(`<aside aria-label="Tanstack query devtools"><div role=separator aria-label="Resize devtools panel"tabindex=0></div><button aria-label="Close tanstack query devtools">`);
|
|
12843
|
+
_tmpl$43 = /* @__PURE__ */ template(`<select name=tsqd-queries-filter-sort aria-label="Sort queries by">`);
|
|
12844
|
+
_tmpl$53 = /* @__PURE__ */ template(`<select name=tsqd-mutations-filter-sort aria-label="Sort mutations by">`);
|
|
12828
12845
|
_tmpl$63 = /* @__PURE__ */ template(`<span>Asc`);
|
|
12829
12846
|
_tmpl$73 = /* @__PURE__ */ template(`<span>Desc`);
|
|
12830
12847
|
_tmpl$83 = /* @__PURE__ */ template(`<button aria-label="Open in picture-in-picture mode"title="Open in picture-in-picture mode">`);
|
|
@@ -12845,19 +12862,19 @@ var init_Devtools = __esm({
|
|
|
12845
12862
|
_tmpl$212 = /* @__PURE__ */ template(`<div><div class=tsqd-mutations-container>`);
|
|
12846
12863
|
_tmpl$222 = /* @__PURE__ */ template(`<div><div><div><button aria-label="Close Tanstack query devtools"><span>TANSTACK</span><span> v</span></button></div></div><div><div><div><input aria-label="Filter queries by query key"type=text placeholder=Filter name=tsqd-query-filter-input></div><div></div><button class=tsqd-query-filter-sort-order-btn></button></div><div><button aria-label="Clear query cache"></button><button>`);
|
|
12847
12864
|
_tmpl$232 = /* @__PURE__ */ template(`<option>Sort by `);
|
|
12848
|
-
_tmpl$242 = /* @__PURE__ */ template(`<div class=tsqd-query-disabled-indicator>disabled`);
|
|
12849
|
-
_tmpl$252 = /* @__PURE__ */ template(`<div class=tsqd-query-static-indicator>static`);
|
|
12865
|
+
_tmpl$242 = /* @__PURE__ */ template(`<div class=tsqd-query-disabled-indicator aria-hidden=true>disabled`);
|
|
12866
|
+
_tmpl$252 = /* @__PURE__ */ template(`<div class=tsqd-query-static-indicator aria-hidden=true>static`);
|
|
12850
12867
|
_tmpl$262 = /* @__PURE__ */ template(`<button><div></div><code class=tsqd-query-hash>`);
|
|
12851
12868
|
_tmpl$27 = /* @__PURE__ */ template(`<div role=tooltip id=tsqd-status-tooltip>`);
|
|
12852
12869
|
_tmpl$28 = /* @__PURE__ */ template(`<span>`);
|
|
12853
|
-
_tmpl$29 = /* @__PURE__ */ template(`<button><span></span><span>`);
|
|
12854
|
-
_tmpl$30 = /* @__PURE__ */ template(`<button><span></span> Error`);
|
|
12855
|
-
_tmpl$31 = /* @__PURE__ */ template(`<div><span></span>Trigger Error<select><option value=""disabled selected>`);
|
|
12870
|
+
_tmpl$29 = /* @__PURE__ */ template(`<button><span aria-hidden=true></span><span>`);
|
|
12871
|
+
_tmpl$30 = /* @__PURE__ */ template(`<button><span aria-hidden=true></span> Error`);
|
|
12872
|
+
_tmpl$31 = /* @__PURE__ */ template(`<div><span aria-hidden=true></span>Trigger Error<select aria-label="Select error type to trigger"><option value=""disabled selected>`);
|
|
12856
12873
|
_tmpl$322 = /* @__PURE__ */ template(`<div class="tsqd-query-details-explorer-container tsqd-query-details-data-explorer">`);
|
|
12857
|
-
_tmpl$332 = /* @__PURE__ */ template(`<form><textarea name=data></textarea><div><span></span><div><button type=button>Cancel</button><button>Save`);
|
|
12858
|
-
_tmpl$34 = /* @__PURE__ */ template(`<div><div>Query Details</div><div><div class=tsqd-query-details-summary><pre><code></code></pre><span></span></div><div class=tsqd-query-details-observers-count><span>Observers:</span><span></span></div><div class=tsqd-query-details-last-updated><span>Last Updated:</span><span></span></div></div><div>Actions</div><div><button><span></span>Refetch</button><button><span></span>Invalidate</button><button><span></span>Reset</button><button><span></span>Remove</button><button><span></span> Loading</button></div><div>Data </div><div>Query Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer">`);
|
|
12874
|
+
_tmpl$332 = /* @__PURE__ */ template(`<form><textarea name=data aria-label="Edit query data as JSON"></textarea><div><span></span><div><button type=button>Cancel</button><button>Save`);
|
|
12875
|
+
_tmpl$34 = /* @__PURE__ */ template(`<div><div role=heading aria-level=2>Query Details</div><div><div class=tsqd-query-details-summary><pre><code></code></pre><span role=status aria-live=polite></span></div><div class=tsqd-query-details-observers-count><span>Observers:</span><span></span></div><div class=tsqd-query-details-last-updated><span>Last Updated:</span><span></span></div></div><div role=heading aria-level=2>Actions</div><div><button><span aria-hidden=true></span>Refetch</button><button><span aria-hidden=true></span>Invalidate</button><button><span aria-hidden=true></span>Reset</button><button><span aria-hidden=true></span>Remove</button><button><span aria-hidden=true></span> Loading</button></div><div role=heading aria-level=2>Data </div><div role=heading aria-level=2>Query Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer">`);
|
|
12859
12876
|
_tmpl$35 = /* @__PURE__ */ template(`<option>`);
|
|
12860
|
-
_tmpl$36 = /* @__PURE__ */ template(`<div><div>Mutation Details</div><div><div class=tsqd-query-details-summary><pre><code></code></pre><span></span></div><div class=tsqd-query-details-last-updated><span>Submitted At:</span><span></span></div></div><div>Variables Details</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer"></div><div>Context Details</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer"></div><div>Data Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer"></div><div>Mutations Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer">`);
|
|
12877
|
+
_tmpl$36 = /* @__PURE__ */ template(`<div><div role=heading aria-level=2>Mutation Details</div><div><div class=tsqd-query-details-summary><pre><code></code></pre><span role=status aria-live=polite></span></div><div class=tsqd-query-details-last-updated><span>Submitted At:</span><span></span></div></div><div role=heading aria-level=2>Variables Details</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer"></div><div role=heading aria-level=2>Context Details</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer"></div><div role=heading aria-level=2>Data Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer"></div><div role=heading aria-level=2>Mutations Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer">`);
|
|
12861
12878
|
[selectedQueryHash, setSelectedQueryHash] = createSignal(null);
|
|
12862
12879
|
[selectedMutationId, setSelectedMutationId] = createSignal(null);
|
|
12863
12880
|
[panelWidth, setPanelWidth] = createSignal(0);
|
|
@@ -13113,6 +13130,10 @@ var init_Devtools = __esm({
|
|
|
13113
13130
|
const styles = createMemo(() => {
|
|
13114
13131
|
return theme() === "dark" ? darkStyles2(css) : lightStyles2(css);
|
|
13115
13132
|
});
|
|
13133
|
+
let closeBtnRef;
|
|
13134
|
+
onMount(() => {
|
|
13135
|
+
closeBtnRef.focus();
|
|
13136
|
+
});
|
|
13116
13137
|
const [isResizing, setIsResizing] = createSignal(false);
|
|
13117
13138
|
const position = createMemo(() => props.localStore.position || useQueryDevtoolsContext().position || POSITION);
|
|
13118
13139
|
const handleDragStart = (event) => {
|
|
@@ -13156,7 +13177,7 @@ var init_Devtools = __esm({
|
|
|
13156
13177
|
setIsResizing(false);
|
|
13157
13178
|
}
|
|
13158
13179
|
document.removeEventListener("mousemove", runDrag, false);
|
|
13159
|
-
document.removeEventListener("
|
|
13180
|
+
document.removeEventListener("mouseup", unsubscribe, false);
|
|
13160
13181
|
};
|
|
13161
13182
|
document.addEventListener("mousemove", runDrag, false);
|
|
13162
13183
|
document.addEventListener("mouseup", unsubscribe, false);
|
|
@@ -13217,8 +13238,32 @@ var init_Devtools = __esm({
|
|
|
13217
13238
|
var _el$7 = _tmpl$33(), _el$8 = _el$7.firstChild, _el$9 = _el$8.nextSibling;
|
|
13218
13239
|
var _ref$3 = panelRef;
|
|
13219
13240
|
typeof _ref$3 === "function" ? use(_ref$3, _el$7) : panelRef = _el$7;
|
|
13241
|
+
_el$8.$$keydown = (e2) => {
|
|
13242
|
+
const step = 10;
|
|
13243
|
+
const minHeight = convertRemToPixels(3.5);
|
|
13244
|
+
const minWidth = convertRemToPixels(12);
|
|
13245
|
+
if (position() === "top" || position() === "bottom") {
|
|
13246
|
+
if (e2.key === "ArrowUp" || e2.key === "ArrowDown") {
|
|
13247
|
+
e2.preventDefault();
|
|
13248
|
+
const currentHeight = Number(props.localStore.height || DEFAULT_HEIGHT);
|
|
13249
|
+
const delta = position() === "bottom" ? e2.key === "ArrowUp" ? step : -10 : e2.key === "ArrowDown" ? step : -10;
|
|
13250
|
+
const newHeight = Math.max(minHeight, currentHeight + delta);
|
|
13251
|
+
props.setLocalStore("height", String(newHeight));
|
|
13252
|
+
}
|
|
13253
|
+
} else {
|
|
13254
|
+
if (e2.key === "ArrowLeft" || e2.key === "ArrowRight") {
|
|
13255
|
+
e2.preventDefault();
|
|
13256
|
+
const currentWidth = Number(props.localStore.width || DEFAULT_WIDTH);
|
|
13257
|
+
const delta = position() === "right" ? e2.key === "ArrowLeft" ? step : -10 : e2.key === "ArrowRight" ? step : -10;
|
|
13258
|
+
const newWidth = Math.max(minWidth, currentWidth + delta);
|
|
13259
|
+
props.setLocalStore("width", String(newWidth));
|
|
13260
|
+
}
|
|
13261
|
+
}
|
|
13262
|
+
};
|
|
13220
13263
|
_el$8.$$mousedown = handleDragStart;
|
|
13221
13264
|
_el$9.$$click = () => props.setLocalStore("open", "false");
|
|
13265
|
+
var _ref$4 = closeBtnRef;
|
|
13266
|
+
typeof _ref$4 === "function" ? use(_ref$4, _el$9) : closeBtnRef = _el$9;
|
|
13222
13267
|
insert(_el$9, createComponent(ChevronDown, {}));
|
|
13223
13268
|
insert(_el$7, createComponent(ContentView, props), null);
|
|
13224
13269
|
createRenderEffect((_p$) => {
|
|
@@ -13226,19 +13271,25 @@ var init_Devtools = __esm({
|
|
|
13226
13271
|
[css`
|
|
13227
13272
|
min-width: min-content;
|
|
13228
13273
|
`]: panelWidth() < thirdBreakpoint && (position() === "right" || position() === "left")
|
|
13229
|
-
}, "tsqd-main-panel"), _v$2 = position() === "bottom" || position() === "top" ? `${props.localStore.height || DEFAULT_HEIGHT}px` : "auto", _v$3 = position() === "right" || position() === "left" ? `${props.localStore.width || DEFAULT_WIDTH}px` : "auto", _v$4 = clsx(styles().dragHandle, styles()[`dragHandle-position-${position()}`], "tsqd-drag-handle"), _v$
|
|
13274
|
+
}, "tsqd-main-panel"), _v$2 = position() === "bottom" || position() === "top" ? `${props.localStore.height || DEFAULT_HEIGHT}px` : "auto", _v$3 = position() === "right" || position() === "left" ? `${props.localStore.width || DEFAULT_WIDTH}px` : "auto", _v$4 = position() === "top" || position() === "bottom" ? "horizontal" : "vertical", _v$5 = position() === "top" || position() === "bottom" ? convertRemToPixels(3.5) : convertRemToPixels(12), _v$6 = position() === "top" || position() === "bottom" ? Number(props.localStore.height || DEFAULT_HEIGHT) : Number(props.localStore.width || DEFAULT_WIDTH), _v$7 = clsx(styles().dragHandle, styles()[`dragHandle-position-${position()}`], "tsqd-drag-handle"), _v$8 = clsx(styles().closeBtn, styles()[`closeBtn-position-${position()}`], "tsqd-minimize-btn");
|
|
13230
13275
|
_v$ !== _p$.e && className(_el$7, _p$.e = _v$);
|
|
13231
13276
|
_v$2 !== _p$.t && ((_p$.t = _v$2) != null ? _el$7.style.setProperty("height", _v$2) : _el$7.style.removeProperty("height"));
|
|
13232
13277
|
_v$3 !== _p$.a && ((_p$.a = _v$3) != null ? _el$7.style.setProperty("width", _v$3) : _el$7.style.removeProperty("width"));
|
|
13233
|
-
_v$4 !== _p$.o &&
|
|
13234
|
-
_v$5 !== _p$.i &&
|
|
13278
|
+
_v$4 !== _p$.o && setAttribute(_el$8, "aria-orientation", _p$.o = _v$4);
|
|
13279
|
+
_v$5 !== _p$.i && setAttribute(_el$8, "aria-valuemin", _p$.i = _v$5);
|
|
13280
|
+
_v$6 !== _p$.n && setAttribute(_el$8, "aria-valuenow", _p$.n = _v$6);
|
|
13281
|
+
_v$7 !== _p$.s && className(_el$8, _p$.s = _v$7);
|
|
13282
|
+
_v$8 !== _p$.h && className(_el$9, _p$.h = _v$8);
|
|
13235
13283
|
return _p$;
|
|
13236
13284
|
}, {
|
|
13237
13285
|
e: void 0,
|
|
13238
13286
|
t: void 0,
|
|
13239
13287
|
a: void 0,
|
|
13240
13288
|
o: void 0,
|
|
13241
|
-
i: void 0
|
|
13289
|
+
i: void 0,
|
|
13290
|
+
n: void 0,
|
|
13291
|
+
s: void 0,
|
|
13292
|
+
h: void 0
|
|
13242
13293
|
});
|
|
13243
13294
|
return _el$7;
|
|
13244
13295
|
})();
|
|
@@ -13303,8 +13354,8 @@ var init_Devtools = __esm({
|
|
|
13303
13354
|
};
|
|
13304
13355
|
return [(() => {
|
|
13305
13356
|
var _el$0 = _tmpl$222(), _el$1 = _el$0.firstChild, _el$10 = _el$1.firstChild, _el$11 = _el$10.firstChild, _el$12 = _el$11.firstChild, _el$13 = _el$12.nextSibling, _el$14 = _el$13.firstChild, _el$15 = _el$1.nextSibling, _el$16 = _el$15.firstChild, _el$17 = _el$16.firstChild, _el$18 = _el$17.firstChild, _el$19 = _el$17.nextSibling, _el$22 = _el$19.nextSibling, _el$25 = _el$16.nextSibling, _el$26 = _el$25.firstChild, _el$27 = _el$26.nextSibling;
|
|
13306
|
-
var _ref$
|
|
13307
|
-
typeof _ref$
|
|
13357
|
+
var _ref$5 = containerRef;
|
|
13358
|
+
typeof _ref$5 === "function" ? use(_ref$5, _el$0) : containerRef = _el$0;
|
|
13308
13359
|
_el$11.$$click = () => {
|
|
13309
13360
|
if (!pip().pipWindow && !props.showPanelViewOnly) {
|
|
13310
13361
|
props.setLocalStore("open", "false");
|
|
@@ -13323,6 +13374,7 @@ var init_Devtools = __esm({
|
|
|
13323
13374
|
get value() {
|
|
13324
13375
|
return selectedView();
|
|
13325
13376
|
},
|
|
13377
|
+
"aria-label": "Toggle between queries and mutations view",
|
|
13326
13378
|
onChange: (value) => {
|
|
13327
13379
|
setSelectedView(value);
|
|
13328
13380
|
setSelectedQueryHash(null);
|
|
@@ -13486,6 +13538,8 @@ var init_Devtools = __esm({
|
|
|
13486
13538
|
get ["class"]() {
|
|
13487
13539
|
return clsx(styles().actionsBtn, "tsqd-actions-btn", "tsqd-action-settings");
|
|
13488
13540
|
},
|
|
13541
|
+
"aria-label": "Open settings menu",
|
|
13542
|
+
title: "Open settings menu",
|
|
13489
13543
|
get children() {
|
|
13490
13544
|
return createComponent(Settings, {});
|
|
13491
13545
|
}
|
|
@@ -13532,51 +13586,48 @@ var init_Devtools = __esm({
|
|
|
13532
13586
|
return clsx(styles().settingsMenu, "tsqd-settings-submenu");
|
|
13533
13587
|
},
|
|
13534
13588
|
get children() {
|
|
13535
|
-
return
|
|
13536
|
-
|
|
13537
|
-
|
|
13538
|
-
|
|
13539
|
-
as: "button",
|
|
13540
|
-
get ["class"]() {
|
|
13541
|
-
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-top");
|
|
13542
|
-
},
|
|
13543
|
-
get children() {
|
|
13544
|
-
return [_tmpl$111(), createComponent(ArrowUp, {})];
|
|
13545
|
-
}
|
|
13546
|
-
}), createComponent(dropdown_menu_exports.Item, {
|
|
13547
|
-
onSelect: () => {
|
|
13548
|
-
setDevtoolsPosition("bottom");
|
|
13549
|
-
},
|
|
13550
|
-
as: "button",
|
|
13551
|
-
get ["class"]() {
|
|
13552
|
-
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-bottom");
|
|
13553
|
-
},
|
|
13554
|
-
get children() {
|
|
13555
|
-
return [_tmpl$103(), createComponent(ArrowDown, {})];
|
|
13556
|
-
}
|
|
13557
|
-
}), createComponent(dropdown_menu_exports.Item, {
|
|
13558
|
-
onSelect: () => {
|
|
13559
|
-
setDevtoolsPosition("left");
|
|
13560
|
-
},
|
|
13561
|
-
as: "button",
|
|
13562
|
-
get ["class"]() {
|
|
13563
|
-
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-left");
|
|
13589
|
+
return createComponent(dropdown_menu_exports.RadioGroup, {
|
|
13590
|
+
"aria-label": "Position settings",
|
|
13591
|
+
get value() {
|
|
13592
|
+
return props.localStore.position;
|
|
13564
13593
|
},
|
|
13594
|
+
onChange: (value) => setDevtoolsPosition(value),
|
|
13565
13595
|
get children() {
|
|
13566
|
-
return [
|
|
13596
|
+
return [createComponent(dropdown_menu_exports.RadioItem, {
|
|
13597
|
+
value: "top",
|
|
13598
|
+
get ["class"]() {
|
|
13599
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-top");
|
|
13600
|
+
},
|
|
13601
|
+
get children() {
|
|
13602
|
+
return [_tmpl$111(), createComponent(ArrowUp, {})];
|
|
13603
|
+
}
|
|
13604
|
+
}), createComponent(dropdown_menu_exports.RadioItem, {
|
|
13605
|
+
value: "bottom",
|
|
13606
|
+
get ["class"]() {
|
|
13607
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-bottom");
|
|
13608
|
+
},
|
|
13609
|
+
get children() {
|
|
13610
|
+
return [_tmpl$103(), createComponent(ArrowDown, {})];
|
|
13611
|
+
}
|
|
13612
|
+
}), createComponent(dropdown_menu_exports.RadioItem, {
|
|
13613
|
+
value: "left",
|
|
13614
|
+
get ["class"]() {
|
|
13615
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-left");
|
|
13616
|
+
},
|
|
13617
|
+
get children() {
|
|
13618
|
+
return [_tmpl$112(), createComponent(ArrowLeft, {})];
|
|
13619
|
+
}
|
|
13620
|
+
}), createComponent(dropdown_menu_exports.RadioItem, {
|
|
13621
|
+
value: "right",
|
|
13622
|
+
get ["class"]() {
|
|
13623
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-right");
|
|
13624
|
+
},
|
|
13625
|
+
get children() {
|
|
13626
|
+
return [_tmpl$122(), createComponent(ArrowRight, {})];
|
|
13627
|
+
}
|
|
13628
|
+
})];
|
|
13567
13629
|
}
|
|
13568
|
-
})
|
|
13569
|
-
onSelect: () => {
|
|
13570
|
-
setDevtoolsPosition("right");
|
|
13571
|
-
},
|
|
13572
|
-
as: "button",
|
|
13573
|
-
get ["class"]() {
|
|
13574
|
-
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-right");
|
|
13575
|
-
},
|
|
13576
|
-
get children() {
|
|
13577
|
-
return [_tmpl$122(), createComponent(ArrowRight, {})];
|
|
13578
|
-
}
|
|
13579
|
-
})];
|
|
13630
|
+
});
|
|
13580
13631
|
}
|
|
13581
13632
|
});
|
|
13582
13633
|
}
|
|
@@ -13607,40 +13658,42 @@ var init_Devtools = __esm({
|
|
|
13607
13658
|
return clsx(styles().settingsMenu, "tsqd-settings-submenu");
|
|
13608
13659
|
},
|
|
13609
13660
|
get children() {
|
|
13610
|
-
return
|
|
13611
|
-
|
|
13612
|
-
props.
|
|
13661
|
+
return createComponent(dropdown_menu_exports.RadioGroup, {
|
|
13662
|
+
get value() {
|
|
13663
|
+
return props.localStore.theme_preference;
|
|
13613
13664
|
},
|
|
13614
|
-
|
|
13615
|
-
|
|
13616
|
-
return clsx(styles().settingsSubButton, props.localStore.theme_preference === "light" && styles().themeSelectedButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-top");
|
|
13665
|
+
onChange: (value) => {
|
|
13666
|
+
props.setLocalStore("theme_preference", value);
|
|
13617
13667
|
},
|
|
13668
|
+
"aria-label": "Theme preference",
|
|
13618
13669
|
get children() {
|
|
13619
|
-
return [
|
|
13620
|
-
|
|
13621
|
-
|
|
13622
|
-
|
|
13623
|
-
|
|
13624
|
-
|
|
13625
|
-
|
|
13626
|
-
|
|
13627
|
-
|
|
13628
|
-
|
|
13629
|
-
|
|
13630
|
-
|
|
13631
|
-
|
|
13632
|
-
|
|
13633
|
-
|
|
13634
|
-
|
|
13635
|
-
|
|
13636
|
-
|
|
13637
|
-
|
|
13638
|
-
|
|
13639
|
-
|
|
13640
|
-
|
|
13641
|
-
|
|
13670
|
+
return [createComponent(dropdown_menu_exports.RadioItem, {
|
|
13671
|
+
value: "light",
|
|
13672
|
+
get ["class"]() {
|
|
13673
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-top");
|
|
13674
|
+
},
|
|
13675
|
+
get children() {
|
|
13676
|
+
return [_tmpl$142(), createComponent(Sun, {})];
|
|
13677
|
+
}
|
|
13678
|
+
}), createComponent(dropdown_menu_exports.RadioItem, {
|
|
13679
|
+
value: "dark",
|
|
13680
|
+
get ["class"]() {
|
|
13681
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-bottom");
|
|
13682
|
+
},
|
|
13683
|
+
get children() {
|
|
13684
|
+
return [_tmpl$152(), createComponent(Moon, {})];
|
|
13685
|
+
}
|
|
13686
|
+
}), createComponent(dropdown_menu_exports.RadioItem, {
|
|
13687
|
+
value: "system",
|
|
13688
|
+
get ["class"]() {
|
|
13689
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-left");
|
|
13690
|
+
},
|
|
13691
|
+
get children() {
|
|
13692
|
+
return [_tmpl$162(), createComponent(Monitor, {})];
|
|
13693
|
+
}
|
|
13694
|
+
})];
|
|
13642
13695
|
}
|
|
13643
|
-
})
|
|
13696
|
+
});
|
|
13644
13697
|
}
|
|
13645
13698
|
});
|
|
13646
13699
|
}
|
|
@@ -13669,43 +13722,46 @@ var init_Devtools = __esm({
|
|
|
13669
13722
|
return clsx(styles().settingsMenu, "tsqd-settings-submenu");
|
|
13670
13723
|
},
|
|
13671
13724
|
get children() {
|
|
13672
|
-
return
|
|
13673
|
-
|
|
13674
|
-
props.
|
|
13675
|
-
},
|
|
13676
|
-
as: "button",
|
|
13677
|
-
get ["class"]() {
|
|
13678
|
-
return clsx(styles().settingsSubButton, props.localStore.hideDisabledQueries !== "true" && styles().themeSelectedButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-show");
|
|
13725
|
+
return createComponent(dropdown_menu_exports.RadioGroup, {
|
|
13726
|
+
get value() {
|
|
13727
|
+
return props.localStore.hideDisabledQueries;
|
|
13679
13728
|
},
|
|
13729
|
+
"aria-label": "Hide disabled queries setting",
|
|
13730
|
+
onChange: (value) => props.setLocalStore("hideDisabledQueries", value),
|
|
13680
13731
|
get children() {
|
|
13681
|
-
return [
|
|
13682
|
-
|
|
13683
|
-
|
|
13732
|
+
return [createComponent(dropdown_menu_exports.RadioItem, {
|
|
13733
|
+
value: "false",
|
|
13734
|
+
get ["class"]() {
|
|
13735
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-show");
|
|
13684
13736
|
},
|
|
13685
13737
|
get children() {
|
|
13686
|
-
return createComponent(
|
|
13738
|
+
return [_tmpl$182(), createComponent(Show, {
|
|
13739
|
+
get when() {
|
|
13740
|
+
return props.localStore.hideDisabledQueries !== "true";
|
|
13741
|
+
},
|
|
13742
|
+
get children() {
|
|
13743
|
+
return createComponent(CheckCircle, {});
|
|
13744
|
+
}
|
|
13745
|
+
})];
|
|
13687
13746
|
}
|
|
13688
|
-
})
|
|
13689
|
-
|
|
13690
|
-
|
|
13691
|
-
|
|
13692
|
-
props.setLocalStore("hideDisabledQueries", "true");
|
|
13693
|
-
},
|
|
13694
|
-
as: "button",
|
|
13695
|
-
get ["class"]() {
|
|
13696
|
-
return clsx(styles().settingsSubButton, props.localStore.hideDisabledQueries === "true" && styles().themeSelectedButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-hide");
|
|
13697
|
-
},
|
|
13698
|
-
get children() {
|
|
13699
|
-
return [_tmpl$192(), createComponent(Show, {
|
|
13700
|
-
get when() {
|
|
13701
|
-
return props.localStore.hideDisabledQueries === "true";
|
|
13747
|
+
}), createComponent(dropdown_menu_exports.RadioItem, {
|
|
13748
|
+
value: "true",
|
|
13749
|
+
get ["class"]() {
|
|
13750
|
+
return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-hide");
|
|
13702
13751
|
},
|
|
13703
13752
|
get children() {
|
|
13704
|
-
return createComponent(
|
|
13753
|
+
return [_tmpl$192(), createComponent(Show, {
|
|
13754
|
+
get when() {
|
|
13755
|
+
return props.localStore.hideDisabledQueries === "true";
|
|
13756
|
+
},
|
|
13757
|
+
get children() {
|
|
13758
|
+
return createComponent(CheckCircle, {});
|
|
13759
|
+
}
|
|
13760
|
+
})];
|
|
13705
13761
|
}
|
|
13706
13762
|
})];
|
|
13707
13763
|
}
|
|
13708
|
-
})
|
|
13764
|
+
});
|
|
13709
13765
|
}
|
|
13710
13766
|
});
|
|
13711
13767
|
}
|
|
@@ -13761,33 +13817,33 @@ var init_Devtools = __esm({
|
|
|
13761
13817
|
}
|
|
13762
13818
|
}), null);
|
|
13763
13819
|
createRenderEffect((_p$) => {
|
|
13764
|
-
var _v$
|
|
13820
|
+
var _v$9 = clsx(styles().queriesContainer, panelWidth() < secondBreakpoint && (selectedQueryHash() || selectedMutationId()) && css`
|
|
13765
13821
|
height: 50%;
|
|
13766
13822
|
max-height: 50%;
|
|
13767
13823
|
`, panelWidth() < secondBreakpoint && !(selectedQueryHash() || selectedMutationId()) && css`
|
|
13768
13824
|
height: 100%;
|
|
13769
13825
|
max-height: 100%;
|
|
13770
|
-
`, "tsqd-queries-container"), _v$
|
|
13771
|
-
_v$
|
|
13772
|
-
_v$
|
|
13773
|
-
_v$
|
|
13774
|
-
_v$
|
|
13775
|
-
_v$
|
|
13776
|
-
_v$
|
|
13777
|
-
_v$
|
|
13778
|
-
_v$
|
|
13779
|
-
_v$
|
|
13780
|
-
_v$
|
|
13781
|
-
_v$
|
|
13782
|
-
_v$
|
|
13783
|
-
_v$
|
|
13784
|
-
_v$
|
|
13785
|
-
_v$
|
|
13786
|
-
_v$
|
|
13787
|
-
_v$
|
|
13788
|
-
_v$
|
|
13789
|
-
_v$
|
|
13790
|
-
_v$
|
|
13826
|
+
`, "tsqd-queries-container"), _v$0 = clsx(styles().row, "tsqd-header"), _v$1 = styles().logoAndToggleContainer, _v$10 = clsx(styles().logo, "tsqd-text-logo-container"), _v$11 = clsx(styles().tanstackLogo, "tsqd-text-logo-tanstack"), _v$12 = clsx(styles().queryFlavorLogo, "tsqd-text-logo-query-flavor"), _v$13 = clsx(styles().row, "tsqd-filters-actions-container"), _v$14 = clsx(styles().filtersContainer, "tsqd-filters-container"), _v$15 = clsx(styles().filterInput, "tsqd-query-filter-textfield-container"), _v$16 = clsx("tsqd-query-filter-textfield"), _v$17 = clsx(styles().filterSelect, "tsqd-query-filter-sort-container"), _v$18 = `Sort order ${(selectedView() === "queries" ? sortOrder() : mutationSortOrder()) === -1 ? "descending" : "ascending"}`, _v$19 = (selectedView() === "queries" ? sortOrder() : mutationSortOrder()) === -1, _v$20 = clsx(styles().actionsContainer, "tsqd-actions-container"), _v$21 = clsx(styles().actionsBtn, "tsqd-actions-btn", "tsqd-action-clear-cache"), _v$22 = `Clear ${selectedView()} cache`, _v$23 = clsx(styles().actionsBtn, offline() && styles().actionsBtnOffline, "tsqd-actions-btn", "tsqd-action-mock-offline-behavior"), _v$24 = `${offline() ? "Unset offline mocking behavior" : "Mock offline behavior"}`, _v$25 = offline(), _v$26 = `${offline() ? "Unset offline mocking behavior" : "Mock offline behavior"}`;
|
|
13827
|
+
_v$9 !== _p$.e && className(_el$0, _p$.e = _v$9);
|
|
13828
|
+
_v$0 !== _p$.t && className(_el$1, _p$.t = _v$0);
|
|
13829
|
+
_v$1 !== _p$.a && className(_el$10, _p$.a = _v$1);
|
|
13830
|
+
_v$10 !== _p$.o && className(_el$11, _p$.o = _v$10);
|
|
13831
|
+
_v$11 !== _p$.i && className(_el$12, _p$.i = _v$11);
|
|
13832
|
+
_v$12 !== _p$.n && className(_el$13, _p$.n = _v$12);
|
|
13833
|
+
_v$13 !== _p$.s && className(_el$15, _p$.s = _v$13);
|
|
13834
|
+
_v$14 !== _p$.h && className(_el$16, _p$.h = _v$14);
|
|
13835
|
+
_v$15 !== _p$.r && className(_el$17, _p$.r = _v$15);
|
|
13836
|
+
_v$16 !== _p$.d && className(_el$18, _p$.d = _v$16);
|
|
13837
|
+
_v$17 !== _p$.l && className(_el$19, _p$.l = _v$17);
|
|
13838
|
+
_v$18 !== _p$.u && setAttribute(_el$22, "aria-label", _p$.u = _v$18);
|
|
13839
|
+
_v$19 !== _p$.c && setAttribute(_el$22, "aria-pressed", _p$.c = _v$19);
|
|
13840
|
+
_v$20 !== _p$.w && className(_el$25, _p$.w = _v$20);
|
|
13841
|
+
_v$21 !== _p$.m && className(_el$26, _p$.m = _v$21);
|
|
13842
|
+
_v$22 !== _p$.f && setAttribute(_el$26, "title", _p$.f = _v$22);
|
|
13843
|
+
_v$23 !== _p$.y && className(_el$27, _p$.y = _v$23);
|
|
13844
|
+
_v$24 !== _p$.g && setAttribute(_el$27, "aria-label", _p$.g = _v$24);
|
|
13845
|
+
_v$25 !== _p$.p && setAttribute(_el$27, "aria-pressed", _p$.p = _v$25);
|
|
13846
|
+
_v$26 !== _p$.b && setAttribute(_el$27, "title", _p$.b = _v$26);
|
|
13791
13847
|
return _p$;
|
|
13792
13848
|
}, {
|
|
13793
13849
|
e: void 0,
|
|
@@ -13900,10 +13956,10 @@ var init_Devtools = __esm({
|
|
|
13900
13956
|
}
|
|
13901
13957
|
}), null);
|
|
13902
13958
|
createRenderEffect((_p$) => {
|
|
13903
|
-
var _v$
|
|
13904
|
-
_v$
|
|
13905
|
-
_v$
|
|
13906
|
-
_v$
|
|
13959
|
+
var _v$27 = clsx(styles().queryRow, selectedQueryHash() === props.query.queryHash && styles().selectedQueryRow, "tsqd-query-row"), _v$28 = `Query key ${props.query.queryHash}${isDisabled() ? ", disabled" : ""}${isStatic() ? ", static" : ""}`, _v$29 = clsx(getObserverCountColorStyles(), "tsqd-query-observer-count");
|
|
13960
|
+
_v$27 !== _p$.e && className(_el$50, _p$.e = _v$27);
|
|
13961
|
+
_v$28 !== _p$.t && setAttribute(_el$50, "aria-label", _p$.t = _v$28);
|
|
13962
|
+
_v$29 !== _p$.a && className(_el$51, _p$.a = _v$29);
|
|
13907
13963
|
return _p$;
|
|
13908
13964
|
}, {
|
|
13909
13965
|
e: void 0,
|
|
@@ -14011,10 +14067,10 @@ var init_Devtools = __esm({
|
|
|
14011
14067
|
}), null);
|
|
14012
14068
|
insert(_el$57, () => new Date(props.mutation.state.submittedAt).toLocaleString(), null);
|
|
14013
14069
|
createRenderEffect((_p$) => {
|
|
14014
|
-
var _v$
|
|
14015
|
-
_v$
|
|
14016
|
-
_v$
|
|
14017
|
-
_v$
|
|
14070
|
+
var _v$30 = clsx(styles().queryRow, selectedMutationId() === props.mutation.mutationId && styles().selectedQueryRow, "tsqd-query-row"), _v$31 = `Mutation submitted at ${new Date(props.mutation.state.submittedAt).toLocaleString()}`, _v$32 = clsx(getObserverCountColorStyles(), "tsqd-query-observer-count");
|
|
14071
|
+
_v$30 !== _p$.e && className(_el$55, _p$.e = _v$30);
|
|
14072
|
+
_v$31 !== _p$.t && setAttribute(_el$55, "aria-label", _p$.t = _v$31);
|
|
14073
|
+
_v$32 !== _p$.a && className(_el$56, _p$.a = _v$32);
|
|
14018
14074
|
return _p$;
|
|
14019
14075
|
}, {
|
|
14020
14076
|
e: void 0,
|
|
@@ -14166,8 +14222,8 @@ var init_Devtools = __esm({
|
|
|
14166
14222
|
});
|
|
14167
14223
|
return (() => {
|
|
14168
14224
|
var _el$60 = _tmpl$29(), _el$62 = _el$60.firstChild, _el$64 = _el$62.nextSibling;
|
|
14169
|
-
var _ref$
|
|
14170
|
-
typeof _ref$
|
|
14225
|
+
var _ref$6 = tagRef;
|
|
14226
|
+
typeof _ref$6 === "function" ? use(_ref$6, _el$60) : tagRef = _el$60;
|
|
14171
14227
|
_el$60.addEventListener("mouseleave", () => {
|
|
14172
14228
|
setMouseOver(false);
|
|
14173
14229
|
setFocused(false);
|
|
@@ -14179,6 +14235,9 @@ var init_Devtools = __esm({
|
|
|
14179
14235
|
get disabled() {
|
|
14180
14236
|
return showLabel();
|
|
14181
14237
|
},
|
|
14238
|
+
get ["aria-label"]() {
|
|
14239
|
+
return `${props.label}: ${props.count}`;
|
|
14240
|
+
},
|
|
14182
14241
|
get ["class"]() {
|
|
14183
14242
|
return clsx(styles().queryStatusTag, !showLabel() && css`
|
|
14184
14243
|
cursor: pointer;
|
|
@@ -14214,17 +14273,17 @@ var init_Devtools = __esm({
|
|
|
14214
14273
|
}), _el$64);
|
|
14215
14274
|
insert(_el$64, () => props.count);
|
|
14216
14275
|
createRenderEffect((_p$) => {
|
|
14217
|
-
var _v$
|
|
14276
|
+
var _v$33 = clsx(css`
|
|
14218
14277
|
width: ${tokens.size[1.5]};
|
|
14219
14278
|
height: ${tokens.size[1.5]};
|
|
14220
14279
|
border-radius: ${tokens.border.radius.full};
|
|
14221
14280
|
background-color: ${tokens.colors[props.color][500]};
|
|
14222
|
-
`, "tsqd-query-status-tag-dot"), _v$
|
|
14281
|
+
`, "tsqd-query-status-tag-dot"), _v$34 = clsx(styles().queryStatusCount, props.count > 0 && props.color !== "gray" && css`
|
|
14223
14282
|
background-color: ${t2(colors[props.color][100], colors[props.color][900])};
|
|
14224
14283
|
color: ${t2(colors[props.color][700], colors[props.color][300])};
|
|
14225
14284
|
`, "tsqd-query-status-tag-count");
|
|
14226
|
-
_v$
|
|
14227
|
-
_v$
|
|
14285
|
+
_v$33 !== _p$.e && className(_el$62, _p$.e = _v$33);
|
|
14286
|
+
_v$34 !== _p$.t && className(_el$64, _p$.t = _v$34);
|
|
14228
14287
|
return _p$;
|
|
14229
14288
|
}, {
|
|
14230
14289
|
e: void 0,
|
|
@@ -14425,14 +14484,14 @@ var init_Devtools = __esm({
|
|
|
14425
14484
|
};
|
|
14426
14485
|
insert(_el$91, () => queryStatus() === "error" ? "Restore" : "Trigger", _el$93);
|
|
14427
14486
|
createRenderEffect((_p$) => {
|
|
14428
|
-
var _v$
|
|
14487
|
+
var _v$35 = clsx(css`
|
|
14429
14488
|
color: ${t2(colors.red[500], colors.red[400])};
|
|
14430
|
-
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-error"), _v$
|
|
14489
|
+
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-error"), _v$36 = queryStatus() === "pending", _v$37 = css`
|
|
14431
14490
|
background-color: ${t2(colors.red[500], colors.red[400])};
|
|
14432
14491
|
`;
|
|
14433
|
-
_v$
|
|
14434
|
-
_v$
|
|
14435
|
-
_v$
|
|
14492
|
+
_v$35 !== _p$.e && className(_el$91, _p$.e = _v$35);
|
|
14493
|
+
_v$36 !== _p$.t && (_el$91.disabled = _p$.t = _v$36);
|
|
14494
|
+
_v$37 !== _p$.a && className(_el$92, _p$.a = _v$37);
|
|
14436
14495
|
return _p$;
|
|
14437
14496
|
}, {
|
|
14438
14497
|
e: void 0,
|
|
@@ -14465,12 +14524,12 @@ var init_Devtools = __esm({
|
|
|
14465
14524
|
}), null);
|
|
14466
14525
|
insert(_el$94, createComponent(ChevronDown, {}), null);
|
|
14467
14526
|
createRenderEffect((_p$) => {
|
|
14468
|
-
var _v$
|
|
14527
|
+
var _v$38 = clsx(styles().actionsSelect, "tsqd-query-details-actions-btn", "tsqd-query-details-action-error-multiple"), _v$39 = css`
|
|
14469
14528
|
background-color: ${tokens.colors.red[400]};
|
|
14470
|
-
`, _v$
|
|
14471
|
-
_v$
|
|
14472
|
-
_v$
|
|
14473
|
-
_v$
|
|
14529
|
+
`, _v$40 = queryStatus() === "pending";
|
|
14530
|
+
_v$38 !== _p$.e && className(_el$94, _p$.e = _v$38);
|
|
14531
|
+
_v$39 !== _p$.t && className(_el$95, _p$.t = _v$39);
|
|
14532
|
+
_v$40 !== _p$.a && (_el$97.disabled = _p$.a = _v$40);
|
|
14474
14533
|
return _p$;
|
|
14475
14534
|
}, {
|
|
14476
14535
|
e: void 0,
|
|
@@ -14528,19 +14587,19 @@ var init_Devtools = __esm({
|
|
|
14528
14587
|
insert(_el$105, () => dataEditError() ? "Invalid Value" : "");
|
|
14529
14588
|
_el$107.$$click = () => setDataMode("view");
|
|
14530
14589
|
createRenderEffect((_p$) => {
|
|
14531
|
-
var _v$
|
|
14590
|
+
var _v$41 = clsx(styles().devtoolsEditForm, "tsqd-query-details-data-editor"), _v$42 = styles().devtoolsEditTextarea, _v$43 = dataEditError(), _v$44 = styles().devtoolsEditFormActions, _v$45 = styles().devtoolsEditFormError, _v$46 = styles().devtoolsEditFormActionContainer, _v$47 = clsx(styles().devtoolsEditFormAction, css`
|
|
14532
14591
|
color: ${t2(colors.gray[600], colors.gray[300])};
|
|
14533
|
-
`), _v$
|
|
14592
|
+
`), _v$48 = clsx(styles().devtoolsEditFormAction, css`
|
|
14534
14593
|
color: ${t2(colors.blue[600], colors.blue[400])};
|
|
14535
14594
|
`);
|
|
14536
|
-
_v$
|
|
14537
|
-
_v$
|
|
14538
|
-
_v$
|
|
14539
|
-
_v$
|
|
14540
|
-
_v$
|
|
14541
|
-
_v$
|
|
14542
|
-
_v$
|
|
14543
|
-
_v$
|
|
14595
|
+
_v$41 !== _p$.e && className(_el$102, _p$.e = _v$41);
|
|
14596
|
+
_v$42 !== _p$.t && className(_el$103, _p$.t = _v$42);
|
|
14597
|
+
_v$43 !== _p$.a && setAttribute(_el$103, "data-error", _p$.a = _v$43);
|
|
14598
|
+
_v$44 !== _p$.o && className(_el$104, _p$.o = _v$44);
|
|
14599
|
+
_v$45 !== _p$.i && className(_el$105, _p$.i = _v$45);
|
|
14600
|
+
_v$46 !== _p$.n && className(_el$106, _p$.n = _v$46);
|
|
14601
|
+
_v$47 !== _p$.s && className(_el$107, _p$.s = _v$47);
|
|
14602
|
+
_v$48 !== _p$.h && className(_el$108, _p$.h = _v$48);
|
|
14544
14603
|
return _p$;
|
|
14545
14604
|
}, {
|
|
14546
14605
|
e: void 0,
|
|
@@ -14564,51 +14623,51 @@ var init_Devtools = __esm({
|
|
|
14564
14623
|
}
|
|
14565
14624
|
}));
|
|
14566
14625
|
createRenderEffect((_p$) => {
|
|
14567
|
-
var _v$
|
|
14626
|
+
var _v$49 = clsx(styles().detailsContainer, "tsqd-query-details-container"), _v$50 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$51 = clsx(styles().detailsBody, "tsqd-query-details-summary-container"), _v$52 = clsx(styles().queryDetailsStatus, getQueryStatusColors()), _v$53 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$54 = clsx(styles().actionsBody, "tsqd-query-details-actions-container"), _v$55 = clsx(css`
|
|
14568
14627
|
color: ${t2(colors.blue[600], colors.blue[400])};
|
|
14569
|
-
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-refetch"), _v$
|
|
14628
|
+
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-refetch"), _v$56 = statusLabel() === "fetching", _v$57 = css`
|
|
14570
14629
|
background-color: ${t2(colors.blue[600], colors.blue[400])};
|
|
14571
|
-
`, _v$
|
|
14630
|
+
`, _v$58 = clsx(css`
|
|
14572
14631
|
color: ${t2(colors.yellow[600], colors.yellow[400])};
|
|
14573
|
-
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-invalidate"), _v$
|
|
14632
|
+
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-invalidate"), _v$59 = queryStatus() === "pending", _v$60 = css`
|
|
14574
14633
|
background-color: ${t2(colors.yellow[600], colors.yellow[400])};
|
|
14575
|
-
`, _v$
|
|
14634
|
+
`, _v$61 = clsx(css`
|
|
14576
14635
|
color: ${t2(colors.gray[600], colors.gray[300])};
|
|
14577
|
-
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-reset"), _v$
|
|
14636
|
+
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-reset"), _v$62 = queryStatus() === "pending", _v$63 = css`
|
|
14578
14637
|
background-color: ${t2(colors.gray[600], colors.gray[400])};
|
|
14579
|
-
`, _v$
|
|
14638
|
+
`, _v$64 = clsx(css`
|
|
14580
14639
|
color: ${t2(colors.pink[500], colors.pink[400])};
|
|
14581
|
-
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-remove"), _v$
|
|
14640
|
+
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-remove"), _v$65 = statusLabel() === "fetching", _v$66 = css`
|
|
14582
14641
|
background-color: ${t2(colors.pink[500], colors.pink[400])};
|
|
14583
|
-
`, _v$
|
|
14642
|
+
`, _v$67 = clsx(css`
|
|
14584
14643
|
color: ${t2(colors.cyan[500], colors.cyan[400])};
|
|
14585
|
-
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-loading"), _v$
|
|
14644
|
+
`, "tsqd-query-details-actions-btn", "tsqd-query-details-action-loading"), _v$68 = restoringLoading(), _v$69 = css`
|
|
14586
14645
|
background-color: ${t2(colors.cyan[500], colors.cyan[400])};
|
|
14587
|
-
`, _v$
|
|
14588
|
-
_v$
|
|
14589
|
-
_v$
|
|
14590
|
-
_v$
|
|
14591
|
-
_v$
|
|
14592
|
-
_v$
|
|
14593
|
-
_v$
|
|
14594
|
-
_v$
|
|
14595
|
-
_v$
|
|
14596
|
-
_v$
|
|
14597
|
-
_v$
|
|
14598
|
-
_v$
|
|
14599
|
-
_v$
|
|
14600
|
-
_v$
|
|
14601
|
-
_v$
|
|
14602
|
-
_v$
|
|
14603
|
-
_v$
|
|
14604
|
-
_v$
|
|
14605
|
-
_v$
|
|
14606
|
-
_v$
|
|
14607
|
-
_v$
|
|
14608
|
-
_v$
|
|
14609
|
-
_v$
|
|
14610
|
-
_v$
|
|
14611
|
-
_v$
|
|
14646
|
+
`, _v$70 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$71 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$72 = tokens.size[2];
|
|
14647
|
+
_v$49 !== _p$.e && className(_el$65, _p$.e = _v$49);
|
|
14648
|
+
_v$50 !== _p$.t && className(_el$66, _p$.t = _v$50);
|
|
14649
|
+
_v$51 !== _p$.a && className(_el$67, _p$.a = _v$51);
|
|
14650
|
+
_v$52 !== _p$.o && className(_el$71, _p$.o = _v$52);
|
|
14651
|
+
_v$53 !== _p$.i && className(_el$78, _p$.i = _v$53);
|
|
14652
|
+
_v$54 !== _p$.n && className(_el$79, _p$.n = _v$54);
|
|
14653
|
+
_v$55 !== _p$.s && className(_el$80, _p$.s = _v$55);
|
|
14654
|
+
_v$56 !== _p$.h && (_el$80.disabled = _p$.h = _v$56);
|
|
14655
|
+
_v$57 !== _p$.r && className(_el$81, _p$.r = _v$57);
|
|
14656
|
+
_v$58 !== _p$.d && className(_el$82, _p$.d = _v$58);
|
|
14657
|
+
_v$59 !== _p$.l && (_el$82.disabled = _p$.l = _v$59);
|
|
14658
|
+
_v$60 !== _p$.u && className(_el$83, _p$.u = _v$60);
|
|
14659
|
+
_v$61 !== _p$.c && className(_el$84, _p$.c = _v$61);
|
|
14660
|
+
_v$62 !== _p$.w && (_el$84.disabled = _p$.w = _v$62);
|
|
14661
|
+
_v$63 !== _p$.m && className(_el$85, _p$.m = _v$63);
|
|
14662
|
+
_v$64 !== _p$.f && className(_el$86, _p$.f = _v$64);
|
|
14663
|
+
_v$65 !== _p$.y && (_el$86.disabled = _p$.y = _v$65);
|
|
14664
|
+
_v$66 !== _p$.g && className(_el$87, _p$.g = _v$66);
|
|
14665
|
+
_v$67 !== _p$.p && className(_el$88, _p$.p = _v$67);
|
|
14666
|
+
_v$68 !== _p$.b && (_el$88.disabled = _p$.b = _v$68);
|
|
14667
|
+
_v$69 !== _p$.T && className(_el$89, _p$.T = _v$69);
|
|
14668
|
+
_v$70 !== _p$.A && className(_el$99, _p$.A = _v$70);
|
|
14669
|
+
_v$71 !== _p$.O && className(_el$109, _p$.O = _v$71);
|
|
14670
|
+
_v$72 !== _p$.I && ((_p$.I = _v$72) != null ? _el$110.style.setProperty("padding", _v$72) : _el$110.style.removeProperty("padding"));
|
|
14612
14671
|
return _p$;
|
|
14613
14672
|
}, {
|
|
14614
14673
|
e: void 0,
|
|
@@ -14742,19 +14801,19 @@ var init_Devtools = __esm({
|
|
|
14742
14801
|
}
|
|
14743
14802
|
}));
|
|
14744
14803
|
createRenderEffect((_p$) => {
|
|
14745
|
-
var _v$
|
|
14746
|
-
_v$
|
|
14747
|
-
_v$
|
|
14748
|
-
_v$
|
|
14749
|
-
_v$
|
|
14750
|
-
_v$
|
|
14751
|
-
_v$
|
|
14752
|
-
_v$
|
|
14753
|
-
_v$
|
|
14754
|
-
_v$
|
|
14755
|
-
_v$
|
|
14756
|
-
_v$
|
|
14757
|
-
_v$
|
|
14804
|
+
var _v$73 = clsx(styles().detailsContainer, "tsqd-query-details-container"), _v$74 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$75 = clsx(styles().detailsBody, "tsqd-query-details-summary-container"), _v$76 = clsx(styles().queryDetailsStatus, getQueryStatusColors()), _v$77 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$78 = tokens.size[2], _v$79 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$80 = tokens.size[2], _v$81 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$82 = tokens.size[2], _v$83 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$84 = tokens.size[2];
|
|
14805
|
+
_v$73 !== _p$.e && className(_el$112, _p$.e = _v$73);
|
|
14806
|
+
_v$74 !== _p$.t && className(_el$113, _p$.t = _v$74);
|
|
14807
|
+
_v$75 !== _p$.a && className(_el$114, _p$.a = _v$75);
|
|
14808
|
+
_v$76 !== _p$.o && className(_el$118, _p$.o = _v$76);
|
|
14809
|
+
_v$77 !== _p$.i && className(_el$122, _p$.i = _v$77);
|
|
14810
|
+
_v$78 !== _p$.n && ((_p$.n = _v$78) != null ? _el$123.style.setProperty("padding", _v$78) : _el$123.style.removeProperty("padding"));
|
|
14811
|
+
_v$79 !== _p$.s && className(_el$124, _p$.s = _v$79);
|
|
14812
|
+
_v$80 !== _p$.h && ((_p$.h = _v$80) != null ? _el$125.style.setProperty("padding", _v$80) : _el$125.style.removeProperty("padding"));
|
|
14813
|
+
_v$81 !== _p$.r && className(_el$126, _p$.r = _v$81);
|
|
14814
|
+
_v$82 !== _p$.d && ((_p$.d = _v$82) != null ? _el$127.style.setProperty("padding", _v$82) : _el$127.style.removeProperty("padding"));
|
|
14815
|
+
_v$83 !== _p$.l && className(_el$128, _p$.l = _v$83);
|
|
14816
|
+
_v$84 !== _p$.u && ((_p$.u = _v$84) != null ? _el$129.style.setProperty("padding", _v$84) : _el$129.style.removeProperty("padding"));
|
|
14758
14817
|
return _p$;
|
|
14759
14818
|
}, {
|
|
14760
14819
|
e: void 0,
|
|
@@ -15159,6 +15218,15 @@ var init_Devtools = __esm({
|
|
|
15159
15218
|
&:hover {
|
|
15160
15219
|
background-color: ${colors.purple[400]}${t2("", alpha[90])};
|
|
15161
15220
|
}
|
|
15221
|
+
&:focus {
|
|
15222
|
+
outline: none;
|
|
15223
|
+
background-color: ${colors.purple[400]}${t2("", alpha[90])};
|
|
15224
|
+
}
|
|
15225
|
+
&:focus-visible {
|
|
15226
|
+
outline: 2px solid ${colors.blue[800]};
|
|
15227
|
+
outline-offset: -2px;
|
|
15228
|
+
background-color: ${colors.purple[400]}${t2("", alpha[90])};
|
|
15229
|
+
}
|
|
15162
15230
|
z-index: 4;
|
|
15163
15231
|
`,
|
|
15164
15232
|
"dragHandle-position-top": css`
|
|
@@ -15778,15 +15846,15 @@ var init_Devtools = __esm({
|
|
|
15778
15846
|
outline-offset: 2px;
|
|
15779
15847
|
outline: 2px solid ${colors.blue[800]};
|
|
15780
15848
|
}
|
|
15781
|
-
|
|
15782
|
-
themeSelectedButton: css`
|
|
15783
|
-
background-color: ${t2(colors.purple[100], colors.purple[900])};
|
|
15784
|
-
color: ${t2(colors.purple[700], colors.purple[300])};
|
|
15785
|
-
& svg {
|
|
15786
|
-
color: ${t2(colors.purple[700], colors.purple[300])};
|
|
15787
|
-
}
|
|
15788
|
-
&:hover {
|
|
15849
|
+
&[data-checked] {
|
|
15789
15850
|
background-color: ${t2(colors.purple[100], colors.purple[900])};
|
|
15851
|
+
color: ${t2(colors.purple[700], colors.purple[300])};
|
|
15852
|
+
& svg {
|
|
15853
|
+
color: ${t2(colors.purple[700], colors.purple[300])};
|
|
15854
|
+
}
|
|
15855
|
+
&:hover {
|
|
15856
|
+
background-color: ${t2(colors.purple[100], colors.purple[900])};
|
|
15857
|
+
}
|
|
15790
15858
|
}
|
|
15791
15859
|
`,
|
|
15792
15860
|
viewToggle: css`
|
|
@@ -15911,7 +15979,7 @@ var init_Devtools = __esm({
|
|
|
15911
15979
|
};
|
|
15912
15980
|
lightStyles2 = (css) => stylesFactory2("light", css);
|
|
15913
15981
|
darkStyles2 = (css) => stylesFactory2("dark", css);
|
|
15914
|
-
delegateEvents(["click", "mousedown", "input"]);
|
|
15982
|
+
delegateEvents(["click", "mousedown", "keydown", "input"]);
|
|
15915
15983
|
}
|
|
15916
15984
|
});
|
|
15917
15985
|
|