@photon-ai/pho-ui 2.16.0 → 3.0.0

package/dist/chunks/trace-Ba1RMBfk.js

@@ -0,0 +1,1645 @@
+"use client";
+import { t as L } from "./cn-ChIgwEl3.js";
+import { t as U } from "./createReactComponent-BqCmnqfX.js";
+import { t as Ie } from "./IconChevronDown-CZilB71T.js";
+import { t as Xe } from "./IconChevronRight-CzoJnYNI.js";
+import { t as Te } from "./IconChevronUp-CrpWSgIl.js";
+import { t as ve } from "./collapsible-if7ncPbI.js";
+import { t as He } from "./ghost-search-BvBFa9su.js";
+import { r as Je } from "./badge-DlLJPLeZ.js";
+import { createContext as ue, useCallback as O, useContext as pe, useEffect as ae, useId as Ze, useMemo as D, useRef as he, useState as Q } from "react";
+import { Fragment as Ye, jsx as l, jsxs as x } from "react/jsx-runtime";
+import { useRender as q } from "@base-ui/react/use-render";
+var Qe = [
+  ["path", {
+    d: "M5 12l14 0",
+    key: "svg-0"
+  }],
+  ["path", {
+    d: "M15 16l4 -4",
+    key: "svg-1"
+  }],
+  ["path", {
+    d: "M15 8l4 4",
+    key: "svg-2"
+  }]
+], qe = U("outline", "arrow-narrow-right", "ArrowNarrowRight", Qe), et = [["path", {
+  d: "M7 10h14l-4 -4",
+  key: "svg-0"
+}], ["path", {
+  d: "M17 14h-14l4 4",
+  key: "svg-1"
+}]], tt = U("outline", "arrows-exchange", "ArrowsExchange", et), nt = [["path", {
+  d: "M7 7l5 5l5 -5",
+  key: "svg-0"
+}], ["path", {
+  d: "M7 13l5 5l5 -5",
+  key: "svg-1"
+}]], at = U("outline", "chevrons-down", "ChevronsDown", nt), rt = [["path", {
+  d: "M7 11l5 -5l5 5",
+  key: "svg-0"
+}], ["path", {
+  d: "M7 17l5 -5l5 5",
+  key: "svg-1"
+}]], st = U("outline", "chevrons-up", "ChevronsUp", rt), ot = [
+  ["path", {
+    d: "M4 6a8 3 0 1 0 16 0a8 3 0 1 0 -16 0",
+    key: "svg-0"
+  }],
+  ["path", {
+    d: "M4 6v6a8 3 0 0 0 16 0v-6",
+    key: "svg-1"
+  }],
+  ["path", {
+    d: "M4 12v6a8 3 0 0 0 16 0v-6",
+    key: "svg-2"
+  }]
+], it = U("outline", "database", "Database", ot), lt = [
+  ["path", {
+    d: "M14 3v4a1 1 0 0 0 1 1h4",
+    key: "svg-0"
+  }],
+  ["path", {
+    d: "M12 21h-5a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h7l5 5v4.5",
+    key: "svg-1"
+  }],
+  ["path", {
+    d: "M14 17.5a2.5 2.5 0 1 0 5 0a2.5 2.5 0 1 0 -5 0",
+    key: "svg-2"
+  }],
+  ["path", {
+    d: "M18.5 19.5l2.5 2.5",
+    key: "svg-3"
+  }]
+], ct = U("outline", "file-search", "FileSearch", lt), dt = [
+  ["path", {
+    d: "M8 9h8",
+    key: "svg-0"
+  }],
+  ["path", {
+    d: "M8 13h6",
+    key: "svg-1"
+  }],
+  ["path", {
+    d: "M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-5l-5 3v-3h-2a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12",
+    key: "svg-2"
+  }]
+], ut = U("outline", "message", "Message", dt), pt = [
+  ["path", {
+    d: "M6 6a2 2 0 0 1 2 -2h8a2 2 0 0 1 2 2v4a2 2 0 0 1 -2 2h-8a2 2 0 0 1 -2 -2l0 -4",
+    key: "svg-0"
+  }],
+  ["path", {
+    d: "M12 2v2",
+    key: "svg-1"
+  }],
+  ["path", {
+    d: "M9 12v9",
+    key: "svg-2"
+  }],
+  ["path", {
+    d: "M15 12v9",
+    key: "svg-3"
+  }],
+  ["path", {
+    d: "M5 16l4 -2",
+    key: "svg-4"
+  }],
+  ["path", {
+    d: "M15 14l4 2",
+    key: "svg-5"
+  }],
+  ["path", {
+    d: "M9 18h6",
+    key: "svg-6"
+  }],
+  ["path", {
+    d: "M10 8v.01",
+    key: "svg-7"
+  }],
+  ["path", {
+    d: "M14 8v.01",
+    key: "svg-8"
+  }]
+], ht = U("outline", "robot", "Robot", pt), mt = [["path", {
+  d: "M16 18a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m0 -12a2 2 0 0 1 2 2a2 2 0 0 1 2 -2a2 2 0 0 1 -2 -2a2 2 0 0 1 -2 2m-7 12a6 6 0 0 1 6 -6a6 6 0 0 1 -6 -6a6 6 0 0 1 -6 6a6 6 0 0 1 6 6",
+  key: "svg-0"
+}]], ge = U("outline", "sparkles", "Sparkles", mt), ft = [["path", {
+  d: "M7 10h3v-3l-3.5 -3.5a6 6 0 0 1 8 8l6 6a2 2 0 0 1 -3 3l-6 -6a6 6 0 0 1 -8 -8l3.5 3.5",
+  key: "svg-0"
+}]], vt = U("outline", "tool", "Tool", ft), gt = [
+  ["path", {
+    d: "M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0",
+    key: "svg-0"
+  }],
+  ["path", {
+    d: "M3.6 9h16.8",
+    key: "svg-1"
+  }],
+  ["path", {
+    d: "M3.6 15h16.8",
+    key: "svg-2"
+  }],
+  ["path", {
+    d: "M11.5 3a17 17 0 0 0 0 18",
+    key: "svg-3"
+  }],
+  ["path", {
+    d: "M12.5 3a17 17 0 0 1 0 18",
+    key: "svg-4"
+  }]
+], bt = U("outline", "world", "World", gt), be = [0, 1], ce = 1e-3, X = (e) => typeof e == "number" && Number.isFinite(e);
+function xt(e) {
+  const t = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Set();
+  for (const r of e.values()) r.parentSpanId != null && e.has(r.parentSpanId) ? t.set(r.id, r.parentSpanId) : (t.set(r.id, null), r.parentSpanId != null && n.add(r.id));
+  const a = /* @__PURE__ */ new Set();
+  for (const r of e.keys()) {
+    if (a.has(r)) continue;
+    const o = [], i = /* @__PURE__ */ new Set();
+    let s = r;
+    for (; s !== null && !a.has(s); ) {
+      if (i.has(s)) {
+        t.set(s, null), n.add(s);
+        break;
+      }
+      o.push(s), i.add(s), s = t.get(s) ?? null;
+    }
+    for (const c of o) a.add(c);
+  }
+  return {
+    parents: t,
+    orphans: n
+  };
+}
+function _e(e) {
+  const t = new Map(e.map((p) => [p.id, p])), { parents: n, orphans: a } = xt(t), r = /* @__PURE__ */ new Map();
+  for (const p of t.values()) {
+    const S = n.get(p.id) ?? null, w = r.get(S) ?? [];
+    w.push(p), r.set(S, w);
+  }
+  let o = 1 / 0;
+  for (const p of t.values()) X(p.startedAt) && p.startedAt < o && (o = p.startedAt);
+  o === 1 / 0 && (o = 0);
+  const i = (p, S) => {
+    let w = !1, d = p.startedAt;
+    X(d) || (d = S ?? o, w = !0);
+    let m = p.endedAt;
+    m != null && (!X(m) || m < d) && (m = d, w = !0);
+    const A = X(p.latencyMs) && p.latencyMs >= 0 ? p.latencyMs : null;
+    return {
+      startedAt: d,
+      endedAt: m,
+      latencyMs: A,
+      repaired: w
+    };
+  }, s = [], c = /* @__PURE__ */ new Map();
+  let u = 0;
+  const g = (p, S, w) => {
+    const d = i(p, w), m = r.get(p.id) ?? [], A = {
+      ...p,
+      parentSpanId: n.get(p.id) ?? null,
+      startedAt: d.startedAt,
+      endedAt: d.endedAt,
+      latencyMs: d.latencyMs,
+      depth: S,
+      hasChildren: m.length > 0,
+      isCollapsed: !1,
+      descendants: 0,
+      descendantErrors: 0,
+      orphan: a.has(p.id),
+      repaired: d.repaired,
+      serverChildId: null
+    };
+    d.repaired && (u += 1), s.push(A), c.set(A.id, A);
+    const b = m.map((E) => ({
+      kid: E,
+      start: X(E.startedAt) ? E.startedAt : d.startedAt
+    }));
+    b.sort((E, N) => E.start - N.start);
+    let $ = 0, _ = 0;
+    for (const { kid: E } of b) {
+      const N = g(E, S + 1, d.startedAt);
+      $ += 1 + N.descendants, _ += (N.status === "failed" ? 1 : 0) + N.descendantErrors, A.kind === "client" && A.serverChildId == null && N.kind === "server" && (A.serverChildId = N.id);
+    }
+    return A.descendants = $, A.descendantErrors = _, A;
+  }, h = (r.get(null) ?? []).map((p) => ({
+    root: p,
+    start: X(p.startedAt) ? p.startedAt : o
+  }));
+  h.sort((p, S) => p.start - S.start);
+  for (const { root: p } of h) g(p, 0, null);
+  return {
+    spans: s,
+    byId: c,
+    orphans: a.size,
+    repaired: u
+  };
+}
+function Ee(e, t) {
+  const n = [];
+  let a = null;
+  for (const r of e.spans) {
+    if (a != null) {
+      if (r.depth > a) continue;
+      a = null;
+    }
+    t.has(r.id) ? (n.push({
+      ...r,
+      isCollapsed: !0
+    }), r.hasChildren && (a = r.depth)) : n.push(r);
+  }
+  return n;
+}
+function Kn(e, t = /* @__PURE__ */ new Set()) {
+  return Ee(_e(e), t);
+}
+function yt(e, t) {
+  const n = [];
+  let a = e.get(t)?.parentSpanId ?? null;
+  for (; a != null && !n.includes(a); )
+    n.push(a), a = e.get(a)?.parentSpanId ?? null;
+  return n;
+}
+function wt(e) {
+  return e.filter((t) => t.hasChildren).map((t) => t.id);
+}
+function Nt(e, t) {
+  return e.filter((n) => n.hasChildren).every((n) => t.has(n.id));
+}
+function kt(e, t) {
+  const n = new Set(t);
+  let a;
+  for (const r of e) a && r.depth <= a.depth ? (n.add(a.id), a = r.hasChildren && !n.has(r.id) ? r : void 0) : r.hasChildren && !n.has(r.id) && (a = r);
+  return a && n.add(a.id), Array.from(n);
+}
+function Mt(e, t) {
+  const n = new Set(t);
+  let a = -1, r = !0;
+  for (const o of e)
+    o.depth <= a && (r = !0), r && n.has(o.id) && (n.delete(o.id), r = !1, a = o.depth);
+  return Array.from(n);
+}
+function At(e, t) {
+  let n = 1 / 0, a = -1 / 0;
+  for (const r of e) {
+    if (!X(r.startedAt)) continue;
+    r.startedAt < n && (n = r.startedAt);
+    const o = X(r.endedAt) ? r.endedAt : t ?? r.startedAt;
+    o > a && (a = o);
+  }
+  return n === 1 / 0 ? {
+    min: 0,
+    max: 0
+  } : {
+    min: n,
+    max: Math.max(a, n)
+  };
+}
+var ie = (e) => Math.min(1, Math.max(0, e));
+function oe(e) {
+  let [t, n] = e;
+  if (X(t) || (t = 0), X(n) || (n = 1), n < t && ([t, n] = [n, t]), t = ie(t), n = ie(n), n - t < 1e-3) {
+    const a = (t + n) / 2;
+    t = ie(a - ce / 2), n = ie(t + ce), t = n - ce;
+  }
+  return [t, n];
+}
+function St(e, t) {
+  const n = e.max - e.min;
+  return {
+    min: e.min + t[0] * n,
+    max: e.min + t[1] * n
+  };
+}
+function Ct(e, t, n = 0.5) {
+  const [a, r] = e, o = r - a, i = Math.min(1, Math.max(ce, o * t));
+  let s = a + n * o - n * i;
+  return s = Math.min(Math.max(s, 0), 1 - i), oe([s, s + i]);
+}
+function It(e, t) {
+  const [n, a] = e, r = a - n;
+  let o = n + t * r;
+  return o = Math.min(Math.max(o, 0), 1 - r), oe([o, o + r]);
+}
+function xe(e, t) {
+  return e[0] + t * (e[1] - e[0]);
+}
+function Tt(e) {
+  return e[0] <= 0 && e[1] >= 1;
+}
+function _t({ startedAt: e, endedAt: t, timeRange: n, now: a }) {
+  const r = Math.max(1, n.max - n.min), o = t ?? a ?? n.max, i = (e - n.min) / r * 100, s = (o - n.min) / r * 100, c = Math.min(100, Math.max(0, i)), u = Math.min(100, Math.max(c, s));
+  return {
+    leftPercent: c,
+    endPercent: u,
+    widthPercent: u - c,
+    durationMs: Math.max(0, o - e),
+    effectiveEnd: o,
+    clippedStart: i < 0 && s > 0,
+    clippedEnd: s > 100 && i < 100
+  };
+}
+function Et(e) {
+  if (e == null) return "";
+  if (typeof e == "object") try {
+    return JSON.stringify(e);
+  } catch {
+    return String(e);
+  }
+  return String(e);
+}
+function $t(e, t) {
+  if (e == null || e.trim() === "") return null;
+  const n = [], a = [];
+  for (const s of e.match(/[^\s"]+|"([^"]*)"/g) ?? []) {
+    const c = s.replace(/^"(.*)"$/, "$1").toLowerCase();
+    c && (c.startsWith("-") && c.length > 1 ? a.push(c.slice(1)) : n.push(c));
+  }
+  if (n.length === 0) return /* @__PURE__ */ new Set();
+  const r = (s) => {
+    const c = s.toLowerCase();
+    return n.some((u) => c.includes(u));
+  }, o = (s) => {
+    const c = s.toLowerCase();
+    return a.some((u) => c.includes(u));
+  }, i = /* @__PURE__ */ new Set();
+  for (const s of t) {
+    if (r(s.name) || s.service != null && r(s.service) || s.type !== "" && r(s.type) || s.kind != null && r(s.kind) || n.some((u) => u === s.id.toLowerCase())) {
+      i.add(s.id);
+      continue;
+    }
+    const c = s.attributes;
+    if (c != null)
+      for (const u of Object.keys(c)) {
+        if (o(u)) continue;
+        const g = Et(c[u]);
+        if (g !== "" && (r(u) || r(g) || r(`${u}=${g}`))) {
+          i.add(s.id);
+          break;
+        }
+      }
+  }
+  return i;
+}
+var $e = ue(null), Pe = ue(null), Re = ue(null);
+function H() {
+  const e = pe($e);
+  if (e == null) throw new Error("SpanPrimitive parts render inside SpanPrimitive.Provider.");
+  return e;
+}
+function ee() {
+  const e = pe(Pe);
+  if (e == null) throw new Error("SpanPrimitive parts render inside SpanPrimitive.Children.");
+  return e;
+}
+var ye = [];
+function Pt({ spans: e, defaultCollapsed: t, collapsed: n, onCollapsedChange: a, now: r, query: o = "", keepFoldsOnMatch: i = !1, defaultView: s, view: c, onViewChange: u, children: g }) {
+  const h = D(() => _e(e), [e]), [p, S] = Q(() => t ?? ye), w = n ?? p, d = D(() => new Set(w), [w]), m = O((I) => {
+    const T = Array.from(new Set(I));
+    n == null && S(T), a?.(T);
+  }, [n, a]), A = O((I) => {
+    const T = new Set(d);
+    T.has(I) ? T.delete(I) : T.add(I), m(Array.from(T));
+  }, [d, m]), { spans: b, byId: $ } = h, _ = O(() => m(ye), [m]), E = O(() => m(wt(b)), [b, m]), N = O(() => m(Mt(b, d)), [
+    b,
+    d,
+    m
+  ]), v = O(() => m(kt(b, d)), [
+    b,
+    d,
+    m
+  ]), y = !Nt(b, d), P = b.some((I) => I.hasChildren && d.has(I.id)), M = D(() => $t(o, b), [o, b]);
+  ae(() => {
+    if (i || M == null || M.size === 0) return;
+    const I = /* @__PURE__ */ new Set();
+    for (const T of M) for (const ne of yt($, T)) d.has(ne) && I.add(ne);
+    I.size !== 0 && m(w.filter((T) => !I.has(T)));
+  }, [
+    M,
+    i,
+    $,
+    d,
+    w,
+    m
+  ]);
+  const J = D(() => Ee(h, d), [h, d]), z = D(() => At(b, r), [b, r]), [W, F] = Q(() => oe(s ?? be)), C = D(() => oe(c ?? W), [c, W]), k = O((I) => {
+    const T = oe(I);
+    c == null && F(T), u?.(T);
+  }, [c, u]), B = O((I, T) => k(Ct(C, I, T)), [C, k]), te = O((I) => k(It(C, I)), [C, k]), R = O(() => k(be), [k]), V = D(() => St(z, C), [z, C]), G = D(() => ({
+    spans: J,
+    all: b,
+    byId: $,
+    orphans: h.orphans,
+    repaired: h.repaired,
+    range: z,
+    view: C,
+    viewRange: V,
+    zoomed: !Tt(C),
+    now: r,
+    collapsed: d,
+    toggle: A,
+    setCollapsed: m,
+    expandAll: _,
+    collapseAll: E,
+    expandOne: N,
+    collapseOne: v,
+    canExpand: P,
+    canCollapse: y,
+    query: o,
+    matches: M,
+    setView: k,
+    zoom: B,
+    pan: te,
+    resetView: R
+  }), [
+    J,
+    b,
+    $,
+    h.orphans,
+    h.repaired,
+    z,
+    C,
+    V,
+    r,
+    d,
+    A,
+    m,
+    _,
+    E,
+    N,
+    v,
+    P,
+    y,
+    o,
+    M,
+    k,
+    B,
+    te,
+    R
+  ]);
+  return /* @__PURE__ */ l($e.Provider, {
+    value: G,
+    children: g
+  });
+}
+function Rt({ children: e }) {
+  const { spans: t } = H();
+  return t.map((n) => /* @__PURE__ */ l(Pe.Provider, {
+    value: n,
+    children: e(n)
+  }, n.id));
+}
+function Dt({ render: e, ref: t, ...n }) {
+  const a = ee(), { matches: r } = H();
+  return q({
+    render: e,
+    ref: t,
+    defaultTagName: "div",
+    props: {
+      ...n,
+      "data-span-id": a.id,
+      "data-span-status": a.status,
+      "data-span-type": a.type,
+      "data-span-depth": a.depth,
+      "data-span-kind": a.kind,
+      "data-collapsed": a.isCollapsed ? "" : void 0,
+      "data-match": r?.has(a.id) ? "" : void 0,
+      "data-orphan": a.orphan ? "" : void 0
+    }
+  });
+}
+function Lt({ render: e, ref: t, baseIndent: n = 8, indentPerLevel: a = 12, style: r, ...o }) {
+  const i = ee();
+  return q({
+    render: e,
+    ref: t,
+    defaultTagName: "div",
+    props: {
+      ...o,
+      style: {
+        ...r,
+        paddingLeft: n + i.depth * a
+      },
+      "data-span-depth": i.depth
+    }
+  });
+}
+function Ot({ render: e, ref: t, onClick: n, ...a }) {
+  const r = ee(), { toggle: o } = H();
+  return q({
+    render: e,
+    ref: t,
+    enabled: r.hasChildren,
+    defaultTagName: "button",
+    props: {
+      type: "button",
+      ...a,
+      "data-collapsed": r.isCollapsed ? "" : void 0,
+      onClick: (i) => {
+        i.stopPropagation(), o(r.id), n?.(i);
+      }
+    }
+  });
+}
+function zt({ render: e, ref: t, ...n }) {
+  const a = ee();
+  return q({
+    render: e,
+    ref: t,
+    defaultTagName: "span",
+    props: {
+      ...n,
+      "data-span-status": a.status,
+      "data-descendant-errors": a.isCollapsed && a.descendantErrors > 0 ? a.descendantErrors : void 0
+    }
+  });
+}
+function Ft({ render: e, ref: t, children: n, ...a }) {
+  const r = ee();
+  return q({
+    render: e,
+    ref: t,
+    defaultTagName: "span",
+    props: {
+      ...a,
+      "data-span-type": r.type,
+      children: n ?? r.type
+    }
+  });
+}
+function Kt({ render: e, ref: t, children: n, ...a }) {
+  const r = ee();
+  return q({
+    render: e,
+    ref: t,
+    defaultTagName: "span",
+    props: {
+      ...a,
+      children: n ?? r.name
+    }
+  });
+}
+function Wt({ render: e, ref: t, timeRange: n, paddingEnd: a = 0, style: r, ...o }) {
+  const i = H(), s = D(() => {
+    const h = n ?? i.viewRange, p = Math.max(1, h.max - h.min);
+    return {
+      min: h.min,
+      max: h.max + p * Math.max(0, a)
+    };
+  }, [
+    n,
+    i.viewRange,
+    a
+  ]), c = Math.max(1, s.max - s.min), u = {
+    ...r,
+    "--span-timeline-min-ms": s.min,
+    "--span-timeline-max-ms": s.max,
+    "--span-timeline-range-ms": c
+  }, g = q({
+    render: e,
+    ref: t,
+    defaultTagName: "div",
+    props: {
+      ...o,
+      style: u,
+      "data-span-timeline": ""
+    }
+  });
+  return /* @__PURE__ */ l(Re.Provider, {
+    value: s,
+    children: g
+  });
+}
+function Vt({ render: e, ref: t, now: n, timeRange: a, style: r, ...o }) {
+  const i = ee(), s = H(), c = pe(Re), u = _t({
+    startedAt: i.startedAt,
+    endedAt: i.endedAt,
+    timeRange: a ?? c ?? s.viewRange,
+    now: n ?? s.now
+  }), g = {
+    ...r,
+    position: "absolute",
+    insetInlineStart: "var(--span-timeline-left)",
+    inlineSize: "max(var(--span-timeline-width), var(--span-timeline-min-width, 0px))",
+    "--span-timeline-left": `${u.leftPercent}%`,
+    "--span-timeline-end": `${u.endPercent}%`,
+    "--span-timeline-width": `${u.widthPercent}%`,
+    "--span-timeline-duration-ms": u.durationMs
+  };
+  return q({
+    render: e,
+    ref: t,
+    defaultTagName: "div",
+    props: {
+      ...o,
+      style: g,
+      "data-span-status": i.status,
+      "data-span-type": i.type,
+      "data-span-running": i.endedAt === null ? "" : void 0,
+      "data-clipped-start": u.clippedStart ? "" : void 0,
+      "data-clipped-end": u.clippedEnd ? "" : void 0
+    }
+  });
+}
+var Z = {
+  Provider: Pt,
+  Children: Rt,
+  Root: Dt,
+  Indent: Lt,
+  CollapseToggle: Ot,
+  StatusIndicator: zt,
+  TypeBadge: Ft,
+  Name: Kt,
+  Timeline: Wt,
+  TimelineBar: Vt
+}, jt = (e) => {
+  const t = Number(e.trim());
+  return t >= 500 && t < 600;
+}, De = [
+  {
+    namespace: "db",
+    icon: it,
+    pills: [{
+      label: "db.system",
+      keys: ["db.system.name", "db.system"]
+    }]
+  },
+  {
+    namespace: "http",
+    icon: bt,
+    pills: [{
+      label: "http.status_code",
+      keys: ["http.response.status_code", "http.status_code"],
+      error: jt
+    }, {
+      label: "http.method",
+      keys: ["http.request.method", "http.method"]
+    }]
+  },
+  {
+    namespace: "messaging",
+    icon: ut
+  },
+  {
+    namespace: "rpc",
+    icon: tt,
+    pills: [{
+      label: "rpc.system",
+      keys: ["rpc.system.name", "rpc.system"]
+    }]
+  },
+  {
+    namespace: "gen_ai",
+    pills: [{
+      label: "gen_ai.request.model",
+      keys: ["gen_ai.request.model"]
+    }]
+  }
+], Bt = {
+  agent: {
+    icon: ht,
+    label: "Agent"
+  },
+  llm: {
+    icon: ge,
+    label: "LLM call"
+  },
+  tool: {
+    icon: vt,
+    label: "Tool call"
+  },
+  retrieval: {
+    icon: ct,
+    label: "Retrieval"
+  },
+  generic: {
+    icon: ge,
+    label: "GenAI span"
+  }
+}, Ut = {
+  chat: "llm",
+  text_completion: "llm",
+  generate_content: "llm",
+  execute_tool: "tool",
+  invoke_agent: "agent",
+  create_agent: "agent",
+  embeddings: "retrieval",
+  retrieve: "retrieval"
+};
+function Gt(e) {
+  if (e == null) return "";
+  if (e instanceof Uint8Array) return JSON.stringify(Array.from(e));
+  if (typeof e == "object") try {
+    return JSON.stringify(e);
+  } catch {
+    return "[unserializable]";
+  }
+  return String(e).trim();
+}
+function me(e, t) {
+  if (e == null) return null;
+  for (const n of t) {
+    if (!(n in e)) continue;
+    const a = Gt(e[n]);
+    if (a !== "") return a;
+  }
+  return null;
+}
+function Xt(e) {
+  if (e == null) return null;
+  const t = me(e, ["gen_ai.operation.name"]);
+  return t != null ? Ut[t.toLowerCase()] ?? "generic" : Object.keys(e).some((n) => n.startsWith("gen_ai.")) ? "generic" : null;
+}
+function Ht(e) {
+  const t = Xt(e);
+  if (t != null) return Bt[t];
+  if (e == null) return null;
+  const n = /* @__PURE__ */ new Set();
+  for (const a of Object.keys(e)) {
+    const r = a.indexOf(".");
+    r > 0 && n.add(a.slice(0, r));
+  }
+  for (const a of De) if (a.icon && n.has(a.namespace)) return { icon: a.icon };
+  return null;
+}
+function Jt(e) {
+  const t = [];
+  if (e == null) return t;
+  for (const n of De) for (const a of n.pills ?? []) {
+    const r = me(e, a.keys);
+    if (r == null) continue;
+    const o = {
+      label: a.label,
+      value: r
+    };
+    a.error?.(r) && (o.error = !0), t.push(o);
+  }
+  return t;
+}
+function Zt(e) {
+  return me(e, ["peer.service", "server.address"]);
+}
+function Yt(e) {
+  return e.map((t) => {
+    const n = t.endedAt ?? null, a = {
+      id: t.id,
+      parentSpanId: t.parentSpanId ?? null,
+      name: t.name,
+      type: t.type ?? "",
+      status: t.status ?? (n == null ? "running" : "completed"),
+      startedAt: t.startedAt,
+      endedAt: n,
+      latencyMs: t.latencyMs ?? (n == null ? null : Math.max(0, n - t.startedAt))
+    };
+    return t.kind != null && (a.kind = t.kind), t.service != null && (a.service = t.service), t.attributes != null && (a.attributes = t.attributes), a;
+  });
+}
+function Qt(e, t) {
+  return e.latencyMs != null ? Math.max(0, e.latencyMs) : e.endedAt != null ? Math.max(0, e.endedAt - e.startedAt) : t != null ? Math.max(0, t - e.startedAt) : null;
+}
+var we = (e) => Math.min(1, Math.max(0, e));
+function Ne(e, t, n) {
+  const a = Math.max(1, t.max - t.min), r = e.endedAt ?? n ?? t.max, o = we((e.startedAt - t.min) / a);
+  return {
+    left: o,
+    width: we(Math.max(o, (r - t.min) / a)) - o
+  };
+}
+function qt(e, t = 6) {
+  if (e <= 0) return 1;
+  const n = e / t, a = 10 ** Math.floor(Math.log10(n));
+  for (const r of [
+    1,
+    2,
+    5,
+    10
+  ]) if (r * a >= n) return r * a;
+  return 10 * a;
+}
+function en(e, t) {
+  const n = t - e;
+  if (!(n > 0)) return [{
+    at: 0,
+    ms: e
+  }];
+  const a = qt(n), r = [], o = Math.ceil(e / a - 1e-9) * a;
+  for (let i = o; i <= t + 1e-9; i += a) {
+    const s = Number(i.toFixed(6));
+    r.push({
+      at: (s - e) / n,
+      ms: s
+    });
+  }
+  return r;
+}
+function re(e) {
+  if (!Number.isFinite(e)) return "";
+  const t = Math.abs(e);
+  return t < 10 ? `${e.toFixed(2)} ms` : t < 100 ? `${e.toFixed(1)} ms` : t < 1e3 ? `${Math.round(e)} ms` : t < 6e4 ? `${(e / 1e3).toFixed(2)} s` : `${(e / 6e4).toFixed(1)} min`;
+}
+function Le(e) {
+  return e === 0 ? "0" : e >= 1e3 ? `${Number((e / 1e3).toFixed(2))} s` : `${Number(e.toFixed(2))} ms`;
+}
+var tn = 7, le = 4, nn = 4;
+function an(e, t) {
+  if (e.length === 0 || t <= 0) return [];
+  const n = e[e.length - 1], a = [];
+  for (const r of e) {
+    const o = Le(r.ms), i = Math.max(o.length * tn, 8), s = r === n, c = r.at * t, u = s ? c - le - i : c + le, g = s ? c - le : c + le + i, h = a[a.length - 1];
+    if (h && u < h.right + nn) {
+      if (!s) continue;
+      a.pop();
+    }
+    a.push({
+      ms: r.ms,
+      right: g
+    });
+  }
+  return a.map((r) => r.ms);
+}
+function Y(e) {
+  return `${Number((e * 100).toFixed(4))}%`;
+}
+var Oe = "rounded-base border border-pho-secondary bg-pho-primary overflow-hidden", ze = "grid grid-cols-[minmax(0,1fr)_minmax(0,1fr)]", rn = "absolute inset-y-0 left-3 right-3", Fe = 12, Ke = 16, sn = 26;
+function on(e) {
+  return `${Fe + e * Ke + sn}px`;
+}
+var ln = 250, ke = 0.8, Me = 0.5, cn = 0.1, dn = 0.3, un = 5e-3, pn = {
+  completed: "bg-pho-inverse/25",
+  failed: "bg-pho-error-ink",
+  running: "bg-pho-inverse/15 motion-safe:animate-pulse",
+  skipped: "border-pho-secondary border border-dashed bg-transparent"
+}, Ae = {
+  completed: "bg-pho-inverse",
+  failed: "bg-pho-error-ink",
+  running: "bg-pho-inverse/40",
+  skipped: "border-pho-secondary border bg-transparent"
+}, hn = "border-pho-error-ink border bg-transparent", mn = {
+  completed: null,
+  failed: "Failed.",
+  running: "Running.",
+  skipped: "Skipped."
+}, se = "text-pho-secondary outline-pho-brand hover:bg-pho-ghost-hover hover:text-pho-secondary-hover flex size-6 shrink-0 cursor-pointer items-center justify-center rounded-sm transition-colors duration-100 ease-linear focus-visible:outline-2 disabled:pointer-events-none disabled:opacity-40", Se = (e) => ({ backgroundImage: `linear-gradient(to ${e === "left" ? "right" : "left"}, color-mix(in srgb, var(--background-color-pho-inverse) 18%, transparent), transparent)` }), de = (e, t, n = `${t}s`) => `${e} ${e === 1 ? t : n}`;
+function We({ className: e, clippedStart: t, clippedEnd: n, children: a }) {
+  return /* @__PURE__ */ x("div", {
+    className: L("border-pho-secondary relative border-l", e),
+    children: [
+      /* @__PURE__ */ l("div", {
+        "data-trace-track": "",
+        className: rn,
+        children: a
+      }),
+      t ? /* @__PURE__ */ l("span", {
+        "aria-hidden": !0,
+        "data-trace-clipped": "start",
+        className: "pointer-events-none absolute inset-y-0 left-0 w-2",
+        style: Se("left")
+      }) : null,
+      n ? /* @__PURE__ */ l("span", {
+        "aria-hidden": !0,
+        "data-trace-clipped": "end",
+        className: "pointer-events-none absolute inset-y-0 right-0 w-2",
+        style: Se("right")
+      }) : null
+    ]
+  });
+}
+function fn(e, t) {
+  return t > 0.5 ? "inside" : e + t > 0.8 ? "before" : "after";
+}
+function vn(e) {
+  if (!(e instanceof HTMLElement)) return !1;
+  const t = e.tagName;
+  return t === "INPUT" || t === "TEXTAREA" || t === "SELECT" || e.isContentEditable;
+}
+var Ve = ue(null);
+function je() {
+  const e = pe(Ve);
+  if (e == null) throw new Error("Trace rows render inside Trace.Waterfall only.");
+  return e;
+}
+function gn() {
+  const e = je(), t = ee(), { viewRange: n, now: a, byId: r, matches: o } = H(), { id: i, name: s, type: c, status: u, depth: g, isCollapsed: h, hasChildren: p } = t, S = e.spans.get(i), w = e.selectedId != null && e.selectedId === i, d = w && S != null ? e.renderSpanDetail?.(S) ?? null : null, m = e.renderSpanDetail != null ? `${e.idBase}-span-${i}` : void 0, A = e.onSelect ? () => e.onSelect?.(w ? null : i) : void 0, { left: b, width: $ } = Ne(t, n, a), _ = t.endedAt ?? a ?? n.max, E = t.startedAt < n.min && _ > n.min, N = _ > n.max && t.startedAt < n.max, v = fn(b, $), y = b > 1 - (b + $) ? "before" : "after", P = Qt(t, a), M = P == null ? null : re(P), J = [
+    t.service,
+    s,
+    M
+  ].filter(Boolean).join(" · "), z = [t.service, c].filter(Boolean).join(", "), W = h ? t.descendants : 0, F = h ? t.descendantErrors : 0, C = mn[u], k = u === "failed", B = Ht(t.attributes), te = Jt(t.attributes), R = h && t.kind === "client" && t.serverChildId != null ? r.get(t.serverChildId) : void 0, V = R != null ? R.service ?? R.name : !p && (t.kind === "client" || t.kind === "producer") ? Zt(t.attributes) : null, G = R ? Ne(R, n, a) : null, I = o?.has(i) ?? !1, T = e.activeMatchId === i, ne = (K) => K === "after" ? { left: `calc(${Y(b + $)} + 0.375rem)` } : { right: `calc(${Y(1 - b)} + 0.375rem)` };
+  return /* @__PURE__ */ x("li", {
+    className: "m-0",
+    style: { "--trace-indent": on(g) },
+    children: [/* @__PURE__ */ x(Z.Root, {
+      "data-trace-row": "",
+      "data-selected": w || void 0,
+      "data-active-match": T || void 0,
+      className: L(ze, "group/row relative min-h-9 items-center transition-colors", "has-[[data-trace-select]:focus-visible]:outline-pho-brand has-[[data-trace-select]:focus-visible]:outline-2 has-[[data-trace-select]:focus-visible]:-outline-offset-2", A != null && "hover:bg-pho-primary-hover", I && "bg-pho-brand-secondary", T && "ring-pho-brand ring-1 ring-inset", w && "bg-pho-primary-hover"),
+      children: [/* @__PURE__ */ x(Z.Indent, {
+        baseIndent: Fe,
+        indentPerLevel: Ke,
+        className: "flex min-w-0 items-center gap-1.5 py-1.5 pr-3",
+        children: [
+          p ? /* @__PURE__ */ l(Z.CollapseToggle, {
+            "aria-expanded": !h,
+            "aria-label": `${h ? "Expand" : "Collapse"} ${s}`,
+            className: "text-pho-secondary outline-pho-brand hover:bg-pho-ghost-hover hover:text-pho-secondary-hover relative z-10 flex size-5 shrink-0 cursor-pointer items-center justify-center rounded-sm transition-[color,background-color,transform] duration-100 ease-linear focus-visible:outline-2",
+            children: /* @__PURE__ */ l(Xe, {
+              "aria-hidden": !0,
+              className: L("size-4 transition-transform duration-150 ease-out", !h && "rotate-90")
+            })
+          }) : /* @__PURE__ */ l("span", {
+            "aria-hidden": !0,
+            className: "size-5 shrink-0"
+          }),
+          /* @__PURE__ */ l(Z.StatusIndicator, {
+            "aria-hidden": !0,
+            className: L("size-1.5 shrink-0 rounded-full", k ? Ae.failed : F > 0 ? hn : Ae[u])
+          }),
+          B ? /* @__PURE__ */ l(B.icon, {
+            "data-trace-icon": "",
+            role: B.label ? "img" : void 0,
+            "aria-label": B.label,
+            "aria-hidden": B.label ? void 0 : !0,
+            className: "text-pho-description size-3.5 shrink-0"
+          }) : null,
+          /* @__PURE__ */ x(bn, {
+            selected: w,
+            expanded: e.renderSpanDetail != null ? d != null : void 0,
+            controls: d != null ? m : void 0,
+            onSelect: A,
+            children: [
+              /* @__PURE__ */ l(Z.Name, { className: "text-pho-primary truncate text-base" }),
+              V ? /* @__PURE__ */ x("span", {
+                "data-trace-callee": "",
+                className: "text-pho-description flex shrink-0 items-center gap-0.5 text-xs",
+                children: [
+                  /* @__PURE__ */ l(qe, {
+                    "aria-hidden": !0,
+                    className: "size-3"
+                  }),
+                  /* @__PURE__ */ l("span", {
+                    className: "sr-only",
+                    children: "calls "
+                  }),
+                  V
+                ]
+              }) : null,
+              z ? /* @__PURE__ */ l("span", {
+                className: "text-pho-description shrink-[3] truncate text-xs",
+                children: z
+              }) : null,
+              te.map((K) => /* @__PURE__ */ l(Je, {
+                size: "xs",
+                contrast: "low",
+                color: K.error ? "error" : "gray",
+                title: `${K.label}: ${K.value}`,
+                "aria-label": `${K.label}: ${K.value}`,
+                "data-trace-pill": K.label,
+                "data-error": K.error || void 0,
+                className: "max-w-32 shrink-0 truncate",
+                children: K.value
+              }, K.label)),
+              W > 0 ? /* @__PURE__ */ x("span", {
+                className: "text-pho-description shrink-0 text-xs tabular-nums",
+                children: [
+                  "(",
+                  W,
+                  F > 0 ? `, ${de(F, "error")}` : "",
+                  ")"
+                ]
+              }) : null,
+              C ? /* @__PURE__ */ l("span", {
+                className: "sr-only",
+                children: C
+              }) : null,
+              F > 0 ? /* @__PURE__ */ x("span", {
+                className: "sr-only",
+                children: [de(F, "error"), " hidden."]
+              }) : null
+            ]
+          })
+        ]
+      }), /* @__PURE__ */ x(We, {
+        className: "h-9",
+        clippedStart: E,
+        clippedEnd: N,
+        children: [
+          /* @__PURE__ */ l(Z.TimelineBar, {
+            "aria-hidden": !0,
+            "data-trace-bar": "",
+            className: L("top-1/2 h-4 -translate-y-1/2 rounded-sm", pn[u]),
+            style: { "--span-timeline-min-width": "2px" },
+            children: v === "inside" && M ? /* @__PURE__ */ l("span", {
+              "data-trace-label": "short",
+              className: L("absolute inset-y-0 right-1.5 flex items-center text-xs whitespace-nowrap tabular-nums group-hover/row:hidden", k ? "text-pho-on-brand" : "text-pho-primary"),
+              children: M
+            }) : null
+          }),
+          R && G ? /* @__PURE__ */ l("span", {
+            "aria-hidden": !0,
+            "data-trace-rpc": "",
+            className: "bg-pho-inverse/45 absolute top-1/2 h-2 -translate-y-1/2 rounded-sm",
+            style: {
+              left: Y(G.left),
+              width: Y(G.width),
+              minWidth: "2px"
+            }
+          }) : null,
+          v !== "inside" && M ? /* @__PURE__ */ l("span", {
+            "aria-hidden": !0,
+            "data-trace-label": "short",
+            className: "text-pho-description absolute top-1/2 -translate-y-1/2 text-xs whitespace-nowrap tabular-nums group-hover/row:hidden",
+            style: ne(v),
+            children: M
+          }) : null,
+          M ? /* @__PURE__ */ l("span", {
+            "aria-hidden": !0,
+            "data-trace-label": "long",
+            className: "text-pho-primary absolute top-1/2 hidden -translate-y-1/2 text-xs whitespace-nowrap tabular-nums group-hover/row:block",
+            style: ne(y),
+            children: J
+          }) : null,
+          M ? /* @__PURE__ */ l("span", {
+            className: "sr-only",
+            children: M
+          }) : null
+        ]
+      })]
+    }), d != null ? /* @__PURE__ */ l(ve.Root, {
+      open: !0,
+      children: /* @__PURE__ */ l(ve.Panel, {
+        className: "motion-reduce:transition-none",
+        children: /* @__PURE__ */ l("section", {
+          id: m,
+          "data-trace-detail": "",
+          className: "border-pho-secondary bg-pho-page border-t py-3 pr-3",
+          style: { paddingLeft: "var(--trace-indent)" },
+          children: d
+        })
+      })
+    }) : null]
+  });
+}
+function bn({ selected: e, expanded: t, controls: n, onSelect: a, children: r }) {
+  const o = "flex min-w-0 flex-1 items-baseline gap-2 text-left";
+  return a == null ? /* @__PURE__ */ l("span", {
+    className: o,
+    children: r
+  }) : /* @__PURE__ */ l("button", {
+    type: "button",
+    "data-trace-select": "",
+    "aria-current": e ? "true" : void 0,
+    "aria-expanded": t,
+    "aria-controls": n,
+    onClick: a,
+    className: L(o, "cursor-pointer outline-none after:absolute after:inset-0 after:content-['']"),
+    children: r
+  });
+}
+function xn(e) {
+  const [t, n] = Q(void 0);
+  return ae(() => {
+    if (!e) return;
+    n(Date.now());
+    const a = setInterval(() => n(Date.now()), ln);
+    return () => clearInterval(a);
+  }, [e]), e ? t : void 0;
+}
+function yn({ spans: e, now: t, selectedId: n, onSelect: a, renderSpanDetail: r, defaultCollapsed: o, collapsed: i, onCollapsedChange: s, foldControls: c = !0, search: u, query: g, onQueryChange: h, defaultView: p, view: S, onViewChange: w, shortcuts: d = "focus", title: m, summary: A, startedAt: b, footer: $, className: _, ...E }) {
+  const N = D(() => Yt(e), [e]), v = D(() => new Map(e.map((C) => [C.id, C])), [e]), y = xn(N.some((C) => C.endedAt == null) && t === void 0), P = t ?? y, [M, J] = Q(""), z = g ?? M, W = O((C) => {
+    g == null && J(C), h?.(C);
+  }, [g, h]), F = D(() => N.filter((C) => C.status === "failed").length, [N]);
+  return /* @__PURE__ */ l(Z.Provider, {
+    spans: N,
+    now: P,
+    defaultCollapsed: o,
+    collapsed: i,
+    onCollapsedChange: s,
+    query: z,
+    defaultView: p,
+    view: S,
+    onViewChange: w,
+    children: /* @__PURE__ */ l(wn, {
+      sources: v,
+      spanCount: N.length,
+      errorCount: F,
+      selectedId: n,
+      onSelect: a,
+      renderSpanDetail: r,
+      foldControls: c,
+      search: u,
+      query: z,
+      setQuery: W,
+      shortcuts: d,
+      title: m,
+      summary: A,
+      startedAt: b,
+      footer: $,
+      className: _,
+      ...E
+    })
+  });
+}
+function wn({ sources: e, spanCount: t, errorCount: n, selectedId: a, onSelect: r, renderSpanDetail: o, foldControls: i, search: s, query: c, setQuery: u, shortcuts: g, title: h, summary: p, startedAt: S, footer: w, className: d, ref: m, ...A }) {
+  const { all: b, matches: $, zoomed: _, zoom: E, pan: N, resetView: v, expandAll: y, collapseAll: P, expandOne: M, collapseOne: J } = H(), z = Ze(), W = he(null), F = he(null), C = O((f) => {
+    W.current = f, typeof m == "function" ? m(f) : m != null && (m.current = f);
+  }, [m]), k = D(() => $ == null ? [] : b.filter((f) => $.has(f.id)).map((f) => f.id), [b, $]), [B, te] = Q(0);
+  ae(() => te(0), [c]);
+  const R = k.length > 0 ? k[B % k.length] ?? null : null, V = O((f) => {
+    k.length !== 0 && te((j) => (j + f + k.length) % k.length);
+  }, [k.length]);
+  ae(() => {
+    if (R == null) return;
+    const f = typeof CSS < "u" && typeof CSS.escape == "function" ? CSS.escape(R) : R.replace(/"/g, '\\"');
+    W.current?.querySelector(`[data-trace-row][data-span-id="${f}"]`)?.scrollIntoView?.({ block: "nearest" });
+  }, [R]);
+  const G = c !== "", I = a != null && r != null;
+  ae(() => {
+    if (!G && !_ && !I || g === !1) return;
+    const f = (j) => {
+      j.key === "Escape" && (g === "focus" && !(j.target instanceof Node && W.current?.contains(j.target)) || (j.preventDefault(), j.stopPropagation(), G ? u("") : _ ? v() : r?.(null)));
+    };
+    return document.addEventListener("keydown", f, !0), () => document.removeEventListener("keydown", f, !0);
+  }, [
+    G,
+    _,
+    I,
+    g,
+    u,
+    v,
+    r
+  ]);
+  const T = O((f) => {
+    if (f.metaKey || f.ctrlKey || f.altKey || vn(f.target)) return !1;
+    switch (f.key) {
+      case "[":
+        return y(), !0;
+      case "]":
+        return P(), !0;
+      case "o":
+        return M(), !0;
+      case "p":
+        return J(), !0;
+      case "ArrowUp":
+        return E(f.shiftKey ? Me : ke), !0;
+      case "ArrowDown":
+        return _ ? (E(f.shiftKey ? 1 / Me : 1 / ke), !0) : !1;
+      case "ArrowLeft":
+        return _ ? (N(f.shiftKey ? -0.3 : -0.1), !0) : !1;
+      case "ArrowRight":
+        return _ ? (N(f.shiftKey ? dn : cn), !0) : !1;
+      case "/":
+        return F.current == null ? !1 : (F.current.focus(), !0);
+      case "f":
+        return k.length === 0 ? !1 : (V(1), !0);
+      case "b":
+        return k.length === 0 ? !1 : (V(-1), !0);
+      default:
+        return !1;
+    }
+  }, [
+    y,
+    P,
+    M,
+    J,
+    E,
+    N,
+    _,
+    k.length,
+    V
+  ]);
+  ae(() => {
+    if (g === !1) return;
+    const f = (j) => {
+      g === "focus" && !(j.target instanceof Node && W.current?.contains(j.target)) || T(j) && j.preventDefault();
+    };
+    return document.addEventListener("keydown", f), () => document.removeEventListener("keydown", f);
+  }, [g, T]);
+  const ne = D(() => ({
+    spans: e,
+    selectedId: a,
+    onSelect: r,
+    renderSpanDetail: o,
+    idBase: z,
+    spanCount: t,
+    errorCount: n,
+    startedAt: S,
+    activeMatchId: R
+  }), [
+    e,
+    a,
+    r,
+    o,
+    z,
+    t,
+    n,
+    S,
+    R
+  ]), K = b.some((f) => f.hasChildren), Ue = s === !0 || typeof s == "string", fe = typeof s == "string" ? s : "Search spans", Ge = w === void 0 ? t > 0 ? /* @__PURE__ */ l(Be, {}) : null : w;
+  return /* @__PURE__ */ l(Ve.Provider, {
+    value: ne,
+    children: /* @__PURE__ */ x("section", {
+      ref: C,
+      "data-trace": "",
+      "data-zoomed": _ || void 0,
+      "aria-label": typeof h == "string" ? h : "Trace",
+      tabIndex: g === "focus" ? -1 : void 0,
+      className: L(Oe, "min-w-0 outline-none", d),
+      ...A,
+      children: [
+        Ue ? /* @__PURE__ */ x("div", {
+          "data-trace-toolbar": "",
+          className: "border-pho-secondary flex min-h-10 items-center gap-3 border-b px-3",
+          children: [/* @__PURE__ */ l(He, {
+            ref: F,
+            value: c,
+            onChange: u,
+            placeholder: fe,
+            "aria-label": fe,
+            onKeyDown: (f) => {
+              f.key === "Enter" ? (f.preventDefault(), V(f.shiftKey ? -1 : 1)) : f.key === "Escape" && c !== "" && (f.preventDefault(), u(""));
+            }
+          }), G ? /* @__PURE__ */ x(Ye, { children: [/* @__PURE__ */ l("span", {
+            "data-trace-match-count": "",
+            "aria-live": "polite",
+            className: "text-pho-description shrink-0 text-xs tabular-nums",
+            children: k.length === 0 ? "No matches" : `${B % k.length + 1} of ${k.length}`
+          }), /* @__PURE__ */ x("span", {
+            className: "flex shrink-0 items-center",
+            children: [/* @__PURE__ */ l("button", {
+              type: "button",
+              "aria-label": "Previous match",
+              title: "Previous match (b)",
+              disabled: k.length === 0,
+              onClick: () => V(-1),
+              className: se,
+              children: /* @__PURE__ */ l(Te, {
+                "aria-hidden": !0,
+                className: "size-4"
+              })
+            }), /* @__PURE__ */ l("button", {
+              type: "button",
+              "aria-label": "Next match",
+              title: "Next match (f)",
+              disabled: k.length === 0,
+              onClick: () => V(1),
+              className: se,
+              children: /* @__PURE__ */ l(Ie, {
+                "aria-hidden": !0,
+                className: "size-4"
+              })
+            })]
+          })] }) : null]
+        }) : null,
+        /* @__PURE__ */ x("div", {
+          "data-trace-axis": "",
+          className: L(ze, "border-pho-secondary h-10 border-b"),
+          children: [/* @__PURE__ */ x("div", {
+            className: "flex h-10 min-w-0 items-center gap-2 px-3",
+            children: [
+              h != null ? /* @__PURE__ */ l("div", {
+                className: "text-pho-secondary min-w-0 truncate text-xs font-medium",
+                children: h
+              }) : null,
+              p != null ? /* @__PURE__ */ l("div", {
+                className: "text-pho-description shrink-0 text-xs tabular-nums",
+                children: p
+              }) : null,
+              i && K ? /* @__PURE__ */ l(Nn, {}) : null
+            ]
+          }), /* @__PURE__ */ l(kn, {})]
+        }),
+        /* @__PURE__ */ l(Z.Timeline, {
+          render: /* @__PURE__ */ l("ol", {
+            "aria-label": typeof h == "string" ? h : "Spans",
+            className: "m-0 list-none p-0"
+          }),
+          children: /* @__PURE__ */ l(Z.Children, { children: () => /* @__PURE__ */ l(gn, {}) })
+        }),
+        Ge
+      ]
+    })
+  });
+}
+function Nn() {
+  const { canExpand: e, canCollapse: t, expandAll: n, collapseAll: a, expandOne: r, collapseOne: o } = H();
+  return /* @__PURE__ */ x("fieldset", {
+    "data-trace-fold-controls": "",
+    className: "m-0 ml-auto flex min-w-0 shrink-0 items-center border-0 p-0",
+    children: [
+      /* @__PURE__ */ l("legend", {
+        className: "sr-only",
+        children: "Fold"
+      }),
+      /* @__PURE__ */ l("button", {
+        type: "button",
+        "aria-label": "Expand one level",
+        title: "Expand one level (o)",
+        disabled: !e,
+        onClick: r,
+        className: se,
+        children: /* @__PURE__ */ l(Ie, {
+          "aria-hidden": !0,
+          className: "size-4"
+        })
+      }),
+      /* @__PURE__ */ l("button", {
+        type: "button",
+        "aria-label": "Collapse one level",
+        title: "Collapse one level (p)",
+        disabled: !t,
+        onClick: o,
+        className: se,
+        children: /* @__PURE__ */ l(Te, {
+          "aria-hidden": !0,
+          className: "size-4"
+        })
+      }),
+      /* @__PURE__ */ l("button", {
+        type: "button",
+        "aria-label": "Expand all",
+        title: "Expand all ([)",
+        disabled: !e,
+        onClick: n,
+        className: se,
+        children: /* @__PURE__ */ l(at, {
+          "aria-hidden": !0,
+          className: "size-4"
+        })
+      }),
+      /* @__PURE__ */ l("button", {
+        type: "button",
+        "aria-label": "Collapse all",
+        title: "Collapse all (])",
+        disabled: !t,
+        onClick: a,
+        className: se,
+        children: /* @__PURE__ */ l(st, {
+          "aria-hidden": !0,
+          className: "size-4"
+        })
+      })
+    ]
+  });
+}
+function kn() {
+  const { range: e, view: t, viewRange: n, setView: a, resetView: r } = H(), o = n.min - e.min, i = n.max - e.min, s = D(() => en(o, i), [o, i]), [c, u] = Q(280), g = he(null);
+  ae(() => {
+    const v = g.current;
+    if (v == null) return;
+    const y = () => {
+      const M = v.clientWidth;
+      M > 0 && u(M);
+    };
+    y();
+    const P = new ResizeObserver(y);
+    return P.observe(v), () => P.disconnect();
+  }, []);
+  const h = new Set(an(s, c)), p = s[s.length - 1], [S, w] = Q(null), [d, m] = Q(null), A = (v) => {
+    const y = v.currentTarget.getBoundingClientRect();
+    return y.width <= 0 ? 0 : Math.min(1, Math.max(0, (v.clientX - y.left) / y.width));
+  }, b = (v) => {
+    if (v.button !== 0) return;
+    v.currentTarget.setPointerCapture?.(v.pointerId);
+    const y = A(v);
+    m({
+      from: y,
+      to: y
+    });
+  }, $ = (v) => {
+    const y = A(v);
+    d && m({
+      from: d.from,
+      to: y
+    }), w(y);
+  }, _ = (v) => {
+    if (!d) return;
+    const y = A(v);
+    m(null);
+    const [P, M] = d.from < y ? [d.from, y] : [y, d.from];
+    M - P < un || a([xe(t, P), xe(t, M)]);
+  }, E = () => {
+    w(null), m(null);
+  }, N = d == null ? null : d.from < d.to ? {
+    left: d.from,
+    width: d.to - d.from
+  } : {
+    left: d.to,
+    width: d.from - d.to
+  };
+  return /* @__PURE__ */ l(We, {
+    className: "h-10",
+    children: /* @__PURE__ */ x("div", {
+      ref: g,
+      "aria-hidden": !0,
+      role: "presentation",
+      "data-trace-axis-track": "",
+      title: "Drag to zoom, double-click to reset",
+      className: "absolute inset-0 cursor-crosshair touch-none select-none",
+      onPointerDown: b,
+      onPointerMove: $,
+      onPointerUp: _,
+      onPointerCancel: E,
+      onPointerLeave: E,
+      onDoubleClick: r,
+      children: [
+        s.map((v) => {
+          const y = v === p;
+          return /* @__PURE__ */ x("span", {
+            "data-trace-tick": "",
+            "data-labeled": h.has(v.ms) || void 0,
+            className: "text-pho-description absolute inset-y-0 text-xs tabular-nums",
+            style: { left: Y(v.at) },
+            children: [/* @__PURE__ */ l("span", { className: "bg-pho-secondary absolute bottom-0 left-0 h-1.5 w-px" }), h.has(v.ms) ? /* @__PURE__ */ l("span", {
+              className: L("absolute inset-y-0 flex items-center whitespace-nowrap", y ? "right-1" : "left-1"),
+              children: Le(v.ms)
+            }) : null]
+          }, v.ms);
+        }),
+        S != null && N == null ? /* @__PURE__ */ l("span", {
+          "data-trace-cursor": "",
+          className: "bg-pho-inverse/40 pointer-events-none absolute inset-y-0 w-px",
+          style: { left: Y(S) },
+          children: /* @__PURE__ */ l("span", {
+            className: L("bg-pho-primary text-pho-secondary absolute top-1 rounded-sm px-1 text-[10px] whitespace-nowrap tabular-nums", S > 0.8 ? "right-1" : "left-1"),
+            children: re(o + S * (i - o))
+          })
+        }) : null,
+        N ? /* @__PURE__ */ l("span", {
+          "data-trace-selection": "",
+          className: "bg-pho-inverse/10 pointer-events-none absolute inset-y-0",
+          style: {
+            left: Y(N.left),
+            width: Y(N.width)
+          }
+        }) : null
+      ]
+    })
+  });
+}
+function Mn(e) {
+  const t = new Date(e);
+  if (!Number.isFinite(e) || Number.isNaN(t.getTime())) return "";
+  const n = (a, r = 2) => String(a).padStart(r, "0");
+  return `Started ${n(t.getHours())}:${n(t.getMinutes())}:${n(t.getSeconds())}.${n(t.getMilliseconds(), 3)}`;
+}
+function An({ spanCount: e, errorCount: t, orphanCount: n = 0, durationMs: a, window: r, startedAt: o }) {
+  const i = [de(e, "span")];
+  if (t > 0 && i.push(de(t, "error")), n > 0 && i.push(`${n} missing ${n === 1 ? "parent" : "parents"}`), i.push(r ? `${re(r.startMs)} – ${re(r.endMs)} of ${re(a)}` : `${re(a)} total`), o != null) {
+    const s = Mn(o);
+    s && i.push(s);
+  }
+  return i;
+}
+function Be({ startedAt: e, className: t, ...n }) {
+  const { spanCount: a, errorCount: r, startedAt: o } = je(), { range: i, viewRange: s, zoomed: c, orphans: u, resetView: g } = H(), h = An({
+    spanCount: a,
+    errorCount: r,
+    orphanCount: u,
+    durationMs: i.max - i.min,
+    window: c ? {
+      startMs: s.min - i.min,
+      endMs: s.max - i.min
+    } : null,
+    startedAt: e ?? o
+  });
+  return /* @__PURE__ */ x("div", {
+    "data-trace-footer": "",
+    className: L("border-pho-secondary text-pho-description flex h-10 items-center justify-between gap-3 border-t px-3 text-xs", t),
+    ...n,
+    children: [/* @__PURE__ */ x("ul", {
+      className: "flex min-w-0 items-center gap-3",
+      children: [/* @__PURE__ */ l(Ce, {
+        className: "bg-pho-inverse/25",
+        label: "Span"
+      }), /* @__PURE__ */ l(Ce, {
+        className: "bg-pho-error-ink",
+        label: "Error"
+      })]
+    }), /* @__PURE__ */ x("div", {
+      className: "flex min-w-0 items-center gap-3",
+      children: [/* @__PURE__ */ l("ul", {
+        className: "flex min-w-0 items-center gap-3 tabular-nums",
+        children: h.map((p) => /* @__PURE__ */ l("li", {
+          className: "shrink-0 last:min-w-0 last:truncate",
+          children: p
+        }, p))
+      }), c ? /* @__PURE__ */ l("button", {
+        type: "button",
+        "data-trace-reset-zoom": "",
+        onClick: g,
+        title: "Reset zoom (Esc)",
+        className: "text-pho-secondary hover:text-pho-primary outline-pho-brand shrink-0 cursor-pointer rounded-sm underline-offset-2 hover:underline focus-visible:outline-2",
+        children: "Reset zoom"
+      }) : null]
+    })]
+  });
+}
+function Ce({ className: e, label: t }) {
+  return /* @__PURE__ */ x("li", {
+    className: "flex items-center gap-1.5",
+    children: [/* @__PURE__ */ l("span", {
+      "aria-hidden": !0,
+      className: L("size-2.5 shrink-0 rounded-sm", e)
+    }), t]
+  });
+}
+var Sn = {
+  debug: "text-pho-description",
+  info: "text-pho-secondary",
+  warn: "text-pho-warning",
+  error: "text-pho-error"
+};
+function Cn({ logs: e, spans: t, title: n = "Logs", className: a, ...r }) {
+  const o = D(() => new Map((t ?? []).map((i) => [i.id, i.name])), [t]);
+  return e == null || e.length === 0 ? null : /* @__PURE__ */ x("section", {
+    "data-trace-logs": "",
+    className: L(Oe, "min-w-0", a),
+    ...r,
+    children: [/* @__PURE__ */ x("div", {
+      className: "border-pho-secondary flex min-h-10 items-center justify-between gap-3 border-b px-3",
+      children: [/* @__PURE__ */ l("div", {
+        className: "text-pho-secondary min-w-0 truncate text-xs font-medium",
+        children: n
+      }), /* @__PURE__ */ x("div", {
+        className: "text-pho-description shrink-0 text-xs tabular-nums",
+        children: [
+          e.length,
+          " ",
+          e.length === 1 ? "line" : "lines"
+        ]
+      })]
+    }), /* @__PURE__ */ l("ol", {
+      className: "divide-pho-secondary m-0 list-none divide-y p-0 font-mono text-xs",
+      children: e.map((i, s) => {
+        const c = i.level ?? "info", u = i.spanId ? o.get(i.spanId) : void 0;
+        return /* @__PURE__ */ x("li", {
+          className: "grid grid-cols-[5rem_3.5rem_minmax(0,1fr)] items-baseline gap-3 px-3 py-1.5",
+          children: [
+            /* @__PURE__ */ x("span", {
+              className: "text-pho-description tabular-nums",
+              children: ["+", re(i.offsetMs)]
+            }),
+            /* @__PURE__ */ l("span", {
+              className: L("truncate", Sn[c]),
+              children: c.charAt(0).toUpperCase() + c.slice(1)
+            }),
+            /* @__PURE__ */ x("span", {
+              className: "text-pho-primary [overflow-wrap:anywhere] whitespace-pre-wrap",
+              children: [i.message, u ? /* @__PURE__ */ x("span", {
+                className: "text-pho-description",
+                children: [" ", u]
+              }) : null]
+            })
+          ]
+        }, i.id ?? s);
+      })
+    })]
+  });
+}
+var In = Object.assign(yn, { Footer: Be }), Wn = {
+  Waterfall: In,
+  Logs: Cn
+};
+export {
+  _e as A,
+  Ct as B,
+  ce as C,
+  oe as D,
+  Kn as E,
+  _t as F,
+  At as I,
+  xe as L,
+  $t as M,
+  Tt as N,
+  wt as O,
+  It as P,
+  St as R,
+  be as S,
+  yt as T,
+  Ht as _,
+  Ne as a,
+  ee as b,
+  an as c,
+  Qt as d,
+  Bt as f,
+  Zt as g,
+  Xt as h,
+  en as i,
+  Mt as j,
+  kt as k,
+  qt as l,
+  Gt as m,
+  An as n,
+  re as o,
+  me as p,
+  on as r,
+  Le as s,
+  Wn as t,
+  Yt as u,
+  Jt as v,
+  Nt as w,
+  H as x,
+  Z as y,
+  Ee as z
+};
+
+//# sourceMappingURL=trace-Ba1RMBfk.js.map