@websublime/vite-plugin-open-api-devtools 0.4.0

package/dist/TimelinePage-CMchXIlE.js

@@ -0,0 +1,847 @@
+import { ref as T, computed as v, defineComponent as ue, createElementBlock as u, openBlock as o, createVNode as x, createElementVNode as e, unref as a, normalizeClass as R, toDisplayString as c, createCommentVNode as k, createTextVNode as A, createBlock as $, resolveDynamicComponent as S, withDirectives as V, Fragment as M, renderList as j, vShow as W, withModifiers as me, onMounted as pe, onUnmounted as he, watch as ge } from "vue";
+import { g as fe, C as N, a as Z, S as ye, X as _e, F as be, b as xe } from "./format-CE7KDbll.js";
+import { c as de, C as P, Z as ve, _ as ce, u as ke } from "./main-AUiFaD93.js";
+import { T as qe, a as Ce } from "./triangle-alert-ZH4fYFnz.js";
+import { defineStore as $e } from "pinia";
+const oe = de("check", [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]]);
+const Se = de("circle-check-big", [
+  ["path", { d: "M21.801 10A10 10 0 1 1 17 3.335", key: "yps3ct" }],
+  ["path", { d: "m9 11 3 3L22 4", key: "1pflzl" }]
+]);
+const re = de("copy", [
+  ["rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2", key: "17jyea" }],
+  ["path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2", key: "zix9uf" }]
+]), Te = $e("timeline", () => {
+  const n = T([]), s = T(!1), r = T(null), d = T({
+    methods: [],
+    statusCodes: [],
+    searchQuery: "",
+    simulatedOnly: null
+  }), q = T(null), g = T(500), p = /* @__PURE__ */ new Map();
+  function z(t) {
+    return t < 200 ? "1xx" : t < 300 ? "2xx" : t < 400 ? "3xx" : t < 500 ? "4xx" : "5xx";
+  }
+  const H = v(() => {
+    let t = n.value;
+    if (d.value.searchQuery.trim()) {
+      const i = d.value.searchQuery.toLowerCase().trim();
+      t = t.filter((m) => m.request.path.toLowerCase().includes(i) || m.request.operationId.toLowerCase().includes(i));
+    }
+    return d.value.methods.length > 0 && (t = t.filter(
+      (i) => d.value.methods.includes(i.request.method.toUpperCase())
+    )), d.value.statusCodes.length > 0 && (t = t.filter((i) => {
+      if (i.status === null) return !1;
+      const m = z(i.status);
+      return d.value.statusCodes.includes(m);
+    })), d.value.simulatedOnly !== null && (t = t.filter((i) => i.simulated === d.value.simulatedOnly)), t;
+  }), B = v(() => q.value ? n.value.find((t) => t.id === q.value) ?? null : null), Q = v(() => n.value.length), O = v(() => n.value.filter((t) => t.response !== null).length), D = v(() => n.value.filter((t) => t.response === null).length), w = v(() => {
+    const t = {
+      "1xx": 0,
+      "2xx": 0,
+      "3xx": 0,
+      "4xx": 0,
+      "5xx": 0
+    };
+    for (const i of n.value)
+      if (i.status !== null) {
+        const m = z(i.status);
+        t[m]++;
+      }
+    return t;
+  }), L = v(() => {
+    const t = n.value.filter((m) => m.duration !== null);
+    if (t.length === 0) return 0;
+    const i = t.reduce((m, E) => m + (E.duration ?? 0), 0);
+    return Math.round(i / t.length);
+  });
+  function U(t) {
+    const i = {
+      id: t.id,
+      request: t,
+      response: null,
+      status: null,
+      duration: null,
+      simulated: !1
+    }, m = p.get(t.id);
+    m && (l(i, m), p.delete(t.id)), n.value.unshift(i), n.value.length > g.value && (n.value = n.value.slice(0, g.value));
+  }
+  function b(t) {
+    const i = n.value.find((m) => m.id === t.requestId);
+    if (i)
+      l(i, t), p.delete(t.requestId);
+    else if (p.set(t.requestId, t), p.size > 100) {
+      const m = f(t);
+      n.value.unshift(m), p.delete(t.requestId), n.value.length > g.value && (n.value = n.value.slice(0, g.value));
+    }
+  }
+  function l(t, i) {
+    t.response = i, t.status = i.status, t.duration = i.duration, t.simulated = i.simulated;
+  }
+  function f(t) {
+    const i = {
+      id: t.requestId,
+      method: "UNKNOWN",
+      path: "/unknown",
+      operationId: "unknown",
+      timestamp: Date.now(),
+      // Use current time as fallback
+      headers: {},
+      query: {},
+      body: void 0
+    };
+    return {
+      id: t.requestId,
+      request: i,
+      response: t,
+      status: t.status,
+      duration: t.duration,
+      simulated: t.simulated
+    };
+  }
+  function C(t) {
+    for (const [i, m] of p) {
+      const E = t.get(i);
+      E ? (l(E, m), p.delete(i)) : (t.set(i, f(m)), p.delete(i));
+    }
+  }
+  function se(t, i) {
+    for (const [m, E] of i) {
+      const I = t.get(m);
+      I ? l(I, E) : p.set(m, E);
+    }
+  }
+  function ne(t) {
+    for (const [i, m] of p)
+      t.has(i) || (t.set(i, f(m)), p.delete(i));
+  }
+  function ie(t) {
+    const i = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map();
+    for (const I of t.entries)
+      if (I.type === "request") {
+        const F = I.data;
+        i.set(F.id, {
+          id: F.id,
+          request: F,
+          response: null,
+          status: null,
+          duration: null,
+          simulated: !1
+        });
+      } else if (I.type === "response") {
+        const F = I.data;
+        m.set(F.requestId, F);
+      }
+    C(i), se(i, m), ne(i);
+    const E = Array.from(i.values()).sort(
+      (I, F) => F.request.timestamp - I.request.timestamp
+    );
+    n.value = E.slice(0, g.value), r.value = null;
+  }
+  function G() {
+    n.value = [], q.value = null, p.clear();
+  }
+  function le(t) {
+    s.value = t;
+  }
+  function J(t) {
+    r.value = t, s.value = !1;
+  }
+  function K() {
+    r.value = null;
+  }
+  function X(t) {
+    d.value.searchQuery = t;
+  }
+  function Y(t) {
+    const i = d.value.methods.indexOf(t);
+    i === -1 ? d.value.methods.push(t) : d.value.methods.splice(i, 1);
+  }
+  function ee(t) {
+    const i = d.value.statusCodes.indexOf(t);
+    i === -1 ? d.value.statusCodes.push(t) : d.value.statusCodes.splice(i, 1);
+  }
+  function te(t) {
+    d.value.simulatedOnly = t;
+  }
+  function y() {
+    d.value = {
+      methods: [],
+      statusCodes: [],
+      searchQuery: "",
+      simulatedOnly: null
+    };
+  }
+  function _() {
+    return d.value.searchQuery.trim() !== "" || d.value.methods.length > 0 || d.value.statusCodes.length > 0 || d.value.simulatedOnly !== null;
+  }
+  function h(t) {
+    q.value = t;
+  }
+  function ae(t) {
+    const i = Math.max(1, t);
+    g.value = i, n.value.length > i && (n.value = n.value.slice(0, i));
+  }
+  return {
+    // State
+    entries: n,
+    isLoading: s,
+    error: r,
+    filter: d,
+    selectedEntryId: q,
+    maxEntries: g,
+    // Getters
+    filteredEntries: H,
+    selectedEntry: B,
+    totalCount: Q,
+    completedCount: O,
+    pendingCount: D,
+    statusCounts: w,
+    averageDuration: L,
+    // Actions
+    addRequest: U,
+    addResponse: b,
+    setTimelineData: ie,
+    clearTimeline: G,
+    setLoading: le,
+    setError: J,
+    clearError: K,
+    setSearchQuery: X,
+    toggleMethodFilter: Y,
+    toggleStatusFilter: ee,
+    setSimulatedFilter: te,
+    clearFilters: y,
+    hasActiveFilters: _,
+    selectEntry: h,
+    setMaxEntries: ae
+  };
+}), Be = { class: "timeline-detail" }, we = {
+  key: 0,
+  class: "timeline-detail__empty"
+}, Ee = {
+  key: 1,
+  class: "timeline-detail__content"
+}, Ie = { class: "timeline-detail__header" }, Re = { class: "timeline-detail__summary" }, ze = { class: "timeline-detail__path font-mono" }, Oe = { class: "timeline-detail__meta" }, De = {
+  key: 1,
+  class: "status-badge status-badge--pending"
+}, Fe = { class: "timeline-detail__duration" }, He = {
+  key: 2,
+  class: "timeline-detail__simulated",
+  title: "Simulated response"
+}, Qe = { class: "timeline-detail__actions" }, Le = { class: "timeline-detail__info" }, Me = { class: "timeline-detail__info-item" }, Ae = { class: "timeline-detail__info-value font-mono" }, Ne = { class: "timeline-detail__info-item" }, je = { class: "timeline-detail__info-value font-mono" }, Pe = { class: "timeline-detail__info-item" }, Ue = { class: "timeline-detail__info-value font-mono" }, Je = { class: "timeline-detail__section" }, Ve = {
+  key: 0,
+  class: "timeline-detail__subsection"
+}, We = ["aria-expanded"], Ze = { class: "text-muted" }, Ge = {
+  id: "requestQuery-panel",
+  class: "timeline-detail__subsection-content"
+}, Ke = { class: "timeline-detail__kv-key font-mono" }, Xe = { class: "timeline-detail__kv-value font-mono" }, Ye = {
+  key: 1,
+  class: "timeline-detail__subsection"
+}, et = ["aria-expanded"], tt = { class: "text-muted" }, st = {
+  id: "requestHeaders-panel",
+  class: "timeline-detail__subsection-content"
+}, nt = { class: "timeline-detail__kv-key font-mono" }, it = { class: "timeline-detail__kv-value font-mono" }, lt = {
+  key: 2,
+  class: "timeline-detail__subsection"
+}, at = {
+  class: "timeline-detail__subsection-header",
+  role: "group"
+}, ot = ["aria-expanded"], rt = {
+  id: "requestBody-panel",
+  class: "timeline-detail__subsection-content"
+}, ut = { class: "timeline-detail__json" }, dt = {
+  key: 0,
+  class: "timeline-detail__section"
+}, ct = {
+  key: 0,
+  class: "timeline-detail__subsection"
+}, mt = ["aria-expanded"], yt = { class: "text-muted" }, _t = {
+  id: "responseHeaders-panel",
+  class: "timeline-detail__subsection-content"
+}, ft = { class: "timeline-detail__kv-key font-mono" }, vt = { class: "timeline-detail__kv-value font-mono" }, pt = {
+  key: 1,
+  class: "timeline-detail__subsection"
+}, ht = {
+  class: "timeline-detail__subsection-header",
+  role: "group"
+}, gt = ["aria-expanded"], bt = {
+  id: "responseBody-panel",
+  class: "timeline-detail__subsection-content"
+}, xt = { class: "timeline-detail__json" }, kt = {
+  key: 1,
+  class: "timeline-detail__section timeline-detail__section--pending"
+}, qt = { class: "timeline-detail__pending" }, Ct = /* @__PURE__ */ ue({
+  __name: "TimelineDetail",
+  props: {
+    entry: {}
+  },
+  setup(n) {
+    const s = n, r = T({
+      requestHeaders: !0,
+      requestQuery: !0,
+      requestBody: !0,
+      responseHeaders: !0,
+      responseBody: !0
+    }), d = T(null), q = v(() => s.entry ? new Date(s.entry.request.timestamp).toLocaleString("en-US", {
+      year: "numeric",
+      month: "short",
+      day: "numeric",
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit",
+      fractionalSecondDigits: 3,
+      hour12: !1
+    }) : ""), g = v(() => s.entry?.duration == null ? "pending..." : s.entry.duration < 1e3 ? `${s.entry.duration}ms` : `${(s.entry.duration / 1e3).toFixed(2)}s`), p = v(() => s.entry?.status ? s.entry.status < 200 ? "status-badge--1xx" : s.entry.status < 300 ? "status-badge--2xx" : s.entry.status < 400 ? "status-badge--3xx" : s.entry.status < 500 ? "status-badge--4xx" : "status-badge--5xx" : "status-badge--pending"), z = v(() => s.entry?.request.query ? Object.keys(s.entry.request.query).length > 0 : !1), H = v(() => s.entry?.request.headers ? Object.keys(s.entry.request.headers).length > 0 : !1), B = v(() => s.entry?.request.body !== void 0 && s.entry?.request.body !== null), Q = v(() => s.entry?.response?.headers ? Object.keys(s.entry.response.headers).length > 0 : !1), O = v(() => s.entry?.response?.body !== void 0 && s.entry?.response?.body !== null);
+    function D(b) {
+      try {
+        return JSON.stringify(b, null, 2);
+      } catch {
+        return String(b);
+      }
+    }
+    function w(b) {
+      r.value[b] = !r.value[b];
+    }
+    async function L(b, l) {
+      try {
+        await navigator.clipboard.writeText(b), d.value = l, setTimeout(() => {
+          d.value = null;
+        }, 2e3);
+      } catch (f) {
+        console.error("Failed to copy:", f);
+      }
+    }
+    async function U() {
+      if (!s.entry) return;
+      const b = {
+        request: s.entry.request,
+        response: s.entry.response
+      };
+      await L(JSON.stringify(b, null, 2), "full");
+    }
+    return (b, l) => (o(), u("div", Be, [
+      n.entry ? (o(), u("div", Ee, [
+        e("div", Ie, [
+          e("div", Re, [
+            e("span", {
+              class: R(["method-badge", `method-badge--${n.entry.request.method.toLowerCase()}`])
+            }, c(a(fe)(n.entry.request.method)), 3),
+            e("span", ze, c(n.entry.request.path), 1)
+          ]),
+          e("div", Oe, [
+            n.entry.status !== null ? (o(), u("span", {
+              key: 0,
+              class: R(["status-badge", p.value])
+            }, c(n.entry.status), 3)) : (o(), u("span", De, "pending")),
+            e("span", Fe, [
+              x(a(P), { size: 14 }),
+              A(" " + c(g.value), 1)
+            ]),
+            n.entry.simulated ? (o(), u("span", He, [
+              x(a(ve), { size: 14 }),
+              l[9] || (l[9] = A(" Simulated ", -1))
+            ])) : k("", !0)
+          ]),
+          e("div", Qe, [
+            e("button", {
+              type: "button",
+              class: "btn btn--ghost btn--sm",
+              title: "Copy as JSON",
+              onClick: U
+            }, [
+              (o(), $(S(d.value === "full" ? a(oe) : a(re)), { size: 14 })),
+              A(" " + c(d.value === "full" ? "Copied!" : "Copy JSON"), 1)
+            ])
+          ])
+        ]),
+        e("div", Le, [
+          e("div", Me, [
+            l[10] || (l[10] = e("span", { class: "timeline-detail__info-label" }, "Timestamp", -1)),
+            e("span", Ae, c(q.value), 1)
+          ]),
+          e("div", Ne, [
+            l[11] || (l[11] = e("span", { class: "timeline-detail__info-label" }, "Operation ID", -1)),
+            e("span", je, c(n.entry.request.operationId), 1)
+          ]),
+          e("div", Pe, [
+            l[12] || (l[12] = e("span", { class: "timeline-detail__info-label" }, "Request ID", -1)),
+            e("span", Ue, c(n.entry.id), 1)
+          ])
+        ]),
+        e("div", Je, [
+          l[16] || (l[16] = e("h3", { class: "timeline-detail__section-title" }, "Request", -1)),
+          z.value ? (o(), u("div", Ve, [
+            e("button", {
+              type: "button",
+              class: "timeline-detail__subsection-header",
+              "aria-expanded": r.value.requestQuery,
+              "aria-controls": "requestQuery-panel",
+              onClick: l[0] || (l[0] = (f) => w("requestQuery"))
+            }, [
+              (o(), $(S(r.value.requestQuery ? a(N) : a(Z)), { size: 16 })),
+              l[13] || (l[13] = e("span", null, "Query Parameters", -1)),
+              e("span", Ze, "(" + c(Object.keys(n.entry.request.query).length) + ")", 1)
+            ], 8, We),
+            V(e("div", Ge, [
+              (o(!0), u(M, null, j(n.entry.request.query, (f, C) => (o(), u("div", {
+                key: C,
+                class: "timeline-detail__kv-row"
+              }, [
+                e("span", Ke, c(C), 1),
+                e("span", Xe, c(Array.isArray(f) ? f.join(", ") : f), 1)
+              ]))), 128))
+            ], 512), [
+              [W, r.value.requestQuery]
+            ])
+          ])) : k("", !0),
+          H.value ? (o(), u("div", Ye, [
+            e("button", {
+              type: "button",
+              class: "timeline-detail__subsection-header",
+              "aria-expanded": r.value.requestHeaders,
+              "aria-controls": "requestHeaders-panel",
+              onClick: l[1] || (l[1] = (f) => w("requestHeaders"))
+            }, [
+              (o(), $(S(r.value.requestHeaders ? a(N) : a(Z)), { size: 16 })),
+              l[14] || (l[14] = e("span", null, "Headers", -1)),
+              e("span", tt, "(" + c(Object.keys(n.entry.request.headers).length) + ")", 1)
+            ], 8, et),
+            V(e("div", st, [
+              (o(!0), u(M, null, j(n.entry.request.headers, (f, C) => (o(), u("div", {
+                key: C,
+                class: "timeline-detail__kv-row"
+              }, [
+                e("span", nt, c(C), 1),
+                e("span", it, c(f), 1)
+              ]))), 128))
+            ], 512), [
+              [W, r.value.requestHeaders]
+            ])
+          ])) : k("", !0),
+          B.value ? (o(), u("div", lt, [
+            e("div", at, [
+              e("button", {
+                type: "button",
+                class: "timeline-detail__subsection-toggle",
+                "aria-expanded": r.value.requestBody,
+                "aria-controls": "requestBody-panel",
+                onClick: l[2] || (l[2] = (f) => w("requestBody"))
+              }, [
+                (o(), $(S(r.value.requestBody ? a(N) : a(Z)), { size: 16 })),
+                l[15] || (l[15] = e("span", null, "Body", -1))
+              ], 8, ot),
+              e("button", {
+                type: "button",
+                class: "btn btn--ghost btn--icon btn--sm",
+                title: "Copy body",
+                onClick: l[3] || (l[3] = me((f) => L(D(n.entry.request.body), "reqBody"), ["stop"]))
+              }, [
+                (o(), $(S(d.value === "reqBody" ? a(oe) : a(re)), { size: 12 }))
+              ])
+            ]),
+            V(e("div", rt, [
+              e("pre", ut, c(D(n.entry.request.body)), 1)
+            ], 512), [
+              [W, r.value.requestBody]
+            ])
+          ])) : k("", !0)
+        ]),
+        n.entry.response ? (o(), u("div", dt, [
+          l[19] || (l[19] = e("h3", { class: "timeline-detail__section-title" }, "Response", -1)),
+          Q.value ? (o(), u("div", ct, [
+            e("button", {
+              type: "button",
+              class: "timeline-detail__subsection-header",
+              "aria-expanded": r.value.responseHeaders,
+              "aria-controls": "responseHeaders-panel",
+              onClick: l[4] || (l[4] = (f) => w("responseHeaders"))
+            }, [
+              (o(), $(S(r.value.responseHeaders ? a(N) : a(Z)), { size: 16 })),
+              l[17] || (l[17] = e("span", null, "Headers", -1)),
+              e("span", yt, "(" + c(Object.keys(n.entry.response.headers).length) + ")", 1)
+            ], 8, mt),
+            V(e("div", _t, [
+              (o(!0), u(M, null, j(n.entry.response.headers, (f, C) => (o(), u("div", {
+                key: C,
+                class: "timeline-detail__kv-row"
+              }, [
+                e("span", ft, c(C), 1),
+                e("span", vt, c(f), 1)
+              ]))), 128))
+            ], 512), [
+              [W, r.value.responseHeaders]
+            ])
+          ])) : k("", !0),
+          O.value ? (o(), u("div", pt, [
+            e("div", ht, [
+              e("button", {
+                type: "button",
+                class: "timeline-detail__subsection-toggle",
+                "aria-expanded": r.value.responseBody,
+                "aria-controls": "responseBody-panel",
+                onClick: l[5] || (l[5] = (f) => w("responseBody"))
+              }, [
+                (o(), $(S(r.value.responseBody ? a(N) : a(Z)), { size: 16 })),
+                l[18] || (l[18] = e("span", null, "Body", -1))
+              ], 8, gt),
+              e("button", {
+                type: "button",
+                class: "btn btn--ghost btn--icon btn--sm",
+                title: "Copy body",
+                onClick: l[6] || (l[6] = me((f) => L(D(n.entry.response.body), "resBody"), ["stop"]))
+              }, [
+                (o(), $(S(d.value === "resBody" ? a(oe) : a(re)), { size: 12 }))
+              ])
+            ]),
+            V(e("div", bt, [
+              e("pre", xt, c(D(n.entry.response.body)), 1)
+            ], 512), [
+              [W, r.value.responseBody]
+            ])
+          ])) : k("", !0)
+        ])) : (o(), u("div", kt, [
+          l[21] || (l[21] = e("h3", { class: "timeline-detail__section-title" }, "Response", -1)),
+          e("div", qt, [
+            x(a(P), {
+              size: 24,
+              class: "timeline-detail__pending-icon"
+            }),
+            l[20] || (l[20] = e("span", { class: "text-muted" }, "Waiting for response...", -1))
+          ])
+        ]))
+      ])) : (o(), u("div", we, [
+        x(a(P), {
+          size: 48,
+          class: "timeline-detail__empty-icon"
+        }),
+        l[7] || (l[7] = e("h3", { class: "timeline-detail__empty-title" }, "Select an entry", -1)),
+        l[8] || (l[8] = e("p", { class: "timeline-detail__empty-description" }, " Click on a timeline entry to view its details. ", -1))
+      ]))
+    ]));
+  }
+}), $t = /* @__PURE__ */ ce(Ct, [["__scopeId", "data-v-b4bdd2d2"]]), St = { class: "timeline-entry__time font-mono text-muted" }, Tt = { class: "timeline-entry__method" }, Bt = { class: "timeline-entry__path font-mono" }, wt = { class: "timeline-entry__status" }, Et = {
+  key: 1,
+  class: "status-badge status-badge--pending"
+}, It = { class: "timeline-entry__duration font-mono text-muted" }, Rt = {
+  key: 0,
+  class: "timeline-entry__simulated",
+  title: "Simulated response"
+}, zt = /* @__PURE__ */ ue({
+  __name: "TimelineEntry",
+  props: {
+    entry: {},
+    isSelected: { type: Boolean, default: !1 }
+  },
+  emits: ["select"],
+  setup(n, { emit: s }) {
+    const r = n, d = s, q = v(() => new Date(r.entry.request.timestamp).toLocaleTimeString("en-US", {
+      hour12: !1,
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit",
+      fractionalSecondDigits: 3
+    })), g = v(() => r.entry.duration === null ? "pending..." : r.entry.duration < 1e3 ? `${r.entry.duration}ms` : `${(r.entry.duration / 1e3).toFixed(2)}s`), p = v(() => r.entry.status === null ? "status-badge--pending" : r.entry.status < 200 ? "status-badge--1xx" : r.entry.status < 300 ? "status-badge--2xx" : r.entry.status < 400 ? "status-badge--3xx" : r.entry.status < 500 ? "status-badge--4xx" : "status-badge--5xx"), z = v(() => r.entry.status === null ? P : r.entry.status < 400 ? Se : qe), H = v(() => r.entry.response === null);
+    function B() {
+      d("select", r.entry.id);
+    }
+    return (Q, O) => (o(), u("button", {
+      type: "button",
+      class: R([
+        "timeline-entry",
+        { "timeline-entry--selected": n.isSelected },
+        { "timeline-entry--pending": H.value },
+        { "timeline-entry--simulated": n.entry.simulated }
+      ]),
+      onClick: B
+    }, [
+      e("div", St, c(q.value), 1),
+      e("div", Tt, [
+        e("span", {
+          class: R(["method-badge", `method-badge--${n.entry.request.method.toLowerCase()}`])
+        }, c(a(fe)(n.entry.request.method)), 3)
+      ]),
+      e("div", Bt, c(n.entry.request.path), 1),
+      e("div", wt, [
+        n.entry.status !== null ? (o(), u("span", {
+          key: 0,
+          class: R(["status-badge", p.value])
+        }, [
+          (o(), $(S(z.value), { size: 12 })),
+          A(" " + c(n.entry.status), 1)
+        ], 2)) : (o(), u("span", Et, [
+          x(a(P), { size: 12 }),
+          O[0] || (O[0] = A(" pending ", -1))
+        ]))
+      ]),
+      e("div", It, c(g.value), 1),
+      n.entry.simulated ? (o(), u("div", Rt, [
+        x(a(ve), { size: 14 })
+      ])) : k("", !0)
+    ], 2));
+  }
+}), Ot = /* @__PURE__ */ ce(zt, [["__scopeId", "data-v-a073dbdf"]]), Dt = { class: "timeline-page" }, Ft = { class: "timeline-toolbar" }, Ht = { class: "timeline-search" }, Qt = ["value"], Lt = ["aria-expanded"], Mt = {
+  key: 0,
+  class: "timeline-filter-toggle__badge"
+}, At = { class: "timeline-stats" }, Nt = { class: "timeline-stats__item" }, jt = {
+  key: 0,
+  class: "timeline-stats__separator"
+}, Pt = {
+  key: 1,
+  class: "timeline-stats__item"
+}, Ut = ["disabled"], Jt = {
+  key: 0,
+  class: "timeline-filters"
+}, Vt = { class: "timeline-filters__section" }, Wt = { class: "timeline-filters__methods" }, Zt = ["onClick"], Gt = { class: "timeline-filters__section" }, Kt = { class: "timeline-filters__status" }, Xt = ["onClick"], Yt = { class: "timeline-filters__status-count" }, es = { class: "timeline-filters__section" }, ts = { class: "timeline-filters__type" }, ss = {
+  key: 0,
+  class: "timeline-filters__actions"
+}, ns = { class: "timeline-content" }, is = {
+  key: 0,
+  class: "timeline-loading"
+}, ls = {
+  key: 1,
+  class: "timeline-error"
+}, as = { class: "timeline-error__message" }, os = {
+  key: 2,
+  class: "timeline-empty empty-state"
+}, rs = {
+  key: 3,
+  class: "timeline-empty empty-state"
+}, us = { class: "timeline-list-panel" }, ds = { class: "timeline-list" }, cs = { class: "timeline-detail-panel" }, ms = /* @__PURE__ */ ue({
+  __name: "TimelinePage",
+  setup(n) {
+    const s = Te(), { send: r, on: d, connected: q } = ke(), g = T(!1), p = T(null), z = [
+      "GET",
+      "POST",
+      "PUT",
+      "PATCH",
+      "DELETE",
+      "OPTIONS",
+      "HEAD",
+      "TRACE"
+    ], H = ["2xx", "3xx", "4xx", "5xx"];
+    function B() {
+      q.value && (s.setLoading(!0), r({ type: "get:timeline" }));
+    }
+    function Q(y) {
+      s.setTimelineData(y), s.setLoading(!1);
+    }
+    function O(y) {
+      s.addRequest(y);
+    }
+    function D(y) {
+      s.addResponse(y);
+    }
+    function w() {
+      s.clearTimeline();
+    }
+    function L() {
+      r({ type: "clear:timeline" }), s.clearTimeline();
+    }
+    function U(y) {
+      s.selectEntry(y);
+    }
+    function b(y) {
+      const _ = y.target;
+      s.setSearchQuery(_.value);
+    }
+    function l() {
+      s.setSearchQuery(""), p.value?.focus();
+    }
+    function f(y) {
+      s.toggleMethodFilter(y);
+    }
+    function C(y) {
+      return s.filter.methods.includes(y);
+    }
+    function se(y) {
+      s.toggleStatusFilter(y);
+    }
+    function ne(y) {
+      return s.filter.statusCodes.includes(y);
+    }
+    function ie() {
+      const y = s.filter.simulatedOnly;
+      s.setSimulatedFilter(y === !0 ? null : !0);
+    }
+    function G() {
+      s.clearFilters();
+    }
+    function le() {
+      g.value = !g.value;
+    }
+    const J = v(() => s.hasActiveFilters()), K = v(() => s.filter.methods.length + s.filter.statusCodes.length + (s.filter.simulatedOnly !== null ? 1 : 0));
+    let X = null, Y = null, ee = null, te = null;
+    return pe(() => {
+      X = d("timeline", Q), Y = d("request", O), ee = d("response", D), te = d("timeline:cleared", w), q.value && B();
+    }), he(() => {
+      X?.(), Y?.(), ee?.(), te?.();
+    }), ge(q, (y) => {
+      y && B();
+    }), (y, _) => (o(), u("div", Dt, [
+      e("div", Ft, [
+        e("div", Ht, [
+          x(a(ye), {
+            size: 16,
+            class: "timeline-search__icon"
+          }),
+          e("input", {
+            ref_key: "searchInputRef",
+            ref: p,
+            type: "text",
+            class: "timeline-search__input input",
+            placeholder: "Search by path or operation...",
+            value: a(s).filter.searchQuery,
+            onInput: b
+          }, null, 40, Qt),
+          a(s).filter.searchQuery ? (o(), u("button", {
+            key: 0,
+            type: "button",
+            class: "timeline-search__clear btn btn--ghost btn--icon",
+            title: "Clear search",
+            onClick: l
+          }, [
+            x(a(_e), { size: 14 })
+          ])) : k("", !0)
+        ]),
+        e("button", {
+          type: "button",
+          class: R([
+            "timeline-filter-toggle btn btn--secondary",
+            { "timeline-filter-toggle--active": J.value }
+          ]),
+          "aria-expanded": g.value,
+          onClick: le
+        }, [
+          x(a(be), { size: 16 }),
+          _[0] || (_[0] = e("span", null, "Filters", -1)),
+          K.value > 0 ? (o(), u("span", Mt, c(K.value), 1)) : k("", !0),
+          (o(), $(S(g.value ? a(xe) : a(N)), { size: 14 }))
+        ], 10, Lt),
+        e("div", At, [
+          e("span", Nt, c(a(s).filteredEntries.length) + " requests ", 1),
+          a(s).averageDuration > 0 ? (o(), u("span", jt, "|")) : k("", !0),
+          a(s).averageDuration > 0 ? (o(), u("span", Pt, " avg " + c(a(s).averageDuration) + "ms ", 1)) : k("", !0)
+        ]),
+        e("button", {
+          type: "button",
+          class: "btn btn--secondary btn--icon",
+          title: "Clear timeline",
+          disabled: a(s).entries.length === 0,
+          onClick: L
+        }, [
+          x(a(Ce), { size: 16 })
+        ], 8, Ut)
+      ]),
+      g.value ? (o(), u("div", Jt, [
+        e("div", Vt, [
+          _[1] || (_[1] = e("h4", { class: "timeline-filters__title" }, "Methods", -1)),
+          e("div", Wt, [
+            (o(), u(M, null, j(z, (h) => e("button", {
+              key: h,
+              type: "button",
+              class: R([
+                "method-badge",
+                `method-badge--${h.toLowerCase()}`,
+                { "method-badge--inactive": !C(h) && a(s).filter.methods.length > 0 }
+              ]),
+              onClick: (ae) => f(h)
+            }, c(h), 11, Zt)), 64))
+          ])
+        ]),
+        e("div", Gt, [
+          _[2] || (_[2] = e("h4", { class: "timeline-filters__title" }, "Status", -1)),
+          e("div", Kt, [
+            (o(), u(M, null, j(H, (h) => e("button", {
+              key: h,
+              type: "button",
+              class: R([
+                "timeline-filters__status-btn",
+                `timeline-filters__status-btn--${h}`,
+                { "timeline-filters__status-btn--active": ne(h) }
+              ]),
+              onClick: (ae) => se(h)
+            }, [
+              A(c(h) + " ", 1),
+              e("span", Yt, " (" + c(a(s).statusCounts[h]) + ") ", 1)
+            ], 10, Xt)), 64))
+          ])
+        ]),
+        e("div", es, [
+          _[3] || (_[3] = e("h4", { class: "timeline-filters__title" }, "Type", -1)),
+          e("div", ts, [
+            e("button", {
+              type: "button",
+              class: R([
+                "timeline-filters__status-btn",
+                { "timeline-filters__status-btn--active": a(s).filter.simulatedOnly }
+              ]),
+              onClick: ie
+            }, " Simulated only ", 2)
+          ])
+        ]),
+        J.value ? (o(), u("div", ss, [
+          e("button", {
+            type: "button",
+            class: "btn btn--ghost",
+            onClick: G
+          }, [
+            x(a(_e), { size: 14 }),
+            _[4] || (_[4] = A(" Clear all filters ", -1))
+          ])
+        ])) : k("", !0)
+      ])) : k("", !0),
+      e("div", ns, [
+        a(s).isLoading ? (o(), u("div", is, [..._[5] || (_[5] = [
+          e("div", { class: "timeline-loading__spinner" }, null, -1),
+          e("span", { class: "text-muted" }, "Loading timeline...", -1)
+        ])])) : a(s).error ? (o(), u("div", ls, [
+          e("p", as, c(a(s).error), 1),
+          e("button", {
+            type: "button",
+            class: "btn btn--primary",
+            onClick: B
+          }, " Retry ")
+        ])) : a(s).entries.length === 0 ? (o(), u("div", os, [
+          x(a(P), {
+            size: 48,
+            class: "empty-state__icon"
+          }),
+          _[6] || (_[6] = e("h3", { class: "empty-state__title" }, "No requests yet", -1)),
+          _[7] || (_[7] = e("p", { class: "empty-state__description" }, " API requests will appear here in real-time as they are made. ", -1))
+        ])) : a(s).filteredEntries.length === 0 ? (o(), u("div", rs, [
+          x(a(ye), {
+            size: 48,
+            class: "empty-state__icon"
+          }),
+          _[8] || (_[8] = e("h3", { class: "empty-state__title" }, "No matching requests", -1)),
+          _[9] || (_[9] = e("p", { class: "empty-state__description" }, " Try adjusting your search or filters. ", -1)),
+          J.value ? (o(), u("button", {
+            key: 0,
+            type: "button",
+            class: "btn btn--secondary",
+            onClick: G
+          }, " Clear filters ")) : k("", !0)
+        ])) : (o(), u(M, { key: 4 }, [
+          e("div", us, [
+            e("div", ds, [
+              (o(!0), u(M, null, j(a(s).filteredEntries, (h) => (o(), $(Ot, {
+                key: h.id,
+                entry: h,
+                "is-selected": a(s).selectedEntryId === h.id,
+                onSelect: U
+              }, null, 8, ["entry", "is-selected"]))), 128))
+            ])
+          ]),
+          e("div", cs, [
+            x($t, {
+              entry: a(s).selectedEntry
+            }, null, 8, ["entry"])
+          ])
+        ], 64))
+      ])
+    ]));
+  }
+}), hs = /* @__PURE__ */ ce(ms, [["__scopeId", "data-v-a5c73778"]]);
+export {
+  hs as default
+};
+//# sourceMappingURL=TimelinePage-CMchXIlE.js.map