@pinia/colada-devtools 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,817 @@
1
+ var Ue = Object.defineProperty;
2
+ var ge = (r) => {
3
+ throw TypeError(r);
4
+ };
5
+ var Fe = (r, o, l) => o in r ? Ue(r, o, { enumerable: !0, configurable: !0, writable: !0, value: l }) : r[o] = l;
6
+ var oe = (r, o, l) => Fe(r, typeof o != "symbol" ? o + "" : o, l), re = (r, o, l) => o.has(r) || ge("Cannot " + l);
7
+ var F = (r, o, l) => (re(r, o, "read from private field"), l ? l.call(r) : o.get(r)), X = (r, o, l) => o.has(r) ? ge("Cannot add the same private member more than once") : o instanceof WeakSet ? o.add(r) : o.set(r, l), _e = (r, o, l, u) => (re(r, o, "write to private field"), u ? u.call(r, l) : o.set(r, l), l), xe = (r, o, l) => (re(r, o, "access private method"), l);
8
+ import { d as Q, u as He, b as C, c as w, o as y, a as f, _ as qe, m as q, s as ce, e as Se, f as Je, r as ke, g as V, w as Z, h as le, n as A, i as $, F as te, j as de, t as ve, k as E, l as Ke, p as We, v as Xe, q as I, x as Ye, y as B, z as G, A as Pe, B as Ce, C as Me, D as Ze, E as Ge, G as T, H as ue, I as et, J as tt, K as nt, L as ze, M as at, N as st, O as it } from "./index-DfIXa7Jb.js";
9
+ import { _ as ot, a as rt } from "./loader-B7hpsxwv.js";
10
+ import { miniJsonParse as lt } from "@pinia/colada-devtools/shared";
11
+ const ut = {
12
+ class: "progress-bar",
13
+ "aria-hidden": ""
14
+ }, ct = /* @__PURE__ */ Q({
15
+ __name: "UCircleProgress.ce",
16
+ props: {
17
+ value: { type: Number },
18
+ min: { default: 0, type: Number },
19
+ max: { default: 100, type: Number },
20
+ strokeWidth: { default: 2, type: Number }
21
+ },
22
+ setup(r) {
23
+ He((l) => ({
24
+ dfc273d4: o.value,
25
+ b5e811ce: l.strokeWidth
26
+ }));
27
+ const o = C(() => Math.round((r.value - r.min) / (r.max - r.min) * 100));
28
+ return (l, u) => (y(), w("div", ut, u[0] || (u[0] = [
29
+ f("svg", null, [
30
+ f("circle", { class: "bg" }),
31
+ f("circle", { class: "fg" })
32
+ ], -1)
33
+ ])));
34
+ }
35
+ }), dt = ".progress-bar>svg[data-v-138f773b]{--progress-value: var(--dfc273d4);--size: 1em;--half-size: calc(var(--size) / 2);--stroke-width: calc(var(--b5e811ce) * var(--size) / 10);--radius: calc((var(--size) - var(--stroke-width)) / 2);--circumference: calc(var(--radius) * pi * 2);--dash: calc((var(--progress-value) * var(--circumference)) / 100);animation:progress-animation 100s linear 0s 1 forwards;width:var(--size);height:var(--size)}.progress-bar circle[data-v-138f773b]{cx:var(--half-size);cy:var(--half-size);r:var(--radius);stroke-width:var(--stroke-width);fill:none;stroke-linecap:butt}.progress-bar circle.bg[data-v-138f773b]{stroke:color-mix(in hsl,currentColor 25%,var(--ui-bg))}.progress-bar circle.fg[data-v-138f773b]{transform:rotate(-90deg);transform-origin:var(--half-size) var(--half-size);stroke-dasharray:var(--dash) calc(var(--circumference) - var(--dash));transition:stroke-dasharray .3s linear 0s;stroke:currentColor}", vt = /* @__PURE__ */ qe(ct, [["styles", [dt]], ["__scopeId", "data-v-138f773b"]]), mt = {
36
+ viewBox: "0 0 24 24",
37
+ width: "1.2em",
38
+ height: "1.2em"
39
+ };
40
+ function pt(r, o) {
41
+ return y(), w("svg", mt, o[0] || (o[0] = [
42
+ f("g", {
43
+ fill: "none",
44
+ stroke: "currentColor",
45
+ "stroke-linecap": "round",
46
+ "stroke-linejoin": "round",
47
+ "stroke-width": "2"
48
+ }, [
49
+ f("circle", {
50
+ cx: "12",
51
+ cy: "12",
52
+ r: "10"
53
+ }),
54
+ f("path", { d: "m9 15l6-6" })
55
+ ], -1)
56
+ ]));
57
+ }
58
+ const ht = q({ name: "lucide-circle-slash", render: pt }), ft = {
59
+ viewBox: "0 0 24 24",
60
+ width: "1.2em",
61
+ height: "1.2em"
62
+ };
63
+ function gt(r, o) {
64
+ return y(), w("svg", ft, o[0] || (o[0] = [
65
+ f("g", {
66
+ fill: "none",
67
+ stroke: "currentColor",
68
+ "stroke-linecap": "round",
69
+ "stroke-linejoin": "round",
70
+ "stroke-width": "2"
71
+ }, [
72
+ f("rect", {
73
+ width: "4",
74
+ height: "16",
75
+ x: "14",
76
+ y: "4",
77
+ rx: "1"
78
+ }),
79
+ f("rect", {
80
+ width: "4",
81
+ height: "16",
82
+ x: "6",
83
+ y: "4",
84
+ rx: "1"
85
+ })
86
+ ], -1)
87
+ ]));
88
+ }
89
+ const _t = q({ name: "lucide-pause", render: gt }), xt = {
90
+ viewBox: "0 0 24 24",
91
+ width: "1.2em",
92
+ height: "1.2em"
93
+ };
94
+ function zt(r, o) {
95
+ return y(), w("svg", xt, o[0] || (o[0] = [
96
+ f("path", {
97
+ fill: "none",
98
+ stroke: "currentColor",
99
+ "stroke-linecap": "round",
100
+ "stroke-linejoin": "round",
101
+ "stroke-width": "2",
102
+ d: "M20 6L9 17l-5-5"
103
+ }, null, -1)
104
+ ]));
105
+ }
106
+ const yt = q({ name: "lucide-check", render: zt }), bt = {
107
+ viewBox: "0 0 24 24",
108
+ width: "1.2em",
109
+ height: "1.2em"
110
+ };
111
+ function wt(r, o) {
112
+ return y(), w("svg", bt, o[0] || (o[0] = [
113
+ f("path", {
114
+ fill: "none",
115
+ stroke: "currentColor",
116
+ "stroke-linecap": "round",
117
+ "stroke-linejoin": "round",
118
+ "stroke-width": "2",
119
+ d: "M18 6L7 17l-5-5m20-2l-7.5 7.5L13 16"
120
+ }, null, -1)
121
+ ]));
122
+ }
123
+ const St = q({ name: "lucide-check-check", render: wt });
124
+ function $e(r) {
125
+ return r.asyncStatus === "loading" ? "loading" : r.state.status === "error" ? "error" : r.state.status === "pending" ? "pending" : r.stale ? "stale" : r.state.status === "success" ? "fresh" : "unknown";
126
+ }
127
+ const ee = {
128
+ loading: {
129
+ base: "bg-purple-400",
130
+ clear: "bg-purple-200",
131
+ text: "text-purple-100"
132
+ },
133
+ fresh: {
134
+ base: "bg-success-500",
135
+ clear: "bg-success-200",
136
+ text: "text-success-100"
137
+ },
138
+ error: {
139
+ base: "bg-error-500",
140
+ clear: "bg-error-200",
141
+ text: "text-error-100"
142
+ },
143
+ stale: {
144
+ base: "bg-info-500",
145
+ clear: "bg-info-200",
146
+ text: "text-info-100"
147
+ },
148
+ pending: {
149
+ base: "bg-warning-500",
150
+ clear: "bg-warning-200",
151
+ text: "text-warning-100"
152
+ },
153
+ inactive: {
154
+ base: "bg-neutral-400",
155
+ clear: "bg-neutral-200",
156
+ text: "text-neutral-100"
157
+ },
158
+ unknown: {
159
+ base: "bg-gray-400",
160
+ clear: "bg-gray-200",
161
+ text: "text-gray-100"
162
+ }
163
+ }, ye = ce(performance.timeOrigin + performance.now());
164
+ let Y, be = 0;
165
+ function kt() {
166
+ return Y || (Y = setInterval(() => {
167
+ ye.value = performance.timeOrigin + performance.now();
168
+ }, 50)), be++, Se(() => {
169
+ --be <= 0 && (clearInterval(Y), Y = void 0);
170
+ }), ye;
171
+ }
172
+ const Pt = { class: "h-full w-6 relative" }, Ct = ["title"], Mt = ["href", "title", "onClick"], $t = { class: "flex font-mono flex-grow gap-0.5 overflow-auto items-center" }, Rt = { class: "text-wrap break-words rounded bg-(--ui-text)/5 px-0.5" }, Lt = {
173
+ key: 0,
174
+ "aria-hidden": "true"
175
+ }, Et = {
176
+ key: 0,
177
+ title: "This query is disabled"
178
+ }, Nt = { class: "rounded bg-theme/70 theme-neutral p-0.5 text-xs flex gap-x-0.5 items-center" }, Tt = {
179
+ key: 1,
180
+ title: "This query will be garbage collected"
181
+ }, Bt = /* @__PURE__ */ Q({
182
+ __name: "ListQueryEntry",
183
+ props: {
184
+ entry: {}
185
+ },
186
+ setup(r) {
187
+ const o = Je(), l = kt();
188
+ function u(d) {
189
+ d.preventDefault(), d.stopPropagation(), o.push("/queries");
190
+ }
191
+ const s = C(() => r.entry.key.map((d) => {
192
+ let g = d;
193
+ try {
194
+ g = typeof d == "string" ? JSON.parse(d) : d;
195
+ } catch {
196
+ }
197
+ return g && typeof g == "object" ? lt(g) : String(g);
198
+ })), h = C(() => $e(r.entry));
199
+ return (d, g) => {
200
+ const b = ot, v = St, z = rt, S = yt, k = _t, P = ht, M = vt, _ = ke("RouterLink");
201
+ return y(), V(_, {
202
+ to: { name: "/queries/[queryId]", params: { queryId: d.entry.id } },
203
+ custom: ""
204
+ }, {
205
+ default: Z(({ isActive: p, navigate: O, href: D }) => {
206
+ var J, K;
207
+ return [
208
+ f("div", {
209
+ class: A(["grid grid-cols-[minmax(0,auto)_1fr] grid-flow-col items-center gap-x-2 p-1 relative text-sm @container", [
210
+ p ? "bg-neutral-200 dark:bg-neutral-700" : "hover:bg-(--ui-bg-elevated)",
211
+ d.entry.active ? "" : "text-(--ui-text)/50"
212
+ ]])
213
+ }, [
214
+ f("div", Pt, [
215
+ f("div", {
216
+ class: A(["absolute -inset-1 right-0 flex items-center justify-center", $(ee)[h.value].base]),
217
+ title: h.value
218
+ }, [
219
+ h.value === "loading" ? (y(), V(b, {
220
+ key: 0,
221
+ title: "Loading",
222
+ "aria-label": "Loading icon"
223
+ })) : h.value === "fresh" ? (y(), V(v, {
224
+ key: 1,
225
+ title: "Fresh successful data",
226
+ "aria-label": "Fresh successful data icon"
227
+ })) : h.value === "error" ? (y(), V(z, {
228
+ key: 2,
229
+ title: "Error",
230
+ "aria-label": "Error icon"
231
+ })) : h.value === "stale" ? (y(), V(S, {
232
+ key: 3,
233
+ title: "Stale",
234
+ "aria-label": "Stale icon"
235
+ })) : h.value === "pending" ? (y(), V(k, {
236
+ key: 4,
237
+ title: "Pending",
238
+ "aria-label": "Pending icon"
239
+ })) : le("", !0)
240
+ ], 10, Ct)
241
+ ]),
242
+ f("a", {
243
+ href: D,
244
+ class: "hover:cursor-pointer block overflow-hidden",
245
+ title: d.entry.active ? "Active query" : "Inactive query",
246
+ onClick: (N) => p ? u(N) : O(N)
247
+ }, [
248
+ f("ol", $t, [
249
+ (y(!0), w(te, null, de(s.value, (N, ae) => (y(), w(te, { key: N }, [
250
+ f("li", Rt, ve(N), 1),
251
+ ae < s.value.length - 1 ? (y(), w("li", Lt, "/")) : le("", !0)
252
+ ], 64))), 128))
253
+ ])
254
+ ], 8, Mt),
255
+ ((J = d.entry.options) == null ? void 0 : J.enabled) === !1 ? (y(), w("div", Et, [
256
+ f("span", Nt, [
257
+ E(P, { "aria-hidden": "" }),
258
+ g[0] || (g[0] = f("span", { class: "@max-md:hidden" }, "disabled", -1))
259
+ ])
260
+ ])) : !d.entry.active && d.entry.gcTimeout && d.entry.devtools.inactiveAt && typeof ((K = d.entry.options) == null ? void 0 : K.gcTime) == "number" && Number.isFinite(d.entry.options.gcTime) && d.entry.options.gcTime <= 3e4 ? (y(), w("div", Tt, [
261
+ E(M, {
262
+ class: "size-[1em] dark:text-neutral-500 text-neutral-400",
263
+ max: d.entry.options.gcTime,
264
+ value: d.entry.devtools.inactiveAt + d.entry.options.gcTime - $(l)
265
+ }, null, 8, ["max", "value"])
266
+ ])) : le("", !0)
267
+ ], 2)
268
+ ];
269
+ }),
270
+ _: 1
271
+ }, 8, ["to"]);
272
+ };
273
+ }
274
+ }), Ot = /* @__PURE__ */ Q({
275
+ __name: "UInput.ce",
276
+ props: {
277
+ modelValue: {},
278
+ modelModifiers: {}
279
+ },
280
+ emits: ["update:modelValue"],
281
+ setup(r) {
282
+ const o = Ke(r, "modelValue");
283
+ return (l, u) => We((y(), w("input", {
284
+ "onUpdate:modelValue": u[0] || (u[0] = (s) => o.value = s),
285
+ class: "py-1.5 pl-8 pr-2 rounded border border-(--ui-border) focus:ring-1 focus:ring-theme focus:outline-none transition-colors theme-primary",
286
+ placeholder: "Search Queries"
287
+ }, null, 512)), [
288
+ [Xe, o.value]
289
+ ]);
290
+ }
291
+ }), Dt = {
292
+ viewBox: "0 0 24 24",
293
+ width: "1.2em",
294
+ height: "1.2em"
295
+ };
296
+ function Vt(r, o) {
297
+ return y(), w("svg", Dt, o[0] || (o[0] = [
298
+ f("g", {
299
+ fill: "none",
300
+ stroke: "currentColor",
301
+ "stroke-linecap": "round",
302
+ "stroke-linejoin": "round",
303
+ "stroke-width": "2"
304
+ }, [
305
+ f("path", { d: "m21 21l-4.34-4.34" }),
306
+ f("circle", {
307
+ cx: "11",
308
+ cy: "11",
309
+ r: "8"
310
+ })
311
+ ], -1)
312
+ ]));
313
+ }
314
+ const It = q({ name: "lucide-search", render: Vt }), At = /* @__PURE__ */ Q({
315
+ __name: "splitpanes",
316
+ props: {
317
+ horizontal: { type: Boolean, default: !1 },
318
+ pushOtherPanes: { type: Boolean, default: !0 },
319
+ maximizePanes: { type: Boolean, default: !0 },
320
+ // Maximize pane on splitter double click/tap.
321
+ rtl: { type: Boolean, default: !1 },
322
+ // Right to left direction.
323
+ firstSplitter: { type: Boolean, default: !1 }
324
+ },
325
+ emits: [
326
+ "ready",
327
+ "resize",
328
+ "resized",
329
+ "pane-click",
330
+ "pane-maximize",
331
+ "pane-add",
332
+ "pane-remove",
333
+ "splitter-click",
334
+ "splitter-dblclick"
335
+ ],
336
+ setup(r, { emit: o }) {
337
+ const l = o, u = r;
338
+ Ge();
339
+ const s = B([]), h = C(
340
+ () => s.value.reduce((e, t) => (e[~~t.id] = t) && e, {})
341
+ ), d = C(() => s.value.length), g = B(null), b = B(!1), v = B({
342
+ mouseDown: !1,
343
+ dragging: !1,
344
+ activeSplitter: null,
345
+ cursorOffset: 0
346
+ // Cursor offset within the splitter.
347
+ }), z = B({
348
+ // Used to detect double click on touch devices.
349
+ splitter: null,
350
+ timeoutId: null
351
+ }), S = C(() => ({
352
+ [`splitpanes splitpanes--${u.horizontal ? "horizontal" : "vertical"}`]: !0,
353
+ "splitpanes--dragging": v.value.dragging
354
+ }));
355
+ let k = () => {
356
+ };
357
+ function P(e) {
358
+ e.addEventListener("mousemove", _, { passive: !1 }), e.addEventListener("mouseup", p), "ontouchstart" in window && (e.addEventListener("touchmove", _, { passive: !1 }), e.addEventListener("touchend", p)), k = () => {
359
+ e.removeEventListener("mousemove", _), e.removeEventListener("mouseup", p), "ontouchstart" in window && (e.removeEventListener("touchmove", _), e.removeEventListener("touchend", p)), k = () => {
360
+ };
361
+ };
362
+ }
363
+ const M = (e, t) => {
364
+ const a = e.target.closest(".splitpanes__splitter");
365
+ if (a) {
366
+ const { left: n, top: i } = a.getBoundingClientRect(), { clientX: m, clientY: c } = "touches" in e ? e.touches[0] : e;
367
+ v.value.cursorOffset = u.horizontal ? c - i : m - n;
368
+ }
369
+ P(e.target.ownerDocument || document), v.value.mouseDown = !0, v.value.activeSplitter = t;
370
+ }, _ = (e) => {
371
+ v.value.mouseDown && (e.preventDefault(), v.value.dragging = !0, requestAnimationFrame(() => {
372
+ ae(K(e)), L("resize", { event: e }, !0);
373
+ }));
374
+ }, p = (e) => {
375
+ v.value.dragging && L("resized", { event: e }, !0), v.value.mouseDown = !1, v.value.activeSplitter = null, setTimeout(() => {
376
+ v.value.dragging = !1, k();
377
+ }, 100);
378
+ }, O = (e, t) => {
379
+ "ontouchstart" in window && (e.preventDefault(), z.value.splitter === t ? (clearTimeout(z.value.timeoutId), z.value.timeoutId = null, D(e, t), z.value.splitter = null) : (z.value.splitter = t, z.value.timeoutId = setTimeout(() => z.value.splitter = null, 500))), v.value.dragging || L("splitter-click", { event: e, index: t }, !0);
380
+ }, D = (e, t) => {
381
+ if (L("splitter-dblclick", { event: e, index: t }, !0), u.maximizePanes) {
382
+ let a = 0;
383
+ s.value = s.value.map((n, i) => (n.size = i === t ? n.max : n.min, i !== t && (a += n.min), n)), s.value[t].size -= a, L("pane-maximize", {
384
+ event: e,
385
+ index: t,
386
+ pane: s.value[t]
387
+ }), L("resized", { event: e, index: t }, !0);
388
+ }
389
+ }, J = (e, t) => {
390
+ L("pane-click", {
391
+ event: e,
392
+ index: h.value[t].index,
393
+ pane: h.value[t]
394
+ });
395
+ }, K = (e) => {
396
+ var t;
397
+ const a = (t = g.value) == null ? void 0 : t.getBoundingClientRect(), { clientX: n, clientY: i } = "ontouchstart" in window && e.touches ? e.touches[0] : e;
398
+ return {
399
+ x: n - (u.horizontal ? 0 : v.value.cursorOffset) - a.left,
400
+ y: i - (u.horizontal ? v.value.cursorOffset : 0) - a.top
401
+ };
402
+ }, N = (e) => {
403
+ e = e[u.horizontal ? "y" : "x"];
404
+ const t = g.value[u.horizontal ? "clientHeight" : "clientWidth"];
405
+ return u.rtl && !u.horizontal && (e = t - e), e * 100 / t;
406
+ }, ae = (e) => {
407
+ const t = v.value.activeSplitter;
408
+ let a = {
409
+ prevPanesSize: me(t),
410
+ nextPanesSize: U(t),
411
+ prevReachedMinPanes: 0,
412
+ nextReachedMinPanes: 0
413
+ };
414
+ const n = 0 + (u.pushOtherPanes ? 0 : a.prevPanesSize), i = 100 - (u.pushOtherPanes ? 0 : a.nextPanesSize), m = Math.max(Math.min(N(e), i), n);
415
+ let c = [t, t + 1], x = s.value[c[0]], R = s.value[c[1]];
416
+ if (!x || !R) return;
417
+ const he = x.max < 100 && m >= x.max + a.prevPanesSize, Qe = R.max < 100 && m <= 100 - (R.max + U(t + 1));
418
+ if (he || Qe) {
419
+ he ? (x.size = x.max, R.size = Math.max(100 - x.max - a.prevPanesSize - a.nextPanesSize, 0)) : (x.size = Math.max(
420
+ 100 - R.max - a.prevPanesSize - U(t + 1),
421
+ 0
422
+ ), R.size = R.max);
423
+ return;
424
+ }
425
+ if (u.pushOtherPanes) {
426
+ const fe = Le(a, m);
427
+ if (!fe) return;
428
+ ({ sums: a, panesToResize: c } = fe), x = s.value[c[0]], R = s.value[c[1]];
429
+ }
430
+ x && (x.size = Math.min(
431
+ Math.max(m - a.prevPanesSize - a.prevReachedMinPanes, x.min),
432
+ x.max
433
+ )), R && (R.size = Math.min(
434
+ Math.max(100 - m - a.nextPanesSize - a.nextReachedMinPanes, R.min),
435
+ R.max
436
+ ));
437
+ }, Le = (e, t) => {
438
+ const a = v.value.activeSplitter, n = [a, a + 1];
439
+ let i = s.value[n[0]], m = s.value[n[1]];
440
+ return i && t < e.prevPanesSize + i.min && (n[0] = Ee(a).index, e.prevReachedMinPanes = 0, n[0] < a && s.value.forEach((c, x) => {
441
+ x > n[0] && x <= a && (c.size = c.min, e.prevReachedMinPanes += c.min);
442
+ }), e.prevPanesSize = me(n[0]), n[0] === void 0) ? (e.prevReachedMinPanes = 0, s.value[0].size = s.value[0].min, s.value.forEach((c, x) => {
443
+ x > 0 && x <= a && (c.size = c.min, e.prevReachedMinPanes += c.min);
444
+ }), m.size = 100 - e.prevReachedMinPanes - s.value[0].min - e.prevPanesSize - e.nextPanesSize, null) : t > 100 - e.nextPanesSize - s.value[n[1]].min && (n[1] = Ne(a).index, e.nextReachedMinPanes = 0, n[1] > a + 1 && s.value.forEach((c, x) => {
445
+ x > a && x < n[1] && (c.size = c.min, e.nextReachedMinPanes += c.min);
446
+ }), e.nextPanesSize = U(n[1] - 1), n[1] === void 0) ? (e.nextReachedMinPanes = 0, s.value.forEach((c, x) => {
447
+ x < d.value - 1 && x >= a + 1 && (c.size = c.min, e.nextReachedMinPanes += c.min);
448
+ }), s.value[n[0]].size = 100 - e.prevPanesSize - U(n[0] - 1), null) : { sums: e, panesToResize: n };
449
+ }, me = (e) => s.value.reduce((t, a, n) => t + (n < e ? a.size : 0), 0), U = (e) => s.value.reduce((t, a, n) => t + (n > e + 1 ? a.size : 0), 0), Ee = (e) => [...s.value].reverse().find((t) => t.index < e && t.size > t.min) || {}, Ne = (e) => s.value.find((t) => t.index > e + 1 && t.size > t.min) || {}, Te = () => {
450
+ var e;
451
+ const t = Array.from(((e = g.value) == null ? void 0 : e.children) || []);
452
+ for (const a of t) {
453
+ const n = a.classList.contains("splitpanes__pane"), i = a.classList.contains("splitpanes__splitter");
454
+ !n && !i && (a.remove(), console.warn(
455
+ "Splitpanes: Only <pane> elements are allowed at the root of <splitpanes>. One of your DOM nodes was removed."
456
+ ));
457
+ }
458
+ }, pe = (e, t, a = !1) => {
459
+ const n = e - 1, i = document.createElement("div");
460
+ i.classList.add("splitpanes__splitter"), a || (i.onmousedown = (m) => M(m, n), typeof window < "u" && "ontouchstart" in window && (i.ontouchstart = (m) => M(m, n)), i.onclick = (m) => O(m, n + 1)), i.ondblclick = (m) => D(m, n + 1), t.parentNode.insertBefore(i, t);
461
+ }, Be = (e) => {
462
+ e.onmousedown = void 0, e.onclick = void 0, e.ondblclick = void 0, e.remove();
463
+ }, W = () => {
464
+ var e;
465
+ const t = Array.from(((e = g.value) == null ? void 0 : e.children) || []);
466
+ for (const n of t)
467
+ n.className.includes("splitpanes__splitter") && Be(n);
468
+ let a = 0;
469
+ for (const n of t)
470
+ n.className.includes("splitpanes__pane") && (!a && u.firstSplitter ? pe(a, n, !0) : a && pe(a, n), a++);
471
+ }, Oe = ({ uid: e, ...t }) => {
472
+ const a = h.value[e];
473
+ for (const [n, i] of Object.entries(t)) a[n] = i;
474
+ }, De = (e) => {
475
+ var t;
476
+ let a = -1;
477
+ Array.from(((t = g.value) == null ? void 0 : t.children) || []).some((n) => (n.className.includes("splitpanes__pane") && a++, n.isSameNode(e.el))), s.value.splice(a, 0, { ...e, index: a }), s.value.forEach((n, i) => n.index = i), b.value && ue(() => {
478
+ W(), se({ addedPane: s.value[a] }), L("pane-add", { pane: s.value[a] });
479
+ });
480
+ }, Ve = (e) => {
481
+ const t = s.value.findIndex((n) => n.id === e);
482
+ s.value[t].el = null;
483
+ const a = s.value.splice(t, 1)[0];
484
+ s.value.forEach((n, i) => n.index = i), ue(() => {
485
+ W(), L("pane-remove", { pane: a }), se({ removedPane: { ...a } });
486
+ });
487
+ }, se = (e = {}) => {
488
+ !e.addedPane && !e.removedPane ? Ae() : s.value.some((t) => t.givenSize !== null || t.min || t.max < 100) ? je(e) : Ie(), b.value && L("resized");
489
+ }, Ie = () => {
490
+ const e = 100 / d.value;
491
+ let t = 0;
492
+ const a = [], n = [];
493
+ for (const i of s.value)
494
+ i.size = Math.max(Math.min(e, i.max), i.min), t -= i.size, i.size >= i.max && a.push(i.id), i.size <= i.min && n.push(i.id);
495
+ t > 0.1 && ie(t, a, n);
496
+ }, Ae = () => {
497
+ let e = 100;
498
+ const t = [], a = [];
499
+ let n = 0;
500
+ for (const m of s.value)
501
+ e -= m.size, m.givenSize !== null && n++, m.size >= m.max && t.push(m.id), m.size <= m.min && a.push(m.id);
502
+ let i = 100;
503
+ if (e > 0.1) {
504
+ for (const m of s.value)
505
+ m.givenSize === null && (m.size = Math.max(
506
+ Math.min(e / (d.value - n), m.max),
507
+ m.min
508
+ )), i -= m.size;
509
+ i > 0.1 && ie(i, t, a);
510
+ }
511
+ }, je = ({ addedPane: e, removedPane: t } = {}) => {
512
+ let a = 100 / d.value, n = 0;
513
+ const i = [], m = [];
514
+ ((e == null ? void 0 : e.givenSize) ?? null) !== null && (a = (100 - e.givenSize) / (d.value - 1));
515
+ for (const c of s.value)
516
+ n -= c.size, c.size >= c.max && i.push(c.id), c.size <= c.min && m.push(c.id);
517
+ if (!(Math.abs(n) < 0.1)) {
518
+ for (const c of s.value)
519
+ (e == null ? void 0 : e.givenSize) !== null && (e == null ? void 0 : e.id) === c.id || (c.size = Math.max(Math.min(a, c.max), c.min)), n -= c.size, c.size >= c.max && i.push(c.id), c.size <= c.min && m.push(c.id);
520
+ n > 0.1 && ie(n, i, m);
521
+ }
522
+ }, ie = (e, t, a) => {
523
+ let n;
524
+ e > 0 ? n = e / (d.value - t.length) : n = e / (d.value - a.length), s.value.forEach((i, m) => {
525
+ if (e > 0 && !t.includes(i.id)) {
526
+ const c = Math.max(Math.min(i.size + n, i.max), i.min), x = c - i.size;
527
+ e -= x, i.size = c;
528
+ } else if (!a.includes(i.id)) {
529
+ const c = Math.max(Math.min(i.size + n, i.max), i.min), x = c - i.size;
530
+ e -= x, i.size = c;
531
+ }
532
+ }), Math.abs(e) > 0.1 && ue(() => {
533
+ b.value && console.warn("Splitpanes: Could not resize panes correctly due to their constraints.");
534
+ });
535
+ }, L = (e, t = void 0, a = !1) => {
536
+ const n = (t == null ? void 0 : t.index) ?? v.value.activeSplitter ?? null;
537
+ l(e, {
538
+ ...t,
539
+ ...n !== null && { index: n },
540
+ ...a && n !== null && {
541
+ prevPane: s.value[n - (u.firstSplitter ? 1 : 0)],
542
+ nextPane: s.value[n + (u.firstSplitter ? 0 : 1)]
543
+ },
544
+ panes: s.value.map((i) => ({
545
+ min: i.min,
546
+ max: i.max,
547
+ size: i.size
548
+ }))
549
+ });
550
+ };
551
+ return G(
552
+ () => u.firstSplitter,
553
+ () => W()
554
+ ), Pe(() => {
555
+ Te(), W(), se(), L("ready"), b.value = !0;
556
+ }), Ce(() => b.value = !1), T("panes", s), T("indexedPanes", h), T(
557
+ "horizontal",
558
+ C(() => u.horizontal)
559
+ ), T("requestUpdate", Oe), T("onPaneAdd", De), T("onPaneRemove", Ve), T("onPaneClick", J), (e, t) => (y(), w("div", {
560
+ class: A(S.value),
561
+ ref_key: "containerEl",
562
+ ref: g
563
+ }, [
564
+ Me(e.$slots, "default")
565
+ ], 2));
566
+ }
567
+ }), we = /* @__PURE__ */ Q({
568
+ __name: "pane",
569
+ props: {
570
+ size: { type: [Number, String] },
571
+ minSize: { type: [Number, String], default: 0 },
572
+ maxSize: { type: [Number, String], default: 100 }
573
+ },
574
+ setup(r) {
575
+ var o;
576
+ const l = r, u = I("requestUpdate"), s = I("onPaneAdd"), h = I("horizontal"), d = I("onPaneRemove"), g = I("onPaneClick"), b = (o = Ye()) == null ? void 0 : o.uid, v = I("indexedPanes"), z = C(() => v.value[b]), S = B(null), k = C(() => {
577
+ const p = isNaN(l.size) || l.size === void 0 ? 0 : parseFloat(l.size);
578
+ return Math.max(Math.min(p, M.value), P.value);
579
+ }), P = C(() => {
580
+ const p = parseFloat(l.minSize);
581
+ return isNaN(p) ? 0 : p;
582
+ }), M = C(() => {
583
+ const p = parseFloat(l.maxSize);
584
+ return isNaN(p) ? 100 : p;
585
+ }), _ = C(() => {
586
+ var p;
587
+ return `${h.value ? "height" : "width"}: ${(p = z.value) == null ? void 0 : p.size}%`;
588
+ });
589
+ return G(
590
+ () => k.value,
591
+ (p) => u({ uid: b, size: p })
592
+ ), G(
593
+ () => P.value,
594
+ (p) => u({ uid: b, min: p })
595
+ ), G(
596
+ () => M.value,
597
+ (p) => u({ uid: b, max: p })
598
+ ), Pe(() => {
599
+ s({
600
+ id: b,
601
+ el: S.value,
602
+ min: P.value,
603
+ max: M.value,
604
+ // The given size (useful to know the user intention).
605
+ givenSize: l.size === void 0 ? null : k.value,
606
+ size: k.value
607
+ // The computed current size at any time.
608
+ });
609
+ }), Ce(() => d(b)), (p, O) => (y(), w("div", {
610
+ ref_key: "paneEl",
611
+ ref: S,
612
+ class: "splitpanes__pane",
613
+ onClick: O[0] || (O[0] = (D) => $(g)(D, $(b))),
614
+ style: Ze(_.value)
615
+ }, [
616
+ Me(p.$slots, "default")
617
+ ], 4));
618
+ }
619
+ }), jt = "bae45330cd3d4e0e96b60d26b57009b5";
620
+ let Qt = 0;
621
+ const Ut = () => `${jt}-${Date.now()}-${Qt++}`;
622
+ class Ft extends Event {
623
+ constructor(o, l, u) {
624
+ super(o), this.container = l, this.matches = u;
625
+ }
626
+ }
627
+ var j, H, ne, Re;
628
+ class Ht extends EventTarget {
629
+ constructor(l, u) {
630
+ super();
631
+ X(this, ne);
632
+ X(this, j);
633
+ X(this, H, new AbortController());
634
+ oe(this, "container");
635
+ oe(this, "matches");
636
+ this.container = u;
637
+ const s = `container-query-observer-${Ut()}`, h = `data-${s}`;
638
+ l.setAttribute(h, "");
639
+ const d = `--${s}`, g = `
640
+ @property ${d} {
641
+ syntax: '<custom-ident>';
642
+ inherits: false;
643
+ initial-value: --false;
644
+ }
645
+ `.trim(), b = `
646
+ @container ${u} {
647
+ [${h}] {
648
+ ${d}: --true;
649
+ }
650
+ }
651
+ `.trim(), v = l.getRootNode();
652
+ if (!(v instanceof ShadowRoot) && !(v instanceof Document))
653
+ throw console.error("root node of element isn't a ShadowRoot or Document", v), new TypeError("Root node must be a ShadowRoot or Document");
654
+ const z = new CSSStyleSheet();
655
+ if (z.replaceSync(g), document.adoptedStyleSheets.push(z), v.ownerDocument === document) {
656
+ const P = new CSSStyleSheet();
657
+ P.replaceSync(b), v.adoptedStyleSheets.push(P);
658
+ }
659
+ const k = getComputedStyle(l);
660
+ this.matches = k.getPropertyValue(d) === "--true", _e(this, j, l), xe(this, ne, Re).call(this, d, u, l);
661
+ }
662
+ dispose() {
663
+ F(this, j).style.removeProperty("transition"), F(this, j).style.removeProperty("transition-behavior"), F(this, H).abort();
664
+ }
665
+ }
666
+ j = new WeakMap(), H = new WeakMap(), ne = new WeakSet(), Re = function(l, u, s) {
667
+ const h = {};
668
+ s.style.setProperty("transition", `${l} 0.001ms step-start`), s.style.setProperty("transition-behavior", "allow-discrete"), s.addEventListener(
669
+ "transitionrun",
670
+ (b) => {
671
+ if (s === b.target) {
672
+ const v = getComputedStyle(s), z = {}, S = v.getPropertyValue(l), k = h[l];
673
+ if (S !== k && (z[l] = S, h[l] = S, l in z)) {
674
+ const M = z[l] === "--true";
675
+ this.matches = M;
676
+ const _ = new Ft("change", u, M);
677
+ this.dispatchEvent(_);
678
+ }
679
+ }
680
+ },
681
+ { signal: F(this, H).signal }
682
+ );
683
+ const g = getComputedStyle(s).getPropertyValue(l);
684
+ h[l] = g;
685
+ };
686
+ typeof window < "u" && (HTMLElement.prototype.matchContainer || (HTMLElement.prototype.matchContainer = function(o) {
687
+ return new Ht(this, o);
688
+ }));
689
+ function qt(r, o) {
690
+ const l = et(
691
+ () => typeof document < "u" && typeof document.body.matchContainer == "function"
692
+ ), u = ce(), s = ce(!1);
693
+ return tt(() => {
694
+ var h, d, g;
695
+ l.value && ((h = u.value) == null || h.dispose(), u.value = (d = ze(o)) == null ? void 0 : d.matchContainer(ze(r)), s.value = !!((g = u.value) != null && g.matches));
696
+ }), Se(() => {
697
+ var h;
698
+ (h = u.value) == null || h.dispose();
699
+ }), nt(
700
+ u,
701
+ "change",
702
+ (h) => {
703
+ s.value = h.matches;
704
+ },
705
+ { passive: !0 }
706
+ ), C(() => s.value);
707
+ }
708
+ const Jt = { class: "grid grid-rows-[auto_1fr] overflow-hidden @container" }, Kt = { class: "flex items-center p-2 border-b border-(--ui-border) gap-2" }, Wt = { class: "relative flex-grow" }, Xt = { class: "flex gap-x-1" }, Yt = ["title"], Zt = { class: "@max-[750px]:hidden" }, Gt = {
709
+ role: "list",
710
+ class: "divide-y divide-(--ui-border)"
711
+ }, sn = /* @__PURE__ */ Q({
712
+ __name: "queries",
713
+ setup(r) {
714
+ const o = B(""), l = at(), u = C(() => {
715
+ let v = l.value;
716
+ if (o.value) {
717
+ const z = o.value.toLowerCase();
718
+ v = v.filter((S) => S.key.some((P) => String(P).toLowerCase().includes(z)));
719
+ }
720
+ return v.sort((z, S) => S.devtools.updatedAt - z.devtools.updatedAt);
721
+ }), s = C(() => ({
722
+ loading: [],
723
+ fresh: [],
724
+ error: [],
725
+ pending: [],
726
+ inactive: u.value.filter((v) => !v.active),
727
+ ...Object.groupBy(u.value, (v) => $e(v))
728
+ })), h = st("container"), d = qt("(width < 768px)", () => {
729
+ var v;
730
+ return (v = h.value) == null ? void 0 : v.$el;
731
+ }), g = it(
732
+ "pc-devtools-query-list-panel-size",
733
+ [30, 70]
734
+ );
735
+ function b({ panes: v }) {
736
+ g.value = v.map((z) => z.size);
737
+ }
738
+ return (v, z) => {
739
+ const S = It, k = Ot, P = Bt, M = ke("RouterView");
740
+ return y(), w("section", Jt, [
741
+ f("div", Kt, [
742
+ f("div", Wt, [
743
+ E(S, { class: "absolute left-2 top-1/2 -translate-y-1/2 text-ui-text-muted size-4" }),
744
+ E(k, {
745
+ modelValue: o.value,
746
+ "onUpdate:modelValue": z[0] || (z[0] = (_) => o.value = _),
747
+ type: "search",
748
+ class: "w-full",
749
+ placeholder: "Search Queries"
750
+ }, null, 8, ["modelValue"])
751
+ ]),
752
+ f("div", Xt, [
753
+ (y(!0), w(te, null, de(s.value, (_, p) => (y(), w("div", {
754
+ key: p,
755
+ class: A(["theme-neutral bg-(--ui-bg-muted) rounded p-1 text-xs font-semibold flex items-center gap-x-1", ((_ == null ? void 0 : _.length) ?? 0) === 0 ? "text-(--ui-text-muted)" : ""]),
756
+ title: `${(_ == null ? void 0 : _.length) ?? 0} ${p} queries (after filtering)`
757
+ }, [
758
+ f("div", {
759
+ class: A(["rounded-full size-2", $(ee)[p].base])
760
+ }, null, 2),
761
+ f("span", Zt, ve(p), 1),
762
+ f("div", {
763
+ class: A([
764
+ "px-1.5 py-0.5 rounded min-w-[1.65em] flex justify-center",
765
+ ((_ == null ? void 0 : _.length) ?? 0) === 0 ? "bg-(--ui-bg-accented)" : [$(ee)[p].base, $(ee)[p].text]
766
+ ])
767
+ }, [
768
+ f("span", null, ve((_ == null ? void 0 : _.length) ?? 0), 1)
769
+ ], 2)
770
+ ], 10, Yt))), 128))
771
+ ])
772
+ ]),
773
+ E($(At), {
774
+ ref_key: "container",
775
+ ref: h,
776
+ class: "overflow-hidden",
777
+ horizontal: $(d),
778
+ onResized: b
779
+ }, {
780
+ default: Z(() => [
781
+ E($(we), {
782
+ "min-size": "15",
783
+ size: $(g)[0],
784
+ class: "flex flex-col"
785
+ }, {
786
+ default: Z(() => [
787
+ f("ol", Gt, [
788
+ (y(!0), w(te, null, de(u.value, (_) => (y(), w("li", {
789
+ key: _.id
790
+ }, [
791
+ E(P, { entry: _ }, null, 8, ["entry"])
792
+ ]))), 128))
793
+ ])
794
+ ]),
795
+ _: 1
796
+ }, 8, ["size"]),
797
+ E($(we), {
798
+ "min-size": "30",
799
+ size: $(g)[1],
800
+ class: "flex flex-col"
801
+ }, {
802
+ default: Z(() => [
803
+ E(M)
804
+ ]),
805
+ _: 1
806
+ }, 8, ["size"])
807
+ ]),
808
+ _: 1
809
+ }, 8, ["horizontal"])
810
+ ]);
811
+ };
812
+ }
813
+ });
814
+ export {
815
+ sn as default
816
+ };
817
+ //# sourceMappingURL=queries-DPJvb6qB.js.map