@pinia/colada-devtools 0.1.8 → 0.1.9

package/dist-panel/{_queryId_-B8mNYXBL.js → _queryId_-BizYY_I8.js}

@@ -1,7 +1,7 @@
-import { _ as W } from "./mouse-pointer-click-C2_foU25.js";
-import { isPlainObject as H, getValueTypeClass as D, formatValue as L } from "@pinia/colada-devtools/shared";
-import { m as g, c as i, o as l, 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 b, 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 h, S as oe, _ as ne, M as se, T as le, O, y as ie, k as d, w as p, U as E, V as ae, W as re, X as I, Y as de } from "./index-UPnYYHaa.js";
-import { _ as ue, a as ce } from "./loader-DJMHHUla.js";
+import { _ as W } from "./mouse-pointer-click-BMFWvdTu.js";
+import { isPlainObject as A, getValueTypeClass as D, formatValue as L } from "@pinia/colada-devtools/shared";
+import { m as g, c as i, o as l, a as e, d as j, x as Y, b as z, r as G, n as C, H as X, h as M, g as b, 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 h, S as oe, _ as ne, M as se, T as le, O, y as ie, k as d, w as p, U as E, V as ae, W as re, X as I, Y as de } from "./index-CIfbEdr_.js";
+import { _ as ue, a as ce } from "./loader-t1YDOb8H.js";
 const pe = {
   viewBox: "0 0 24 24",
   width: "1.2em",
@@ -19,7 +19,7 @@ function me(s, n) {
     }, null, -1)
   ])]);
 }
