@websublime/vite-plugin-open-api-devtools 0.8.5 → 0.9.0-next.1

package/dist/TimelinePage-D_GD3OjL.js

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