adonisjs-server-stats 1.5.4 → 1.6.2

package/dist/react/index-UdTfSvtO.js

@@ -0,0 +1,1074 @@
+import { jsx as e, jsxs as d, Fragment as H } from "react/jsx-runtime";
+import K, { useState as N, useRef as j, useEffect as R, useCallback as B, useMemo as O, Suspense as F, lazy as T } from "react";
+import { DEFAULT_FEATURES as G, detectFeatures as Q, ServerStatsController as X, getTheme as Y, onThemeChange as Z, toggleTheme as ee, buildSparklineData as se, computeStats as te, formatStatNum as U, detectMetricGroupsFromStats as ne, getVisibleMetricGroups as oe, METRIC_DEFINITIONS as ie, TAB_ICONS as L, DashboardDataController as re, subscribeToChannel as ae, DebugDataController as le, compactPreview as ce } from "adonisjs-server-stats/core";
+import { createPortal as de } from "react-dom";
+function z(s = {}) {
+  const { baseUrl: i = "", debugEndpoint: t = "/admin/api/debug", authToken: n } = s, [a, h] = N(G), [c, r] = N(!0), [g, p] = N(null), m = j(!1);
+  return R(() => {
+    if (m.current) return;
+    m.current = !0;
+    let l = !1;
+    return (async () => {
+      try {
+        const f = await Q({ baseUrl: i, debugEndpoint: t, authToken: n });
+        l || (h(f), r(!1));
+      } catch (f) {
+        l || (p(f instanceof Error ? f : new Error(String(f))), r(!1));
+      }
+    })(), () => {
+      l = !0;
+    };
+  }, [i, t, n]), { features: a, isLoading: c, error: g };
+}
+function ue(s = {}) {
+  const {
+    baseUrl: i = "",
+    endpoint: t = "/admin/api/server-stats",
+    channelName: n = "admin/server-stats",
+    authToken: a,
+    pollInterval: h = 3e3
+  } = s, [c, r] = N(null), [g, p] = N(!1), [m, l] = N(!1), [y, f] = N(null), [b, w] = N(!1), E = j(null);
+  R(() => {
+    if (b) return;
+    const I = new X({
+      baseUrl: i,
+      endpoint: t,
+      channelName: n,
+      authToken: a,
+      pollInterval: h,
+      onStatsUpdate: (C) => r(C),
+      onConnectionChange: (C) => p(C),
+      onStaleChange: (C) => l(C),
+      onError: (C) => f(C),
+      onUnauthorizedChange: (C) => w(C)
+    });
+    return E.current = I, I.start(), () => {
+      I.stop(), E.current = null;
+    };
+  }, [i, n, a, h, b]);
+  const _ = B((I) => E.current?.getHistory(I) ?? [], []);
+  return {
+    stats: c,
+    history: E.current?.getAllHistory() ?? {},
+    getHistory: _,
+    isConnected: g,
+    isStale: m,
+    error: y,
+    unauthorized: b
+  };
+}
+function A() {
+  const [s, i] = N(() => Y());
+  R(() => Z((a) => {
+    i(a);
+  }), []);
+  const t = B(() => {
+    const n = ee();
+    return i(n), n;
+  }, []);
+  return { theme: s, toggleTheme: t };
+}
+function he({
+  data: s,
+  color: i = "#34d399",
+  width: t = 120,
+  height: n = 32,
+  className: a = ""
+}) {
+  const h = O(
+    () => se(s, { width: t, height: n }),
+    [s, t, n]
+  ), c = O(() => "ss-grad-" + Math.random().toString(36).slice(2, 8), []), r = { "--ss-accent": i };
+  if (!h)
+    return /* @__PURE__ */ e("div", { className: `ss-dash-sparkline ${a}`, style: r, children: /* @__PURE__ */ e(
+      "svg",
+      {
+        width: t,
+        height: n,
+        viewBox: `0 0 ${t} ${n}`,
+        style: { display: "block" },
+        children: /* @__PURE__ */ d("text", { x: t / 2, y: n / 2 + 3, textAnchor: "middle", fill: "#737373", fontSize: "9", children: [
+          "collecting",
+          "…"
+        ] })
+      }
+    ) });
+  const g = i || "var(--ss-accent)";
+  return /* @__PURE__ */ e("div", { className: `ss-dash-sparkline ${a}`, style: r, children: /* @__PURE__ */ d(
+    "svg",
+    {
+      width: t,
+      height: n,
+      viewBox: `0 0 ${t} ${n}`,
+      style: { display: "block" },
+      children: [
+        /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ d("linearGradient", { id: c, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+          /* @__PURE__ */ e("stop", { offset: "0%", stopColor: g, stopOpacity: "0.25" }),
+          /* @__PURE__ */ e("stop", { offset: "100%", stopColor: g, stopOpacity: "0.02" })
+        ] }) }),
+        /* @__PURE__ */ e("path", { d: h.areaPath, fill: `url(#${c})` }),
+        /* @__PURE__ */ e(
+          "path",
+          {
+            className: "ss-dash-sparkline-line",
+            d: "M" + h.points.replace(/ /g, " L"),
+            fill: "none",
+            stroke: g,
+            strokeWidth: "1.5",
+            strokeLinejoin: "round",
+            strokeLinecap: "round"
+          }
+        )
+      ]
+    }
+  ) });
+}
+const pe = {
+  "ss-red": "#f87171",
+  "ss-amber": "#fbbf24",
+  "ss-green": "#34d399",
+  "ss-muted": "#737373"
+};
+function me(s, i, t) {
+  const [n, a] = N({
+    position: "absolute",
+    bottom: "100%",
+    left: 0,
+    marginBottom: "10px",
+    zIndex: 180
+  });
+  return R(() => {
+    if (!t) return;
+    const h = () => {
+      const r = s.current, g = i.current;
+      if (!r || !g) return;
+      const p = r.closest(".ss-bar");
+      if (!p) return;
+      const m = r.getBoundingClientRect(), l = p.getBoundingClientRect(), y = m.left - l.left + m.width / 2;
+      a({
+        position: "absolute",
+        bottom: "100%",
+        left: `${y}px`,
+        transform: "translateX(-50%)",
+        marginBottom: "10px",
+        zIndex: 180
+      }), requestAnimationFrame(() => {
+        const f = g.getBoundingClientRect();
+        let b = 0;
+        f.left < 8 ? b = 8 - f.left : f.right > window.innerWidth - 8 && (b = window.innerWidth - 8 - f.right), b && a((w) => ({
+          ...w,
+          transform: `translateX(calc(-50% + ${b}px))`
+        }));
+      });
+    };
+    h();
+    const c = s.current?.closest(".ss-bar-scroll");
+    return c?.addEventListener("scroll", h), window.addEventListener("resize", h), () => {
+      c?.removeEventListener("scroll", h), window.removeEventListener("resize", h);
+    };
+  }, [t, s, i]), n;
+}
+function be({ metric: s, stats: i, history: t, className: n = "" }) {
+  const [a, h] = N(!1), [c, r] = N(!1), g = j(null), p = j(null);
+  if (s.show && !s.show(i))
+    return null;
+  const m = s.value ? s.value(i) : s.format(i), l = s.color ? s.color(i) : "", y = l && pe[l] || "#34d399", f = typeof s.detail == "function" ? s.detail(i) : s.detail, b = O(() => te(t), [t]), w = a || c, E = me(g, p, w), _ = B(($) => {
+    $.stopPropagation(), h((o) => !o);
+  }, []);
+  R(() => {
+    if (!a) return;
+    const $ = (v) => {
+      const x = v.target;
+      g.current && !g.current.contains(x) && p.current && !p.current.contains(x) && h(!1);
+    }, o = (v) => {
+      v.key === "Escape" && h(!1);
+    };
+    return document.addEventListener("click", $), document.addEventListener("keydown", o), () => {
+      document.removeEventListener("click", $), document.removeEventListener("keydown", o);
+    };
+  }, [a]);
+  const I = g.current?.closest(".ss-bar"), C = w && I ? de(
+    /* @__PURE__ */ d(
+      "div",
+      {
+        ref: p,
+        className: `ss-tooltip ${a ? "ss-pinned" : ""}`,
+        style: E,
+        children: [
+          /* @__PURE__ */ d("div", { className: "ss-tooltip-inner", style: { position: "relative" }, children: [
+            a && /* @__PURE__ */ e(
+              "button",
+              {
+                className: "ss-tooltip-close",
+                onClick: ($) => {
+                  $.stopPropagation(), h(!1);
+                },
+                type: "button",
+                children: "×"
+              }
+            ),
+            /* @__PURE__ */ d("div", { className: "ss-tooltip-header", children: [
+              /* @__PURE__ */ e("span", { className: "ss-tooltip-title", children: s.title }),
+              s.unit && /* @__PURE__ */ e("span", { className: "ss-tooltip-unit", children: s.unit })
+            ] }),
+            /* @__PURE__ */ d("div", { className: "ss-tooltip-current", children: [
+              /* @__PURE__ */ e("span", { className: "ss-tooltip-current-label", children: "Current: " }),
+              /* @__PURE__ */ e("span", { className: "ss-tooltip-current-value", children: m })
+            ] }),
+            b && /* @__PURE__ */ d("div", { className: "ss-tooltip-stats", children: [
+              /* @__PURE__ */ d("span", { children: [
+                "Min: ",
+                U(b.min, s.unit)
+              ] }),
+              /* @__PURE__ */ d("span", { children: [
+                "Max: ",
+                U(b.max, s.unit)
+              ] }),
+              /* @__PURE__ */ d("span", { children: [
+                "Avg: ",
+                U(b.avg, s.unit)
+              ] })
+            ] }),
+            f && /* @__PURE__ */ e("div", { className: "ss-tooltip-details", children: f }),
+            t.length > 0 && /* @__PURE__ */ d(H, { children: [
+              /* @__PURE__ */ e("div", { className: "ss-tooltip-sparkline", children: /* @__PURE__ */ e(he, { data: t, color: y }) }),
+              /* @__PURE__ */ d("div", { className: "ss-tooltip-samples", children: [
+                "Last ",
+                Math.min(t.length, 60),
+                " samples (~",
+                Math.round(Math.min(t.length, 60) * 3 / 60),
+                " min)"
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "ss-tooltip-arrow" })
+        ]
+      }
+    ),
+    I
+  ) : null;
+  return /* @__PURE__ */ d(H, { children: [
+    /* @__PURE__ */ d(
+      "div",
+      {
+        ref: g,
+        className: `ss-badge ${a ? "ss-pinned" : ""} ${n}`,
+        onClick: _,
+        onMouseEnter: () => !a && r(!0),
+        onMouseLeave: () => r(!1),
+        role: "button",
+        tabIndex: 0,
+        onKeyDown: ($) => $.key === "Enter" && _($),
+        children: [
+          /* @__PURE__ */ e("span", { className: "ss-label", children: s.label }),
+          /* @__PURE__ */ e("span", { className: `ss-value ${l}`, children: m })
+        ]
+      }
+    ),
+    C
+  ] });
+}
+function We(s) {
+  const {
+    featureOptions: i,
+    autoHideOnUnauthorized: t = !0,
+    onOpenDebugPanel: n,
+    debugPanelOpen: a = !1,
+    onConnectionChange: h,
+    ...c
+  } = s, { stats: r, getHistory: g, isConnected: p, isStale: m, unauthorized: l } = ue(c);
+  R(() => {
+    h?.(p);
+  }, [p, h]);
+  const { features: y } = z(i), { theme: f } = A(), [b, w] = N(() => typeof window > "u" ? !0 : localStorage.getItem("admin:stats-bar") !== "hidden"), E = j(null), _ = j(null);
+  R(() => {
+    t && l && w(!1);
+  }, [t, l]);
+  const I = B(() => {
+    w((v) => {
+      const x = !v;
+      return localStorage.setItem("admin:stats-bar", x ? "visible" : "hidden"), x;
+    });
+  }, []);
+  R(() => {
+    const v = _.current;
+    if (!v) return;
+    const x = (k) => {
+      Math.abs(k.deltaX) > Math.abs(k.deltaY) || (k.preventDefault(), v.scrollLeft += k.deltaY);
+    };
+    return v.addEventListener("wheel", x, { passive: !1 }), () => v.removeEventListener("wheel", x);
+  }, []);
+  const C = O(() => r ? ne(r) : oe(y), [r, y]), $ = O(
+    () => ie.filter((v) => C.has(v.group || "core")),
+    [C]
+  ), o = O(() => {
+    const v = [];
+    let x = "";
+    for (const k of $) {
+      const D = k.group || "core";
+      D !== x && (x = D, v.push({ group: x, metrics: [] })), v[v.length - 1].metrics.push(k);
+    }
+    return v;
+  }, [$]);
+  return t && l ? null : /* @__PURE__ */ d(H, { children: [
+    /* @__PURE__ */ d(
+      "button",
+      {
+        type: "button",
+        className: `ss-toggle ${b ? "ss-visible" : "ss-collapsed"}`,
+        onClick: I,
+        title: b ? "Hide stats bar" : "Show stats bar",
+        "data-ss-theme": f,
+        children: [
+          !b && r && /* @__PURE__ */ d("span", { className: "ss-toggle-summary", style: { display: "flex" }, children: [
+            C.has("process") && /* @__PURE__ */ d(H, { children: [
+              /* @__PURE__ */ d(
+                "span",
+                {
+                  className: `ss-value ${r.cpuPercent > 80 ? "ss-red" : r.cpuPercent > 50 ? "ss-amber" : "ss-green"}`,
+                  children: [
+                    r.cpuPercent.toFixed(0),
+                    "%"
+                  ]
+                }
+              ),
+              /* @__PURE__ */ e("span", { className: "ss-value ss-green", children: r.memHeapUsed !== void 0 ? Math.round(r.memHeapUsed / (1024 * 1024)) + "M" : "-" })
+            ] }),
+            C.has("redis") && r.redisOk !== void 0 && /* @__PURE__ */ e("span", { className: `ss-value ${r.redisOk ? "ss-green" : "ss-red"}`, children: r.redisOk ? "✓" : "✗" })
+          ] }),
+          b && /* @__PURE__ */ e("span", { className: "ss-toggle-label", style: { color: "#737373" }, children: "hide stats" }),
+          /* @__PURE__ */ e("span", { className: "ss-toggle-arrow", children: b ? "▼" : "▲" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ d("div", { ref: E, className: b ? "ss-bar" : "ss-bar ss-hidden", "data-ss-theme": f, children: [
+      /* @__PURE__ */ d("div", { className: "ss-bar-left", children: [
+        n && /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            className: `ss-dbg-btn ${a ? "ss-dbg-active" : ""}`,
+            onClick: n,
+            title: "Toggle debug panel",
+            id: "ss-dbg-wrench",
+            children: /* @__PURE__ */ e(
+              "svg",
+              {
+                width: "14",
+                height: "14",
+                viewBox: L.wrench.viewBox,
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                dangerouslySetInnerHTML: { __html: L.wrench.elements.join("") }
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: m ? "ss-dot ss-stale" : "ss-dot" })
+      ] }),
+      /* @__PURE__ */ e("div", { ref: _, className: "ss-bar-scroll", id: "ss-bar-scroll", children: r && o.map((v, x) => /* @__PURE__ */ d(K.Fragment, { children: [
+        x > 0 && /* @__PURE__ */ e("div", { className: "ss-group-sep" }),
+        /* @__PURE__ */ e("div", { className: "ss-group", children: v.metrics.map((k) => /* @__PURE__ */ e(
+          be,
+          {
+            metric: k,
+            stats: r,
+            history: g(k.historyKey || "")
+          },
+          k.id
+        )) })
+      ] }, v.group)) })
+    ] })
+  ] });
+}
+function J({
+  theme: s,
+  onToggle: i,
+  className: t = "",
+  classPrefix: n = "ss-dash"
+}) {
+  const a = s === "dark";
+  return /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      className: `${n === "ss-dbg" ? "ss-dbg-theme-toggle" : "ss-dash-theme-btn"} ${t}`,
+      onClick: i,
+      title: a ? "Switch to light theme" : "Switch to dark theme",
+      "aria-label": a ? "Switch to light theme" : "Switch to dark theme",
+      children: a ? (
+        // Sun icon
+        /* @__PURE__ */ e(
+          "svg",
+          {
+            width: "16",
+            height: "16",
+            viewBox: L.sun.viewBox,
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            dangerouslySetInnerHTML: { __html: L.sun.elements.join("") }
+          }
+        )
+      ) : (
+        // Moon icon
+        /* @__PURE__ */ e(
+          "svg",
+          {
+            width: "16",
+            height: "16",
+            viewBox: L.moon.viewBox,
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            dangerouslySetInnerHTML: { __html: L.moon.elements.join("") }
+          }
+        )
+      )
+    }
+  );
+}
+const ge = T(() => import("./QueriesTab-fyBB1u_Y.js")), ve = T(() => import("./EventsTab-eCh02cdd.js")), fe = T(() => import("./EmailsTab-Dh2YSa_f.js")), we = T(() => import("./RoutesTab-D3l8TOpu.js")), ke = T(() => import("./LogsTab-D-kR7PjX.js")), Ne = T(() => import("./TimelineTab-C5TFaSmQ.js")), ye = T(() => import("./CacheTab-CnVW5PLs.js")), Ce = T(() => import("./JobsTab-Dl5nrj2z.js")), Se = T(() => import("./ConfigTab-BSWq_o2p.js")), Le = T(() => import("./InternalsTab-Oij0A2fN.js")), Te = T(() => import("./CustomPaneTab-xjkYwTvH.js"));
+function Je(s) {
+  const {
+    defaultOpen: i = !1,
+    dashboardPath: t,
+    isOpen: n,
+    onOpenChange: a,
+    isLive: h = !1,
+    ...c
+  } = s, [r, g] = N(i), p = n !== void 0 ? n : r, m = (o) => {
+    a ? a(o) : g(o);
+  }, [l, y] = N("queries"), { features: f } = z(c), { theme: b, toggleTheme: w } = A(), E = f.customPanes || [];
+  R(() => {
+    const o = (v) => {
+      v.key === "Escape" && p && m(!1);
+    };
+    return document.addEventListener("keydown", o), () => document.removeEventListener("keydown", o);
+  }, [p]);
+  const _ = O(
+    () => [
+      { id: "queries", label: "Queries", visible: !0 },
+      { id: "events", label: "Events", visible: !0 },
+      { id: "emails", label: "Emails", visible: !0 },
+      { id: "routes", label: "Routes", visible: !0 },
+      { id: "logs", label: "Logs", visible: !0 },
+      { id: "timeline", label: "Timeline", visible: f.tracing },
+      { id: "cache", label: "Cache", visible: f.cache },
+      { id: "jobs", label: "Jobs", visible: f.queues },
+      { id: "config", label: "Config", visible: !0 },
+      { id: "internals", label: "Internals", visible: !0 }
+    ],
+    [f]
+  ), I = O(() => _.filter((o) => o.visible), [_]);
+  R(() => {
+    const o = [
+      ...I.map((v) => v.id),
+      ...E.map((v) => v.id)
+    ];
+    !o.includes(l) && o.length > 0 && y(o[0]);
+  }, [I, E, l]);
+  const C = B(() => {
+    m(!p);
+  }, [p]), $ = B(() => {
+    const o = { options: c }, v = E.find((k) => k.id === l);
+    if (v)
+      return /* @__PURE__ */ e(F, { fallback: /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "Loading..." }), children: /* @__PURE__ */ e(Te, { pane: v, options: c }) });
+    const x = {
+      queries: /* @__PURE__ */ e(ge, { ...o }),
+      events: /* @__PURE__ */ e(ve, { ...o }),
+      emails: /* @__PURE__ */ e(fe, { ...o }),
+      routes: /* @__PURE__ */ e(
+        we,
+        {
+          ...o,
+          currentPath: typeof window < "u" ? window.location.pathname : ""
+        }
+      ),
+      logs: /* @__PURE__ */ e(ke, { ...o }),
+      timeline: /* @__PURE__ */ e(Ne, { ...o }),
+      cache: /* @__PURE__ */ e(ye, { ...o, dashboardPath: t }),
+      jobs: /* @__PURE__ */ e(Ce, { ...o, dashboardPath: t }),
+      config: /* @__PURE__ */ e(Se, { ...o, dashboardPath: t }),
+      internals: /* @__PURE__ */ e(Le, { ...o })
+    };
+    return /* @__PURE__ */ e(F, { fallback: /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "Loading..." }), children: x[l] || /* @__PURE__ */ e("div", { className: "ss-dbg-empty", children: "Unknown tab" }) });
+  }, [l, c, E]);
+  return /* @__PURE__ */ d(H, { children: [
+    n === void 0 && /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        className: `ss-dbg-btn ${p ? "ss-dbg-active" : ""}`,
+        onClick: C,
+        title: "Toggle debug panel",
+        id: "ss-dbg-wrench",
+        children: /* @__PURE__ */ e(
+          "svg",
+          {
+            width: "14",
+            height: "14",
+            viewBox: L.wrench.viewBox,
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            dangerouslySetInnerHTML: { __html: L.wrench.elements.join("") }
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ d(
+      "div",
+      {
+        className: `ss-dbg-panel ${p ? "ss-dbg-open" : ""}`,
+        "data-ss-theme": b,
+        id: "ss-dbg-panel",
+        children: [
+          /* @__PURE__ */ d("div", { className: "ss-dbg-tabs", children: [
+            /* @__PURE__ */ d("div", { className: "ss-dbg-tabs-scroll", children: [
+              I.map((o) => /* @__PURE__ */ d(
+                "button",
+                {
+                  type: "button",
+                  className: `ss-dbg-tab ${l === o.id ? "ss-dbg-active" : ""}`,
+                  onClick: () => y(o.id),
+                  children: [
+                    L[o.id] ? /* @__PURE__ */ e(
+                      "svg",
+                      {
+                        className: "ss-dbg-tab-icon",
+                        viewBox: L[o.id].viewBox,
+                        dangerouslySetInnerHTML: { __html: L[o.id].elements.join("") }
+                      }
+                    ) : null,
+                    o.label
+                  ]
+                },
+                o.id
+              )),
+              E.map((o) => /* @__PURE__ */ e(
+                "button",
+                {
+                  type: "button",
+                  className: `ss-dbg-tab ${l === o.id ? "ss-dbg-active" : ""}`,
+                  onClick: () => y(o.id),
+                  children: o.label
+                },
+                o.id
+              ))
+            ] }),
+            /* @__PURE__ */ d("div", { className: "ss-dbg-tabs-right", children: [
+              /* @__PURE__ */ e(
+                "span",
+                {
+                  className: `ss-dbg-conn-mode ${h ? "ss-dbg-conn-live" : "ss-dbg-conn-polling"}`,
+                  title: h ? "Connected via Transmit (SSE) — real-time updates" : "Polling every 3s",
+                  children: h ? "live" : "polling"
+                }
+              ),
+              /* @__PURE__ */ e(J, { theme: b, onToggle: w, classPrefix: "ss-dbg" }),
+              t && /* @__PURE__ */ e(
+                "a",
+                {
+                  href: t,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  className: "ss-dbg-dashboard-link",
+                  title: "Open dashboard",
+                  children: /* @__PURE__ */ e(
+                    "svg",
+                    {
+                      width: "14",
+                      height: "14",
+                      viewBox: L["external-link"].viewBox,
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      strokeLinecap: "round",
+                      strokeLinejoin: "round",
+                      dangerouslySetInnerHTML: { __html: L["external-link"].elements.join("") }
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ e(
+                "button",
+                {
+                  type: "button",
+                  className: "ss-dbg-close",
+                  onClick: () => m(!1),
+                  title: "Close panel",
+                  children: "×"
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "ss-dbg-content", children: p && $() })
+        ]
+      }
+    )
+  ] });
+}
+function Ee(s, i = {}) {
+  const {
+    baseUrl: t = "",
+    dashboardEndpoint: n = "/__stats/api",
+    authToken: a,
+    page: h = 1,
+    perPage: c = 50,
+    search: r,
+    sort: g,
+    sortDir: p,
+    filters: m,
+    timeRange: l,
+    refreshKey: y
+  } = i, [f, b] = N(null), [w, E] = N(null), [_, I] = N(!0), [C, $] = N(null), o = j(null), v = j(s), x = j(!1);
+  o.current || (o.current = new re({
+    baseUrl: t,
+    endpoint: n,
+    authToken: a,
+    section: s,
+    perPage: c,
+    callbacks: {
+      onData: (M) => b(M),
+      onPagination: (M) => E(M),
+      onLoading: (M) => I(M),
+      onError: (M) => $(M),
+      onUnauthorized: () => {
+      }
+    }
+  })), R(() => {
+    const M = o.current, u = v.current !== s;
+    return v.current = s, M.configure({ page: h, perPage: c, search: r, sort: g, sortDir: p, filters: m, timeRange: l }), u || !x.current ? (u ? M.setSection(s) : M.start(), x.current = !0) : M.fetch(!0), () => {
+      M.stop();
+    };
+  }, [s, h, c, r, g, p, m, l, y]);
+  const k = B(() => {
+    o.current?.fetch(!0);
+  }, []), D = B(
+    async (M, u = "post", S) => o.current.mutate(M, u, S),
+    []
+  ), P = B(() => o.current.getApi(), []);
+  return { data: f, meta: w, isLoading: _, error: C, refresh: k, mutate: D, getApi: P };
+}
+const $e = [
+  "overview",
+  "requests",
+  "queries",
+  "events",
+  "routes",
+  "logs",
+  "emails",
+  "timeline",
+  "cache",
+  "jobs",
+  "config",
+  "internals"
+], xe = T(() => import("./OverviewSection-nm3xdACz.js")), Ie = T(() => import("./RequestsSection-DTqB81ac.js")), Be = T(() => import("./QueriesSection-DB12HMfQ.js")), Me = T(() => import("./EventsSection-C1pbJDfW.js")), Re = T(() => import("./RoutesSection-DJWa4NPV.js")), Oe = T(() => import("./LogsSection-C1p81fXO.js")), _e = T(() => import("./EmailsSection-CSyTg1aX.js")), De = T(() => import("./TimelineSection-C4d-jRX1.js")), je = T(() => import("./CacheSection-DGxMDlWK.js")), He = T(() => import("./JobsSection-CLAin5vU.js")), Pe = T(() => import("./ConfigSection-DPcrfqXY.js")), qe = T(() => import("./InternalsSection-t7ihcWO-.js"));
+function W(s) {
+  return s === "timeline" ? "dashboard-timeline" : s;
+}
+function Ve(s) {
+  const {
+    baseUrl: i = "",
+    dashboardEndpoint: t = "/__stats/api",
+    debugEndpoint: n,
+    authToken: a,
+    backUrl: h = "/",
+    channelName: c = "server-stats/dashboard"
+  } = s, { features: r } = z({ baseUrl: i, debugEndpoint: n, authToken: a }), { theme: g, toggleTheme: p } = A(), [m, l] = N("overview"), [y, f] = N(() => typeof window > "u" ? !1 : localStorage.getItem("ss-dash-sidebar") === "collapsed"), [b, w] = N(!1), [E, _] = N(0), I = j(0);
+  R(() => {
+    if (!c) return;
+    const u = ae({
+      baseUrl: i,
+      channelName: c,
+      authToken: a,
+      onMessage: () => {
+        I.current += 1, _(I.current);
+      },
+      onConnect: () => w(!0),
+      onDisconnect: () => w(!1),
+      onError: () => w(!1)
+    });
+    return () => u.unsubscribe();
+  }, [i, c, a]);
+  const C = r.customPanes || [], $ = B(
+    (u) => {
+      const S = u.replace("#", "").split("?")[0];
+      return S && [...$e, ...C.map((V) => V.id)].includes(S) ? S : "overview";
+    },
+    [C]
+  );
+  R(() => {
+    if (typeof window > "u") return;
+    const u = $(window.location.hash);
+    (u !== "overview" || window.location.hash) && l(u);
+  }, [$]), R(() => {
+    const u = () => {
+      const S = $(window.location.hash);
+      S !== m && l(S);
+    };
+    return window.addEventListener("hashchange", u), () => window.removeEventListener("hashchange", u);
+  }, [m, $]), R(() => {
+    typeof window > "u" || (window.location.hash = m);
+  }, [m]);
+  const o = B(() => {
+    f((u) => {
+      const S = !u;
+      return localStorage.setItem("ss-dash-sidebar", S ? "collapsed" : "expanded"), S;
+    });
+  }, []), v = O(
+    () => [
+      { id: "overview", label: "Overview", visible: !0 },
+      { id: "requests", label: "Requests", visible: !0 },
+      { id: "queries", label: "Queries", visible: !0 },
+      { id: "events", label: "Events", visible: !0 },
+      { id: "routes", label: "Routes", visible: !0 },
+      { id: "logs", label: "Logs", visible: !0 },
+      { id: "emails", label: "Emails", visible: !0 },
+      { id: "timeline", label: "Timeline", visible: r.tracing },
+      { id: "cache", label: "Cache", visible: r.cache },
+      { id: "jobs", label: "Jobs", visible: r.queues },
+      { id: "config", label: "Config", visible: !0 },
+      { id: "internals", label: "Internals", visible: !0 }
+    ],
+    [r]
+  ), x = O(() => v.filter((u) => u.visible), [v]), k = O(
+    () => ({ baseUrl: i, dashboardEndpoint: t, authToken: a, refreshKey: E }),
+    [i, t, a, E]
+  ), { data: D } = Ee("overview", k), P = O(() => {
+    if (!D) return {};
+    const u = {};
+    if (D.totalRequests > 0 && (u.requests = { count: D.totalRequests }), D.queryStats?.total > 0 && (u.queries = { count: D.queryStats.total }), D.logLevelBreakdown) {
+      const S = D.logLevelBreakdown, q = S.error + S.warn + S.info + S.debug;
+      q > 0 && (u.logs = { count: q });
+    }
+    return u;
+  }, [D]), M = B(() => {
+    const u = {
+      overview: /* @__PURE__ */ e(xe, { options: k }),
+      requests: /* @__PURE__ */ e(Ie, { options: k }),
+      queries: /* @__PURE__ */ e(Be, { options: k }),
+      events: /* @__PURE__ */ e(Me, { options: k }),
+      routes: /* @__PURE__ */ e(Re, { options: k }),
+      logs: /* @__PURE__ */ e(Oe, { options: k }),
+      emails: /* @__PURE__ */ e(_e, { options: k }),
+      timeline: /* @__PURE__ */ e(De, { options: k }),
+      cache: /* @__PURE__ */ e(je, { options: k }),
+      jobs: /* @__PURE__ */ e(He, { options: k }),
+      config: /* @__PURE__ */ e(Pe, { options: k }),
+      internals: /* @__PURE__ */ e(qe, { options: k, debugEndpoint: n })
+    };
+    return /* @__PURE__ */ e("div", { className: "ss-dash-pane ss-dash-active", id: `ss-dash-pane-${m}`, children: /* @__PURE__ */ e("div", { className: "ss-dash-pane-inner", children: /* @__PURE__ */ e(F, { fallback: /* @__PURE__ */ e("div", { className: "ss-dash-empty", children: "Loading..." }), children: u[m] || /* @__PURE__ */ e("div", { className: "ss-dash-empty", children: "Unknown section" }) }) }) });
+  }, [m, k]);
+  return /* @__PURE__ */ d("div", { className: "ss-dash", "data-theme": g, id: "ss-dash", children: [
+    /* @__PURE__ */ d("div", { className: "ss-dash-header", children: [
+      /* @__PURE__ */ d("div", { className: "ss-dash-header-left", children: [
+        /* @__PURE__ */ e("span", { className: "ss-dash-logo", children: "Server Stats" }),
+        /* @__PURE__ */ e("span", { className: "ss-dash-logo-sub", children: "Dashboard" })
+      ] }),
+      /* @__PURE__ */ d("div", { className: "ss-dash-header-center", children: [
+        /* @__PURE__ */ e(
+          "span",
+          {
+            className: `ss-dash-live-dot ${b ? "ss-dash-connected" : ""}`,
+            id: "ss-dash-live-dot"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "span",
+          {
+            className: `ss-dash-live-label ${b ? "ss-dash-connected" : ""}`,
+            id: "ss-dash-live-label",
+            children: b ? "Live" : "Polling"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ d("div", { className: "ss-dash-header-right", children: [
+        /* @__PURE__ */ e(J, { theme: g, onToggle: p }),
+        h && /* @__PURE__ */ e("a", { href: h, className: "ss-dash-back-link", title: "Back to app", children: "← App" })
+      ] })
+    ] }),
+    /* @__PURE__ */ d("div", { className: "ss-dash-body", children: [
+      /* @__PURE__ */ d(
+        "div",
+        {
+          className: `ss-dash-sidebar ${y ? "ss-dash-collapsed" : ""}`,
+          id: "ss-dash-sidebar",
+          children: [
+            /* @__PURE__ */ d("nav", { className: "ss-dash-nav", children: [
+              x.map((u) => {
+                const S = P[u.id];
+                return /* @__PURE__ */ d(
+                  "button",
+                  {
+                    type: "button",
+                    className: `ss-dash-nav-item ${m === u.id ? "ss-dash-active" : ""}`,
+                    "data-ss-section": u.id,
+                    onClick: () => {
+                      u.id !== m && l(u.id);
+                    },
+                    title: y ? u.label : void 0,
+                    children: [
+                      /* @__PURE__ */ e("span", { className: "ss-dash-nav-icon", children: /* @__PURE__ */ e(
+                        "svg",
+                        {
+                          width: "20",
+                          height: "20",
+                          viewBox: (L[W(u.id)] || L.config).viewBox,
+                          fill: "none",
+                          stroke: "currentColor",
+                          strokeWidth: "2",
+                          strokeLinecap: "round",
+                          strokeLinejoin: "round",
+                          dangerouslySetInnerHTML: {
+                            __html: (L[W(u.id)] || L.config).elements.join("")
+                          }
+                        }
+                      ) }),
+                      /* @__PURE__ */ e("span", { className: "ss-dash-nav-label", children: u.label }),
+                      S && S.count > 0 && /* @__PURE__ */ e(
+                        "span",
+                        {
+                          className: `ss-dash-nav-badge${S.variant ? " " + S.variant : ""}`,
+                          children: S.count
+                        }
+                      )
+                    ]
+                  },
+                  u.id
+                );
+              }),
+              C.length > 0 && /* @__PURE__ */ e("div", { className: "ss-dash-nav-sep" }),
+              C.map((u) => /* @__PURE__ */ d(
+                "button",
+                {
+                  type: "button",
+                  className: `ss-dash-nav-item ${m === u.id ? "ss-dash-active" : ""}`,
+                  onClick: () => l(u.id),
+                  title: y ? u.label : void 0,
+                  children: [
+                    /* @__PURE__ */ e("span", { className: "ss-dash-nav-icon", children: /* @__PURE__ */ e(
+                      "svg",
+                      {
+                        width: "20",
+                        height: "20",
+                        viewBox: L["custom-pane"].viewBox,
+                        fill: "none",
+                        stroke: "currentColor",
+                        strokeWidth: "2",
+                        strokeLinecap: "round",
+                        strokeLinejoin: "round",
+                        dangerouslySetInnerHTML: { __html: L["custom-pane"].elements.join("") }
+                      }
+                    ) }),
+                    /* @__PURE__ */ e("span", { className: "ss-dash-nav-label", children: u.label })
+                  ]
+                },
+                u.id
+              ))
+            ] }),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                className: "ss-dash-sidebar-toggle",
+                id: "ss-dash-sidebar-toggle",
+                onClick: o,
+                title: y ? "Expand sidebar" : "Collapse sidebar",
+                children: y ? /* @__PURE__ */ e(
+                  "svg",
+                  {
+                    width: "16",
+                    height: "16",
+                    viewBox: L["chevron-right"].viewBox,
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "1.5",
+                    dangerouslySetInnerHTML: { __html: L["chevron-right"].elements.join("") }
+                  }
+                ) : /* @__PURE__ */ e(
+                  "svg",
+                  {
+                    width: "16",
+                    height: "16",
+                    viewBox: L["chevron-left"].viewBox,
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "1.5",
+                    dangerouslySetInnerHTML: { __html: L["chevron-left"].elements.join("") }
+                  }
+                )
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "ss-dash-main", children: M() })
+    ] })
+  ] });
+}
+function Ke(s, i = {}) {
+  const { baseUrl: t = "", debugEndpoint: n = "/admin/api/debug", authToken: a } = i, [h, c] = N(null), [r, g] = N(!0), [p, m] = N(null), l = j(null);
+  l.current || (l.current = new le({
+    baseUrl: t,
+    endpoint: n,
+    authToken: a,
+    onData: (w) => c(w),
+    onLoading: (w) => g(w),
+    onError: (w) => m(w),
+    onUnauthorized: (w) => m(w)
+  })), R(() => {
+    const w = l.current;
+    return w.start(s), () => w.stop();
+  }, [s]);
+  const y = B(() => {
+    l.current?.refresh();
+  }, []), f = B(() => {
+    c(null);
+  }, []), b = B((w, E) => {
+    l.current?.cacheForTab(w, E);
+  }, []);
+  return { data: h, isLoading: r, error: p, refresh: y, clearData: f, cacheForTab: b };
+}
+function Ge({
+  color: s = "muted",
+  children: i,
+  className: t = "",
+  classPrefix: n = "ss-dash"
+}) {
+  return /* @__PURE__ */ e("span", { className: `${n}-badge ${n}-badge-${s} ${t}`, children: i });
+}
+function Qe({ method: s, className: i = "", classPrefix: t = "ss-dash" }) {
+  return /* @__PURE__ */ e(
+    "span",
+    {
+      className: `${t}-method ${t}-method-${s.toLowerCase()} ${i}`,
+      children: s
+    }
+  );
+}
+function Xe({ code: s, className: i = "", classPrefix: t = "ss-dash" }) {
+  let n = `${t}-status-2xx`;
+  return s >= 500 ? n = `${t}-status-5xx` : s >= 400 ? n = `${t}-status-4xx` : s >= 300 && (n = `${t}-status-3xx`), /* @__PURE__ */ e("span", { className: `${t}-status ${n} ${i}`, children: s });
+}
+function Ye({
+  data: s,
+  maxPreviewLength: i = 100,
+  className: t = "",
+  classPrefix: n = "ss-dash"
+}) {
+  const [a, h] = N(!1), c = O(() => {
+    if (typeof s == "string")
+      try {
+        return JSON.parse(s);
+      } catch {
+        return s;
+      }
+    return s;
+  }, [s]), r = O(() => typeof c == "object" && c !== null ? ce(c, i) : String(c ?? "-"), [c, i]), g = O(() => typeof c == "object" && c !== null ? JSON.stringify(c, null, 2) : String(c), [c]), p = B(() => {
+    h((l) => !l);
+  }, []), m = B(async () => {
+    try {
+      await navigator.clipboard.writeText(g);
+    } catch {
+    }
+  }, [g]);
+  return !s && s !== 0 && s !== !1 ? /* @__PURE__ */ e("span", { className: `ss-dim ${n}-c-dim`, children: "-" }) : /* @__PURE__ */ d("div", { className: `${n}-data-cell ${t}`, children: [
+    /* @__PURE__ */ e(
+      "span",
+      {
+        className: `${n}-data-preview`,
+        onClick: p,
+        role: "button",
+        tabIndex: 0,
+        onKeyDown: (l) => l.key === "Enter" && p(),
+        children: r
+      }
+    ),
+    a && /* @__PURE__ */ d("div", { className: `${n}-data-full`, onClick: p, children: [
+      /* @__PURE__ */ e(
+        "button",
+        {
+          className: `${n}-copy-btn`,
+          onClick: (l) => {
+            l.stopPropagation(), m();
+          },
+          title: "Copy to clipboard",
+          type: "button",
+          children: "Copy"
+        }
+      ),
+      /* @__PURE__ */ e("pre", { children: g })
+    ] })
+  ] });
+}
+function Ze({ content: s, children: i, position: t = "top", className: n = "" }) {
+  const [a, h] = N(!1), [c, r] = N({ left: 0, bottom: 0 }), g = j(null), p = j(null), m = B(() => {
+    h(!0);
+  }, []), l = B(() => {
+    h(!1);
+  }, []);
+  return R(() => {
+    if (!a || !g.current || !p.current) return;
+    const y = g.current.getBoundingClientRect(), f = p.current.getBoundingClientRect();
+    let b = y.left + y.width / 2 - f.width / 2, w;
+    b < 8 && (b = 8), b + f.width > window.innerWidth - 8 && (b = window.innerWidth - 8 - f.width), t === "top" && (w = window.innerHeight - y.top + 8), r({ left: b, bottom: w ?? 0 });
+  }, [a, t]), /* @__PURE__ */ d(
+    "div",
+    {
+      ref: g,
+      className: `ss-tooltip-trigger ${n}`,
+      onMouseEnter: m,
+      onMouseLeave: l,
+      style: { display: "inline-flex", position: "relative" },
+      children: [
+        i,
+        a && /* @__PURE__ */ d(
+          "div",
+          {
+            ref: p,
+            className: "ss-tooltip",
+            style: {
+              position: "fixed",
+              left: `${c.left}px`,
+              bottom: t === "top" ? `${c.bottom}px` : void 0,
+              zIndex: 200,
+              pointerEvents: "none"
+            },
+            children: [
+              /* @__PURE__ */ e("div", { className: "ss-tooltip-inner", children: s }),
+              /* @__PURE__ */ e("div", { className: "ss-tooltip-arrow" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  Ge as B,
+  Ve as D,
+  Ye as J,
+  Qe as M,
+  he as S,
+  J as T,
+  Ee as a,
+  Xe as b,
+  Je as c,
+  We as d,
+  Ze as e,
+  z as f,
+  ue as g,
+  A as h,
+  Ke as u
+};