-const ve = g({ name: "lucide-chevron-right", render: me }), he = ["title"], fe = /* @__PURE__ */ z({
+const ve = g({ name: "lucide-chevron-right", render: me }), he = ["title"], fe = /* @__PURE__ */ j({
   __name: "JsonItem",
   props: {
     itemKey: {},
@@ -27,12 +27,12 @@ const ve = g({ name: "lucide-chevron-right", render: me }), he = ["title"], fe =
     depth: {}
   },
   setup(s) {
-    const n = s, m = Y(!1), o = j(() => {
+    const n = s, m = Y(!1), o = z(() => {
       const { value: r } = n;
-      return Array.isArray(r) && r.length > 0 || H(r) && Object.keys(r).length > 0 || r instanceof Map && r.size > 0 || r instanceof Set && r.size > 0;
-    }), y = j(() => {
+      return Array.isArray(r) && r.length > 0 || A(r) && Object.keys(r).length > 0 || r instanceof Map && r.size > 0 || r instanceof Set && r.size > 0;
+    }), y = z(() => {
       const { value: r } = n;
-      return Array.isArray(r) ? r.map((f, v) => [v, f]) : H(r) ? Object.entries(r) : r instanceof Map ? r.entries() : r instanceof Set ? Array.from(r).map((f, v) => [v, f]) : [];
+      return Array.isArray(r) ? r.map((f, v) => [v, f]) : A(r) ? Object.entries(r) : r instanceof Map ? r.entries() : r instanceof Set ? Array.from(r).map((f, v) => [v, f]) : [];
     });
     function x() {
       o.value && (m.value = !m.value);
@@ -74,9 +74,9 @@ const ve = g({ name: "lucide-chevron-right", render: me }), he = ["title"], fe =
   }
 });
 function ge(s) {
-  return !!s && (Array.isArray(s) || H(s) || s instanceof Map || s instanceof Set);
+  return !!s && (Array.isArray(s) || A(s) || s instanceof Map || s instanceof Set);
 }
-const _e = /* @__PURE__ */ z({
+const _e = /* @__PURE__ */ j({
   __name: "JsonViewer",
   props: {
     data: {}
@@ -167,7 +167,7 @@ function Be(s, n) {
     ], -1)
   ])]);
 }
-const je = g({ 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({
+const ze = g({ name: "lucide-refresh-cw", render: Be }), je = { 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" }, Ae = /* @__PURE__ */ j({
   __name: "UCollapse.ce",
   props: /* @__PURE__ */ K({
     title: { type: String },
@@ -190,7 +190,7 @@ const je = g({ name: "lucide-refresh-cw", render: Be }), ze = { class: "collapse
         o.target.scrollIntoView(y);
       }
     }
-    return (o, y) => (l(), i("div", ze, [
+    return (o, y) => (l(), i("div", je, [
       ee(e("input", {
         "onUpdate:modelValue": y[0] || (y[0] = (x) => n.value = x),
         type: "checkbox"
@@ -221,7 +221,7 @@ const je = g({ name: "lucide-refresh-cw", render: Be }), ze = { class: "collapse
       ], 34)
     ]));
   }
-}), Ve = '.collapse[data-v-46c2be51]:not(td,tr,colgroup){visibility:visible}.collapse[data-v-46c2be51]{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-46c2be51]:is([type=checkbox],[type=radio]){grid-column-start:1;grid-row-start:1;appearance:none;opacity:0}.collapse[data-v-46c2be51]:is([open],:focus),.collapse[data-v-46c2be51]:has(>input:is([type=checkbox],[type=radio]):checked){grid-template-rows:max-content 1fr}.collapse:is([open],:focus)>.collapse-content[data-v-46c2be51],.collapse[data-v-46c2be51]:not(.collapse-close)>:where(input:is([type=checkbox],[type=radio]):checked~.collapse-content){visibility:visible;min-height:fit-content}.collapse[data-v-46c2be51]:focus-visible,.collapse[data-v-46c2be51]: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-46c2be51],.collapse:not(.collapse-close)>input[type=radio][data-v-46c2be51]:not(:checked),.collapse:not(.collapse-close)>.collapse-title[data-v-46c2be51]{cursor:pointer}.collapse:focus:not(.collapse-close,.collapse[open])>.collapse-title[data-v-46c2be51]{cursor:unset}.collapse:is([open]).collapse-arrow>.collapse-title[data-v-46c2be51]:after{transform:translateY(-50%) rotate(225deg)}.collapse.collapse-arrow:focus>.collapse-title[data-v-46c2be51]:after{transform:translateY(-50%) rotate(225deg)}.collapse.collapse-arrow>input:is([type=checkbox],[type=radio]):checked~.collapse-title[data-v-46c2be51]:after{transform:translateY(-50%) rotate(225deg)}.collapse>input[data-v-46c2be51]:is([type=checkbox],[type=radio]){z-index:1;width:100%}.collapse-title[data-v-46c2be51],.collapse-content[data-v-46c2be51]{grid-column-start:1;grid-row-start:1}.collapse-content[data-v-46c2be51]{visibility:hidden;grid-column-start:1;grid-row-start:2;min-height:0;cursor:unset;transition:visibility .2s}.collapse-arrow>.collapse-title[data-v-46c2be51]: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-46c2be51]{position:relative;width:100%;transition:background-color .2s ease-out}', Ae = /* @__PURE__ */ ne(He, [["styles", [Ve]], ["__scopeId", "data-v-46c2be51"]]);
+}), Ve = '.collapse[data-v-46c2be51]:not(td,tr,colgroup){visibility:visible}.collapse[data-v-46c2be51]{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-46c2be51]:is([type=checkbox],[type=radio]){grid-column-start:1;grid-row-start:1;appearance:none;opacity:0}.collapse[data-v-46c2be51]:is([open],:focus),.collapse[data-v-46c2be51]:has(>input:is([type=checkbox],[type=radio]):checked){grid-template-rows:max-content 1fr}.collapse:is([open],:focus)>.collapse-content[data-v-46c2be51],.collapse[data-v-46c2be51]:not(.collapse-close)>:where(input:is([type=checkbox],[type=radio]):checked~.collapse-content){visibility:visible;min-height:fit-content}.collapse[data-v-46c2be51]:focus-visible,.collapse[data-v-46c2be51]: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-46c2be51],.collapse:not(.collapse-close)>input[type=radio][data-v-46c2be51]:not(:checked),.collapse:not(.collapse-close)>.collapse-title[data-v-46c2be51]{cursor:pointer}.collapse:focus:not(.collapse-close,.collapse[open])>.collapse-title[data-v-46c2be51]{cursor:unset}.collapse:is([open]).collapse-arrow>.collapse-title[data-v-46c2be51]:after{transform:translateY(-50%) rotate(225deg)}.collapse.collapse-arrow:focus>.collapse-title[data-v-46c2be51]:after{transform:translateY(-50%) rotate(225deg)}.collapse.collapse-arrow>input:is([type=checkbox],[type=radio]):checked~.collapse-title[data-v-46c2be51]:after{transform:translateY(-50%) rotate(225deg)}.collapse>input[data-v-46c2be51]:is([type=checkbox],[type=radio]){z-index:1;width:100%}.collapse-title[data-v-46c2be51],.collapse-content[data-v-46c2be51]{grid-column-start:1;grid-row-start:1}.collapse-content[data-v-46c2be51]{visibility:hidden;grid-column-start:1;grid-row-start:2;min-height:0;cursor:unset;transition:visibility .2s}.collapse-arrow>.collapse-title[data-v-46c2be51]: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-46c2be51]{position:relative;width:100%;transition:background-color .2s ease-out}', He = /* @__PURE__ */ ne(Ae, [["styles", [Ve]], ["__scopeId", "data-v-46c2be51"]]);
 function Oe(s) {
   if (s < 1e3)
     return `${Math.round(s)} ms`;
@@ -287,8 +287,8 @@ function Je(s, n) {
       "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" })
+      e("path", { d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }),
+      e("path", { d: "M14 2v5a1 1 0 0 0 1 1h5M10 9H8m8 4H8m8 4H8" })
     ], -1)
   ])]);
 }
@@ -400,16 +400,16 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
 }, bt = {
   key: 1,
   class: "text-neutral-500/50"
-}, wt = { 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 = {
+}, wt = { 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" }, zt = { class: "rounded p-1 overflow-auto max-h-[1200px]" }, jt = { class: "py-1" }, Tt = {
   key: 0,
   class: "rounded bg-neutral-500/20 p-1 overflow-auto max-h-[1200px]"
-}, It = { key: 1 }, Ht = {
+}, It = { key: 1 }, At = {
   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({
+}, Vt = { class: "flex flex-col text-center items-center gap-2 text-lg px-2" }, Lt = /* @__PURE__ */ j({
   __name: "[queryId]",
   setup(s) {
-    const n = ae(), m = se(), o = j(() => m.value.find((_) => _.keyHash === n.params.queryId) ?? null), y = j(() => o.value?.devtools.history.map((_) => {
+    const n = ae(), m = se(), o = z(() => m.value.find((_) => _.keyHash === n.params.queryId) ?? null), y = z(() => o.value?.devtools.history.map((_) => {
       let t;
       try {
         t = JSON.stringify(_, null, 2);
@@ -437,7 +437,7 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
         !_ || S === _.status || (S = _.status, _.status === "error" ? (w.value = !0, B = v.value, v.value = !1) : _.status === "success" && (v.value = B, w.value = !1));
       }
     ), (_, t) => {
-      const k = Ae, R = je, $ = de, N = Se, A = ue, U = ce, F = $e, J = xe, P = _e, Q = W;
+      const k = He, R = ze, $ = de, N = Se, H = ue, U = ce, F = $e, J = xe, P = _e, Q = W;
       return l(), i("div", lt, [
         o.value ? (l(), i(q, { key: 0 }, [
           d(k, {
@@ -533,7 +533,7 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
                   onClick: t[2] || (t[2] = (c) => a(f).emit("queries:simulate:loading", o.value.key))
                 }, {
                   default: p(() => [
-                    d(A),
+                    d(H),
                     t[17] || (t[17] = h(" Simulate loading ", -1))
                   ]),
                   _: 1
@@ -545,7 +545,7 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
                   onClick: t[3] || (t[3] = (c) => a(f).emit("queries:simulate:loading:stop", o.value.key))
                 }, {
                   default: p(() => [
-                    d(A, { class: "animate-spin" }),
+                    d(H, { class: "animate-spin" }),
                     t[18] || (t[18] = h(" Stop loading ", -1))
                   ]),
                   _: 1
@@ -661,7 +661,7 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
                   open: !1
                 }, {
                   default: p(() => [
-                    e("pre", jt, u(c.data), 1)
+                    e("pre", zt, u(c.data), 1)
                   ]),
                   _: 2
                 }, 1032, ["title"]))), 128))
@@ -675,7 +675,7 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
             icon: a(Ke)
           }, {
             default: p(() => [
-              e("div", zt, [
+              e("div", jt, [
                 o.value.options ? (l(), i("pre", Tt, u(o.value.options), 1)) : (l(), i("p", It, [...t[26] || (t[26] = [
                   h(" This Query entry has no options. It might have been created from the server or manually set with ", -1),
                   e("code", null, "queryCache.setQueryData()", -1),
@@ -685,7 +685,7 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
             ]),
             _: 1
           }, 8, ["icon"])
-        ], 64)) : (l(), i("div", Ht, [
+        ], 64)) : (l(), i("div", At, [
           e("p", Vt, [
             t[27] || (t[27] = h(" Select a Query to inspect ", -1)),
             d(Q)
@@ -698,4 +698,4 @@ const st = g({ name: "lucide-sigma-square", render: nt }), lt = { class: "flex f
 export {
   Lt as default
 };
-//# sourceMappingURL=_queryId_-B8mNYXBL.js.map
+//# sourceMappingURL=_queryId_-BizYY_I8.js.map

package/dist-panel/_queryId_-BizYY_I8.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"_queryId_-BizYY_I8.js","sources":["../src/panel/components/editable-json/JsonItem.vue","../src/panel/components/editable-json/JsonViewer.vue","../src/panel/components/UCollapse.ce.vue","../src/panel/utils/time.ts","../src/panel/pages/queries/[queryId].vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed } from 'vue'\nimport type { JSONValue } from '@pinia/colada-devtools/shared'\nimport { formatValue, getValueTypeClass, isPlainObject } from '@pinia/colada-devtools/shared'\n\nconst props = defineProps<{\n  itemKey: string\n  value: JSONValue | Map<PropertyKey, any> | Set<unknown>\n  depth: number\n}>()\n\nconst isExpanded = ref(false)\n\nconst isExpandable = computed(() => {\n  const { value } = props\n  return (\n    (Array.isArray(value) && value.length > 0) ||\n    (isPlainObject(value) && Object.keys(value).length > 0) ||\n    (value instanceof Map && value.size > 0) ||\n    (value instanceof Set && value.size > 0)\n  )\n})\n\nconst keyValuePairs = computed<Iterable<[PropertyKey, any]>>(() => {\n  const { value } = props\n  if (Array.isArray(value)) {\n    return value.map((v, i) => [i, v] as const)\n  } else if (isPlainObject(value)) {\n    return Object.entries(value)\n  } else if (value instanceof Map) {\n    return value.entries()\n  } else if (value instanceof Set) {\n    return Array.from(value).map((v, i) => [i, v] as const)\n  }\n  return []\n})\n\nfunction toggleExpansion() {\n  if (!isExpandable.value) return\n  isExpanded.value = !isExpanded.value\n}\n\n// TODO: rework the indentation of nested items, it's currently bugged: it increases too much and is too small at the beginning\n</script>\n\n<template>\n  <div\n    :style=\"{ paddingLeft: `${depth * 0.35}em` }\"\n    class=\"ring-(--ui-bg-muted)\"\n    :class=\"{\n      'hover:ring': isExpandable,\n      'rounded-tl': depth > 0,\n    }\"\n  >\n    <div\n      class=\"flex items-center gap-2 py-0.5 bg-transparent hover:bg-(--ui-bg-muted) duration-200 transition-colors\"\n      :class=\"depth > 0 && 'rounded-l'\"\n    >\n      <ILucideChevronRight\n        v-if=\"isExpandable\"\n        class=\"size-3 text-(--ui-text-dimmed) transition-transform duration-200 cursor-pointer\"\n        :class=\"{ 'rotate-90': isExpanded }\"\n        @click=\"toggleExpansion\"\n      />\n\n      <!-- Maintain alignment by adding left margin when chevron is absent -->\n      <span class=\"text-(--devtools-syntax-gray)\" :class=\"!isExpandable && 'ml-5'\">\n        {{ itemKey }}:\n      </span>\n\n      <!-- Value or Collection Label -->\n      <span\n        :class=\"[getValueTypeClass(value), isExpandable && 'cursor-pointer']\"\n        :title=\"isExpandable ? 'Click to expand' : undefined\"\n        @click=\"toggleExpansion\"\n      >\n        {{ formatValue(value) }}\n      </span>\n\n      <!-- Edit button -->\n      <!-- <UButton v-if=\"isHovered && !isExpandable\" size=\"xs\"> -->\n      <!--   Edit -->\n      <!-- </UButton> -->\n    </div>\n\n    <!-- Expanded children -->\n    <template v-if=\"isExpandable && isExpanded\">\n      <JsonItem\n        v-for=\"[childKey, childValue] of keyValuePairs\"\n        :key=\"childKey\"\n        :item-key=\"String(childKey)\"\n        :value=\"childValue\"\n        :depth=\"depth + 1\"\n      />\n    </template>\n  </div>\n</template>\n","<script lang=\"ts\">\nfunction isExpandable(\n  value: unknown,\n): value is unknown[] | Record<string, unknown> | Map<unknown, unknown> | Set<unknown> {\n  return (\n    !!value &&\n    (Array.isArray(value) || isPlainObject(value) || value instanceof Map || value instanceof Set)\n  )\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { formatValue, getValueTypeClass, isPlainObject } from '@pinia/colada-devtools/shared'\nimport JsonItem from './JsonItem.vue'\n\ndefineProps<{\n  data: unknown\n}>()\n</script>\n\n<template>\n  <!-- Handle expandable items -->\n  <template v-if=\"isExpandable(data)\">\n    <JsonItem\n      v-for=\"[key, value] in Object.entries(data)\"\n      :key=\"key\"\n      :item-key=\"key\"\n      :value=\"value\"\n      :depth=\"0\"\n    />\n  </template>\n  <!-- Handle primitive root values -->\n  <template v-else>\n    <span :class=\"getValueTypeClass(data)\">{{ formatValue(data) }}</span>\n  </template>\n</template>\n","<script setup lang=\"ts\">\nimport type { Component } from 'vue'\n\ndefineProps<{\n  title?: string\n  icon?: Component\n  noPadding?: boolean\n}>()\n\nconst open = defineModel<boolean>('open', {\n  default: true,\n})\n\nfunction scrollIfNeeded(event: TransitionEvent) {\n  if (event.target instanceof HTMLElement) {\n    const scrollOptions: ScrollIntoViewOptions = {\n      block: 'nearest',\n      inline: 'nearest',\n      behavior: 'smooth',\n    }\n    event.target.scrollIntoView(scrollOptions)\n  }\n}\n</script>\n\n<template>\n  <div class=\"collapse collapse-arrow\">\n    <input v-model=\"open\" type=\"checkbox\" />\n    <div class=\"collapse-title px-2 py-0.5 bg-neutral-200 dark:bg-neutral-800 theme-neutral\">\n      <slot name=\"title\" :open :title>\n        <h3 class=\"font-semibold text-sm flex gap-x-1 items-center\">\n          <slot name=\"icon\">\n            <component :is=\"icon\" v-if=\"icon\" class=\"size-4\" />\n          </slot>\n          {{ title ?? 'Group' }}\n        </h3>\n      </slot>\n    </div>\n    <div\n      :class=\"!noPadding && 'px-2'\"\n      class=\"collapse-content text-sm overflow-hidden\"\n      @transitionend=\"scrollIfNeeded\"\n    >\n      <slot :open />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.collapse:not(td, tr, colgroup) {\n  visibility: visible;\n}\n\n.collapse {\n  position: relative;\n  display: grid;\n  overflow: hidden;\n  width: 100%;\n  grid-template-rows: max-content 0fr;\n  transition: grid-template-rows 0.2s;\n  isolation: isolate;\n\n  > input:is([type='checkbox'], [type='radio']) {\n    grid-column-start: 1;\n    grid-row-start: 1;\n    appearance: none;\n    opacity: 0;\n  }\n\n  &:is([open], :focus),\n  &:has(> input:is([type='checkbox'], [type='radio']):checked) {\n    grid-template-rows: max-content 1fr;\n  }\n\n  &:is([open], :focus) > .collapse-content,\n  &:not(.collapse-close)\n    > :where(input:is([type='checkbox'], [type='radio']):checked ~ .collapse-content) {\n    visibility: visible;\n    min-height: fit-content;\n  }\n  &:focus-visible,\n  &:has(> input:is([type='checkbox'], [type='radio']):focus-visible) {\n    outline-color: var(--ui-text);\n    outline-style: solid;\n    outline-width: 2px;\n    outline-offset: 2px;\n  }\n\n  &:not(.collapse-close) {\n    > input[type='checkbox'],\n    > input[type='radio']:not(:checked),\n    > .collapse-title {\n      cursor: pointer;\n    }\n  }\n\n  &:focus:not(.collapse-close, .collapse[open]) > .collapse-title {\n    cursor: unset;\n  }\n\n  &:is([open]) {\n    &.collapse-arrow {\n      > .collapse-title:after {\n        transform: translateY(-50%) rotate(225deg);\n      }\n    }\n  }\n\n  &.collapse-arrow:focus {\n    > .collapse-title:after {\n      transform: translateY(-50%) rotate(225deg);\n    }\n  }\n\n  &.collapse-arrow {\n    > input:is([type='checkbox'], [type='radio']):checked ~ .collapse-title:after {\n      transform: translateY(-50%) rotate(225deg);\n    }\n  }\n\n  > input:is([type='checkbox'], [type='radio']) {\n    z-index: 1;\n    width: 100%;\n  }\n}\n\n.collapse-title,\n.collapse-content {\n  grid-column-start: 1;\n  grid-row-start: 1;\n}\n\n.collapse-content {\n  visibility: hidden;\n  grid-column-start: 1;\n  grid-row-start: 2;\n  min-height: 0;\n  cursor: unset;\n  transition: visibility 0.2s;\n}\n\n.collapse-arrow {\n  > .collapse-title:after {\n    position: absolute;\n    display: block;\n    height: 0.5rem;\n    width: 0.5rem;\n    transform: translateY(-100%) rotate(45deg);\n    transition-property: all;\n    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    transition-duration: 0.2s;\n    top: 50%;\n    right: 0.8em;\n    inset-inline-end: 0.75rem;\n    content: '';\n    transform-origin: 75% 75%;\n    box-shadow: 2px 2px;\n    pointer-events: none;\n  }\n}\n\n.collapse-title {\n  position: relative;\n  width: 100%;\n  transition: background-color 0.2s ease-out;\n}\n</style>\n","export function formatDuration(timeInMs: number): string {\n  if (timeInMs < 1000) {\n    return `${Math.round(timeInMs)} ms`\n  }\n\n  const seconds = timeInMs / 1000\n  if (timeInMs < 10_000) {\n    return `${seconds.toFixed(3)} seconds`\n  }\n\n  if (timeInMs < 60_000) {\n    return `${Math.floor(seconds)} seconds`\n  }\n\n  const minutes = Math.floor(seconds / 60)\n\n  if (timeInMs < 3_600_000) {\n    return `${minutes} minute${minutes > 1 ? 's' : ''}`\n  }\n\n  const hours = Math.floor(minutes / 60)\n\n  return `${hours}h${minutes % 60}m${seconds % 60}s`\n}\n","<script setup lang=\"ts\">\nimport type { UseQueryEntryPayload } from '@pinia/colada-devtools/shared'\nimport { computed, watch } from 'vue'\nimport { useDuplexChannel, useQueryEntries } from '../../composables/duplex-channel'\nimport { formatDuration } from '../../utils/time'\nimport { useRoute } from 'vue-router'\nimport type { DataStateStatus } from '@pinia/colada'\n\nimport IWrench from '~icons/lucide/wrench'\nimport IInfoCircle from '~icons/lucide/info'\nimport IFileText from '~icons/lucide/file-text'\nimport ICircleX from '~icons/lucide/circle-x'\nimport IBraces from '~icons/lucide/braces'\nimport IHistory from '~icons/lucide/history'\nimport ISigmaSquare from '~icons/lucide/sigma-square'\nimport { useTimeAgo, formatTimeAgo, useLocalStorage } from '@vueuse/core'\nimport type { FormatTimeAgoOptions } from '@vueuse/core'\n\nconst route = useRoute()\nconst queries = useQueryEntries()\n\nconst selectedQuery = computed<UseQueryEntryPayload | null>(() => {\n  return queries.value.find((entry) => entry.keyHash === route.params.queryId) ?? null\n})\n\nconst serializedHistoryEntries = computed(() => {\n  return (\n    selectedQuery.value?.devtools.history.map((entry) => {\n      let value: string\n      try {\n        value = JSON.stringify(entry, null, 2)\n      } catch (error) {\n        value = `Error serializing entry: ${String(error)}`\n      }\n      return {\n        ...entry,\n        data: value,\n      }\n    }) ?? []\n  )\n})\n\nconst TIME_AGO_OPTIONS: FormatTimeAgoOptions = {\n  showSecond: true,\n  rounding: 'floor',\n  max: 1000 * 60 * 5, // 5 minutes\n}\n\nconst lastUpdate = useTimeAgo(() => selectedQuery.value?.devtools.updatedAt ?? 0, {\n  ...TIME_AGO_OPTIONS,\n  updateInterval: 3000,\n})\n\n// TODO: we should be able to highlight components using this query\n// const el = useTemplateRef('me')\n// TODO: add ref=\"me\" to the div\n// watch(\n//   // also trigger if the selectedQuery changes\n//   () => [el.value, selectedQuery.value?.id] as const,\n//   ([el]) => {\n//     if (!el || !selectedQuery.value) return\n//\n//     const observingComponents = findVueComponents(\n//       el,\n//       selectedQuery.value.deps.filter((c) => c.type === 'component').map((c) => c.uid) ?? [],\n//     )\n//\n//     console.log('elements', observingComponents)\n//   },\n// )\n\nconst channel = useDuplexChannel()\n\nconst isDataOpen = useLocalStorage<boolean>('pc:query:details:data:open', false, {})\nlet wasDataOpen = isDataOpen.value\nlet lastStatus: DataStateStatus | null = null\nconst isErrorOpen = useLocalStorage<boolean>('pc:query:details:error:open', false, {})\nwatch(\n  () => selectedQuery.value?.state,\n  (state) => {\n    if (!state || lastStatus === state.status) return\n    lastStatus = state.status\n    if (state.status === 'error') {\n      isErrorOpen.value = true\n      // preserve it for later\n      wasDataOpen = isDataOpen.value\n      isDataOpen.value = false\n    } else if (state.status === 'success') {\n      isDataOpen.value = wasDataOpen\n      isErrorOpen.value = false\n    }\n  },\n)\n</script>\n\n<template>\n  <div class=\"flex flex-col divide-y dark:divide-(--ui-border) divide-(--ui-border-accented)\">\n    <template v-if=\"selectedQuery\">\n      <UCollapse title=\"Details\" :icon=\"IInfoCircle\">\n        <div class=\"py-1 text-sm\">\n          <p class=\"grid grid-cols-[auto_1fr] gap-1\">\n            <span>key:</span>\n            <span>\n              <code class=\"rounded bg-neutral-500/20 p-0.5\">{{ selectedQuery.key }}</code>\n            </span>\n          </p>\n\n          <p\n            class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n            title=\"When was the query entry last updated\"\n          >\n            <span>Last update:</span>\n            <span class=\"font-bold\">{{ lastUpdate }}</span>\n          </p>\n\n          <p\n            v-if=\"selectedQuery.devtools.history.at(0)?.fetchTime\"\n            class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n            title=\"When was the last time the query was fetched\"\n          >\n            <span>Last fetch:</span>\n            <span class=\"font-bold\">{{\n              formatTimeAgo(new Date(selectedQuery.devtools.history.at(0)!.fetchTime!.start), {\n                ...TIME_AGO_OPTIONS,\n                max: undefined,\n              })\n            }}</span>\n          </p>\n\n          <p\n            v-if=\"selectedQuery.devtools.history.at(0)?.fetchTime?.end\"\n            class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n            title=\"How long did the last query take to fetch\"\n          >\n            <span>Fetch duration:</span>\n            <span class=\"font-bold\">{{\n              formatDuration(\n                selectedQuery.devtools.history.at(0)!.fetchTime!.end! -\n                  selectedQuery.devtools.history.at(0)!.fetchTime!.start,\n              )\n            }}</span>\n          </p>\n\n          <p\n            class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n            title=\"How many components and effects are using this query\"\n          >\n            <span\n              >Observers: <span class=\"font-bold\">{{ selectedQuery.deps.length }}</span></span\n            >\n          </p>\n\n          <p\n            v-if=\"!selectedQuery.active && selectedQuery.options\"\n            class=\"grid grid-cols-[auto_1fr] gap-x-2\"\n            title=\"When is this query entry garbace collected\"\n          >\n            <template\n              v-if=\"\n                typeof selectedQuery.options.gcTime === 'number' &&\n                Number.isFinite(selectedQuery.options.gcTime)\n              \"\n            >\n              <span>Will be <i>gced</i></span>\n              <span class=\"font-bold\">{{\n                formatTimeAgo(\n                  new Date(selectedQuery.devtools.inactiveAt + selectedQuery.options.gcTime),\n                  {\n                    ...TIME_AGO_OPTIONS,\n                    max: undefined,\n                  },\n                )\n              }}</span>\n            </template>\n          </p>\n        </div>\n      </UCollapse>\n\n      <UCollapse title=\"Actions\" :icon=\"IWrench\">\n        <div class=\"py-2 gap-2 flex flex-wrap items-center justify-items-start\">\n          <UButton\n            class=\"theme-info\"\n            size=\"sm\"\n            title=\"Refetch this query\"\n            :disabled=\"selectedQuery.options?.enabled === false\"\n            @click=\"channel.emit('queries:refetch', selectedQuery.key)\"\n          >\n            <i-lucide-refresh-cw class=\"size-3.5\" /> Refetch\n          </UButton>\n\n          <UButton\n            class=\"theme-neutral\"\n            size=\"sm\"\n            title=\"Invalidate this query\"\n            @click=\"channel.emit('queries:invalidate', selectedQuery.key)\"\n          >\n            <i-lucide-timer-reset /> Invalidate\n          </UButton>\n\n          <UButton\n            v-if=\"selectedQuery.devtools.simulate !== 'loading'\"\n            class=\"theme-purple\"\n            size=\"sm\"\n            title=\"Restore the previous state\"\n            @click=\"channel.emit('queries:simulate:loading', selectedQuery.key)\"\n          >\n            <i-lucide-loader />\n            Simulate loading\n          </UButton>\n          <UButton\n            v-else\n            class=\"theme-purple\"\n            size=\"sm\"\n            title=\"Simulate a loading state\"\n            @click=\"channel.emit('queries:simulate:loading:stop', selectedQuery.key)\"\n          >\n            <i-lucide-loader class=\"animate-spin\" />\n            Stop loading\n          </UButton>\n\n          <UButton\n            v-if=\"selectedQuery.devtools.simulate !== 'error'\"\n            class=\"theme-error\"\n            size=\"sm\"\n            title=\"Simulate an Error state\"\n            @click=\"channel.emit('queries:simulate:error', selectedQuery.key)\"\n          >\n            <i-lucide-x-octagon /> Simulate error\n          </UButton>\n          <UButton\n            v-else\n            class=\"theme-error\"\n            size=\"sm\"\n            title=\"Restore the previous state\"\n            @click=\"channel.emit('queries:simulate:error:stop', selectedQuery.key)\"\n          >\n            <i-lucide-rotate-ccw /> Remove error\n          </UButton>\n\n          <UButton\n            class=\"theme-warning\"\n            size=\"sm\"\n            title=\"Reset this query to its initial (pending) state\"\n            @click=\"channel.emit('queries:reset', selectedQuery.key)\"\n          >\n            <i-lucide-trash /> Reset\n          </UButton>\n        </div>\n      </UCollapse>\n\n      <UCollapse\n        v-model:open=\"isDataOpen\"\n        title=\"Data\"\n        :icon=\"IFileText\"\n        class=\"font-mono\"\n        no-padding\n      >\n        <JsonViewer :data=\"selectedQuery.state.data\" />\n      </UCollapse>\n\n      <UCollapse\n        v-model:open=\"isErrorOpen\"\n        :title=\"`Error${selectedQuery.state.status === 'error' ? ' (!)' : ''}`\"\n        :icon=\"ICircleX\"\n      >\n        <div class=\"py-1\">\n          <pre v-if=\"selectedQuery.state.error\" class=\"rounded p-1 overflow-auto max-h-[1200px]\">{{\n            selectedQuery.state.error\n          }}</pre>\n          <p v-else class=\"text-neutral-500/50\">No error</p>\n        </div>\n      </UCollapse>\n\n      <UCollapse title=\"Call count\" :icon=\"ISigmaSquare\" :open=\"false\">\n        <div class=\"py-1\">\n          <p class=\"grid grid-cols-[auto_1fr] gap-1\">\n            <span>Calls:</span>\n            <span>\n              <code class=\"font-bold\">{{ selectedQuery.devtools.count.total }}</code>\n            </span>\n            <span>Success:</span>\n            <span>\n              <code class=\"font-bold\">{{ selectedQuery.devtools.count.succeed }}</code>\n            </span>\n            <span>Errors:</span>\n            <span>\n              <code class=\"font-bold\">{{ selectedQuery.devtools.count.errored }}</code>\n            </span>\n            <span>Cancelled:</span>\n            <span>\n              <code class=\"font-bold\">{{ selectedQuery.devtools.count.cancelled }}</code>\n            </span>\n          </p>\n        </div>\n      </UCollapse>\n\n      <UCollapse\n        :title=\"`History (${selectedQuery.devtools.history.length})`\"\n        :icon=\"IHistory\"\n        :open=\"false\"\n      >\n        <div class=\"py-1\">\n          <UCollapse\n            v-for=\"entry of serializedHistoryEntries\"\n            :key=\"entry.updatedAt\"\n            :title=\"`Entry nº${entry.id} (${formatTimeAgo(new Date(entry.updatedAt), TIME_AGO_OPTIONS)})`\"\n            :open=\"false\"\n          >\n            <pre class=\"rounded p-1 overflow-auto max-h-[1200px]\">{{ entry.data }}</pre>\n          </UCollapse>\n        </div>\n      </UCollapse>\n\n      <UCollapse title=\"Options\" :open=\"false\" :icon=\"IBraces\">\n        <div class=\"py-1\">\n          <pre\n            v-if=\"selectedQuery.options\"\n            class=\"rounded bg-neutral-500/20 p-1 overflow-auto max-h-[1200px]\"\n            >{{ selectedQuery.options }}</pre\n          >\n          <p v-else>\n            This Query entry has no options. It might have been created from the server or manually\n            set with\n            <code>queryCache.setQueryData()</code> for prefetching.\n          </p>\n        </div>\n      </UCollapse>\n    </template>\n\n    <template v-else>\n      <div class=\"py-6 mx-auto\">\n        <p class=\"flex flex-col text-center items-center gap-2 text-lg px-2\">\n          Select a Query to inspect\n          <i-lucide-mouse-pointer-click />\n        </p>\n      </div>\n    </template>\n  </div>\n</template>\n"],"names":["props","__props","isExpanded","ref","isExpandable","computed","value","isPlainObject","keyValuePairs","v","i","toggleExpansion","_createElementBlock","_createElementVNode","_normalizeClass","_createBlock","_component_ILucideChevronRight","_toDisplayString","_unref","getValueTypeClass","formatValue","_hoisted_1","_openBlock","_Fragment","_renderList","childKey","childValue","_component_JsonItem","key","JsonItem","open","_useModel","scrollIfNeeded","event","scrollOptions","$event","_hoisted_2","_renderSlot","_ctx","_hoisted_3","_resolveDynamicComponent","_createTextVNode","formatDuration","timeInMs","seconds","minutes","route","useRoute","queries","useQueryEntries","selectedQuery","entry","serializedHistoryEntries","error","TIME_AGO_OPTIONS","lastUpdate","useTimeAgo","channel","useDuplexChannel","isDataOpen","useLocalStorage","wasDataOpen","lastStatus","isErrorOpen","watch","state","_createVNode","_component_UCollapse","IInfoCircle","_cache","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","formatTimeAgo","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","IWrench","_hoisted_15","_component_UButton","_component_i_lucide_refresh_cw","_component_i_lucide_timer_reset","_component_i_lucide_loader","_component_i_lucide_x_octagon","_component_i_lucide_rotate_ccw","_component_i_lucide_trash","IFileText","_component_JsonViewer","ICircleX","_hoisted_16","_hoisted_17","_hoisted_18","ISigmaSquare","_hoisted_19","_hoisted_20","_hoisted_21","_hoisted_22","_hoisted_23","_hoisted_24","IHistory","_hoisted_25","_hoisted_26","IBraces","_hoisted_27","_hoisted_28","_hoisted_29","_hoisted_30","_hoisted_31","_component_i_lucide_mouse_pointer_click"],"mappings":"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"}

package/dist-panel/{index-oPdQg_Hb.js → index-BNGmSTu0.js}

@@ -1,5 +1,5 @@
-import { _ as o } from "./mouse-pointer-click-C2_foU25.js";
-import { _ as c, c as s, o as n, a as _, P as a, k as r } from "./index-UPnYYHaa.js";
+import { _ as o } from "./mouse-pointer-click-BMFWvdTu.js";
+import { _ as c, c as s, o as n, a as _, P as a, k as r } from "./index-CIfbEdr_.js";
 const i = {}, l = { class: "py-6 mx-auto" }, p = { class: "flex flex-col text-center items-center gap-2 text-lg px-2" };
 function d(m, e) {
   const t = o;
@@ -14,4 +14,4 @@ const u = /* @__PURE__ */ c(i, [["render", d]]);
 export {
   u as default
 };
-//# sourceMappingURL=index-oPdQg_Hb.js.map
+//# sourceMappingURL=index-BNGmSTu0.js.map

package/dist-panel/{index-oPdQg_Hb.js.map → index-BNGmSTu0.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index-oPdQg_Hb.js","sources":["../src/panel/pages/queries/index.vue"],"sourcesContent":["<script setup lang=\"ts\"></script>\n\n<template>\n  <div class=\"py-6 mx-auto\">\n    <p class=\"flex flex-col text-center items-center gap-2 text-lg px-2\">\n      Select a Query to inspect\n      <i-lucide-mouse-pointer-click />\n    </p>\n  </div>\n</template>\n"],"names":["_hoisted_1","_hoisted_2","_openBlock","_createElementBlock","_createElementVNode","_createVNode","_component_i_lucide_mouse_pointer_click"],"mappings":";;cAGOA,IAAA,EAAA,OAAM,eAAc,GACpBC,IAAA,EAAA,OAAM,4DAA2D;;;AADtE,SAAAC,EAAA,GAAAC,EAKM,OALNH,GAKM;AAAA,IAJJI,EAGI,KAHJH,GAGI;AAAA,wBAHiE,+BAEnE,EAAA;AAAA,MAAAI,EAAgCC,CAAA;AAAA;;;;"}
+{"version":3,"file":"index-BNGmSTu0.js","sources":["../src/panel/pages/queries/index.vue"],"sourcesContent":["<script setup lang=\"ts\"></script>\n\n<template>\n  <div class=\"py-6 mx-auto\">\n    <p class=\"flex flex-col text-center items-center gap-2 text-lg px-2\">\n      Select a Query to inspect\n      <i-lucide-mouse-pointer-click />\n    </p>\n  </div>\n</template>\n"],"names":["_hoisted_1","_hoisted_2","_openBlock","_createElementBlock","_createElementVNode","_createVNode","_component_i_lucide_mouse_pointer_click"],"mappings":";;cAGOA,IAAA,EAAA,OAAM,eAAc,GACpBC,IAAA,EAAA,OAAM,4DAA2D;;;AADtE,SAAAC,EAAA,GAAAC,EAKM,OALNH,GAKM;AAAA,IAJJI,EAGI,KAHJH,GAGI;AAAA,wBAHiE,+BAEnE,EAAA;AAAA,MAAAI,EAAgCC,CAAA;AAAA;;;;"}