@tanstack/query-devtools 5.20.2 → 5.21.3

package/build/Devtools/{6ZYZQAZS.js → SUV2KM2F.js}

@@ -9488,33 +9488,34 @@ delegateEvents(["click"]);
 var _tmpl$24 = /* @__PURE__ */ template(`<div><div aria-hidden=true></div><button aria-label="Open Tanstack query devtools">`);
 var _tmpl$25 = /* @__PURE__ */ template(`<div>`);
 var _tmpl$33 = /* @__PURE__ */ template(`<aside aria-label="Tanstack query devtools"><div></div><button aria-label="Close tanstack query devtools">`);
-var _tmpl$43 = /* @__PURE__ */ template(`<select>`);
-var _tmpl$53 = /* @__PURE__ */ template(`<span>Asc`);
-var _tmpl$63 = /* @__PURE__ */ template(`<span>Desc`);
-var _tmpl$73 = /* @__PURE__ */ template(`<div>Settings`);
-var _tmpl$83 = /* @__PURE__ */ template(`<span>Position`);
-var _tmpl$93 = /* @__PURE__ */ template(`<span>Top`);
-var _tmpl$103 = /* @__PURE__ */ template(`<span>Bottom`);
-var _tmpl$113 = /* @__PURE__ */ template(`<span>Left`);
-var _tmpl$122 = /* @__PURE__ */ template(`<span>Right`);
-var _tmpl$132 = /* @__PURE__ */ template(`<span>Theme`);
-var _tmpl$142 = /* @__PURE__ */ template(`<span>Light`);
-var _tmpl$152 = /* @__PURE__ */ template(`<span>Dark`);
-var _tmpl$162 = /* @__PURE__ */ template(`<span>System`);
-var _tmpl$172 = /* @__PURE__ */ template(`<div><div class=tsqd-queries-container>`);
-var _tmpl$182 = /* @__PURE__ */ template(`<div><div class=tsqd-mutations-container>`);
-var _tmpl$192 = /* @__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 class=tsqd-query-filter-textfield></div><div></div><button class=tsqd-query-filter-sort-order-btn></button></div><div><button aria-label="Clear query cache"></button><button>`);
-var _tmpl$202 = /* @__PURE__ */ template(`<option>Sort by `);
-var _tmpl$212 = /* @__PURE__ */ template(`<div class=tsqd-query-disabled-indicator>disabled`);
-var _tmpl$222 = /* @__PURE__ */ template(`<button><div></div><code class=tsqd-query-hash>`);
-var _tmpl$232 = /* @__PURE__ */ template(`<div role=tooltip id=tsqd-status-tooltip>`);
-var _tmpl$242 = /* @__PURE__ */ template(`<span>`);
-var _tmpl$252 = /* @__PURE__ */ template(`<button><span></span><span>`);
-var _tmpl$26 = /* @__PURE__ */ template(`<button><span></span> Error`);
-var _tmpl$27 = /* @__PURE__ */ template(`<div><span></span>Trigger Error<select><option value=""disabled selected>`);
-var _tmpl$28 = /* @__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 Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-data-explorer"></div><div>Query Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer">`);
-var _tmpl$29 = /* @__PURE__ */ template(`<option>`);
-var _tmpl$30 = /* @__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">`);
+var _tmpl$43 = /* @__PURE__ */ template(`<select name=tsqd-queries-filter-sort>`);
+var _tmpl$53 = /* @__PURE__ */ template(`<select name=tsqd-mutations-filter-sort>`);
+var _tmpl$63 = /* @__PURE__ */ template(`<span>Asc`);
+var _tmpl$73 = /* @__PURE__ */ template(`<span>Desc`);
+var _tmpl$83 = /* @__PURE__ */ template(`<div>Settings`);
+var _tmpl$93 = /* @__PURE__ */ template(`<span>Position`);
+var _tmpl$103 = /* @__PURE__ */ template(`<span>Top`);
+var _tmpl$113 = /* @__PURE__ */ template(`<span>Bottom`);
+var _tmpl$122 = /* @__PURE__ */ template(`<span>Left`);
+var _tmpl$132 = /* @__PURE__ */ template(`<span>Right`);
+var _tmpl$142 = /* @__PURE__ */ template(`<span>Theme`);
+var _tmpl$152 = /* @__PURE__ */ template(`<span>Light`);
+var _tmpl$162 = /* @__PURE__ */ template(`<span>Dark`);
+var _tmpl$172 = /* @__PURE__ */ template(`<span>System`);
+var _tmpl$182 = /* @__PURE__ */ template(`<div><div class=tsqd-queries-container>`);
+var _tmpl$192 = /* @__PURE__ */ template(`<div><div class=tsqd-mutations-container>`);
+var _tmpl$202 = /* @__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 class=tsqd-query-filter-textfield 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>`);
+var _tmpl$212 = /* @__PURE__ */ template(`<option>Sort by `);
+var _tmpl$222 = /* @__PURE__ */ template(`<div class=tsqd-query-disabled-indicator>disabled`);
+var _tmpl$232 = /* @__PURE__ */ template(`<button><div></div><code class=tsqd-query-hash>`);
+var _tmpl$242 = /* @__PURE__ */ template(`<div role=tooltip id=tsqd-status-tooltip>`);
+var _tmpl$252 = /* @__PURE__ */ template(`<span>`);
+var _tmpl$26 = /* @__PURE__ */ template(`<button><span></span><span>`);
+var _tmpl$27 = /* @__PURE__ */ template(`<button><span></span> Error`);
+var _tmpl$28 = /* @__PURE__ */ template(`<div><span></span>Trigger Error<select><option value=""disabled selected>`);
+var _tmpl$29 = /* @__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 Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-data-explorer"></div><div>Query Explorer</div><div class="tsqd-query-details-explorer-container tsqd-query-details-query-explorer">`);
+var _tmpl$30 = /* @__PURE__ */ template(`<option>`);
+var _tmpl$31 = /* @__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">`);
 var firstBreakpoint = 1024;
 var secondBreakpoint = 796;
 var thirdBreakpoint = 700;
@@ -9652,11 +9653,13 @@ var Devtools = (props) => {
             transition:
               opacity 0.3s,
               transform 0.3s;
+            opacity: 1;
           }
 
           & .tsqd-button-transition-exit-to,
           & .tsqd-button-transition-enter {
-            transform: ${buttonPosition() === "top-left" ? `translateX(-72px);` : buttonPosition() === "top-right" ? `translateX(72px);` : `translateY(72px);`};
+            transform: ${buttonPosition() === "relative" ? `none;` : buttonPosition() === "top-left" ? `translateX(-72px);` : buttonPosition() === "top-right" ? `translateX(72px);` : `translateY(72px);`};
+            opacity: 0;
           }
         `, "tsqd-transitions-container")));
     return _el$;
@@ -9859,7 +9862,7 @@ var ContentView = (props) => {
     el.style.setProperty("--tsqd-font-size", variable);
   };
   return [(() => {
-    const _el$8 = _tmpl$192(), _el$9 = _el$8.firstChild, _el$10 = _el$9.firstChild, _el$11 = _el$10.firstChild, _el$12 = _el$11.firstChild, _el$13 = _el$12.nextSibling, _el$14 = _el$13.firstChild, _el$15 = _el$9.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;
+    const _el$8 = _tmpl$202(), _el$9 = _el$8.firstChild, _el$10 = _el$9.firstChild, _el$11 = _el$10.firstChild, _el$12 = _el$11.firstChild, _el$13 = _el$12.nextSibling, _el$14 = _el$13.firstChild, _el$15 = _el$9.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;
     const _ref$3 = containerRef;
     typeof _ref$3 === "function" ? use(_ref$3, _el$8) : containerRef = _el$8;
     _el$11.$$click = () => props.setLocalStore("open", "false");
@@ -9941,7 +9944,7 @@ var ContentView = (props) => {
           props.setLocalStore("sort", e2.currentTarget.value);
         });
         insert(_el$20, () => Object.keys(sortFns).map((key) => (() => {
-          const _el$42 = _tmpl$202(); _el$42.firstChild;
+          const _el$42 = _tmpl$212(); _el$42.firstChild;
           _el$42.value = key;
           insert(_el$42, key, null);
           return _el$42;
@@ -9955,12 +9958,12 @@ var ContentView = (props) => {
         return selectedView() === "mutations";
       },
       get children() {
-        const _el$21 = _tmpl$43();
+        const _el$21 = _tmpl$53();
         _el$21.addEventListener("change", (e2) => {
           props.setLocalStore("mutationSort", e2.currentTarget.value);
         });
         insert(_el$21, () => Object.keys(mutationSortFns).map((key) => (() => {
-          const _el$44 = _tmpl$202(); _el$44.firstChild;
+          const _el$44 = _tmpl$212(); _el$44.firstChild;
           _el$44.value = key;
           insert(_el$44, key, null);
           return _el$44;
@@ -9982,7 +9985,7 @@ var ContentView = (props) => {
         return (selectedView() === "queries" ? sortOrder() : mutationSortOrder()) === 1;
       },
       get children() {
-        return [_tmpl$53(), createComponent(ArrowUp, {})];
+        return [_tmpl$63(), createComponent(ArrowUp, {})];
       }
     }), null);
     insert(_el$22, createComponent(Show, {
@@ -9990,7 +9993,7 @@ var ContentView = (props) => {
         return (selectedView() === "queries" ? sortOrder() : mutationSortOrder()) === -1;
       },
       get children() {
-        return [_tmpl$63(), createComponent(ArrowDown, {})];
+        return [_tmpl$73(), createComponent(ArrowDown, {})];
       }
     }), null);
     _el$26.$$click = () => {
@@ -10033,7 +10036,7 @@ var ContentView = (props) => {
               },
               get children() {
                 return [(() => {
-                  const _el$28 = _tmpl$73();
+                  const _el$28 = _tmpl$83();
                   createRenderEffect(() => className(_el$28, clsx(styles().settingsMenuHeader, "tsqd-settings-menu-header")));
                   return _el$28;
                 })(), createComponent(index$f.Sub, {
@@ -10046,7 +10049,7 @@ var ContentView = (props) => {
                         return clsx(styles().settingsSubTrigger, "tsqd-settings-menu-sub-trigger", "tsqd-settings-menu-sub-trigger-position");
                       },
                       get children() {
-                        return [_tmpl$83(), createComponent(ChevronDown, {})];
+                        return [_tmpl$93(), createComponent(ChevronDown, {})];
                       }
                     }), createComponent(index$f.Portal, {
                       ref: (el) => setComputedVariables(el),
@@ -10065,7 +10068,7 @@ var ContentView = (props) => {
                                 return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-top");
                               },
                               get children() {
-                                return [_tmpl$93(), createComponent(ArrowUp, {})];
+                                return [_tmpl$103(), createComponent(ArrowUp, {})];
                               }
                             }), createComponent(index$f.Item, {
                               onSelect: () => {
@@ -10076,7 +10079,7 @@ var ContentView = (props) => {
                                 return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-bottom");
                               },
                               get children() {
-                                return [_tmpl$103(), createComponent(ArrowDown, {})];
+                                return [_tmpl$113(), createComponent(ArrowDown, {})];
                               }
                             }), createComponent(index$f.Item, {
                               onSelect: () => {
@@ -10087,7 +10090,7 @@ var ContentView = (props) => {
                                 return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-left");
                               },
                               get children() {
-                                return [_tmpl$113(), createComponent(ArrowLeft, {})];
+                                return [_tmpl$122(), createComponent(ArrowLeft, {})];
                               }
                             }), createComponent(index$f.Item, {
                               onSelect: () => {
@@ -10098,7 +10101,7 @@ var ContentView = (props) => {
                                 return clsx(styles().settingsSubButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-right");
                               },
                               get children() {
-                                return [_tmpl$122(), createComponent(ArrowRight, {})];
+                                return [_tmpl$132(), createComponent(ArrowRight, {})];
                               }
                             })];
                           }
@@ -10116,7 +10119,7 @@ var ContentView = (props) => {
                         return clsx(styles().settingsSubTrigger, "tsqd-settings-menu-sub-trigger", "tsqd-settings-menu-sub-trigger-position");
                       },
                       get children() {
-                        return [_tmpl$132(), createComponent(ChevronDown, {})];
+                        return [_tmpl$142(), createComponent(ChevronDown, {})];
                       }
                     }), createComponent(index$f.Portal, {
                       ref: (el) => setComputedVariables(el),
@@ -10135,7 +10138,7 @@ var ContentView = (props) => {
                                 return clsx(styles().settingsSubButton, props.localStore.theme_preference === "light" && styles().themeSelectedButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-top");
                               },
                               get children() {
-                                return [_tmpl$142(), createComponent(Sun, {})];
+                                return [_tmpl$152(), createComponent(Sun, {})];
                               }
                             }), createComponent(index$f.Item, {
                               onSelect: () => {
@@ -10146,7 +10149,7 @@ var ContentView = (props) => {
                                 return clsx(styles().settingsSubButton, props.localStore.theme_preference === "dark" && styles().themeSelectedButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-bottom");
                               },
                               get children() {
-                                return [_tmpl$152(), createComponent(Moon, {})];
+                                return [_tmpl$162(), createComponent(Moon, {})];
                               }
                             }), createComponent(index$f.Item, {
                               onSelect: () => {
@@ -10157,7 +10160,7 @@ var ContentView = (props) => {
                                 return clsx(styles().settingsSubButton, props.localStore.theme_preference === "system" && styles().themeSelectedButton, "tsqd-settings-menu-position-btn", "tsqd-settings-menu-position-btn-left");
                               },
                               get children() {
-                                return [_tmpl$162(), createComponent(Monitor, {})];
+                                return [_tmpl$172(), createComponent(Monitor, {})];
                               }
                             })];
                           }
@@ -10177,7 +10180,7 @@ var ContentView = (props) => {
         return selectedView() === "queries";
       },
       get children() {
-        const _el$38 = _tmpl$172(), _el$39 = _el$38.firstChild;
+        const _el$38 = _tmpl$182(), _el$39 = _el$38.firstChild;
         insert(_el$39, createComponent(Key, {
           by: (q) => q.queryHash,
           get each() {
@@ -10198,7 +10201,7 @@ var ContentView = (props) => {
         return selectedView() === "mutations";
       },
       get children() {
-        const _el$40 = _tmpl$182(), _el$41 = _el$40.firstChild;
+        const _el$40 = _tmpl$192(), _el$41 = _el$40.firstChild;
         insert(_el$41, createComponent(Key, {
           by: (m) => m.mutationId,
           get each() {
@@ -10325,7 +10328,7 @@ var QueryRow = (props) => {
       return queryState();
     },
     get children() {
-      const _el$46 = _tmpl$222(), _el$47 = _el$46.firstChild, _el$48 = _el$47.nextSibling;
+      const _el$46 = _tmpl$232(), _el$47 = _el$46.firstChild, _el$48 = _el$47.nextSibling;
       _el$46.$$click = () => setSelectedQueryHash(props.query.queryHash === selectedQueryHash() ? null : props.query.queryHash);
       insert(_el$47, observers);
       insert(_el$48, () => props.query.queryHash);
@@ -10334,7 +10337,7 @@ var QueryRow = (props) => {
           return isDisabled();
         },
         get children() {
-          return _tmpl$212();
+          return _tmpl$222();
         }
       }), null);
       createRenderEffect((_p$) => {
@@ -10402,7 +10405,7 @@ var MutationRow = (props) => {
       return mutationState();
     },
     get children() {
-      const _el$50 = _tmpl$222(), _el$51 = _el$50.firstChild, _el$52 = _el$51.nextSibling;
+      const _el$50 = _tmpl$232(), _el$51 = _el$50.firstChild, _el$52 = _el$51.nextSibling;
       _el$50.$$click = () => {
         setSelectedMutationId(props.mutation.mutationId === selectedMutationId() ? null : props.mutation.mutationId);
       };
@@ -10593,7 +10596,7 @@ var QueryStatus = (props) => {
     return true;
   });
   return (() => {
-    const _el$55 = _tmpl$252(), _el$57 = _el$55.firstChild, _el$59 = _el$57.nextSibling;
+    const _el$55 = _tmpl$26(), _el$57 = _el$55.firstChild, _el$59 = _el$57.nextSibling;
     const _ref$4 = tagRef;
     typeof _ref$4 === "function" ? use(_ref$4, _el$55) : tagRef = _el$55;
     _el$55.addEventListener("mouseleave", () => {
@@ -10623,7 +10626,7 @@ var QueryStatus = (props) => {
         return createMemo(() => !!!showLabel())() && (mouseOver() || focused());
       },
       get children() {
-        const _el$56 = _tmpl$232();
+        const _el$56 = _tmpl$242();
         insert(_el$56, () => props.label);
         createRenderEffect(() => className(_el$56, clsx(styles().statusTooltip, "tsqd-query-status-tooltip")));
         return _el$56;
@@ -10634,7 +10637,7 @@ var QueryStatus = (props) => {
         return showLabel();
       },
       get children() {
-        const _el$58 = _tmpl$242();
+        const _el$58 = _tmpl$252();
         insert(_el$58, () => props.label);
         createRenderEffect(() => className(_el$58, clsx(styles().queryStatusTagLabel, "tsqd-query-status-tag-label")));
         return _el$58;
@@ -10744,7 +10747,7 @@ var QueryDetails = () => {
       return createMemo(() => !!activeQuery())() && activeQueryState();
     },
     get children() {
-      const _el$60 = _tmpl$28(), _el$61 = _el$60.firstChild, _el$62 = _el$61.nextSibling, _el$63 = _el$62.firstChild, _el$64 = _el$63.firstChild, _el$65 = _el$64.firstChild, _el$66 = _el$64.nextSibling, _el$67 = _el$63.nextSibling, _el$68 = _el$67.firstChild, _el$69 = _el$68.nextSibling, _el$70 = _el$67.nextSibling, _el$71 = _el$70.firstChild, _el$72 = _el$71.nextSibling, _el$73 = _el$62.nextSibling, _el$74 = _el$73.nextSibling, _el$75 = _el$74.firstChild, _el$76 = _el$75.firstChild, _el$77 = _el$75.nextSibling, _el$78 = _el$77.firstChild, _el$79 = _el$77.nextSibling, _el$80 = _el$79.firstChild, _el$81 = _el$79.nextSibling, _el$82 = _el$81.firstChild, _el$83 = _el$81.nextSibling, _el$84 = _el$83.firstChild, _el$85 = _el$84.nextSibling, _el$94 = _el$74.nextSibling, _el$95 = _el$94.nextSibling, _el$96 = _el$95.nextSibling, _el$97 = _el$96.nextSibling;
+      const _el$60 = _tmpl$29(), _el$61 = _el$60.firstChild, _el$62 = _el$61.nextSibling, _el$63 = _el$62.firstChild, _el$64 = _el$63.firstChild, _el$65 = _el$64.firstChild, _el$66 = _el$64.nextSibling, _el$67 = _el$63.nextSibling, _el$68 = _el$67.firstChild, _el$69 = _el$68.nextSibling, _el$70 = _el$67.nextSibling, _el$71 = _el$70.firstChild, _el$72 = _el$71.nextSibling, _el$73 = _el$62.nextSibling, _el$74 = _el$73.nextSibling, _el$75 = _el$74.firstChild, _el$76 = _el$75.firstChild, _el$77 = _el$75.nextSibling, _el$78 = _el$77.firstChild, _el$79 = _el$77.nextSibling, _el$80 = _el$79.firstChild, _el$81 = _el$79.nextSibling, _el$82 = _el$81.firstChild, _el$83 = _el$81.nextSibling, _el$84 = _el$83.firstChild, _el$85 = _el$84.nextSibling, _el$94 = _el$74.nextSibling, _el$95 = _el$94.nextSibling, _el$96 = _el$95.nextSibling, _el$97 = _el$96.nextSibling;
       insert(_el$65, () => displayValue(activeQuery().queryKey, true));
       insert(_el$66, statusLabel);
       insert(_el$69, observerCount);
@@ -10789,7 +10792,7 @@ var QueryDetails = () => {
           return errorTypes().length === 0 || queryStatus() === "error";
         },
         get children() {
-          const _el$86 = _tmpl$26(), _el$87 = _el$86.firstChild, _el$88 = _el$87.nextSibling;
+          const _el$86 = _tmpl$27(), _el$87 = _el$86.firstChild, _el$88 = _el$87.nextSibling;
           _el$86.$$click = () => {
             if (!activeQuery().state.error) {
               triggerError();
@@ -10821,7 +10824,7 @@ var QueryDetails = () => {
           return !(errorTypes().length === 0 || queryStatus() === "error");
         },
         get children() {
-          const _el$89 = _tmpl$27(), _el$90 = _el$89.firstChild, _el$91 = _el$90.nextSibling, _el$92 = _el$91.nextSibling; _el$92.firstChild;
+          const _el$89 = _tmpl$28(), _el$90 = _el$89.firstChild, _el$91 = _el$90.nextSibling, _el$92 = _el$91.nextSibling; _el$92.firstChild;
           _el$92.addEventListener("change", (e2) => {
             const errorType = errorTypes().find((et) => et.name === e2.currentTarget.value);
             triggerError(errorType);
@@ -10831,7 +10834,7 @@ var QueryDetails = () => {
               return errorTypes();
             },
             children: (errorType) => (() => {
-              const _el$98 = _tmpl$29();
+              const _el$98 = _tmpl$30();
               insert(_el$98, () => errorType.name);
               createRenderEffect(() => _el$98.value = errorType.name);
               return _el$98;
@@ -10998,7 +11001,7 @@ var MutationDetails = () => {
       return activeMutation();
     },
     get children() {
-      const _el$99 = _tmpl$30(), _el$100 = _el$99.firstChild, _el$101 = _el$100.nextSibling, _el$102 = _el$101.firstChild, _el$103 = _el$102.firstChild, _el$104 = _el$103.firstChild, _el$105 = _el$103.nextSibling, _el$106 = _el$102.nextSibling, _el$107 = _el$106.firstChild, _el$108 = _el$107.nextSibling, _el$109 = _el$101.nextSibling, _el$110 = _el$109.nextSibling, _el$111 = _el$110.nextSibling, _el$112 = _el$111.nextSibling, _el$113 = _el$112.nextSibling, _el$114 = _el$113.nextSibling, _el$115 = _el$114.nextSibling, _el$116 = _el$115.nextSibling;
+      const _el$99 = _tmpl$31(), _el$100 = _el$99.firstChild, _el$101 = _el$100.nextSibling, _el$102 = _el$101.firstChild, _el$103 = _el$102.firstChild, _el$104 = _el$103.firstChild, _el$105 = _el$103.nextSibling, _el$106 = _el$102.nextSibling, _el$107 = _el$106.firstChild, _el$108 = _el$107.nextSibling, _el$109 = _el$101.nextSibling, _el$110 = _el$109.nextSibling, _el$111 = _el$110.nextSibling, _el$112 = _el$111.nextSibling, _el$113 = _el$112.nextSibling, _el$114 = _el$113.nextSibling, _el$115 = _el$114.nextSibling, _el$116 = _el$115.nextSibling;
       insert(_el$104, createComponent(Show, {
         get when() {
           return activeMutation().options.mutationKey;
@@ -11268,6 +11271,9 @@ var stylesFactory2 = (theme) => {
       top: 12px;
       right: 12px;
     `,
+    "devtoolsBtn-position-relative": u`
+      position: relative;
+    `,
     "panel-position-top": u`
       top: 0;
       right: 0;

package/build/Devtools/{FWYJEP5C.jsx → VAJS2OS4.jsx}

@@ -10509,11 +10509,13 @@ var Devtools = (props) => {
             transition:
               opacity 0.3s,
               transform 0.3s;
+            opacity: 1;
           }
 
           & .tsqd-button-transition-exit-to,
           & .tsqd-button-transition-enter {
-            transform: ${buttonPosition() === "top-left" ? `translateX(-72px);` : buttonPosition() === "top-right" ? `translateX(72px);` : `translateY(72px);`};
+            transform: ${buttonPosition() === "relative" ? `none;` : buttonPosition() === "top-left" ? `translateX(-72px);` : buttonPosition() === "top-right" ? `translateX(72px);` : `translateY(72px);`};
+            opacity: 0;
           }
         `,
       "tsqd-transitions-container"
@@ -10850,6 +10852,7 @@ var ContentView = (props) => {
                 }
               }}
               class="tsqd-query-filter-textfield"
+              name="tsqd-query-filter-input"
               value={selectedView() === "queries" ? props.localStore.filter || "" : props.localStore.mutationFilter || ""}
             />
           </div>
@@ -10861,6 +10864,7 @@ var ContentView = (props) => {
           >
             <Show when={selectedView() === "queries"}><select
               value={sort()}
+              name="tsqd-queries-filter-sort"
               onChange={(e2) => {
                 props.setLocalStore("sort", e2.currentTarget.value);
               }}
@@ -10870,6 +10874,7 @@ var ContentView = (props) => {
             </option>)}</select></Show>
             <Show when={selectedView() === "mutations"}><select
               value={mutationSort()}
+              name="tsqd-mutations-filter-sort"
               onChange={(e2) => {
                 props.setLocalStore("mutationSort", e2.currentTarget.value);
               }}
@@ -12076,6 +12081,9 @@ var stylesFactory2 = (theme) => {
       top: 12px;
       right: 12px;
     `,
+    "devtoolsBtn-position-relative": u`
+      position: relative;
+    `,
     "panel-position-top": u`
       top: 0;
       right: 0;

package/build/Devtools/{2TZ2XDYA.jsx → Z62CHOQ7.jsx}

@@ -10510,11 +10510,13 @@ var Devtools = (props) => {
             transition:
               opacity 0.3s,
               transform 0.3s;
+            opacity: 1;
           }
 
           & .tsqd-button-transition-exit-to,
           & .tsqd-button-transition-enter {
-            transform: ${buttonPosition() === "top-left" ? `translateX(-72px);` : buttonPosition() === "top-right" ? `translateX(72px);` : `translateY(72px);`};
+            transform: ${buttonPosition() === "relative" ? `none;` : buttonPosition() === "top-left" ? `translateX(-72px);` : buttonPosition() === "top-right" ? `translateX(72px);` : `translateY(72px);`};
+            opacity: 0;
           }
         `,
       "tsqd-transitions-container"
@@ -10851,6 +10853,7 @@ var ContentView = (props) => {
                 }
               }}
               class="tsqd-query-filter-textfield"
+              name="tsqd-query-filter-input"
               value={selectedView() === "queries" ? props.localStore.filter || "" : props.localStore.mutationFilter || ""}
             />
           </div>
@@ -10862,6 +10865,7 @@ var ContentView = (props) => {
           >
             <Show when={selectedView() === "queries"}><select
               value={sort()}
+              name="tsqd-queries-filter-sort"
               onChange={(e2) => {
                 props.setLocalStore("sort", e2.currentTarget.value);
               }}
@@ -10871,6 +10875,7 @@ var ContentView = (props) => {
             </option>)}</select></Show>
             <Show when={selectedView() === "mutations"}><select
               value={mutationSort()}
+              name="tsqd-mutations-filter-sort"
               onChange={(e2) => {
                 props.setLocalStore("mutationSort", e2.currentTarget.value);
               }}
@@ -12077,6 +12082,9 @@ var stylesFactory2 = (theme) => {
       top: 12px;
       right: 12px;
     `,
+    "devtoolsBtn-position-relative": u`
+      position: relative;
+    `,
     "panel-position-top": u`
       top: 0;
       right: 0;