@pinia/colada-devtools 0.1.5 → 0.1.6

package/dist-panel/_queryId_-13o6pDV6.js

@@ -0,0 +1,708 @@
+import { _ as W } from "./mouse-pointer-click-BeSJo9Pm.js";
+import { isPlainObject as H, getValueTypeClass as D, formatValue as L } from "@pinia/colada-devtools/shared";
+import { m as _, c as r, o as n, a as e, d as z, x as Y, b as j, r as G, n as C, H as X, h as M, g as w, t as u, i as a, F as q, j as V, Q as K, l as Z, p as ee, R as te, C as T, P as f, S as oe, _ as se, M as ne, T as le, U as re, O, y as ie, k as d, w as p, V as E, W as ae, X as I, Y as de } from "./index-BgTq8RHl.js";
+import { _ as ue, a as ce } from "./loader-Dx4_68Bp.js";
+const pe = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function me(l, s) {
+  return n(), r("svg", pe, s[0] || (s[0] = [
+    e("path", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2",
+      d: "m9 18l6-6l-6-6"
+    }, null, -1)
+  ]));
+}
+const ve = _({ name: "lucide-chevron-right", render: me }), fe = ["title"], he = /* @__PURE__ */ z({
+  __name: "JsonItem",
+  props: {
+    itemKey: {},
+    value: { type: [String, Number, Boolean, null, Array, Object, Map, Set] },
+    depth: {}
+  },
+  setup(l) {
+    const s = l, m = Y(!1), t = j(() => {
+      const { value: i } = s;
+      return Array.isArray(i) && i.length > 0 || H(i) && Object.keys(i).length > 0 || i instanceof Map && i.size > 0 || i instanceof Set && i.size > 0;
+    }), y = j(() => {
+      const { value: i } = s;
+      return Array.isArray(i) ? i.map((h, v) => [v, h]) : H(i) ? Object.entries(i) : i instanceof Map ? i.entries() : i instanceof Set ? Array.from(i).map((h, v) => [v, h]) : [];
+    });
+    function b() {
+      t.value && (m.value = !m.value);
+    }
+    return (i, h) => {
+      const v = ve, B = G("JsonItem", !0);
+      return n(), r("div", {
+        style: X({ paddingLeft: `${i.depth * 0.35}em` }),
+        class: C(["ring-(--ui-bg-muted)", {
+          "hover:ring": t.value,
+          "rounded-tl": i.depth > 0
+        }])
+      }, [
+        e("div", {
+          class: C(["flex items-center gap-2 py-0.5 bg-transparent hover:bg-(--ui-bg-muted) duration-200 transition-colors", i.depth > 0 && "rounded-l"])
+        }, [
+          t.value ? (n(), w(v, {
+            key: 0,
+            class: C(["size-3 text-(--ui-text-dimmed) transition-transform duration-200 cursor-pointer", { "rotate-90": m.value }]),
+            onClick: b
+          }, null, 8, ["class"])) : M("", !0),
+          e("span", {
+            class: C(["text-(--devtools-syntax-gray)", !t.value && "ml-5"])
+          }, u(i.itemKey) + ": ", 3),
+          e("span", {
+            class: C([a(D)(i.value), t.value && "cursor-pointer"]),
+            title: t.value ? "Click to expand" : void 0,
+            onClick: b
+          }, u(a(L)(i.value)), 11, fe)
+        ], 2),
+        t.value && m.value ? (n(!0), r(q, { key: 0 }, V(y.value, ([S, x]) => (n(), w(B, {
+          key: S,
+          "item-key": String(S),
+          value: x,
+          depth: i.depth + 1
+        }, null, 8, ["item-key", "value", "depth"]))), 128)) : M("", !0)
+      ], 6);
+    };
+  }
+});
+function _e(l) {
+  return !!l && (Array.isArray(l) || H(l) || l instanceof Map || l instanceof Set);
+}
+const ge = /* @__PURE__ */ z({
+  __name: "JsonViewer",
+  props: {
+    data: {}
+  },
+  setup(l) {
+    return (s, m) => _e(s.data) ? (n(!0), r(q, { key: 0 }, V(Object.entries(s.data), ([t, y]) => (n(), w(he, {
+      key: t,
+      "item-key": t,
+      value: y,
+      depth: 0
+    }, null, 8, ["item-key", "value"]))), 128)) : (n(), r("span", {
+      key: 1,
+      class: C(a(D)(s.data))
+    }, u(a(L)(s.data)), 3));
+  }
+}), ye = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function ke(l, s) {
+  return n(), r("svg", ye, s[0] || (s[0] = [
+    e("path", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2",
+      d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+    }, null, -1)
+  ]));
+}
+const be = _({ name: "lucide-trash", render: ke }), we = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function xe(l, s) {
+  return n(), r("svg", we, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("path", { d: "M3 12a9 9 0 1 0 9-9a9.75 9.75 0 0 0-6.74 2.74L3 8" }),
+      e("path", { d: "M3 3v5h5" })
+    ], -1)
+  ]));
+}
+const $e = _({ name: "lucide-rotate-ccw", render: xe }), Ce = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Me(l, s) {
+  return n(), r("svg", Ce, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("path", { d: "M10 2h4m-2 12v-4m-8 3a8 8 0 0 1 8-7a8 8 0 1 1-5.3 14L4 17.6" }),
+      e("path", { d: "M9 17H4v5" })
+    ], -1)
+  ]));
+}
+const Se = _({ name: "lucide-timer-reset", render: Me }), qe = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Be(l, s) {
+  return n(), r("svg", qe, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("path", { d: "M3 12a9 9 0 0 1 9-9a9.75 9.75 0 0 1 6.74 2.74L21 8" }),
+      e("path", { d: "M21 3v5h-5m5 4a9 9 0 0 1-9 9a9.75 9.75 0 0 1-6.74-2.74L3 16" }),
+      e("path", { d: "M8 16H3v5" })
+    ], -1)
+  ]));
+}
+const je = _({ name: "lucide-refresh-cw", render: Be }), ze = { class: "collapse collapse-arrow" }, Te = { class: "collapse-title px-2 py-0.5 bg-neutral-200 dark:bg-neutral-800 theme-neutral" }, Ie = { class: "font-semibold text-sm flex gap-x-1 items-center" }, He = /* @__PURE__ */ z({
+  __name: "UCollapse.ce",
+  props: /* @__PURE__ */ K({
+    title: { type: String },
+    icon: { type: null },
+    noPadding: { type: Boolean }
+  }, {
+    open: { type: Boolean, default: !0 },
+    openModifiers: {}
+  }),
+  emits: ["update:open"],
+  setup(l) {
+    const s = Z(l, "open");
+    function m(t) {
+      if (t.target instanceof HTMLElement) {
+        const y = {
+          block: "nearest",
+          inline: "nearest",
+          behavior: "smooth"
+        };
+        t.target.scrollIntoView(y);
+      }
+    }
+    return (t, y) => (n(), r("div", ze, [
+      ee(e("input", {
+        "onUpdate:modelValue": y[0] || (y[0] = (b) => s.value = b),
+        type: "checkbox"
+      }, null, 512), [
+        [te, s.value]
+      ]),
+      e("div", Te, [
+        T(t.$slots, "title", {
+          open: s.value,
+          title: t.title
+        }, () => [
+          e("h3", Ie, [
+            T(t.$slots, "icon", {}, () => [
+              t.icon ? (n(), w(oe(t.icon), {
+                key: 0,
+                class: "size-4"
+              })) : M("", !0)
+            ], !0),
+            f(" " + u(t.title ?? "Group"), 1)
+          ])
+        ], !0)
+      ]),
+      e("div", {
+        class: C([!t.noPadding && "px-2", "collapse-content text-sm overflow-hidden"]),
+        onTransitionend: m
+      }, [
+        T(t.$slots, "default", { open: s.value }, void 0, !0)
+      ], 34)
+    ]));
+  }
+}), Ve = '.collapse[data-v-1b4f74d5]:not(td,tr,colgroup){visibility:visible}.collapse[data-v-1b4f74d5]{position:relative;display:grid;overflow:hidden;width:100%;grid-template-rows:max-content 0fr;transition:grid-template-rows .2s;isolation:isolate}.collapse>input[data-v-1b4f74d5]:is([type=checkbox],[type=radio]){grid-column-start:1;grid-row-start:1;appearance:none;opacity:0}.collapse[data-v-1b4f74d5]:is([open],:focus),.collapse[data-v-1b4f74d5]:has(>input:is([type=checkbox],[type=radio]):checked){grid-template-rows:max-content 1fr}.collapse:is([open],:focus)>.collapse-content[data-v-1b4f74d5],.collapse[data-v-1b4f74d5]:not(.collapse-close)>:where(input:is([type=checkbox],[type=radio]):checked~.collapse-content){visibility:visible;min-height:fit-content}.collapse[data-v-1b4f74d5]:focus-visible,.collapse[data-v-1b4f74d5]:has(>input:is([type=checkbox],[type=radio]):focus-visible){outline-color:var(--ui-text);outline-style:solid;outline-width:2px;outline-offset:2px}.collapse:not(.collapse-close)>input[type=checkbox][data-v-1b4f74d5],.collapse:not(.collapse-close)>input[type=radio][data-v-1b4f74d5]:not(:checked),.collapse:not(.collapse-close)>.collapse-title[data-v-1b4f74d5]{cursor:pointer}.collapse:focus:not(.collapse-close,.collapse[open])>.collapse-title[data-v-1b4f74d5]{cursor:unset}.collapse:is([open]).collapse-arrow>.collapse-title[data-v-1b4f74d5]:after{transform:translateY(-50%) rotate(225deg)}.collapse.collapse-arrow:focus>.collapse-title[data-v-1b4f74d5]:after{transform:translateY(-50%) rotate(225deg)}.collapse.collapse-arrow>input:is([type=checkbox],[type=radio]):checked~.collapse-title[data-v-1b4f74d5]:after{transform:translateY(-50%) rotate(225deg)}.collapse>input[data-v-1b4f74d5]:is([type=checkbox],[type=radio]){z-index:1;width:100%}.collapse-title[data-v-1b4f74d5],.collapse-content[data-v-1b4f74d5]{grid-column-start:1;grid-row-start:1}.collapse-content[data-v-1b4f74d5]{visibility:hidden;grid-column-start:1;grid-row-start:2;min-height:0;cursor:unset;transition:visibility .2s}.collapse-arrow>.collapse-title[data-v-1b4f74d5]:after{position:absolute;display:block;height:.5rem;width:.5rem;transform:translateY(-100%) rotate(45deg);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s;top:50%;right:.8em;inset-inline-end:.75rem;content:"";transform-origin:75% 75%;box-shadow:2px 2px;pointer-events:none}.collapse-title[data-v-1b4f74d5]{position:relative;width:100%;transition:background-color .2s ease-out}', Ae = /* @__PURE__ */ se(He, [["styles", [Ve]], ["__scopeId", "data-v-1b4f74d5"]]);
+function Oe(l) {
+  if (l < 1e3)
+    return `${Math.round(l)} ms`;
+  const s = l / 1e3;
+  if (l < 1e4)
+    return `${s.toFixed(3)} seconds`;
+  if (l < 6e4)
+    return `${Math.floor(s)} seconds`;
+  const m = Math.floor(s / 60);
+  return l < 36e5 ? `${m} minute${m > 1 ? "s" : ""}` : `${Math.floor(m / 60)}h${m % 60}m${s % 60}s`;
+}
+const Ee = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function De(l, s) {
+  return n(), r("svg", Ee, s[0] || (s[0] = [
+    e("path", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2",
+      d: "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"
+    }, null, -1)
+  ]));
+}
+const Le = _({ name: "lucide-wrench", render: De }), Re = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Ne(l, s) {
+  return n(), r("svg", Re, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("circle", {
+        cx: "12",
+        cy: "12",
+        r: "10"
+      }),
+      e("path", { d: "M12 16v-4m0-4h.01" })
+    ], -1)
+  ]));
+}
+const Ue = _({ name: "lucide-info", render: Ne }), Fe = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Je(l, s) {
+  return n(), r("svg", Fe, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+      e("path", { d: "M14 2v4a2 2 0 0 0 2 2h4M10 9H8m8 4H8m8 4H8" })
+    ], -1)
+  ]));
+}
+const Pe = _({ name: "lucide-file-text", render: Je }), Qe = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function We(l, s) {
+  return n(), r("svg", Qe, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("circle", {
+        cx: "12",
+        cy: "12",
+        r: "10"
+      }),
+      e("path", { d: "m15 9l-6 6m0-6l6 6" })
+    ], -1)
+  ]));
+}
+const Ye = _({ name: "lucide-circle-x", render: We }), Ge = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function Xe(l, s) {
+  return n(), r("svg", Ge, s[0] || (s[0] = [
+    e("path", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2",
+      d: "M8 3H7a2 2 0 0 0-2 2v5a2 2 0 0 1-2 2a2 2 0 0 1 2 2v5c0 1.1.9 2 2 2h1m8 0h1a2 2 0 0 0 2-2v-5c0-1.1.9-2 2-2a2 2 0 0 1-2-2V5a2 2 0 0 0-2-2h-1"
+    }, null, -1)
+  ]));
+}
+const Ke = _({ name: "lucide-braces", render: Xe }), Ze = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function et(l, s) {
+  return n(), r("svg", Ze, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("path", { d: "M3 12a9 9 0 1 0 9-9a9.75 9.75 0 0 0-6.74 2.74L3 8" }),
+      e("path", { d: "M3 3v5h5m4-1v5l4 2" })
+    ], -1)
+  ]));
+}
+const tt = _({ name: "lucide-history", render: et }), ot = {
+  viewBox: "0 0 24 24",
+  width: "1.2em",
+  height: "1.2em"
+};
+function st(l, s) {
+  return n(), r("svg", ot, s[0] || (s[0] = [
+    e("g", {
+      fill: "none",
+      stroke: "currentColor",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2"
+    }, [
+      e("rect", {
+        width: "18",
+        height: "18",
+        x: "3",
+        y: "3",
+        rx: "2"
+      }),
+      e("path", { d: "M16 8.9V7H8l4 5l-4 5h8v-1.9" })
+    ], -1)
+  ]));
+}
+const nt = _({ name: "lucide-sigma-square", render: st }), lt = { class: "flex flex-col divide-y dark:divide-(--ui-border) divide-(--ui-border-accented)" }, rt = { class: "py-1 text-sm" }, it = { class: "grid grid-cols-[auto_1fr] gap-1" }, at = { class: "rounded bg-neutral-500/20 p-0.5" }, dt = {
+  class: "grid grid-cols-[auto_1fr] gap-x-2",
+  title: "When was the query entry last updated"
+}, ut = { class: "font-bold" }, ct = {
+  key: 0,
+  class: "grid grid-cols-[auto_1fr] gap-x-2",
+  title: "When was the last time the query was fetched"
+}, pt = { class: "font-bold" }, mt = {
+  key: 1,
+  class: "grid grid-cols-[auto_1fr] gap-x-2",
+  title: "How long did the last query take to fetch"
+}, vt = { class: "font-bold" }, ft = {
+  class: "grid grid-cols-[auto_1fr] gap-x-2",
+  title: "How many components and effects are using this query"
+}, ht = { class: "font-bold" }, _t = {
+  key: 2,
+  class: "grid grid-cols-[auto_1fr] gap-x-2",
+  title: "When is this query entry garbace collected"
+}, gt = { class: "font-bold" }, yt = { class: "py-2 gap-2 flex flex-wrap items-center justify-items-start" }, kt = { class: "py-1" }, bt = {
+  key: 0,
+  class: "rounded p-1 overflow-auto max-h-[1200px]"
+}, wt = {
+  key: 1,
+  class: "text-neutral-500/50"
+}, xt = { class: "py-1" }, $t = { class: "grid grid-cols-[auto_1fr] gap-1" }, Ct = { class: "font-bold" }, Mt = { class: "font-bold" }, St = { class: "font-bold" }, qt = { class: "font-bold" }, Bt = { class: "py-1" }, jt = { class: "rounded p-1 overflow-auto max-h-[1200px]" }, zt = { class: "py-1" }, Tt = {
+  key: 0,
+  class: "rounded bg-neutral-500/20 p-1 overflow-auto max-h-[1200px]"
+}, It = { key: 1 }, Ht = {
+  key: 1,
+  class: "py-6 mx-auto"
+}, Vt = { class: "flex flex-col text-center items-center gap-2 text-lg px-2" }, Lt = /* @__PURE__ */ z({
+  __name: "[queryId]",
+  setup(l) {
+    const s = ae(), m = ne(), t = j(() => m.value.find((g) => g.keyHash === s.params.queryId) ?? null), y = j(() => t.value?.devtools.history.map((g) => {
+      let o;
+      try {
+        o = JSON.stringify(g, null, 2);
+      } catch (k) {
+        o = `Error serializing entry: ${String(k)}`;
+      }
+      return {
+        ...g,
+        data: o
+      };
+    }) ?? []), b = {
+      showSecond: !0,
+      rounding: "floor",
+      max: 1e3 * 60 * 5
+      // 5 minutes
+    }, i = le(() => t.value?.devtools.updatedAt ?? 0, {
+      ...b,
+      updateInterval: 3e3
+    }), h = re(), v = O("pc:query:details:data:open", !1, {});
+    let B = v.value, S = null;
+    const x = O("pc:query:details:error:open", !1, {});
+    return ie(
+      () => t.value?.state,
+      (g) => {
+        !g || S === g.status || (S = g.status, g.status === "error" ? (x.value = !0, B = v.value, v.value = !1) : g.status === "success" && (v.value = B, x.value = !1));
+      }
+    ), (g, o) => {
+      const k = Ae, R = je, $ = de, N = Se, A = ue, U = ce, F = $e, J = be, P = ge, Q = W;
+      return n(), r("div", lt, [
+        t.value ? (n(), r(q, { key: 0 }, [
+          d(k, {
+            title: "Details",
+            icon: a(Ue)
+          }, {
+            default: p(() => [
+              e("div", rt, [
+                e("p", it, [
+                  o[9] || (o[9] = e("span", null, "key:", -1)),
+                  e("span", null, [
+                    e("code", at, u(t.value.key), 1)
+                  ])
+                ]),
+                e("p", dt, [
+                  o[10] || (o[10] = e("span", null, "Last update:", -1)),
+                  e("span", ut, u(a(i)), 1)
+                ]),
+                t.value.devtools.history.at(0)?.fetchTime ? (n(), r("p", ct, [
+                  o[11] || (o[11] = e("span", null, "Last fetch:", -1)),
+                  e("span", pt, u(a(I)(new Date(t.value.devtools.history.at(0).fetchTime.start), {
+                    ...b,
+                    max: void 0
+                  })), 1)
+                ])) : M("", !0),
+                t.value.devtools.history.at(0)?.fetchTime?.end ? (n(), r("p", mt, [
+                  o[12] || (o[12] = e("span", null, "Fetch duration:", -1)),
+                  e("span", vt, u(a(Oe)(
+                    t.value.devtools.history.at(0).fetchTime.end - t.value.devtools.history.at(0).fetchTime.start
+                  )), 1)
+                ])) : M("", !0),
+                e("p", ft, [
+                  e("span", null, [
+                    o[13] || (o[13] = f("Observers: ")),
+                    e("span", ht, u(t.value.deps.length), 1)
+                  ])
+                ]),
+                !t.value.active && t.value.options ? (n(), r("p", _t, [
+                  typeof t.value.options.gcTime == "number" && Number.isFinite(t.value.options.gcTime) ? (n(), r(q, { key: 0 }, [
+                    o[14] || (o[14] = e("span", null, [
+                      f("Will be "),
+                      e("i", null, "gced")
+                    ], -1)),
+                    e("span", gt, u(a(I)(
+                      new Date(t.value.devtools.inactiveAt + t.value.options.gcTime),
+                      {
+                        ...b,
+                        max: void 0
+                      }
+                    )), 1)
+                  ], 64)) : M("", !0)
+                ])) : M("", !0)
+              ])
+            ]),
+            _: 1
+          }, 8, ["icon"]),
+          d(k, {
+            title: "Actions",
+            icon: a(Le)
+          }, {
+            default: p(() => [
+              e("div", yt, [
+                d($, {
+                  class: "theme-info",
+                  size: "sm",
+                  title: "Refetch this query",
+                  disabled: t.value.options?.enabled === !1,
+                  onClick: o[0] || (o[0] = (c) => a(h).emit("queries:refetch", t.value.key))
+                }, {
+                  default: p(() => [
+                    d(R, { class: "size-3.5" }),
+                    o[15] || (o[15] = f(" Refetch "))
+                  ]),
+                  _: 1,
+                  __: [15]
+                }, 8, ["disabled"]),
+                d($, {
+                  class: "theme-neutral",
+                  size: "sm",
+                  title: "Invalidate this query",
+                  onClick: o[1] || (o[1] = (c) => a(h).emit("queries:invalidate", t.value.key))
+                }, {
+                  default: p(() => [
+                    d(N),
+                    o[16] || (o[16] = f(" Invalidate "))
+                  ]),
+                  _: 1,
+                  __: [16]
+                }),
+                t.value.devtools.simulate !== "loading" ? (n(), w($, {
+                  key: 0,
+                  class: "theme-purple",
+                  size: "sm",
+                  title: "Restore the previous state",
+                  onClick: o[2] || (o[2] = (c) => a(h).emit("queries:simulate:loading", t.value.key))
+                }, {
+                  default: p(() => [
+                    d(A),
+                    o[17] || (o[17] = f(" Simulate loading "))
+                  ]),
+                  _: 1,
+                  __: [17]
+                })) : (n(), w($, {
+                  key: 1,
+                  class: "theme-purple",
+                  size: "sm",
+                  title: "Simulate a loading state",
+                  onClick: o[3] || (o[3] = (c) => a(h).emit("queries:simulate:loading:stop", t.value.key))
+                }, {
+                  default: p(() => [
+                    d(A, { class: "animate-spin" }),
+                    o[18] || (o[18] = f(" Stop loading "))
+                  ]),
+                  _: 1,
+                  __: [18]
+                })),
+                t.value.devtools.simulate !== "error" ? (n(), w($, {
+                  key: 2,
+                  class: "theme-error",
+                  size: "sm",
+                  title: "Simulate an Error state",
+                  onClick: o[4] || (o[4] = (c) => a(h).emit("queries:simulate:error", t.value.key))
+                }, {
+                  default: p(() => [
+                    d(U),
+                    o[19] || (o[19] = f(" Simulate error "))
+                  ]),
+                  _: 1,
+                  __: [19]
+                })) : (n(), w($, {
+                  key: 3,
+                  class: "theme-error",
+                  size: "sm",
+                  title: "Restore the previous state",
+                  onClick: o[5] || (o[5] = (c) => a(h).emit("queries:simulate:error:stop", t.value.key))
+                }, {
+                  default: p(() => [
+                    d(F),
+                    o[20] || (o[20] = f(" Remove error "))
+                  ]),
+                  _: 1,
+                  __: [20]
+                })),
+                d($, {
+                  class: "theme-warning",
+                  size: "sm",
+                  title: "Reset this query to its initial (pending) state",
+                  onClick: o[6] || (o[6] = (c) => a(h).emit("queries:reset", t.value.key))
+                }, {
+                  default: p(() => [
+                    d(J),
+                    o[21] || (o[21] = f(" Reset "))
+                  ]),
+                  _: 1,
+                  __: [21]
+                })
+              ])
+            ]),
+            _: 1
+          }, 8, ["icon"]),
+          d(k, {
+            open: a(v),
+            "onUpdate:open": o[7] || (o[7] = (c) => E(v) ? v.value = c : null),
+            title: "Data",
+            icon: a(Pe),
+            class: "font-mono",
+            "no-padding": ""
+          }, {
+            default: p(() => [
+              d(P, {
+                data: t.value.state.data
+              }, null, 8, ["data"])
+            ]),
+            _: 1
+          }, 8, ["open", "icon"]),
+          d(k, {
+            open: a(x),
+            "onUpdate:open": o[8] || (o[8] = (c) => E(x) ? x.value = c : null),
+            title: `Error${t.value.state.status === "error" ? " (!)" : ""}`,
+            icon: a(Ye)
+          }, {
+            default: p(() => [
+              e("div", kt, [
+                t.value.state.error ? (n(), r("pre", bt, u(t.value.state.error), 1)) : (n(), r("p", wt, " No error "))
+              ])
+            ]),
+            _: 1
+          }, 8, ["open", "title", "icon"]),
+          d(k, {
+            title: "Call count",
+            icon: a(nt),
+            open: !1
+          }, {
+            default: p(() => [
+              e("div", xt, [
+                e("p", $t, [
+                  o[22] || (o[22] = e("span", null, "Calls:", -1)),
+                  e("span", null, [
+                    e("code", Ct, u(t.value.devtools.count.total), 1)
+                  ]),
+                  o[23] || (o[23] = e("span", null, "Success:", -1)),
+                  e("span", null, [
+                    e("code", Mt, u(t.value.devtools.count.succeed), 1)
+                  ]),
+                  o[24] || (o[24] = e("span", null, "Errors:", -1)),
+                  e("span", null, [
+                    e("code", St, u(t.value.devtools.count.errored), 1)
+                  ]),
+                  o[25] || (o[25] = e("span", null, "Cancelled:", -1)),
+                  e("span", null, [
+                    e("code", qt, u(t.value.devtools.count.cancelled), 1)
+                  ])
+                ])
+              ])
+            ]),
+            _: 1
+          }, 8, ["icon"]),
+          d(k, {
+            title: `History (${t.value.devtools.history.length})`,
+            icon: a(tt),
+            open: !1
+          }, {
+            default: p(() => [
+              e("div", Bt, [
+                (n(!0), r(q, null, V(y.value, (c) => (n(), w(k, {
+                  key: c.updatedAt,
+                  title: `Entry nº${c.id} (${a(I)(new Date(c.updatedAt), b)})`,
+                  open: !1
+                }, {
+                  default: p(() => [
+                    e("pre", jt, u(c.data), 1)
+                  ]),
+                  _: 2
+                }, 1032, ["title"]))), 128))
+              ])
+            ]),
+            _: 1
+          }, 8, ["title", "icon"]),
+          d(k, {
+            title: "Options",
+            open: !1,
+            icon: a(Ke)
+          }, {
+            default: p(() => [
+              e("div", zt, [
+                t.value.options ? (n(), r("pre", Tt, u(t.value.options), 1)) : (n(), r("p", It, o[26] || (o[26] = [
+                  f(" This Query entry has no options. It might have been created from the server or manually set with "),
+                  e("code", null, "queryCache.setQueryData()", -1),
+                  f(" for prefetching. ")
+                ])))
+              ])
+            ]),
+            _: 1
+          }, 8, ["icon"])
+        ], 64)) : (n(), r("div", Ht, [
+          e("p", Vt, [
+            o[27] || (o[27] = f(" Select a Query to inspect ")),
+            d(Q)
+          ])
+        ]))
+      ]);
+    };
+  }
+});
+export {
+  Lt as default
+};
+//# sourceMappingURL=_queryId_-13o6pDV6.js.map