@tanstack/query-devtools 5.1.0 → 5.7.4

package/build/Devtools/{BWLPXLBN.js → G2MVXYID.js}

@@ -1,4 +1,4 @@
-import { createContext, delegateEvents, createSignal, createMemo, createComponent, createEffect, insert, Show, createRenderEffect, className, onMount, on, setAttribute, spread, mergeProps, For, onCleanup, isServer, $PROXY, $TRACK, getListener, batch, createUniqueId, useContext, Index, template, use, untrack, useTransition, createRoot, splitProps, Portal, addEventListener, Switch, Match, Dynamic, children, createComputed, getOwner, DEV } from '../chunk/Z53XT47W.js';
+import { createContext, delegateEvents, sortFns, mutationSortFns, createSignal, getPreferredColorScheme, createMemo, createComponent, createEffect, onMount, onCleanup, use, insert, Show, createRenderEffect, className, on, setAttribute, getQueryStatusColor, getMutationStatusColor, getQueryStatusLabel, spread, mergeProps, getQueryStatusColorByLabel, displayValue, For, isServer, $PROXY, $TRACK, getListener, batch, createUniqueId, useContext, Index, updateNestedDataByPath, template, convertRemToPixels, getSidedProp, untrack, useTransition, createRoot, splitProps, Portal, addEventListener, stringify, Switch, Match, deleteNestedDataByPath, Dynamic, children, createComputed, getOwner, DEV } from '../chunk/2CFRQNPI.js';
 
 // ../../node_modules/.pnpm/@tanstack+match-sorter-utils@8.8.4/node_modules/@tanstack/match-sorter-utils/build/lib/index.mjs
 var characterMap = {
@@ -681,8 +681,8 @@ var noop = () => {
 function createListTransition(source, options) {
   const initSource = untrack(source);
   if (isServer) {
-    const copy2 = initSource.slice();
-    return () => copy2;
+    const copy = initSource.slice();
+    return () => copy;
   }
   const { onChange } = options;
   let prevSet = new Set(options.appear ? void 0 : initSource);
@@ -1700,7 +1700,7 @@ function isElementInScope(element, scope) {
 }
 function getFocusableTreeWalker(root, opts, scope) {
   const selector = opts?.tabbable ? TABBABLE_ELEMENT_SELECTOR : FOCUSABLE_ELEMENT_SELECTOR;
-  const walker2 = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
+  const walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
     acceptNode(node) {
       if (opts?.from?.contains(node)) {
         return NodeFilter.FILTER_REJECT;
@@ -1712,9 +1712,9 @@ function getFocusableTreeWalker(root, opts, scope) {
     }
   });
   if (opts?.from) {
-    walker2.currentNode = opts.from;
+    walker.currentNode = opts.from;
   }
-  return walker2;
+  return walker;
 }
 function noop3() {
   return;
@@ -2048,19 +2048,19 @@ function updatePath(current, path, traversed = []) {
   let part, prev = current;
   if (path.length > 1) {
     part = path.shift();
-    const partType = typeof part, isArray4 = Array.isArray(current);
+    const partType = typeof part, isArray2 = Array.isArray(current);
     if (Array.isArray(part)) {
       for (let i2 = 0; i2 < part.length; i2++) {
         updatePath(current, [part[i2]].concat(path), traversed);
       }
       return;
-    } else if (isArray4 && partType === "function") {
+    } else if (isArray2 && partType === "function") {
       for (let i2 = 0; i2 < current.length; i2++) {
         if (part(current[i2], i2))
           updatePath(current, [i2].concat(path), traversed);
       }
       return;
-    } else if (isArray4 && partType === "object") {
+    } else if (isArray2 && partType === "object") {
       const { from = 0, to = current.length - 1, by = 1 } = part;
       for (let i2 = from; i2 <= to; i2 += by) {
         updatePath(current, [i2].concat(path), traversed);
@@ -2089,11 +2089,11 @@ function updatePath(current, path, traversed = []) {
 }
 function createStore(...[store, options]) {
   const unwrappedStore = unwrap(store || {});
-  const isArray4 = Array.isArray(unwrappedStore);
+  const isArray2 = Array.isArray(unwrappedStore);
   const wrappedStore = wrap$1(unwrappedStore);
   function setStore(...args) {
     batch(() => {
-      isArray4 && args.length === 1 ? updateArray(unwrappedStore, args[0]) : updatePath(unwrappedStore, args);
+      isArray2 && args.length === 1 ? updateArray(unwrappedStore, args[0]) : updatePath(unwrappedStore, args);
     });
   }
   return [wrappedStore, setStore];
@@ -4039,7 +4039,7 @@ function ariaHideOutside(targets, root = document.body) {
       }
       return NodeFilter.FILTER_ACCEPT;
     };
-    const walker2 = document.createTreeWalker(root2, NodeFilter.SHOW_ELEMENT, {
+    const walker = document.createTreeWalker(root2, NodeFilter.SHOW_ELEMENT, {
       acceptNode
     });
     const acceptRoot = acceptNode(root2);
@@ -4047,10 +4047,10 @@ function ariaHideOutside(targets, root = document.body) {
       hide2(root2);
     }
     if (acceptRoot !== NodeFilter.FILTER_REJECT) {
-      let node = walker2.nextNode();
+      let node = walker.nextNode();
       while (node != null) {
         hide2(node);
-        node = walker2.nextNode();
+        node = walker.nextNode();
       }
     }
   };
@@ -5022,13 +5022,13 @@ function createSelectableCollection(props, ref, scrollRef) {
           if (e2.shiftKey) {
             refEl.focus();
           } else {
-            const walker2 = getFocusableTreeWalker(refEl, {
+            const walker = getFocusableTreeWalker(refEl, {
               tabbable: true
             });
             let next;
             let last;
             do {
-              last = walker2.lastChild();
+              last = walker.lastChild();
               if (last) {
                 next = last;
               }
@@ -8510,35 +8510,35 @@ var tokens = {
   },
   font: {
     size: {
-      "2xs": "0.625rem",
-      xs: "0.75rem",
-      sm: "0.875rem",
-      md: "1rem",
-      lg: "1.125rem",
-      xl: "1.25rem",
-      "2xl": "1.5rem",
-      "3xl": "1.875rem",
-      "4xl": "2.25rem",
-      "5xl": "3rem",
-      "6xl": "3.75rem",
-      "7xl": "4.5rem",
-      "8xl": "6rem",
-      "9xl": "8rem"
+      "2xs": "calc(var(--tsqd-font-size) * 0.625)",
+      xs: "calc(var(--tsqd-font-size) * 0.75)",
+      sm: "calc(var(--tsqd-font-size) * 0.875)",
+      md: "var(--tsqd-font-size)",
+      lg: "calc(var(--tsqd-font-size) * 1.125)",
+      xl: "calc(var(--tsqd-font-size) * 1.25)",
+      "2xl": "calc(var(--tsqd-font-size) * 1.5)",
+      "3xl": "calc(var(--tsqd-font-size) * 1.875)",
+      "4xl": "calc(var(--tsqd-font-size) * 2.25)",
+      "5xl": "calc(var(--tsqd-font-size) * 3)",
+      "6xl": "calc(var(--tsqd-font-size) * 3.75)",
+      "7xl": "calc(var(--tsqd-font-size) * 4.5)",
+      "8xl": "calc(var(--tsqd-font-size) * 6)",
+      "9xl": "calc(var(--tsqd-font-size) * 8)"
     },
     lineHeight: {
-      xs: "1rem",
-      sm: "1.25rem",
-      md: "1.5rem",
-      lg: "1.75rem",
-      xl: "1.75rem",
-      "2xl": "2rem",
-      "3xl": "2.25rem",
-      "4xl": "2.5rem",
-      "5xl": "1",
-      "6xl": "1",
-      "7xl": "1",
-      "8xl": "1",
-      "9xl": "1"
+      xs: "calc(var(--tsqd-font-size) * 1)",
+      sm: "calc(var(--tsqd-font-size) * 1.25)",
+      md: "calc(var(--tsqd-font-size) * 1.5)",
+      lg: "calc(var(--tsqd-font-size) * 1.75)",
+      xl: "calc(var(--tsqd-font-size) * 2)",
+      "2xl": "calc(var(--tsqd-font-size) * 2.25)",
+      "3xl": "calc(var(--tsqd-font-size) * 2.5)",
+      "4xl": "calc(var(--tsqd-font-size) * 2.75)",
+      "5xl": "calc(var(--tsqd-font-size) * 3)",
+      "6xl": "calc(var(--tsqd-font-size) * 3.25)",
+      "7xl": "calc(var(--tsqd-font-size) * 3.5)",
+      "8xl": "calc(var(--tsqd-font-size) * 3.75)",
+      "9xl": "calc(var(--tsqd-font-size) * 4)"
     },
     weight: {
       thin: "100",
@@ -8563,55 +8563,55 @@ var tokens = {
   border: {
     radius: {
       none: "0px",
-      xs: "0.125rem",
-      sm: "0.25rem",
-      md: "0.375rem",
-      lg: "0.5rem",
-      xl: "0.75rem",
-      "2xl": "1rem",
-      "3xl": "1.5rem",
+      xs: "calc(var(--tsqd-font-size) * 0.125)",
+      sm: "calc(var(--tsqd-font-size) * 0.25)",
+      md: "calc(var(--tsqd-font-size) * 0.375)",
+      lg: "calc(var(--tsqd-font-size) * 0.5)",
+      xl: "calc(var(--tsqd-font-size) * 0.75)",
+      "2xl": "calc(var(--tsqd-font-size) * 1)",
+      "3xl": "calc(var(--tsqd-font-size) * 1.5)",
       full: "9999px"
     }
   },
   size: {
     0: "0px",
-    0.25: "0.0625rem",
-    0.5: "0.125rem",
-    1: "0.25rem",
-    1.5: "0.375rem",
-    2: "0.5rem",
-    2.5: "0.625rem",
-    3: "0.75rem",
-    3.5: "0.875rem",
-    4: "1rem",
-    4.5: "1.125rem",
-    5: "1.25rem",
-    5.5: "1.375rem",
-    6: "1.5rem",
-    6.5: "1.625rem",
-    7: "1.75rem",
-    8: "2rem",
-    9: "2.25rem",
-    10: "2.5rem",
-    11: "2.75rem",
-    12: "3rem",
-    14: "3.5rem",
-    16: "4rem",
-    20: "5rem",
-    24: "6rem",
-    28: "7rem",
-    32: "8rem",
-    36: "9rem",
-    40: "10rem",
-    44: "11rem",
-    48: "12rem",
-    52: "13rem",
-    56: "14rem",
-    60: "15rem",
-    64: "16rem",
-    72: "18rem",
-    80: "20rem",
-    96: "24rem"
+    0.25: "calc(var(--tsqd-font-size) * 0.0625)",
+    0.5: "calc(var(--tsqd-font-size) * 0.125)",
+    1: "calc(var(--tsqd-font-size) * 0.25)",
+    1.5: "calc(var(--tsqd-font-size) * 0.375)",
+    2: "calc(var(--tsqd-font-size) * 0.5)",
+    2.5: "calc(var(--tsqd-font-size) * 0.625)",
+    3: "calc(var(--tsqd-font-size) * 0.75)",
+    3.5: "calc(var(--tsqd-font-size) * 0.875)",
+    4: "calc(var(--tsqd-font-size) * 1)",
+    4.5: "calc(var(--tsqd-font-size) * 1.125)",
+    5: "calc(var(--tsqd-font-size) * 1.25)",
+    5.5: "calc(var(--tsqd-font-size) * 1.375)",
+    6: "calc(var(--tsqd-font-size) * 1.5)",
+    6.5: "calc(var(--tsqd-font-size) * 1.625)",
+    7: "calc(var(--tsqd-font-size) * 1.75)",
+    8: "calc(var(--tsqd-font-size) * 2)",
+    9: "calc(var(--tsqd-font-size) * 2.25)",
+    10: "calc(var(--tsqd-font-size) * 2.5)",
+    11: "calc(var(--tsqd-font-size) * 2.75)",
+    12: "calc(var(--tsqd-font-size) * 3)",
+    14: "calc(var(--tsqd-font-size) * 3.5)",
+    16: "calc(var(--tsqd-font-size) * 4)",
+    20: "calc(var(--tsqd-font-size) * 5)",
+    24: "calc(var(--tsqd-font-size) * 6)",
+    28: "calc(var(--tsqd-font-size) * 7)",
+    32: "calc(var(--tsqd-font-size) * 8)",
+    36: "calc(var(--tsqd-font-size) * 9)",
+    40: "calc(var(--tsqd-font-size) * 10)",
+    44: "calc(var(--tsqd-font-size) * 11)",
+    48: "calc(var(--tsqd-font-size) * 12)",
+    52: "calc(var(--tsqd-font-size) * 13)",
+    56: "calc(var(--tsqd-font-size) * 14)",
+    60: "calc(var(--tsqd-font-size) * 15)",
+    64: "calc(var(--tsqd-font-size) * 16)",
+    72: "calc(var(--tsqd-font-size) * 18)",
+    80: "calc(var(--tsqd-font-size) * 20)",
+    96: "calc(var(--tsqd-font-size) * 24)"
   },
   shadow: Shadow,
   zIndices: {
@@ -8631,1190 +8631,6 @@ var tokens = {
   }
 };
 
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/double-indexed-kv.js
-var DoubleIndexedKV = (
-  /** @class */
-  function() {
-    function DoubleIndexedKV2() {
-      this.keyToValue = /* @__PURE__ */ new Map();
-      this.valueToKey = /* @__PURE__ */ new Map();
-    }
-    DoubleIndexedKV2.prototype.set = function(key, value) {
-      this.keyToValue.set(key, value);
-      this.valueToKey.set(value, key);
-    };
-    DoubleIndexedKV2.prototype.getByKey = function(key) {
-      return this.keyToValue.get(key);
-    };
-    DoubleIndexedKV2.prototype.getByValue = function(value) {
-      return this.valueToKey.get(value);
-    };
-    DoubleIndexedKV2.prototype.clear = function() {
-      this.keyToValue.clear();
-      this.valueToKey.clear();
-    };
-    return DoubleIndexedKV2;
-  }()
-);
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/registry.js
-var Registry = (
-  /** @class */
-  function() {
-    function Registry2(generateIdentifier) {
-      this.generateIdentifier = generateIdentifier;
-      this.kv = new DoubleIndexedKV();
-    }
-    Registry2.prototype.register = function(value, identifier) {
-      if (this.kv.getByValue(value)) {
-        return;
-      }
-      if (!identifier) {
-        identifier = this.generateIdentifier(value);
-      }
-      this.kv.set(identifier, value);
-    };
-    Registry2.prototype.clear = function() {
-      this.kv.clear();
-    };
-    Registry2.prototype.getIdentifier = function(value) {
-      return this.kv.getByValue(value);
-    };
-    Registry2.prototype.getValue = function(identifier) {
-      return this.kv.getByKey(identifier);
-    };
-    return Registry2;
-  }()
-);
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/class-registry.js
-var __extends = function() {
-  var extendStatics = function(d, b2) {
-    extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function(d2, b3) {
-      d2.__proto__ = b3;
-    } || function(d2, b3) {
-      for (var p2 in b3)
-        if (Object.prototype.hasOwnProperty.call(b3, p2))
-          d2[p2] = b3[p2];
-    };
-    return extendStatics(d, b2);
-  };
-  return function(d, b2) {
-    if (typeof b2 !== "function" && b2 !== null)
-      throw new TypeError("Class extends value " + String(b2) + " is not a constructor or null");
-    extendStatics(d, b2);
-    function __() {
-      this.constructor = d;
-    }
-    d.prototype = b2 === null ? Object.create(b2) : (__.prototype = b2.prototype, new __());
-  };
-}();
-var ClassRegistry = (
-  /** @class */
-  function(_super) {
-    __extends(ClassRegistry2, _super);
-    function ClassRegistry2() {
-      var _this = _super.call(this, function(c2) {
-        return c2.name;
-      }) || this;
-      _this.classToAllowedProps = /* @__PURE__ */ new Map();
-      return _this;
-    }
-    ClassRegistry2.prototype.register = function(value, options) {
-      if (typeof options === "object") {
-        if (options.allowProps) {
-          this.classToAllowedProps.set(value, options.allowProps);
-        }
-        _super.prototype.register.call(this, value, options.identifier);
-      } else {
-        _super.prototype.register.call(this, value, options);
-      }
-    };
-    ClassRegistry2.prototype.getAllowedProps = function(value) {
-      return this.classToAllowedProps.get(value);
-    };
-    return ClassRegistry2;
-  }(Registry)
-);
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/util.js
-var __read = function(o2, n2) {
-  var m = typeof Symbol === "function" && o2[Symbol.iterator];
-  if (!m)
-    return o2;
-  var i2 = m.call(o2), r2, ar = [], e2;
-  try {
-    while ((n2 === void 0 || n2-- > 0) && !(r2 = i2.next()).done)
-      ar.push(r2.value);
-  } catch (error) {
-    e2 = { error };
-  } finally {
-    try {
-      if (r2 && !r2.done && (m = i2["return"]))
-        m.call(i2);
-    } finally {
-      if (e2)
-        throw e2.error;
-    }
-  }
-  return ar;
-};
-function valuesOfObj(record) {
-  if ("values" in Object) {
-    return Object.values(record);
-  }
-  var values = [];
-  for (var key in record) {
-    if (record.hasOwnProperty(key)) {
-      values.push(record[key]);
-    }
-  }
-  return values;
-}
-function find2(record, predicate) {
-  var values = valuesOfObj(record);
-  if ("find" in values) {
-    return values.find(predicate);
-  }
-  var valuesNotNever = values;
-  for (var i2 = 0; i2 < valuesNotNever.length; i2++) {
-    var value = valuesNotNever[i2];
-    if (predicate(value)) {
-      return value;
-    }
-  }
-  return void 0;
-}
-function forEach(record, run) {
-  Object.entries(record).forEach(function(_a) {
-    var _b = __read(_a, 2), key = _b[0], value = _b[1];
-    return run(value, key);
-  });
-}
-function includes(arr, value) {
-  return arr.indexOf(value) !== -1;
-}
-function findArr(record, predicate) {
-  for (var i2 = 0; i2 < record.length; i2++) {
-    var value = record[i2];
-    if (predicate(value)) {
-      return value;
-    }
-  }
-  return void 0;
-}
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/custom-transformer-registry.js
-var CustomTransformerRegistry = (
-  /** @class */
-  function() {
-    function CustomTransformerRegistry2() {
-      this.transfomers = {};
-    }
-    CustomTransformerRegistry2.prototype.register = function(transformer) {
-      this.transfomers[transformer.name] = transformer;
-    };
-    CustomTransformerRegistry2.prototype.findApplicable = function(v) {
-      return find2(this.transfomers, function(transformer) {
-        return transformer.isApplicable(v);
-      });
-    };
-    CustomTransformerRegistry2.prototype.findByName = function(name) {
-      return this.transfomers[name];
-    };
-    return CustomTransformerRegistry2;
-  }()
-);
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/is.js
-var getType = function(payload) {
-  return Object.prototype.toString.call(payload).slice(8, -1);
-};
-var isUndefined = function(payload) {
-  return typeof payload === "undefined";
-};
-var isNull = function(payload) {
-  return payload === null;
-};
-var isPlainObject = function(payload) {
-  if (typeof payload !== "object" || payload === null)
-    return false;
-  if (payload === Object.prototype)
-    return false;
-  if (Object.getPrototypeOf(payload) === null)
-    return true;
-  return Object.getPrototypeOf(payload) === Object.prototype;
-};
-var isEmptyObject = function(payload) {
-  return isPlainObject(payload) && Object.keys(payload).length === 0;
-};
-var isArray2 = function(payload) {
-  return Array.isArray(payload);
-};
-var isString2 = function(payload) {
-  return typeof payload === "string";
-};
-var isNumber2 = function(payload) {
-  return typeof payload === "number" && !isNaN(payload);
-};
-var isBoolean = function(payload) {
-  return typeof payload === "boolean";
-};
-var isRegExp = function(payload) {
-  return payload instanceof RegExp;
-};
-var isMap = function(payload) {
-  return payload instanceof Map;
-};
-var isSet = function(payload) {
-  return payload instanceof Set;
-};
-var isSymbol = function(payload) {
-  return getType(payload) === "Symbol";
-};
-var isDate = function(payload) {
-  return payload instanceof Date && !isNaN(payload.valueOf());
-};
-var isError = function(payload) {
-  return payload instanceof Error;
-};
-var isNaNValue = function(payload) {
-  return typeof payload === "number" && isNaN(payload);
-};
-var isPrimitive = function(payload) {
-  return isBoolean(payload) || isNull(payload) || isUndefined(payload) || isNumber2(payload) || isString2(payload) || isSymbol(payload);
-};
-var isBigint = function(payload) {
-  return typeof payload === "bigint";
-};
-var isInfinite = function(payload) {
-  return payload === Infinity || payload === -Infinity;
-};
-var isTypedArray = function(payload) {
-  return ArrayBuffer.isView(payload) && !(payload instanceof DataView);
-};
-var isURL = function(payload) {
-  return payload instanceof URL;
-};
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/pathstringifier.js
-var escapeKey = function(key) {
-  return key.replace(/\./g, "\\.");
-};
-var stringifyPath = function(path) {
-  return path.map(String).map(escapeKey).join(".");
-};
-var parsePath = function(string) {
-  var result = [];
-  var segment = "";
-  for (var i2 = 0; i2 < string.length; i2++) {
-    var char = string.charAt(i2);
-    var isEscapedDot = char === "\\" && string.charAt(i2 + 1) === ".";
-    if (isEscapedDot) {
-      segment += ".";
-      i2++;
-      continue;
-    }
-    var isEndOfSegment = char === ".";
-    if (isEndOfSegment) {
-      result.push(segment);
-      segment = "";
-      continue;
-    }
-    segment += char;
-  }
-  var lastSegment = segment;
-  result.push(lastSegment);
-  return result;
-};
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/transformer.js
-var __assign = function() {
-  __assign = Object.assign || function(t2) {
-    for (var s2, i2 = 1, n2 = arguments.length; i2 < n2; i2++) {
-      s2 = arguments[i2];
-      for (var p2 in s2)
-        if (Object.prototype.hasOwnProperty.call(s2, p2))
-          t2[p2] = s2[p2];
-    }
-    return t2;
-  };
-  return __assign.apply(this, arguments);
-};
-var __read2 = function(o2, n2) {
-  var m = typeof Symbol === "function" && o2[Symbol.iterator];
-  if (!m)
-    return o2;
-  var i2 = m.call(o2), r2, ar = [], e2;
-  try {
-    while ((n2 === void 0 || n2-- > 0) && !(r2 = i2.next()).done)
-      ar.push(r2.value);
-  } catch (error) {
-    e2 = { error };
-  } finally {
-    try {
-      if (r2 && !r2.done && (m = i2["return"]))
-        m.call(i2);
-    } finally {
-      if (e2)
-        throw e2.error;
-    }
-  }
-  return ar;
-};
-var __spreadArray = function(to, from) {
-  for (var i2 = 0, il = from.length, j = to.length; i2 < il; i2++, j++)
-    to[j] = from[i2];
-  return to;
-};
-function simpleTransformation(isApplicable, annotation, transform, untransform) {
-  return {
-    isApplicable,
-    annotation,
-    transform,
-    untransform
-  };
-}
-var simpleRules = [
-  simpleTransformation(isUndefined, "undefined", function() {
-    return null;
-  }, function() {
-    return void 0;
-  }),
-  simpleTransformation(isBigint, "bigint", function(v) {
-    return v.toString();
-  }, function(v) {
-    if (typeof BigInt !== "undefined") {
-      return BigInt(v);
-    }
-    return v;
-  }),
-  simpleTransformation(isDate, "Date", function(v) {
-    return v.toISOString();
-  }, function(v) {
-    return new Date(v);
-  }),
-  simpleTransformation(isError, "Error", function(v, superJson) {
-    var baseError = {
-      name: v.name,
-      message: v.message
-    };
-    superJson.allowedErrorProps.forEach(function(prop) {
-      baseError[prop] = v[prop];
-    });
-    return baseError;
-  }, function(v, superJson) {
-    var e2 = new Error(v.message);
-    e2.name = v.name;
-    e2.stack = v.stack;
-    superJson.allowedErrorProps.forEach(function(prop) {
-      e2[prop] = v[prop];
-    });
-    return e2;
-  }),
-  simpleTransformation(isRegExp, "regexp", function(v) {
-    return "" + v;
-  }, function(regex) {
-    var body = regex.slice(1, regex.lastIndexOf("/"));
-    var flags = regex.slice(regex.lastIndexOf("/") + 1);
-    return new RegExp(body, flags);
-  }),
-  simpleTransformation(
-    isSet,
-    "set",
-    // (sets only exist in es6+)
-    // eslint-disable-next-line es5/no-es6-methods
-    function(v) {
-      return __spreadArray([], __read2(v.values()));
-    },
-    function(v) {
-      return new Set(v);
-    }
-  ),
-  simpleTransformation(isMap, "map", function(v) {
-    return __spreadArray([], __read2(v.entries()));
-  }, function(v) {
-    return new Map(v);
-  }),
-  simpleTransformation(function(v) {
-    return isNaNValue(v) || isInfinite(v);
-  }, "number", function(v) {
-    if (isNaNValue(v)) {
-      return "NaN";
-    }
-    if (v > 0) {
-      return "Infinity";
-    } else {
-      return "-Infinity";
-    }
-  }, Number),
-  simpleTransformation(function(v) {
-    return v === 0 && 1 / v === -Infinity;
-  }, "number", function() {
-    return "-0";
-  }, Number),
-  simpleTransformation(isURL, "URL", function(v) {
-    return v.toString();
-  }, function(v) {
-    return new URL(v);
-  })
-];
-function compositeTransformation(isApplicable, annotation, transform, untransform) {
-  return {
-    isApplicable,
-    annotation,
-    transform,
-    untransform
-  };
-}
-var symbolRule = compositeTransformation(function(s2, superJson) {
-  if (isSymbol(s2)) {
-    var isRegistered = !!superJson.symbolRegistry.getIdentifier(s2);
-    return isRegistered;
-  }
-  return false;
-}, function(s2, superJson) {
-  var identifier = superJson.symbolRegistry.getIdentifier(s2);
-  return ["symbol", identifier];
-}, function(v) {
-  return v.description;
-}, function(_, a2, superJson) {
-  var value = superJson.symbolRegistry.getValue(a2[1]);
-  if (!value) {
-    throw new Error("Trying to deserialize unknown symbol");
-  }
-  return value;
-});
-var constructorToName = [
-  Int8Array,
-  Uint8Array,
-  Int16Array,
-  Uint16Array,
-  Int32Array,
-  Uint32Array,
-  Float32Array,
-  Float64Array,
-  Uint8ClampedArray
-].reduce(function(obj, ctor) {
-  obj[ctor.name] = ctor;
-  return obj;
-}, {});
-var typedArrayRule = compositeTransformation(isTypedArray, function(v) {
-  return ["typed-array", v.constructor.name];
-}, function(v) {
-  return __spreadArray([], __read2(v));
-}, function(v, a2) {
-  var ctor = constructorToName[a2[1]];
-  if (!ctor) {
-    throw new Error("Trying to deserialize unknown typed array");
-  }
-  return new ctor(v);
-});
-function isInstanceOfRegisteredClass(potentialClass, superJson) {
-  if (potentialClass === null || potentialClass === void 0 ? void 0 : potentialClass.constructor) {
-    var isRegistered = !!superJson.classRegistry.getIdentifier(potentialClass.constructor);
-    return isRegistered;
-  }
-  return false;
-}
-var classRule = compositeTransformation(isInstanceOfRegisteredClass, function(clazz, superJson) {
-  var identifier = superJson.classRegistry.getIdentifier(clazz.constructor);
-  return ["class", identifier];
-}, function(clazz, superJson) {
-  var allowedProps = superJson.classRegistry.getAllowedProps(clazz.constructor);
-  if (!allowedProps) {
-    return __assign({}, clazz);
-  }
-  var result = {};
-  allowedProps.forEach(function(prop) {
-    result[prop] = clazz[prop];
-  });
-  return result;
-}, function(v, a2, superJson) {
-  var clazz = superJson.classRegistry.getValue(a2[1]);
-  if (!clazz) {
-    throw new Error("Trying to deserialize unknown class - check https://github.com/blitz-js/superjson/issues/116#issuecomment-773996564");
-  }
-  return Object.assign(Object.create(clazz.prototype), v);
-});
-var customRule = compositeTransformation(function(value, superJson) {
-  return !!superJson.customTransformerRegistry.findApplicable(value);
-}, function(value, superJson) {
-  var transformer = superJson.customTransformerRegistry.findApplicable(value);
-  return ["custom", transformer.name];
-}, function(value, superJson) {
-  var transformer = superJson.customTransformerRegistry.findApplicable(value);
-  return transformer.serialize(value);
-}, function(v, a2, superJson) {
-  var transformer = superJson.customTransformerRegistry.findByName(a2[1]);
-  if (!transformer) {
-    throw new Error("Trying to deserialize unknown custom value");
-  }
-  return transformer.deserialize(v);
-});
-var compositeRules = [classRule, symbolRule, customRule, typedArrayRule];
-var transformValue = function(value, superJson) {
-  var applicableCompositeRule = findArr(compositeRules, function(rule) {
-    return rule.isApplicable(value, superJson);
-  });
-  if (applicableCompositeRule) {
-    return {
-      value: applicableCompositeRule.transform(value, superJson),
-      type: applicableCompositeRule.annotation(value, superJson)
-    };
-  }
-  var applicableSimpleRule = findArr(simpleRules, function(rule) {
-    return rule.isApplicable(value, superJson);
-  });
-  if (applicableSimpleRule) {
-    return {
-      value: applicableSimpleRule.transform(value, superJson),
-      type: applicableSimpleRule.annotation
-    };
-  }
-  return void 0;
-};
-var simpleRulesByAnnotation = {};
-simpleRules.forEach(function(rule) {
-  simpleRulesByAnnotation[rule.annotation] = rule;
-});
-var untransformValue = function(json, type, superJson) {
-  if (isArray2(type)) {
-    switch (type[0]) {
-      case "symbol":
-        return symbolRule.untransform(json, type, superJson);
-      case "class":
-        return classRule.untransform(json, type, superJson);
-      case "custom":
-        return customRule.untransform(json, type, superJson);
-      case "typed-array":
-        return typedArrayRule.untransform(json, type, superJson);
-      default:
-        throw new Error("Unknown transformation: " + type);
-    }
-  } else {
-    var transformation = simpleRulesByAnnotation[type];
-    if (!transformation) {
-      throw new Error("Unknown transformation: " + type);
-    }
-    return transformation.untransform(json, superJson);
-  }
-};
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/accessDeep.js
-var getNthKey = function(value, n2) {
-  var keys2 = value.keys();
-  while (n2 > 0) {
-    keys2.next();
-    n2--;
-  }
-  return keys2.next().value;
-};
-function validatePath(path) {
-  if (includes(path, "__proto__")) {
-    throw new Error("__proto__ is not allowed as a property");
-  }
-  if (includes(path, "prototype")) {
-    throw new Error("prototype is not allowed as a property");
-  }
-  if (includes(path, "constructor")) {
-    throw new Error("constructor is not allowed as a property");
-  }
-}
-var getDeep = function(object, path) {
-  validatePath(path);
-  for (var i2 = 0; i2 < path.length; i2++) {
-    var key = path[i2];
-    if (isSet(object)) {
-      object = getNthKey(object, +key);
-    } else if (isMap(object)) {
-      var row = +key;
-      var type = +path[++i2] === 0 ? "key" : "value";
-      var keyOfRow = getNthKey(object, row);
-      switch (type) {
-        case "key":
-          object = keyOfRow;
-          break;
-        case "value":
-          object = object.get(keyOfRow);
-          break;
-      }
-    } else {
-      object = object[key];
-    }
-  }
-  return object;
-};
-var setDeep = function(object, path, mapper) {
-  validatePath(path);
-  if (path.length === 0) {
-    return mapper(object);
-  }
-  var parent = object;
-  for (var i2 = 0; i2 < path.length - 1; i2++) {
-    var key = path[i2];
-    if (isArray2(parent)) {
-      var index = +key;
-      parent = parent[index];
-    } else if (isPlainObject(parent)) {
-      parent = parent[key];
-    } else if (isSet(parent)) {
-      var row = +key;
-      parent = getNthKey(parent, row);
-    } else if (isMap(parent)) {
-      var isEnd = i2 === path.length - 2;
-      if (isEnd) {
-        break;
-      }
-      var row = +key;
-      var type = +path[++i2] === 0 ? "key" : "value";
-      var keyOfRow = getNthKey(parent, row);
-      switch (type) {
-        case "key":
-          parent = keyOfRow;
-          break;
-        case "value":
-          parent = parent.get(keyOfRow);
-          break;
-      }
-    }
-  }
-  var lastKey = path[path.length - 1];
-  if (isArray2(parent)) {
-    parent[+lastKey] = mapper(parent[+lastKey]);
-  } else if (isPlainObject(parent)) {
-    parent[lastKey] = mapper(parent[lastKey]);
-  }
-  if (isSet(parent)) {
-    var oldValue = getNthKey(parent, +lastKey);
-    var newValue = mapper(oldValue);
-    if (oldValue !== newValue) {
-      parent["delete"](oldValue);
-      parent.add(newValue);
-    }
-  }
-  if (isMap(parent)) {
-    var row = +path[path.length - 2];
-    var keyToRow = getNthKey(parent, row);
-    var type = +lastKey === 0 ? "key" : "value";
-    switch (type) {
-      case "key": {
-        var newKey = mapper(keyToRow);
-        parent.set(newKey, parent.get(keyToRow));
-        if (newKey !== keyToRow) {
-          parent["delete"](keyToRow);
-        }
-        break;
-      }
-      case "value": {
-        parent.set(keyToRow, mapper(parent.get(keyToRow)));
-        break;
-      }
-    }
-  }
-  return object;
-};
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/plainer.js
-var __read3 = function(o2, n2) {
-  var m = typeof Symbol === "function" && o2[Symbol.iterator];
-  if (!m)
-    return o2;
-  var i2 = m.call(o2), r2, ar = [], e2;
-  try {
-    while ((n2 === void 0 || n2-- > 0) && !(r2 = i2.next()).done)
-      ar.push(r2.value);
-  } catch (error) {
-    e2 = { error };
-  } finally {
-    try {
-      if (r2 && !r2.done && (m = i2["return"]))
-        m.call(i2);
-    } finally {
-      if (e2)
-        throw e2.error;
-    }
-  }
-  return ar;
-};
-var __spreadArray2 = function(to, from) {
-  for (var i2 = 0, il = from.length, j = to.length; i2 < il; i2++, j++)
-    to[j] = from[i2];
-  return to;
-};
-function traverse(tree, walker2, origin) {
-  if (origin === void 0) {
-    origin = [];
-  }
-  if (!tree) {
-    return;
-  }
-  if (!isArray2(tree)) {
-    forEach(tree, function(subtree, key) {
-      return traverse(subtree, walker2, __spreadArray2(__spreadArray2([], __read3(origin)), __read3(parsePath(key))));
-    });
-    return;
-  }
-  var _a = __read3(tree, 2), nodeValue = _a[0], children2 = _a[1];
-  if (children2) {
-    forEach(children2, function(child, key) {
-      traverse(child, walker2, __spreadArray2(__spreadArray2([], __read3(origin)), __read3(parsePath(key))));
-    });
-  }
-  walker2(nodeValue, origin);
-}
-function applyValueAnnotations(plain, annotations, superJson) {
-  traverse(annotations, function(type, path) {
-    plain = setDeep(plain, path, function(v) {
-      return untransformValue(v, type, superJson);
-    });
-  });
-  return plain;
-}
-function applyReferentialEqualityAnnotations(plain, annotations) {
-  function apply(identicalPaths, path) {
-    var object = getDeep(plain, parsePath(path));
-    identicalPaths.map(parsePath).forEach(function(identicalObjectPath) {
-      plain = setDeep(plain, identicalObjectPath, function() {
-        return object;
-      });
-    });
-  }
-  if (isArray2(annotations)) {
-    var _a = __read3(annotations, 2), root = _a[0], other = _a[1];
-    root.forEach(function(identicalPath) {
-      plain = setDeep(plain, parsePath(identicalPath), function() {
-        return plain;
-      });
-    });
-    if (other) {
-      forEach(other, apply);
-    }
-  } else {
-    forEach(annotations, apply);
-  }
-  return plain;
-}
-var isDeep = function(object, superJson) {
-  return isPlainObject(object) || isArray2(object) || isMap(object) || isSet(object) || isInstanceOfRegisteredClass(object, superJson);
-};
-function addIdentity(object, path, identities) {
-  var existingSet = identities.get(object);
-  if (existingSet) {
-    existingSet.push(path);
-  } else {
-    identities.set(object, [path]);
-  }
-}
-function generateReferentialEqualityAnnotations(identitites) {
-  var result = {};
-  var rootEqualityPaths = void 0;
-  identitites.forEach(function(paths) {
-    if (paths.length <= 1) {
-      return;
-    }
-    var _a = __read3(paths.map(function(path) {
-      return path.map(String);
-    }).sort(function(a2, b2) {
-      return a2.length - b2.length;
-    })), shortestPath = _a[0], identicalPaths = _a.slice(1);
-    if (shortestPath.length === 0) {
-      rootEqualityPaths = identicalPaths.map(stringifyPath);
-    } else {
-      result[stringifyPath(shortestPath)] = identicalPaths.map(stringifyPath);
-    }
-  });
-  if (rootEqualityPaths) {
-    if (isEmptyObject(result)) {
-      return [rootEqualityPaths];
-    } else {
-      return [rootEqualityPaths, result];
-    }
-  } else {
-    return isEmptyObject(result) ? void 0 : result;
-  }
-}
-var walker = function(object, identities, superJson, path, objectsInThisPath) {
-  var _a;
-  if (path === void 0) {
-    path = [];
-  }
-  if (objectsInThisPath === void 0) {
-    objectsInThisPath = [];
-  }
-  if (!isPrimitive(object)) {
-    addIdentity(object, path, identities);
-  }
-  if (!isDeep(object, superJson)) {
-    var transformed_1 = transformValue(object, superJson);
-    if (transformed_1) {
-      return {
-        transformedValue: transformed_1.value,
-        annotations: [transformed_1.type]
-      };
-    } else {
-      return {
-        transformedValue: object
-      };
-    }
-  }
-  if (includes(objectsInThisPath, object)) {
-    return {
-      transformedValue: null
-    };
-  }
-  var transformationResult = transformValue(object, superJson);
-  var transformed = (_a = transformationResult === null || transformationResult === void 0 ? void 0 : transformationResult.value) !== null && _a !== void 0 ? _a : object;
-  if (!isPrimitive(object)) {
-    objectsInThisPath = __spreadArray2(__spreadArray2([], __read3(objectsInThisPath)), [object]);
-  }
-  var transformedValue = isArray2(transformed) ? [] : {};
-  var innerAnnotations = {};
-  forEach(transformed, function(value, index) {
-    var recursiveResult = walker(value, identities, superJson, __spreadArray2(__spreadArray2([], __read3(path)), [index]), objectsInThisPath);
-    transformedValue[index] = recursiveResult.transformedValue;
-    if (isArray2(recursiveResult.annotations)) {
-      innerAnnotations[index] = recursiveResult.annotations;
-    } else if (isPlainObject(recursiveResult.annotations)) {
-      forEach(recursiveResult.annotations, function(tree, key) {
-        innerAnnotations[escapeKey(index) + "." + key] = tree;
-      });
-    }
-  });
-  if (isEmptyObject(innerAnnotations)) {
-    return {
-      transformedValue,
-      annotations: !!transformationResult ? [transformationResult.type] : void 0
-    };
-  } else {
-    return {
-      transformedValue,
-      annotations: !!transformationResult ? [transformationResult.type, innerAnnotations] : innerAnnotations
-    };
-  }
-};
-
-// ../../node_modules/.pnpm/is-what@4.1.15/node_modules/is-what/dist/index.js
-function getType2(payload) {
-  return Object.prototype.toString.call(payload).slice(8, -1);
-}
-function isPlainObject2(payload) {
-  if (getType2(payload) !== "Object")
-    return false;
-  const prototype = Object.getPrototypeOf(payload);
-  return !!prototype && prototype.constructor === Object && prototype === Object.prototype;
-}
-function isArray3(payload) {
-  return getType2(payload) === "Array";
-}
-
-// ../../node_modules/.pnpm/copy-anything@3.0.5/node_modules/copy-anything/dist/index.js
-function assignProp(carry, key, newVal, originalObject, includeNonenumerable) {
-  const propType = {}.propertyIsEnumerable.call(originalObject, key) ? "enumerable" : "nonenumerable";
-  if (propType === "enumerable")
-    carry[key] = newVal;
-  if (includeNonenumerable && propType === "nonenumerable") {
-    Object.defineProperty(carry, key, {
-      value: newVal,
-      enumerable: false,
-      writable: true,
-      configurable: true
-    });
-  }
-}
-function copy(target, options = {}) {
-  if (isArray3(target)) {
-    return target.map((item) => copy(item, options));
-  }
-  if (!isPlainObject2(target)) {
-    return target;
-  }
-  const props = Object.getOwnPropertyNames(target);
-  const symbols = Object.getOwnPropertySymbols(target);
-  return [...props, ...symbols].reduce((carry, key) => {
-    if (isArray3(options.props) && !options.props.includes(key)) {
-      return carry;
-    }
-    const val = target[key];
-    const newVal = copy(val, options);
-    assignProp(carry, key, newVal, target, options.nonenumerable);
-    return carry;
-  }, {});
-}
-
-// ../../node_modules/.pnpm/superjson@1.12.4/node_modules/superjson/dist/esm/index.js
-var __assign2 = function() {
-  __assign2 = Object.assign || function(t2) {
-    for (var s2, i2 = 1, n2 = arguments.length; i2 < n2; i2++) {
-      s2 = arguments[i2];
-      for (var p2 in s2)
-        if (Object.prototype.hasOwnProperty.call(s2, p2))
-          t2[p2] = s2[p2];
-    }
-    return t2;
-  };
-  return __assign2.apply(this, arguments);
-};
-var __read4 = function(o2, n2) {
-  var m = typeof Symbol === "function" && o2[Symbol.iterator];
-  if (!m)
-    return o2;
-  var i2 = m.call(o2), r2, ar = [], e2;
-  try {
-    while ((n2 === void 0 || n2-- > 0) && !(r2 = i2.next()).done)
-      ar.push(r2.value);
-  } catch (error) {
-    e2 = { error };
-  } finally {
-    try {
-      if (r2 && !r2.done && (m = i2["return"]))
-        m.call(i2);
-    } finally {
-      if (e2)
-        throw e2.error;
-    }
-  }
-  return ar;
-};
-var __spreadArray3 = function(to, from) {
-  for (var i2 = 0, il = from.length, j = to.length; i2 < il; i2++, j++)
-    to[j] = from[i2];
-  return to;
-};
-var SuperJSON = (
-  /** @class */
-  function() {
-    function SuperJSON2() {
-      this.classRegistry = new ClassRegistry();
-      this.symbolRegistry = new Registry(function(s2) {
-        var _a;
-        return (_a = s2.description) !== null && _a !== void 0 ? _a : "";
-      });
-      this.customTransformerRegistry = new CustomTransformerRegistry();
-      this.allowedErrorProps = [];
-    }
-    SuperJSON2.prototype.serialize = function(object) {
-      var identities = /* @__PURE__ */ new Map();
-      var output = walker(object, identities, this);
-      var res = {
-        json: output.transformedValue
-      };
-      if (output.annotations) {
-        res.meta = __assign2(__assign2({}, res.meta), { values: output.annotations });
-      }
-      var equalityAnnotations = generateReferentialEqualityAnnotations(identities);
-      if (equalityAnnotations) {
-        res.meta = __assign2(__assign2({}, res.meta), { referentialEqualities: equalityAnnotations });
-      }
-      return res;
-    };
-    SuperJSON2.prototype.deserialize = function(payload) {
-      var json = payload.json, meta = payload.meta;
-      var result = copy(json);
-      if (meta === null || meta === void 0 ? void 0 : meta.values) {
-        result = applyValueAnnotations(result, meta.values, this);
-      }
-      if (meta === null || meta === void 0 ? void 0 : meta.referentialEqualities) {
-        result = applyReferentialEqualityAnnotations(result, meta.referentialEqualities);
-      }
-      return result;
-    };
-    SuperJSON2.prototype.stringify = function(object) {
-      return JSON.stringify(this.serialize(object));
-    };
-    SuperJSON2.prototype.parse = function(string) {
-      return this.deserialize(JSON.parse(string));
-    };
-    SuperJSON2.prototype.registerClass = function(v, options) {
-      this.classRegistry.register(v, options);
-    };
-    SuperJSON2.prototype.registerSymbol = function(v, identifier) {
-      this.symbolRegistry.register(v, identifier);
-    };
-    SuperJSON2.prototype.registerCustom = function(transformer, name) {
-      this.customTransformerRegistry.register(__assign2({ name }, transformer));
-    };
-    SuperJSON2.prototype.allowErrorProps = function() {
-      var _a;
-      var props = [];
-      for (var _i = 0; _i < arguments.length; _i++) {
-        props[_i] = arguments[_i];
-      }
-      (_a = this.allowedErrorProps).push.apply(_a, __spreadArray3([], __read4(props)));
-    };
-    SuperJSON2.defaultInstance = new SuperJSON2();
-    SuperJSON2.serialize = SuperJSON2.defaultInstance.serialize.bind(SuperJSON2.defaultInstance);
-    SuperJSON2.deserialize = SuperJSON2.defaultInstance.deserialize.bind(SuperJSON2.defaultInstance);
-    SuperJSON2.stringify = SuperJSON2.defaultInstance.stringify.bind(SuperJSON2.defaultInstance);
-    SuperJSON2.parse = SuperJSON2.defaultInstance.parse.bind(SuperJSON2.defaultInstance);
-    SuperJSON2.registerClass = SuperJSON2.defaultInstance.registerClass.bind(SuperJSON2.defaultInstance);
-    SuperJSON2.registerSymbol = SuperJSON2.defaultInstance.registerSymbol.bind(SuperJSON2.defaultInstance);
-    SuperJSON2.registerCustom = SuperJSON2.defaultInstance.registerCustom.bind(SuperJSON2.defaultInstance);
-    SuperJSON2.allowErrorProps = SuperJSON2.defaultInstance.allowErrorProps.bind(SuperJSON2.defaultInstance);
-    return SuperJSON2;
-  }()
-);
-var serialize = SuperJSON.serialize;
-SuperJSON.deserialize;
-var stringify = SuperJSON.stringify;
-SuperJSON.parse;
-SuperJSON.registerClass;
-SuperJSON.registerCustom;
-SuperJSON.registerSymbol;
-SuperJSON.allowErrorProps;
-
-// src/utils.tsx
-function getQueryStatusLabel(query) {
-  return query.state.fetchStatus === "fetching" ? "fetching" : !query.getObserversCount() ? "inactive" : query.state.fetchStatus === "paused" ? "paused" : query.isStale() ? "stale" : "fresh";
-}
-function getSidedProp(prop, side) {
-  return `${prop}${side.charAt(0).toUpperCase() + side.slice(1)}`;
-}
-function getQueryStatusColor({
-  queryState,
-  observerCount,
-  isStale
-}) {
-  return queryState.fetchStatus === "fetching" ? "blue" : !observerCount ? "gray" : queryState.fetchStatus === "paused" ? "purple" : isStale ? "yellow" : "green";
-}
-function getMutationStatusColor({
-  status,
-  isPaused
-}) {
-  return isPaused ? "purple" : status === "error" ? "red" : status === "pending" ? "yellow" : status === "success" ? "green" : "gray";
-}
-function getQueryStatusColorByLabel(label) {
-  return label === "fresh" ? "green" : label === "stale" ? "yellow" : label === "paused" ? "purple" : label === "inactive" ? "gray" : "blue";
-}
-var displayValue = (value, beautify = false) => {
-  const {
-    json
-  } = serialize(value);
-  return JSON.stringify(json, null, beautify ? 2 : void 0);
-};
-var getStatusRank = (q) => q.state.fetchStatus !== "idle" ? 0 : !q.getObserversCount() ? 3 : q.isStale() ? 2 : 1;
-var queryHashSort = (a2, b2) => a2.queryHash.localeCompare(b2.queryHash);
-var dateSort = (a2, b2) => a2.state.dataUpdatedAt < b2.state.dataUpdatedAt ? 1 : -1;
-var statusAndDateSort = (a2, b2) => {
-  if (getStatusRank(a2) === getStatusRank(b2)) {
-    return dateSort(a2, b2);
-  }
-  return getStatusRank(a2) > getStatusRank(b2) ? 1 : -1;
-};
-var sortFns = {
-  status: statusAndDateSort,
-  "query hash": queryHashSort,
-  "last updated": dateSort
-};
-var getMutationStatusRank = (m) => m.state.isPaused ? 0 : m.state.status === "error" ? 2 : m.state.status === "pending" ? 1 : 3;
-var mutationDateSort = (a2, b2) => a2.state.submittedAt < b2.state.submittedAt ? 1 : -1;
-var mutationStatusSort = (a2, b2) => {
-  if (getMutationStatusRank(a2) === getMutationStatusRank(b2)) {
-    return mutationDateSort(a2, b2);
-  }
-  return getMutationStatusRank(a2) > getMutationStatusRank(b2) ? 1 : -1;
-};
-var mutationSortFns = {
-  status: mutationStatusSort,
-  "last updated": mutationDateSort
-};
-var convertRemToPixels = (rem) => {
-  return rem * parseFloat(getComputedStyle(document.documentElement).fontSize);
-};
-var getPreferredColorScheme = () => {
-  const [colorScheme, setColorScheme] = createSignal("dark");
-  onMount(() => {
-    const query = window.matchMedia("(prefers-color-scheme: dark)");
-    setColorScheme(query.matches ? "dark" : "light");
-    const listener = (e2) => {
-      setColorScheme(e2.matches ? "dark" : "light");
-    };
-    query.addEventListener("change", listener);
-    onCleanup(() => query.removeEventListener("change", listener));
-  });
-  return colorScheme;
-};
-var updateNestedDataByPath = (oldData, updatePath2, value) => {
-  if (updatePath2.length === 0) {
-    return value;
-  }
-  if (oldData instanceof Map) {
-    const newData = new Map(oldData);
-    if (updatePath2.length === 1) {
-      newData.set(updatePath2[0], value);
-      return newData;
-    }
-    const [head, ...tail] = updatePath2;
-    newData.set(head, updateNestedDataByPath(newData.get(head), tail, value));
-    return newData;
-  }
-  if (oldData instanceof Set) {
-    const setAsArray = updateNestedDataByPath(Array.from(oldData), updatePath2, value);
-    return new Set(setAsArray);
-  }
-  if (Array.isArray(oldData)) {
-    const newData = [...oldData];
-    if (updatePath2.length === 1) {
-      newData[updatePath2[0]] = value;
-      return newData;
-    }
-    const [head, ...tail] = updatePath2;
-    newData[head] = updateNestedDataByPath(newData[head], tail, value);
-    return newData;
-  }
-  if (oldData instanceof Object) {
-    const newData = {
-      ...oldData
-    };
-    if (updatePath2.length === 1) {
-      newData[updatePath2[0]] = value;
-      return newData;
-    }
-    const [head, ...tail] = updatePath2;
-    newData[head] = updateNestedDataByPath(newData[head], tail, value);
-    return newData;
-  }
-  return oldData;
-};
-var deleteNestedDataByPath = (oldData, deletePath) => {
-  if (oldData instanceof Map) {
-    const newData = new Map(oldData);
-    if (deletePath.length === 1) {
-      newData.delete(deletePath[0]);
-      return newData;
-    }
-    const [head, ...tail] = deletePath;
-    newData.set(head, deleteNestedDataByPath(newData.get(head), tail));
-    return newData;
-  }
-  if (oldData instanceof Set) {
-    const setAsArray = deleteNestedDataByPath(Array.from(oldData), deletePath);
-    return new Set(setAsArray);
-  }
-  if (Array.isArray(oldData)) {
-    const newData = [...oldData];
-    if (deletePath.length === 1) {
-      return newData.filter((_, idx) => idx.toString() !== deletePath[0]);
-    }
-    const [head, ...tail] = deletePath;
-    newData[head] = deleteNestedDataByPath(newData[head], tail);
-    return newData;
-  }
-  if (oldData instanceof Object) {
-    const newData = {
-      ...oldData
-    };
-    if (deletePath.length === 1) {
-      delete newData[deletePath[0]];
-      return newData;
-    }
-    const [head, ...tail] = deletePath;
-    newData[head] = deleteNestedDataByPath(newData[head], tail);
-    return newData;
-  }
-  return oldData;
-};
-
 // src/icons/index.tsx
 var _tmpl$ = /* @__PURE__ */ template(`<svg width=14 height=14 viewBox="0 0 14 14"fill=none xmlns=http://www.w3.org/2000/svg><path d="M13 13L9.00007 9M10.3333 5.66667C10.3333 8.244 8.244 10.3333 5.66667 10.3333C3.08934 10.3333 1 8.244 1 5.66667C1 3.08934 3.08934 1 5.66667 1C8.244 1 10.3333 3.08934 10.3333 5.66667Z"stroke=currentColor stroke-width=1.66667 stroke-linecap=round stroke-linejoin=round>`);
 var _tmpl$2 = /* @__PURE__ */ template(`<svg width=24 height=24 viewBox="0 0 24 24"fill=none xmlns=http://www.w3.org/2000/svg><path d="M9 3H15M3 6H21M19 6L18.2987 16.5193C18.1935 18.0975 18.1409 18.8867 17.8 19.485C17.4999 20.0118 17.0472 20.4353 16.5017 20.6997C15.882 21 15.0911 21 13.5093 21H10.4907C8.90891 21 8.11803 21 7.49834 20.6997C6.95276 20.4353 6.50009 20.0118 6.19998 19.485C5.85911 18.8867 5.8065 18.0975 5.70129 16.5193L5 6M10 10.5V15.5M14 10.5V15.5"stroke=currentColor stroke-width=2 stroke-linecap=round stroke-linejoin=round>`);
@@ -10579,8 +9395,8 @@ var stylesFactory = (theme) => {
     expanderButtonContainer: u`
       display: flex;
       align-items: center;
-      line-height: 1.125rem;
-      min-height: 1.125rem;
+      line-height: ${size2[4]};
+      min-height: ${size2[4]};
       gap: ${size2[2]};
     `,
     expanderButton: u`
@@ -10588,7 +9404,7 @@ var stylesFactory = (theme) => {
       color: inherit;
       font: inherit;
       outline: inherit;
-      height: 1rem;
+      height: ${size2[5]};
       background: transparent;
       border: none;
       padding: 0;
@@ -10630,8 +9446,8 @@ var stylesFactory = (theme) => {
       display: inline-flex;
       gap: ${size2[2]};
       width: 100%;
-      margin-bottom: ${size2[0.5]};
-      line-height: 1.125rem;
+      margin: ${size2[0.25]} 0px;
+      line-height: ${size2[4.5]};
       align-items: center;
     `,
     editableInput: u`
@@ -10771,16 +9587,31 @@ var Devtools = (props) => {
   const position = createMemo(() => {
     return props.localStore.position || useQueryDevtoolsContext().position || POSITION;
   });
+  let transitionsContainerRef;
   createEffect(() => {
-    const root = document.querySelector(".tsqd-parent-container");
+    const root = transitionsContainerRef.parentElement;
     const height = props.localStore.height || DEFAULT_HEIGHT;
     const width = props.localStore.width || DEFAULT_WIDTH;
     const panelPosition = position();
     root.style.setProperty("--tsqd-panel-height", `${panelPosition === "top" ? "-" : ""}${height}px`);
     root.style.setProperty("--tsqd-panel-width", `${panelPosition === "left" ? "-" : ""}${width}px`);
   });
+  onMount(() => {
+    const onFocus = () => {
+      const root = transitionsContainerRef.parentElement;
+      const fontSize = getComputedStyle(root).fontSize;
+      root.style.setProperty("--tsqd-font-size", fontSize);
+    };
+    onFocus();
+    window.addEventListener("focus", onFocus);
+    onCleanup(() => {
+      window.removeEventListener("focus", onFocus);
+    });
+  });
   return (() => {
     const _el$ = _tmpl$25();
+    const _ref$ = transitionsContainerRef;
+    typeof _ref$ === "function" ? use(_ref$, _el$) : transitionsContainerRef = _el$;
     insert(_el$, createComponent(TransitionGroup, {
       name: "tsqd-panel-transition",
       get children() {
@@ -10952,8 +9783,8 @@ var DevtoolsPanel = (props) => {
   };
   return (() => {
     const _el$5 = _tmpl$33(), _el$6 = _el$5.firstChild, _el$7 = _el$6.nextSibling;
-    const _ref$ = panelRef;
-    typeof _ref$ === "function" ? use(_ref$, _el$5) : panelRef = _el$5;
+    const _ref$2 = panelRef;
+    typeof _ref$2 === "function" ? use(_ref$2, _el$5) : panelRef = _el$5;
     _el$6.$$mousedown = handleDragStart;
     _el$7.$$click = () => props.setLocalStore("open", "false");
     insert(_el$7, createComponent(ChevronDown, {}));
@@ -10990,6 +9821,7 @@ var DevtoolsPanel = (props) => {
 var ContentView = (props) => {
   setupQueryCacheSubscription();
   setupMutationCacheSubscription();
+  let containerRef;
   const theme = useTheme();
   const styles = createMemo(() => {
     return theme() === "dark" ? darkStyles2 : lightStyles2;
@@ -11033,8 +9865,15 @@ var ContentView = (props) => {
   const setDevtoolsPosition = (pos) => {
     props.setLocalStore("position", pos);
   };
+  const setComputedVariables = (el) => {
+    const computedStyle = getComputedStyle(containerRef);
+    const variable = computedStyle.getPropertyValue("--tsqd-font-size");
+    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 _ref$3 = containerRef;
+    typeof _ref$3 === "function" ? use(_ref$3, _el$8) : containerRef = _el$8;
     _el$11.$$click = () => props.setLocalStore("open", "false");
     insert(_el$13, () => useQueryDevtoolsContext().queryFlavor, _el$14);
     insert(_el$13, () => useQueryDevtoolsContext().version, null);
@@ -11198,6 +10037,7 @@ var ContentView = (props) => {
             return createComponent(Settings, {});
           }
         }), createComponent(index$d.Portal, {
+          ref: (el) => setComputedVariables(el),
           get children() {
             return createComponent(index$d.Content, {
               get ["class"]() {
@@ -11221,6 +10061,7 @@ var ContentView = (props) => {
                         return [_tmpl$83(), createComponent(ChevronDown, {})];
                       }
                     }), createComponent(index$d.Portal, {
+                      ref: (el) => setComputedVariables(el),
                       get children() {
                         return createComponent(index$d.SubContent, {
                           get ["class"]() {
@@ -11290,6 +10131,7 @@ var ContentView = (props) => {
                         return [_tmpl$132(), createComponent(ChevronDown, {})];
                       }
                     }), createComponent(index$d.Portal, {
+                      ref: (el) => setComputedVariables(el),
                       get children() {
                         return createComponent(index$d.SubContent, {
                           get ["class"]() {
@@ -11761,8 +10603,8 @@ var QueryStatus = (props) => {
   });
   return (() => {
     const _el$55 = _tmpl$252(), _el$57 = _el$55.firstChild, _el$59 = _el$57.nextSibling;
-    const _ref$2 = tagRef;
-    typeof _ref$2 === "function" ? use(_ref$2, _el$55) : tagRef = _el$55;
+    const _ref$4 = tagRef;
+    typeof _ref$4 === "function" ? use(_ref$4, _el$55) : tagRef = _el$55;
     _el$55.addEventListener("mouseleave", () => {
       setMouseOver(false);
       setFocused(false);
@@ -12023,7 +10865,6 @@ var QueryDetails = () => {
           return _el$89;
         }
       }), null);
-      _el$95.style.setProperty("padding", "0.5rem");
       insert(_el$95, createComponent(Explorer, {
         label: "Data",
         defaultExpanded: ["Data"],
@@ -12035,7 +10876,6 @@ var QueryDetails = () => {
           return activeQuery();
         }
       }));
-      _el$97.style.setProperty("padding", "0.5rem");
       insert(_el$97, createComponent(Explorer, {
         label: "Query",
         defaultExpanded: ["Query", "queryKey"],
@@ -12064,7 +10904,7 @@ var QueryDetails = () => {
                 color: ${t2(colors.cyan[500], colors.cyan[400])};
               `, "tsqd-query-details-actions-btn", "tsqd-query-details-action-loading"), _v$58 = restoringLoading(), _v$59 = u`
                 background-color: ${t2(colors.cyan[500], colors.cyan[400])};
-              `, _v$60 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$61 = clsx(styles().detailsHeader, "tsqd-query-details-header");
+              `, _v$60 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$61 = tokens.size[2], _v$62 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$63 = tokens.size[2];
         _v$39 !== _p$._v$39 && className(_el$60, _p$._v$39 = _v$39);
         _v$40 !== _p$._v$40 && className(_el$61, _p$._v$40 = _v$40);
         _v$41 !== _p$._v$41 && className(_el$62, _p$._v$41 = _v$41);
@@ -12087,7 +10927,9 @@ var QueryDetails = () => {
         _v$58 !== _p$._v$58 && (_el$83.disabled = _p$._v$58 = _v$58);
         _v$59 !== _p$._v$59 && className(_el$84, _p$._v$59 = _v$59);
         _v$60 !== _p$._v$60 && className(_el$94, _p$._v$60 = _v$60);
-        _v$61 !== _p$._v$61 && className(_el$96, _p$._v$61 = _v$61);
+        _v$61 !== _p$._v$61 && ((_p$._v$61 = _v$61) != null ? _el$95.style.setProperty("padding", _v$61) : _el$95.style.removeProperty("padding"));
+        _v$62 !== _p$._v$62 && className(_el$96, _p$._v$62 = _v$62);
+        _v$63 !== _p$._v$63 && ((_p$._v$63 = _v$63) != null ? _el$97.style.setProperty("padding", _v$63) : _el$97.style.removeProperty("padding"));
         return _p$;
       }, {
         _v$39: void 0,
@@ -12112,7 +10954,9 @@ var QueryDetails = () => {
         _v$58: void 0,
         _v$59: void 0,
         _v$60: void 0,
-        _v$61: void 0
+        _v$61: void 0,
+        _v$62: void 0,
+        _v$63: void 0
       });
       return _el$60;
     }
@@ -12190,7 +11034,6 @@ var MutationDetails = () => {
         }
       }), null);
       insert(_el$108, () => new Date(activeMutation().state.submittedAt).toLocaleTimeString());
-      _el$110.style.setProperty("padding", "0.5rem");
       insert(_el$110, createComponent(Explorer, {
         label: "Variables",
         defaultExpanded: ["Variables"],
@@ -12198,7 +11041,6 @@ var MutationDetails = () => {
           return activeMutation().state.variables;
         }
       }));
-      _el$112.style.setProperty("padding", "0.5rem");
       insert(_el$112, createComponent(Explorer, {
         label: "Context",
         defaultExpanded: ["Context"],
@@ -12206,7 +11048,6 @@ var MutationDetails = () => {
           return activeMutation().state.context;
         }
       }));
-      _el$114.style.setProperty("padding", "0.5rem");
       insert(_el$114, createComponent(Explorer, {
         label: "Data",
         defaultExpanded: ["Data"],
@@ -12214,7 +11055,6 @@ var MutationDetails = () => {
           return activeMutation().state.data;
         }
       }));
-      _el$116.style.setProperty("padding", "0.5rem");
       insert(_el$116, createComponent(Explorer, {
         label: "Mutation",
         defaultExpanded: ["Mutation"],
@@ -12223,25 +11063,33 @@ var MutationDetails = () => {
         }
       }));
       createRenderEffect((_p$) => {
-        const _v$62 = clsx(styles().detailsContainer, "tsqd-query-details-container"), _v$63 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$64 = clsx(styles().detailsBody, "tsqd-query-details-summary-container"), _v$65 = clsx(styles().queryDetailsStatus, getQueryStatusColors()), _v$66 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$67 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$68 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$69 = clsx(styles().detailsHeader, "tsqd-query-details-header");
-        _v$62 !== _p$._v$62 && className(_el$99, _p$._v$62 = _v$62);
-        _v$63 !== _p$._v$63 && className(_el$100, _p$._v$63 = _v$63);
-        _v$64 !== _p$._v$64 && className(_el$101, _p$._v$64 = _v$64);
-        _v$65 !== _p$._v$65 && className(_el$105, _p$._v$65 = _v$65);
-        _v$66 !== _p$._v$66 && className(_el$109, _p$._v$66 = _v$66);
-        _v$67 !== _p$._v$67 && className(_el$111, _p$._v$67 = _v$67);
-        _v$68 !== _p$._v$68 && className(_el$113, _p$._v$68 = _v$68);
-        _v$69 !== _p$._v$69 && className(_el$115, _p$._v$69 = _v$69);
+        const _v$64 = clsx(styles().detailsContainer, "tsqd-query-details-container"), _v$65 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$66 = clsx(styles().detailsBody, "tsqd-query-details-summary-container"), _v$67 = clsx(styles().queryDetailsStatus, getQueryStatusColors()), _v$68 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$69 = tokens.size[2], _v$70 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$71 = tokens.size[2], _v$72 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$73 = tokens.size[2], _v$74 = clsx(styles().detailsHeader, "tsqd-query-details-header"), _v$75 = tokens.size[2];
+        _v$64 !== _p$._v$64 && className(_el$99, _p$._v$64 = _v$64);
+        _v$65 !== _p$._v$65 && className(_el$100, _p$._v$65 = _v$65);
+        _v$66 !== _p$._v$66 && className(_el$101, _p$._v$66 = _v$66);
+        _v$67 !== _p$._v$67 && className(_el$105, _p$._v$67 = _v$67);
+        _v$68 !== _p$._v$68 && className(_el$109, _p$._v$68 = _v$68);
+        _v$69 !== _p$._v$69 && ((_p$._v$69 = _v$69) != null ? _el$110.style.setProperty("padding", _v$69) : _el$110.style.removeProperty("padding"));
+        _v$70 !== _p$._v$70 && className(_el$111, _p$._v$70 = _v$70);
+        _v$71 !== _p$._v$71 && ((_p$._v$71 = _v$71) != null ? _el$112.style.setProperty("padding", _v$71) : _el$112.style.removeProperty("padding"));
+        _v$72 !== _p$._v$72 && className(_el$113, _p$._v$72 = _v$72);
+        _v$73 !== _p$._v$73 && ((_p$._v$73 = _v$73) != null ? _el$114.style.setProperty("padding", _v$73) : _el$114.style.removeProperty("padding"));
+        _v$74 !== _p$._v$74 && className(_el$115, _p$._v$74 = _v$74);
+        _v$75 !== _p$._v$75 && ((_p$._v$75 = _v$75) != null ? _el$116.style.setProperty("padding", _v$75) : _el$116.style.removeProperty("padding"));
         return _p$;
       }, {
-        _v$62: void 0,
-        _v$63: void 0,
         _v$64: void 0,
         _v$65: void 0,
         _v$66: void 0,
         _v$67: void 0,
         _v$68: void 0,
-        _v$69: void 0
+        _v$69: void 0,
+        _v$70: void 0,
+        _v$71: void 0,
+        _v$72: void 0,
+        _v$73: void 0,
+        _v$74: void 0,
+        _v$75: void 0
       });
       return _el$99;
     }
@@ -12415,7 +11263,7 @@ var stylesFactory2 = (theme) => {
       right: 0;
       left: 0;
       max-height: 90%;
-      min-height: 3.5rem;
+      min-height: ${size2[14]};
       border-bottom: ${t2(colors.gray[400], colors.darkGray[300])} 1px solid;
     `,
     "panel-position-bottom": u`
@@ -12423,7 +11271,7 @@ var stylesFactory2 = (theme) => {
       right: 0;
       left: 0;
       max-height: 90%;
-      min-height: 3.5rem;
+      min-height: ${size2[14]};
       border-top: ${t2(colors.gray[400], colors.darkGray[300])} 1px solid;
     `,
     "panel-position-right": u`
@@ -12755,6 +11603,8 @@ var stylesFactory2 = (theme) => {
           outline: 2px solid ${colors.blue[800]};
         }
         & svg {
+          width: ${tokens.size[3]};
+          height: ${tokens.size[3]};
           color: ${t2(colors.gray[500], colors.gray[400])};
         }
       }
@@ -12840,8 +11690,8 @@ var stylesFactory2 = (theme) => {
       border-radius: ${tokens.border.radius.sm};
       background-color: ${t2(colors.gray[100], colors.darkGray[400])};
       border: 1px solid ${t2(colors.gray[300], colors.darkGray[200])};
-      width: 1.625rem;
-      height: 1.625rem;
+      width: ${tokens.size[6.5]};
+      height: ${tokens.size[6.5]};
       justify-content: center;
       display: flex;
       align-items: center;