llmtap 0.1.4 → 0.1.7

package/dist/dashboard/assets/Settings-DzwivrGY.js

@@ -1,6 +0,0 @@
-import{c as h,v as Y,r as a,j as e,m as x,w as Z,D as ee,X as B,x as te,y as se,z as ae,f as ne,B as le,E as re,F as oe}from"./index-M3DwcRrc.js";import{u as ie,P as de,d as U}from"./format-CNuIwzac.js";import{C as f,a as ce,D as w}from"./download-B-39NUBC.js";const xe=[["ellipse",{cx:"12",cy:"5",rx:"9",ry:"3",key:"msslwz"}],["path",{d:"M3 5V19A9 3 0 0 0 21 19V5",key:"1wlel7"}],["path",{d:"M3 12A9 3 0 0 0 21 12",key:"mv7ke4"}]],pe=h("database",xe);const me=[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"M12 16v-4",key:"1dtifu"}],["path",{d:"M12 8h.01",key:"e9boi3"}]],he=h("info",me);const ue=[["path",{d:"M5 12h14",key:"1ays0h"}],["path",{d:"M12 5v14",key:"s699le"}]],be=h("plus",ue);const ye=[["path",{d:"M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z",key:"1ffxy3"}],["path",{d:"m21.854 2.147-10.94 10.939",key:"12cjpa"}]],ge=h("send",ye);const je=[["line",{x1:"10",x2:"14",y1:"2",y2:"2",key:"14vaq8"}],["line",{x1:"12",x2:"15",y1:"14",y2:"11",key:"17fdiu"}],["circle",{cx:"12",cy:"14",r:"8",key:"1e1u0o"}]],fe=h("timer",je);const we=[["path",{d:"M10 11v6",key:"nco0om"}],["path",{d:"M14 11v6",key:"outv1u"}],["path",{d:"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6",key:"miytrc"}],["path",{d:"M3 6h18",key:"d0wm0j"}],["path",{d:"M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2",key:"e791ji"}]],ve=h("trash-2",we);function z(o){if(o===0)return"0 B";const i=["B","KB","MB","GB"],d=Math.min(Math.floor(Math.log(o)/Math.log(1024)),i.length-1);return`${(o/Math.pow(1024,d)).toFixed(d===0?0:1)} ${i[d]}`}function u({label:o,value:i,mono:d}){return e.jsxs("div",{className:"flex items-center justify-between gap-4 rounded-2xl border border-white/6 bg-white/4 px-4 py-3",children:[e.jsx("span",{className:"text-sm text-slate-400",children:o}),e.jsx("span",{className:`text-sm font-medium text-white ${d?"font-mono":""}`,children:i})]})}function Se(){const o=Y(),[i,d]=a.useState(!1),[J,M]=a.useState(!1),[b,P]=a.useState(!1),[K,$]=a.useState(null),[y,E]=a.useState([]),[Q,v]=a.useState(!1),[l,p]=a.useState({provider:"",model:"",inputCostPer1M:"",outputCostPer1M:""}),[g,V]=a.useState("30"),[q,D]=a.useState(!1),[N,O]=a.useState(null),[R,T]=a.useState(!1),[k,G]=a.useState(""),[C,H]=a.useState("llmtap"),[A,L]=a.useState(!1),[S,j]=a.useState(null),[I,_]=a.useState(!1),{data:n}=ie({queryKey:["db-info"],queryFn:oe});async function W(){if(confirm("Delete all trace data? This cannot be undone.")){d(!0);try{await le(),M(!0),o.invalidateQueries(),setTimeout(()=>M(!1),3e3)}catch(t){alert(`Reset failed: ${t instanceof Error?t.message:String(t)}`)}finally{d(!1)}}}async function F(t){P(!0);try{const s=await re(t),m=new Blob([s],{type:t==="json"?"application/json":"text/csv"}),r=URL.createObjectURL(m),c=document.createElement("a");c.href=r,c.download=`llmtap-traces-${new Date().toISOString().slice(0,10)}.${t}`,document.body.appendChild(c),c.click(),document.body.removeChild(c),URL.revokeObjectURL(r)}catch(s){alert(`Export failed: ${s instanceof Error?s.message:String(s)}`)}finally{P(!1)}}function X(t,s){navigator.clipboard.writeText(t).catch(()=>{}),$(s),setTimeout(()=>$(null),2e3)}return e.jsx(de,{eyebrow:"Control Panel",title:"Configure, export, and manage your local collector.",description:"Database status, data export, and maintenance controls. Everything runs locally on your machine — your data never leaves.",aside:e.jsxs("div",{className:"insight-panel",children:[e.jsx(ne,{}),e.jsx("div",{className:"mt-4 space-y-3",children:e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Database"}),e.jsx("div",{className:"mt-2 text-lg font-medium text-white",children:n?z(n.sizeBytes):"..."}),e.jsxs("div",{className:"mt-1 text-sm text-slate-400",children:[n?.spanCount??0," spans stored"]})]})})]}),children:e.jsxs("div",{className:"grid gap-5 xl:grid-cols-2",children:[e.jsxs(x.div,{className:"dashboard-shell rounded-[26px] px-5 py-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{duration:.35},children:[e.jsxs("div",{className:"mb-5 flex items-center gap-2",children:[e.jsx(pe,{className:"h-4 w-4 text-sky-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"Database status"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(u,{label:"Size on disk",value:n?z(n.sizeBytes):"-"}),e.jsx(u,{label:"Total spans",value:String(n?.spanCount??0),mono:!0}),e.jsx(u,{label:"Total traces",value:String(n?.traceCount??0),mono:!0}),e.jsx(u,{label:"Journal mode",value:n?.walMode?.toUpperCase()??"-",mono:!0}),e.jsx(u,{label:"Data range",value:n?.oldestSpan&&n?.newestSpan?`${U(n.oldestSpan)} to ${U(n.newestSpan)}`:"No data"}),e.jsxs("div",{className:"flex items-center justify-between gap-4 rounded-2xl border border-white/6 bg-white/4 px-4 py-3",children:[e.jsx("span",{className:"text-sm text-slate-400",children:"Storage path"}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"max-w-[220px] truncate font-mono text-xs text-slate-300",children:n?.path??"-"}),n?.path&&e.jsx("button",{type:"button",onClick:()=>X(n.path,"path"),className:"rounded-lg border border-white/8 bg-white/4 p-1.5 text-slate-400 transition-colors hover:text-white",children:K==="path"?e.jsx(f,{className:"h-3 w-3 text-emerald-300"}):e.jsx(ce,{className:"h-3 w-3"})})]})]})]})]}),e.jsxs("div",{className:"space-y-5",children:[e.jsxs(x.div,{className:"dashboard-shell rounded-[26px] px-5 py-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:.1,duration:.35},children:[e.jsxs("div",{className:"mb-5 flex items-center gap-2",children:[e.jsx(w,{className:"h-4 w-4 text-emerald-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"Export data"})]}),e.jsx("p",{className:"mb-4 text-sm text-slate-400",children:"Download all trace data for offline analysis, backup, or migration."}),e.jsxs("div",{className:"flex gap-3",children:[e.jsxs("button",{type:"button",onClick:()=>F("json"),disabled:b,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(w,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:b?"Exporting...":"Export JSON"})]}),e.jsxs("button",{type:"button",onClick:()=>F("csv"),disabled:b,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(w,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:b?"Exporting...":"Export CSV"})]})]})]}),e.jsxs(x.div,{className:"dashboard-shell rounded-[26px] px-5 py-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:.15,duration:.35},children:[e.jsxs("div",{className:"mb-5 flex items-center gap-2",children:[e.jsx(ve,{className:"h-4 w-4 text-rose-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"Reset data"})]}),e.jsx("p",{className:"mb-4 text-sm text-slate-400",children:"Permanently delete all stored traces and spans. This action cannot be undone."}),e.jsx("button",{type:"button",onClick:W,disabled:i,className:"inline-flex items-center gap-2 rounded-full border border-rose-400/20 bg-rose-400/8 px-4 py-2.5 text-sm font-medium text-rose-200 transition-colors hover:border-rose-400/30 hover:bg-rose-400/14 disabled:cursor-not-allowed disabled:opacity-50",children:J?e.jsxs(e.Fragment,{children:[e.jsx(f,{className:"h-4 w-4 text-emerald-300"}),e.jsx("span",{children:"Data cleared"})]}):e.jsxs(e.Fragment,{children:[e.jsx(Z,{className:`h-4 w-4 ${i?"animate-spin":""}`}),e.jsx("span",{children:i?"Resetting...":"Reset all data"})]})})]}),e.jsxs(x.div,{className:"dashboard-shell rounded-[26px] px-5 py-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:.2,duration:.35},children:[e.jsxs("div",{className:"mb-5 flex items-center gap-2",children:[e.jsx(ee,{className:"h-4 w-4 text-amber-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"Pricing overrides"})]}),e.jsx("p",{className:"mb-4 text-sm text-slate-400",children:"Override built-in per-model pricing. Use this for custom or private models not in the default table."}),y.length>0&&e.jsx("div",{className:"mb-4 space-y-2",children:y.map((t,s)=>e.jsxs("div",{className:"flex items-center justify-between gap-3 rounded-2xl border border-white/6 bg-white/4 px-4 py-3",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("span",{className:"rounded-full border border-white/10 bg-white/6 px-2 py-0.5 text-[10px] font-bold uppercase tracking-[0.16em] text-slate-300",children:t.provider}),e.jsx("span",{className:"font-mono text-sm text-white",children:t.model})]}),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("span",{className:"font-mono text-xs text-slate-400",children:["$",t.inputCostPer1M,"/M in"]}),e.jsxs("span",{className:"font-mono text-xs text-slate-400",children:["$",t.outputCostPer1M,"/M out"]}),e.jsx("button",{type:"button",onClick:()=>E(m=>m.filter((r,c)=>c!==s)),className:"rounded-lg border border-white/8 bg-white/4 p-1.5 text-slate-500 transition-colors hover:text-rose-300",children:e.jsx(B,{className:"h-3 w-3"})})]})]},`${t.provider}-${t.model}`))}),Q?e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsxs("div",{className:"grid grid-cols-2 gap-3 sm:grid-cols-4",children:[e.jsx("input",{value:l.provider,onChange:t=>p(s=>({...s,provider:t.target.value})),placeholder:"Provider",className:"rounded-xl border border-white/8 bg-white/4 px-3 py-2 text-sm text-white placeholder:text-slate-500 focus:border-emerald-400/30 focus:outline-none"}),e.jsx("input",{value:l.model,onChange:t=>p(s=>({...s,model:t.target.value})),placeholder:"Model name",className:"rounded-xl border border-white/8 bg-white/4 px-3 py-2 text-sm text-white placeholder:text-slate-500 focus:border-emerald-400/30 focus:outline-none"}),e.jsx("input",{value:l.inputCostPer1M,onChange:t=>p(s=>({...s,inputCostPer1M:t.target.value})),placeholder:"Input $/M",type:"number",step:"0.01",className:"rounded-xl border border-white/8 bg-white/4 px-3 py-2 text-sm text-white placeholder:text-slate-500 focus:border-emerald-400/30 focus:outline-none"}),e.jsx("input",{value:l.outputCostPer1M,onChange:t=>p(s=>({...s,outputCostPer1M:t.target.value})),placeholder:"Output $/M",type:"number",step:"0.01",className:"rounded-xl border border-white/8 bg-white/4 px-3 py-2 text-sm text-white placeholder:text-slate-500 focus:border-emerald-400/30 focus:outline-none"})]}),e.jsxs("div",{className:"mt-3 flex items-center gap-2",children:[e.jsxs("button",{type:"button",onClick:()=>{l.provider&&l.model&&l.inputCostPer1M&&l.outputCostPer1M&&(E(t=>[...t,{...l}]),p({provider:"",model:"",inputCostPer1M:"",outputCostPer1M:""}),v(!1))},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(f,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Add"})]}),e.jsxs("button",{type:"button",onClick:()=>{v(!1),p({provider:"",model:"",inputCostPer1M:"",outputCostPer1M:""})},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(B,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Cancel"})]})]})]}):e.jsxs("button",{type:"button",onClick:()=>v(!0),className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(be,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Add pricing override"})]}),y.length>0&&e.jsxs("div",{className:"mt-4 rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500",children:"SDK code to apply these overrides"}),e.jsx("pre",{className:"font-mono text-xs leading-relaxed text-slate-300",children:`import { setPricing } from "@llmtap/sdk";
-${y.map(t=>`setPricing("${t.provider}", "${t.model}", ${t.inputCostPer1M}, ${t.outputCostPer1M});`).join(`
-`)}`})]})]}),e.jsxs(x.div,{className:"dashboard-shell rounded-[26px] px-5 py-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:.25,duration:.35},children:[e.jsxs("div",{className:"mb-5 flex items-center gap-2",children:[e.jsx(fe,{className:"h-4 w-4 text-purple-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"Data retention"})]}),e.jsx("p",{className:"mb-4 text-sm text-slate-400",children:"Configure how long trace data is kept. Older traces will be automatically cleaned up."}),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("select",{value:g,onChange:t=>V(t.target.value),className:"rounded-2xl border border-white/8 bg-white/4 px-4 py-3 text-sm text-white focus:border-purple-400/30 focus:outline-none",children:[e.jsx("option",{value:"7",children:"7 days"}),e.jsx("option",{value:"14",children:"14 days"}),e.jsx("option",{value:"30",children:"30 days"}),e.jsx("option",{value:"90",children:"90 days"}),e.jsx("option",{value:"365",children:"1 year"}),e.jsx("option",{value:"0",children:"Keep forever"})]}),e.jsx("button",{type:"button",onClick:async()=>{const t=parseInt(g,10);if(!(t>0&&!confirm(`Delete all trace data older than ${g} days?`))){T(!0);try{const s=await te(t);O(s.deletedSpans),D(!0),o.invalidateQueries(),setTimeout(()=>{D(!1),O(null)},4e3)}catch(s){alert(`Retention failed: ${s instanceof Error?s.message:String(s)}`)}finally{T(!1)}}},disabled:R,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:q?e.jsxs(e.Fragment,{children:[e.jsx(f,{className:"h-3.5 w-3.5 text-emerald-300"}),e.jsx("span",{children:N!==null&&N>0?`Cleaned ${N} spans`:"Applied"})]}):e.jsx("span",{children:R?"Applying...":"Apply now"})})]}),e.jsxs("p",{className:"mt-3 text-xs text-slate-500",children:["This immediately deletes spans older than the selected period. For automatic enforcement on every startup, use ",e.jsxs("code",{className:"rounded bg-white/6 px-1.5 py-0.5 font-mono text-slate-400",children:["llmtap start --retention ",g]}),"."]})]}),e.jsxs(x.div,{className:"dashboard-shell rounded-[26px] px-5 py-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:.27,duration:.35},children:[e.jsxs("div",{className:"mb-5 flex items-center gap-2",children:[e.jsx(ge,{className:"h-4 w-4 text-cyan-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"OpenTelemetry Export"})]}),e.jsx("p",{className:"mb-4 text-sm text-slate-400",children:"Export spans in OTLP format for Datadog, Grafana Tempo, Jaeger, Honeycomb, or any OTLP-compatible backend."}),e.jsxs("div",{className:"space-y-3",children:[e.jsxs("button",{type:"button",disabled:I,onClick:async()=>{_(!0);try{const t=await se(1e3,C),s=new Blob([t],{type:"application/json"}),m=URL.createObjectURL(s),r=document.createElement("a");r.href=m,r.download="llmtap-export.otlp.json",document.body.appendChild(r),r.click(),document.body.removeChild(r),URL.revokeObjectURL(m)}catch(t){alert(`Export failed: ${t instanceof Error?t.message:String(t)}`)}finally{_(!1)}},className:"flex items-center gap-2 rounded-2xl border border-cyan-400/20 bg-cyan-400/10 px-4 py-2.5 text-sm font-medium text-cyan-300 transition-colors hover:bg-cyan-400/20",children:[e.jsx(w,{className:"h-3.5 w-3.5"}),I?"Exporting...":"Download OTLP JSON"]}),e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"mb-3 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500",children:"Forward to OTLP endpoint"}),e.jsxs("div",{className:"flex flex-col gap-3 sm:flex-row",children:[e.jsx("input",{type:"text",value:k,onChange:t=>{G(t.target.value),j(null)},placeholder:"http://localhost:4318/v1/traces",className:"flex-1 rounded-xl border border-white/8 bg-white/4 px-3 py-2 text-sm text-white placeholder-slate-500 focus:border-cyan-400/30 focus:outline-none"}),e.jsx("input",{type:"text",value:C,onChange:t=>H(t.target.value),placeholder:"service name",className:"w-32 rounded-xl border border-white/8 bg-white/4 px-3 py-2 text-sm text-white placeholder-slate-500 focus:border-cyan-400/30 focus:outline-none"}),e.jsx("button",{type:"button",disabled:!k||A,onClick:async()=>{L(!0),j(null);try{const t=await ae(k,{service:C});j(`Forwarded ${t.spanCount} spans`)}catch(t){j(`Error: ${t instanceof Error?t.message:String(t)}`)}finally{L(!1)}},className:"rounded-xl border border-cyan-400/20 bg-cyan-400/10 px-4 py-2 text-sm font-medium text-cyan-300 transition-colors hover:bg-cyan-400/20 disabled:opacity-40",children:A?"Sending...":"Send"})]}),S&&e.jsx("p",{className:`mt-2 text-xs ${S.startsWith("Error")?"text-rose-400":"text-emerald-400"}`,children:S})]}),e.jsxs("p",{className:"text-xs text-slate-500",children:["CLI: ",e.jsx("code",{className:"rounded bg-white/6 px-1.5 py-0.5 font-mono text-slate-400",children:"llmtap export --format otlp --endpoint http://localhost:4318/v1/traces"})]})]})]}),e.jsxs(x.div,{className:"dashboard-shell rounded-[26px] px-5 py-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:.3,duration:.35},children:[e.jsxs("div",{className:"mb-5 flex items-center gap-2",children:[e.jsx(he,{className:"h-4 w-4 text-sky-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"Quick start"})]}),e.jsxs("div",{className:"space-y-3",children:[e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500",children:"1. Install the SDK"}),e.jsx("pre",{className:"font-mono text-xs text-slate-300",children:"npm install @llmtap/sdk"})]}),e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500",children:"2. Wrap your client"}),e.jsx("pre",{className:"font-mono text-xs leading-relaxed text-slate-300",children:`import { wrap } from "@llmtap/sdk";
-import OpenAI from "openai";
-
-const openai = wrap(new OpenAI());`})]}),e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500",children:"3. That's it"}),e.jsx("p",{className:"text-xs leading-relaxed text-slate-400",children:"All API calls are now traced automatically. Open this dashboard to see real-time data."})]})]})]})]})]})})}export{Se as default};

package/dist/dashboard/assets/StatusDot-CjYDb6xj.js

@@ -1 +0,0 @@
-import{c as o,j as e,b as s}from"./index-M3DwcRrc.js";const a=[["path",{d:"m12 19-7-7 7-7",key:"1l729n"}],["path",{d:"M19 12H5",key:"x3x0zl"}]],d=o("arrow-left",a);const c=[["path",{d:"m6 9 6 6 6-6",key:"qrunsl"}]],i=o("chevron-down",c);function u({status:n,className:t}){const r=n==="error";return e.jsxs("span",{className:s("relative flex h-3.5 w-3.5 items-center justify-center",t),children:[e.jsx("span",{className:s("absolute inset-0 rounded-full",r?"bg-rose-400/25":"bg-emerald-400/25")}),e.jsx("span",{className:s("relative h-2 w-2 rounded-full",r?"bg-rose-400":"bg-emerald-300")})]})}export{d as A,i as C,u as S};

package/dist/dashboard/assets/TraceDetail-C0tQsZ-6.js

@@ -1,17 +0,0 @@
-import{c as f,j as e,b as ce,n as de,r as h,L as pe,A as Y,m as M,o as xe,f as me,p as he,k as ue}from"./index-M3DwcRrc.js";import{u as ge,P as be,b as w,c as g}from"./format-CNuIwzac.js";import{g as k,C as Z,M as W}from"./content-DqloWqre.js";import{p as fe,d as je}from"./provider-colors-DcHYMgVv.js";import{A as ye,C as L,S as Ne}from"./StatusDot-CjYDb6xj.js";import{C as O,D as ve,a as we}from"./download-B-39NUBC.js";import{L as P}from"./layers-BQ0MpYqk.js";import{Z as ke}from"./zap-DjNN7wJp.js";import{C as Q}from"./coins-BmXTNwva.js";import{C as E}from"./clock-BEYeaSdD.js";import{O as Ce}from"./orbit-eg7lcPsM.js";const $e=[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]],Te=f("chevron-right",$e);const Me=[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"m9 12 2 2 4-4",key:"dzmm74"}]],Se=f("circle-check",Me);const _e=[["path",{d:"m16 18 6-6-6-6",key:"eg8j8"}],["path",{d:"m8 6-6 6 6 6",key:"ppft3o"}]],Ie=f("code",_e);const Re=[["path",{d:"M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",key:"1oefj6"}],["path",{d:"M14 2v5a1 1 0 0 0 1 1h5",key:"wfsgrz"}],["path",{d:"M10 9H8",key:"b1mrlr"}],["path",{d:"M16 13H8",key:"t4e002"}],["path",{d:"M16 17H8",key:"z1uh3a"}]],Le=f("file-text",Re);const Oe=[["line",{x1:"4",x2:"20",y1:"9",y2:"9",key:"4lhtct"}],["line",{x1:"4",x2:"20",y1:"15",y2:"15",key:"vyu0kd"}],["line",{x1:"10",x2:"8",y1:"3",y2:"21",key:"1ggp8o"}],["line",{x1:"16",x2:"14",y1:"3",y2:"21",key:"weycgp"}]],Pe=f("hash",Oe);const Ee=[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",ry:"2",key:"1m3agn"}],["circle",{cx:"9",cy:"9",r:"2",key:"af1f0g"}],["path",{d:"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21",key:"1xmnt7"}]],Ae=f("image",Ee);const De=[["path",{d:"M5 5a2 2 0 0 1 3.008-1.728l11.997 6.998a2 2 0 0 1 .003 3.458l-12 7A2 2 0 0 1 5 19z",key:"10ikf1"}]],X=f("play",De);const He=[["path",{d:"M12 19h8",key:"baeox8"}],["path",{d:"m4 17 6-6-6-6",key:"1yngyt"}]],ze=f("terminal",He);const Fe=[["path",{d:"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z",key:"1ngwbx"}]],Be=f("wrench",Fe);function qe({provider:t,className:a}){const n=t.toLowerCase(),i=fe[n]??je;return e.jsx("span",{className:ce("inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold capitalize",i.bg,i.text,i.border,a),children:t})}function Ke(t){const a=new Map,n=[];for(const l of t)a.set(l.spanId,{span:l,children:[]});for(const l of t){const c=a.get(l.spanId);c&&(l.parentSpanId&&a.has(l.parentSpanId)?a.get(l.parentSpanId)?.children.push(c):n.push(c))}const i=l=>{l.sort((c,s)=>c.span.startTime-s.span.startTime);for(const c of l)i(c.children)};return i(n),n}function A(t){return t.children.reduce((a,n)=>a+1+A(n),0)}function Je(){const[t,a]=h.useState(null);function n(i,l){navigator.clipboard.writeText(i),a(l),setTimeout(()=>a(null),2e3)}return{copied:t,copy:n}}function v({text:t,label:a,copied:n,onCopy:i}){return e.jsx("button",{type:"button",onClick:l=>{l.stopPropagation(),i(t,a)},className:"rounded-lg border border-white/8 bg-white/4 p-1.5 text-slate-500 transition-colors hover:text-white",title:"Copy to clipboard",children:n===a?e.jsx(O,{className:"h-3 w-3 text-emerald-300"}):e.jsx(we,{className:"h-3 w-3"})})}function b({icon:t,label:a,value:n}){return e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-1.5 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-500",children:[e.jsx(t,{className:"h-3 w-3"}),a]}),e.jsx("div",{className:"font-mono text-sm font-semibold text-slate-100",children:n})]})}function Ue({role:t,type:a}){const n={system:"bg-purple-400/10 text-purple-200 border-purple-400/16",user:"bg-sky-400/10 text-sky-200 border-sky-400/16",assistant:"bg-emerald-400/10 text-emerald-200 border-emerald-400/16",tool:"bg-amber-300/10 text-amber-200 border-amber-300/16",function:"bg-amber-300/10 text-amber-200 border-amber-300/16"},i=a==="input"?"bg-sky-400/10 text-sky-200 border-sky-400/16":"bg-emerald-400/10 text-emerald-200 border-emerald-400/16";return e.jsx("span",{className:`rounded-full border px-2.5 py-1 text-[10px] font-bold capitalize tracking-[0.16em] ${n[t]??i}`,children:t})}function G(t){return!t||typeof t=="string"?!1:t.some(a=>a.type==="image_url"||a.type==="image")}function D(t){return t.map(a=>a.type==="image_url"&&a.image_url?.url?a.image_url.url:a.type==="image"&&a.source?.data?`data:${a.source.media_type||"image/png"};base64,${a.source.data}`:null).filter(a=>{if(!a)return!1;if(a.startsWith("data:image/"))return!0;try{const n=new URL(a);return n.protocol==="http:"||n.protocol==="https:"}catch{return!1}})}function Ye(t){const a=k(t);let n=a?Math.ceil(a.length/4):0;if(t&&typeof t!="string"){const i=t.filter(l=>l.type==="image_url"||l.type==="image").length;n+=i*85}return n}function V({message:t,type:a,copied:n,onCopy:i}){const l=t.content,c=k(l),s=l&&typeof l!="string"?D(l):[],d=a==="input"?"border-white/8":"border-emerald-400/10",o=`msg-${a}-${t.role}-${c.slice(0,20)}`;return e.jsxs("div",{className:`rounded-2xl border ${d} bg-white/4 p-4`,children:[e.jsxs("div",{className:"flex items-center justify-between gap-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Ue,{role:t.role,type:a}),t.name&&e.jsx("span",{className:"font-mono text-[10px] text-slate-500",children:t.name}),s.length>0&&e.jsxs("span",{className:"inline-flex items-center gap-1 rounded-full border border-purple-400/16 bg-purple-400/10 px-2 py-0.5 text-[10px] font-bold uppercase tracking-[0.12em] text-purple-200",children:[e.jsx(Ae,{className:"h-2.5 w-2.5"}),s.length," image",s.length>1?"s":""]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("span",{className:"font-mono text-[10px] text-slate-600",children:["~",Ye(l)," tok"]}),c&&e.jsx(v,{text:c,label:o,copied:n,onCopy:i})]})]}),c&&e.jsx("pre",{className:"mt-2.5 whitespace-pre-wrap font-mono text-xs leading-relaxed text-slate-200",children:Ve(c)}),s.length>0&&e.jsx("div",{className:"mt-2.5 flex flex-wrap gap-2",children:s.map((p,j)=>e.jsxs("a",{href:p,target:"_blank",rel:"noopener noreferrer",className:"group relative overflow-hidden rounded-lg border border-white/10 bg-slate-950/60 transition-colors hover:border-white/20",children:[e.jsx("img",{src:p,alt:`Image ${j+1}`,className:"max-h-48 max-w-64 object-contain",loading:"lazy"}),e.jsx("span",{className:"absolute inset-0 flex items-center justify-center bg-black/50 opacity-0 transition-opacity group-hover:opacity-100",children:e.jsx("span",{className:"text-[10px] font-bold uppercase tracking-widest text-white",children:"Open"})})]},j))})]})}function We({span:t,copied:a,onCopy:n}){const i=t.inputMessages?.length??0,l=t.outputMessages?.length??0,[c,s]=h.useState(i>3),[d,o]=h.useState(l>3);return e.jsx(M.div,{initial:{opacity:0,gridTemplateRows:"0fr"},animate:{opacity:1,gridTemplateRows:"1fr"},exit:{opacity:0,gridTemplateRows:"0fr"},transition:{duration:.2},style:{display:"grid"},children:e.jsx("div",{className:"overflow-hidden",children:e.jsxs("div",{className:"mx-4 mb-4 space-y-5 rounded-[24px] border border-white/8 bg-[linear-gradient(180deg,rgba(8,15,28,0.96),rgba(4,8,18,0.98))] p-5 text-sm",children:[e.jsx("div",{className:"flex items-center justify-between gap-2",children:e.jsxs("div",{className:"grid flex-1 grid-cols-2 gap-3 md:grid-cols-4",children:[e.jsx(b,{icon:Pe,label:"Model",value:t.responseModel??t.requestModel??"-"}),e.jsx(b,{icon:P,label:"Tokens",value:`${t.inputTokens} in / ${t.outputTokens} out`}),e.jsx(b,{icon:Q,label:"Cost",value:w(t.totalCost)}),e.jsx(b,{icon:E,label:"Duration",value:t.duration?g(t.duration):"-"})]})}),e.jsxs("div",{className:"flex flex-wrap items-center gap-2",children:[e.jsx(v,{text:t.spanId,label:"spanId",copied:a,onCopy:n}),e.jsxs("span",{className:"font-mono text-[10px] text-slate-500",children:["span: ",t.spanId.slice(0,12),"..."]}),t.sessionId&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"text-slate-600",children:"|"}),e.jsxs("span",{className:"font-mono text-[10px] text-slate-500",children:["session: ",t.sessionId]})]}),t.temperature!==void 0&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"text-slate-600",children:"|"}),e.jsxs("span",{className:"font-mono text-[10px] text-slate-500",children:["temp: ",t.temperature]})]}),t.topP!==void 0&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"text-slate-600",children:"|"}),e.jsxs("span",{className:"font-mono text-[10px] text-slate-500",children:["top_p: ",t.topP]})]}),t.maxTokens!==void 0&&e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"text-slate-600",children:"|"}),e.jsxs("span",{className:"font-mono text-[10px] text-slate-500",children:["max_tokens: ",t.maxTokens]})]})]}),t.status==="error"&&e.jsxs("div",{className:"rounded-2xl border border-rose-400/18 bg-rose-400/6 p-4",children:[e.jsxs("div",{className:"mb-1.5 flex items-center justify-between gap-2",children:[e.jsxs("div",{className:"flex items-center gap-1.5 text-xs font-bold uppercase tracking-[0.16em] text-rose-300",children:[e.jsx(Z,{className:"h-4 w-4"}),t.errorType??"error"]}),t.errorMessage&&e.jsx(v,{text:t.errorMessage,label:"error",copied:a,onCopy:n})]}),e.jsx("div",{className:"font-mono text-xs leading-relaxed text-rose-200/70",children:t.errorMessage})]}),t.inputMessages&&t.inputMessages.length>0&&e.jsxs("div",{children:[e.jsxs("button",{type:"button",onClick:()=>s(p=>!p),className:"mb-3 flex w-full items-center gap-1.5 text-[10px] font-bold uppercase tracking-[0.16em] text-slate-500 transition-colors hover:text-slate-300",children:[e.jsx(L,{className:`h-3.5 w-3.5 transition-transform ${c?"-rotate-90":""}`}),e.jsx(W,{className:"h-3.5 w-3.5"}),"Input messages (",t.inputMessages.length,")"]}),!c&&e.jsx("div",{className:"space-y-2",children:t.inputMessages.map((p,j)=>e.jsx(V,{message:p,type:"input",copied:a,onCopy:n},`in-${p.role}-${j}`))})]}),t.outputMessages&&t.outputMessages.length>0&&e.jsxs("div",{children:[e.jsxs("button",{type:"button",onClick:()=>o(p=>!p),className:"mb-3 flex w-full items-center gap-1.5 text-[10px] font-bold uppercase tracking-[0.16em] text-slate-500 transition-colors hover:text-slate-300",children:[e.jsx(L,{className:`h-3.5 w-3.5 transition-transform ${d?"-rotate-90":""}`}),e.jsx(W,{className:"h-3.5 w-3.5"}),"Output messages (",t.outputMessages.length,")"]}),!d&&e.jsx("div",{className:"space-y-2",children:t.outputMessages.map((p,j)=>e.jsx(V,{message:p,type:"output",copied:a,onCopy:n},`out-${p.role}-${j}`))})]}),t.toolCalls&&t.toolCalls.length>0&&e.jsxs("div",{children:[e.jsxs("div",{className:"mb-3 flex items-center gap-1.5 text-[10px] font-bold uppercase tracking-[0.16em] text-slate-500",children:[e.jsx(Be,{className:"h-3.5 w-3.5"}),"Tool calls (",t.toolCalls.length,")"]}),e.jsx("div",{className:"space-y-2",children:t.toolCalls.map(p=>e.jsxs("div",{className:"rounded-2xl border border-amber-300/10 bg-white/4 p-4",children:[e.jsxs("div",{className:"flex items-center justify-between gap-2",children:[e.jsx("span",{className:"rounded-full border border-amber-300/16 bg-amber-300/10 px-2.5 py-1 text-[10px] font-bold tracking-[0.16em] text-amber-200",children:p.name}),e.jsx(v,{text:p.arguments,label:`tool-${p.id}`,copied:a,onCopy:n})]}),e.jsx("pre",{className:"mt-2.5 overflow-x-auto font-mono text-xs leading-relaxed text-slate-200",children:ee(p.arguments)}),p.result&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"my-2 border-t border-white/6"}),e.jsx("div",{className:"mb-1 text-[10px] font-bold uppercase tracking-[0.16em] text-slate-600",children:"Result"}),e.jsx("pre",{className:"overflow-x-auto font-mono text-xs leading-relaxed text-slate-300",children:p.result})]})]},p.id))})]})]})})})}function ee(t){try{return JSON.stringify(JSON.parse(t),null,2)}catch{return t}}function Xe(t){const a=t.providerName?.toLowerCase()??"",n=t.requestModel??t.responseModel??"unknown",i=(t.inputMessages??[]).map(s=>({role:s.role,content:typeof s.content=="string"?s.content:s.content??""})),c=JSON.stringify({model:n,messages:i}).replace(/'/g,"'\\''");return a==="openai"?`curl https://api.openai.com/v1/chat/completions \\
-  -H "Authorization: Bearer $OPENAI_API_KEY" \\
-  -H "Content-Type: application/json" \\
-  -d '${c}'`:a==="anthropic"?`curl https://api.anthropic.com/v1/messages \\
-  -H "x-api-key: $ANTHROPIC_API_KEY" \\
-  -H "anthropic-version: 2023-06-01" \\
-  -H "Content-Type: application/json" \\
-  -d '${JSON.stringify({model:n,max_tokens:t.maxTokens??1024,messages:i.filter(o=>o.role!=="system"),...i.find(o=>o.role==="system")?{system:i.find(o=>o.role==="system").content}:{}}).replace(/'/g,"'\\''")}'`:a==="google"?`curl "https://generativelanguage.googleapis.com/v1beta/models/${n}:generateContent?key=$GOOGLE_API_KEY" \\
-  -H "Content-Type: application/json" \\
-  -d '${c}'`:`curl https://api.example.com/v1/chat/completions \\
-  -H "Authorization: Bearer $API_KEY" \\
-  -H "Content-Type: application/json" \\
-  -d '${c}'`}function Ge(t,a,n,i,l,c){const s=[];s.push("# Trace Report"),s.push(""),s.push(`**Trace ID:** \`${t}\``),s.push(`**Status:** ${c?"Error":"Stable"}`),s.push(`**Total Spans:** ${a.length}`),s.push(`**Total Tokens:** ${n.toLocaleString()}`),s.push(`**Total Cost:** ${w(i)}`),s.push(`**Duration:** ${g(l)}`),s.push(""),s.push("---"),s.push("");for(const d of a){if(s.push(`## Span: ${d.name}`),s.push(""),s.push("| Field | Value |"),s.push("|-------|-------|"),s.push(`| Span ID | \`${d.spanId}\` |`),s.push(`| Provider | ${d.providerName} |`),s.push(`| Model | ${d.responseModel??d.requestModel??"-"} |`),s.push(`| Operation | ${d.operationName} |`),s.push(`| Tokens | ${d.inputTokens} in / ${d.outputTokens} out |`),s.push(`| Cost | ${w(d.totalCost)} |`),s.push(`| Duration | ${d.duration?g(d.duration):"-"} |`),s.push(`| Status | ${d.status} |`),s.push(""),d.inputMessages&&d.inputMessages.length>0){s.push("### Input Messages"),s.push("");for(const o of d.inputMessages)s.push(`**[${o.role}]${o.name?` (${o.name})`:""}**`),s.push(""),s.push(k(o.content)||"_empty_"),G(o.content)&&s.push(`
-_[${D(o.content).length} image(s) attached]_`),s.push("")}if(d.outputMessages&&d.outputMessages.length>0){s.push("### Output Messages"),s.push("");for(const o of d.outputMessages)s.push(`**[${o.role}]${o.name?` (${o.name})`:""}**`),s.push(""),s.push(k(o.content)||"_empty_"),G(o.content)&&s.push(`
-_[${D(o.content).length} image(s) attached]_`),s.push("")}if(d.toolCalls&&d.toolCalls.length>0){s.push("### Tool Calls"),s.push("");for(const o of d.toolCalls)s.push(`**${o.name}** (\`${o.id}\`)`),s.push(""),s.push("```json"),s.push(ee(o.arguments)),s.push("```"),o.result&&(s.push(""),s.push("Result:"),s.push("```"),s.push(o.result),s.push("```")),s.push("")}s.push("---"),s.push("")}return s.join(`
-`)}function Ve(t){const a=/```(\w*)\n?([\s\S]*?)```/g,n=[];let i=0,l,c=0;for(;(l=a.exec(t))!==null;){l.index>i&&n.push(e.jsx("span",{children:t.slice(i,l.index)},c++));const s=l[1]||"",d=l[2];n.push(e.jsxs("span",{className:"my-1.5 block rounded-lg border border-white/8 bg-slate-950/80 px-3 py-2",children:[s&&e.jsxs("span",{className:"mb-1 flex items-center gap-1 text-[10px] font-bold uppercase tracking-[0.16em] text-slate-500",children:[e.jsx(Ie,{className:"h-3 w-3"}),s]}),e.jsx("span",{className:"block font-mono text-[11px] leading-relaxed text-emerald-200/80",children:d})]},c++)),i=l.index+l[0].length}return i<t.length&&n.push(e.jsx("span",{children:t.slice(i)},c++)),n.length===0?t:n}function dt(){const{traceId:t}=de(),[a,n]=h.useState(null),[i,l]=h.useState({}),{copied:c,copy:s}=Je(),[d,o]=h.useState(!1),[p,j]=h.useState(""),[H,z]=h.useState(!1),[y,C]=h.useState(null),[F,$]=h.useState(null),[S,te]=h.useState(null),{data:se,isLoading:ae}=ge({queryKey:["trace",t],queryFn:()=>ue(t),enabled:!!t}),x=se?.spans??[],_=h.useMemo(()=>Ke(x),[x]),I=x.length>0?Math.min(...x.map(r=>r.startTime)):0,N=(x.length>0?Math.max(...x.map(r=>r.endTime??r.startTime)):0)-I||1,B=x.reduce((r,u)=>r+u.totalTokens,0),q=x.reduce((r,u)=>r+u.totalCost,0),R=x.some(r=>r.status==="error");function re(){const r=new Blob([JSON.stringify(x,null,2)],{type:"application/json"}),u=URL.createObjectURL(r),m=document.createElement("a");m.href=u,m.download=`trace-${t?.slice(0,12)}.json`,document.body.appendChild(m),m.click(),document.body.removeChild(m),URL.revokeObjectURL(u)}async function ne(){if(!(!S||!p.trim())){z(!0),$(null),C(null);try{const r=await he(S,p.trim());C(r)}catch(r){$(r instanceof Error?r.message:String(r))}finally{z(!1)}}}function le(r){te(r),o(!0),C(null),$(null)}const K=(r,u=0)=>{const m=r.span.spanId===a,J=r.children.length>0,U=i[r.span.spanId]??!1,oe=(r.span.startTime-I)/N*100,ie=Math.max(((r.span.endTime??r.span.startTime)-r.span.startTime)/N*100,1);return e.jsxs(h.Fragment,{children:[e.jsx("div",{className:"border-t border-white/6 first:border-t-0",children:e.jsxs("div",{className:"flex items-start gap-2 px-4 py-3 sm:px-5",children:[e.jsx("div",{className:"flex items-center",style:{paddingLeft:`${u*22}px`},children:J?e.jsx("button",{type:"button",onClick:()=>l(T=>({...T,[r.span.spanId]:!T[r.span.spanId]})),className:"flex h-8 w-8 items-center justify-center rounded-full border border-white/8 bg-white/4 text-slate-400 transition-colors hover:text-white",children:e.jsx(Te,{className:`h-4 w-4 transition-transform ${U?"":"rotate-90"}`})}):e.jsx("span",{className:"flex h-8 w-8 items-center justify-center rounded-full border border-white/8 bg-white/4 text-slate-500",children:e.jsx("span",{className:"h-1.5 w-1.5 rounded-full bg-slate-500"})})}),e.jsxs("button",{type:"button",onClick:()=>n(m?null:r.span.spanId),className:`grid min-w-0 flex-1 gap-3 rounded-[22px] px-3 py-3 text-left transition-colors sm:grid-cols-[minmax(0,320px)_minmax(0,1fr)_88px] sm:items-center ${m?"bg-white/8":"hover:bg-white/4"}`,children:[e.jsx("div",{className:"min-w-0",children:e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx(Ne,{status:r.span.status}),e.jsxs("div",{className:"min-w-0",children:[e.jsx("div",{className:"truncate text-sm font-medium text-white",children:r.span.name}),e.jsxs("div",{className:"mt-1 flex flex-wrap items-center gap-2.5",children:[e.jsx(qe,{provider:r.span.providerName}),e.jsx("span",{className:"font-mono text-[10px] uppercase tracking-[0.16em] text-slate-500",children:r.span.operationName}),J?e.jsxs("span",{className:"font-mono text-[10px] uppercase tracking-[0.16em] text-slate-500",children:[A(r)," child",A(r)===1?"":"ren"]}):null]})]})]})}),e.jsxs("div",{className:"min-w-0",children:[e.jsxs("div",{className:"mb-2 flex items-center justify-between text-[10px] uppercase tracking-[0.16em] text-slate-500",children:[e.jsxs("span",{children:[Math.round(r.span.startTime-I),"ms"]}),e.jsx("span",{children:r.span.duration?g(r.span.duration):"instant"})]}),e.jsx("div",{className:"relative h-8 overflow-hidden rounded-full bg-slate-950/90",children:e.jsx(M.div,{className:`absolute bottom-1 top-1 origin-left rounded-full ${r.span.status==="error"?"bg-[linear-gradient(90deg,#fb7185,#f97316)]":"bg-[linear-gradient(90deg,#34d399,#38bdf8)]"}`,style:{left:`${oe}%`,width:`${Math.max(ie,.5)}%`},initial:{scaleX:0},animate:{scaleX:1},transition:{duration:.4,ease:"easeOut"}})})]}),e.jsxs("div",{className:"text-right font-mono text-[11px] text-slate-400",children:[e.jsx("div",{className:"text-slate-200",children:w(r.span.totalCost)}),e.jsxs("div",{children:[r.span.totalTokens.toLocaleString()," tok"]})]})]})]})}),e.jsx(Y,{children:m?e.jsx(We,{span:r.span,copied:c,onCopy:s}):null}),!U&&r.children.map(T=>K(T,u+1))]},r.span.spanId)};return ae?e.jsxs("div",{className:"mx-auto max-w-[1500px] space-y-6",children:[e.jsx("div",{className:"skeleton-panel h-44 rounded-[28px]"}),e.jsx("div",{className:"skeleton-panel h-28 rounded-[24px]"}),e.jsx("div",{className:"skeleton-panel h-72 rounded-[24px]"})]}):e.jsxs(be,{eyebrow:"Trace Console",title:t?`Trace ${t.slice(0,12)}...`:"Trace detail",description:"Inspect the nested execution tree, timing offsets, token pressure, and payloads for a single trace without losing the operator surface.",aside:e.jsxs("div",{className:"insight-panel",children:[e.jsx(me,{}),e.jsxs("div",{className:"mt-4 space-y-3",children:[e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Current status"}),e.jsx("div",{className:"mt-2 flex items-center gap-2 text-base font-medium text-white",children:R?e.jsxs(e.Fragment,{children:[e.jsx(Z,{className:"h-4 w-4 text-rose-300"}),"Error state"]}):e.jsxs(e.Fragment,{children:[e.jsx(Se,{className:"h-4 w-4 text-emerald-300"}),"Stable"]})})]}),e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Hierarchy"}),e.jsxs("div",{className:"mt-2 text-base font-medium text-white",children:[_.length," root spans"]}),e.jsxs("div",{className:"mt-1 text-sm text-slate-400",children:[g(N)," elapsed from first to last event"]})]})]})]}),children:[e.jsxs("div",{className:"flex items-center justify-between gap-2 text-sm",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs(pe,{to:"/",className:"status-chip transition-colors hover:text-white",children:[e.jsx(ye,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Back to overview"})]}),e.jsx("span",{className:"truncate font-mono text-xs text-slate-500",children:t}),e.jsx(v,{text:t??"",label:"traceId",copied:c,onCopy:s})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[x.length>0&&e.jsxs("button",{type:"button",onClick:()=>{const r=x[0];s(Xe(r),"curl")},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[c==="curl"?e.jsx(O,{className:"h-3.5 w-3.5 text-emerald-300"}):e.jsx(ze,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:c==="curl"?"Copied!":"Copy as cURL"})]}),x.length>0&&e.jsxs("button",{type:"button",onClick:()=>{s(Ge(t??"",x,B,q,N,R),"markdown")},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[c==="markdown"?e.jsx(O,{className:"h-3.5 w-3.5 text-emerald-300"}):e.jsx(Le,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:c==="markdown"?"Copied!":"Copy as Markdown"})]}),e.jsxs("button",{type:"button",onClick:re,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(ve,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Export JSON"})]}),x.length>0&&e.jsxs("button",{type:"button",onClick:()=>le(x[0].spanId),className:"status-chip border-emerald-400/20 bg-emerald-400/8 transition-colors hover:border-emerald-400/30 hover:bg-emerald-400/14",children:[e.jsx(X,{className:"h-3.5 w-3.5 text-emerald-300"}),e.jsx("span",{children:"Replay"})]})]})]}),e.jsx("div",{className:"dashboard-shell rounded-[26px] px-5 py-5",children:e.jsxs("div",{className:"grid grid-cols-2 gap-4 md:grid-cols-5",children:[e.jsx(b,{icon:P,label:"Spans",value:String(x.length)}),e.jsx(b,{icon:ke,label:"Tokens",value:B.toLocaleString()}),e.jsx(b,{icon:Q,label:"Cost",value:w(q)}),e.jsx(b,{icon:E,label:"Duration",value:x.length>0?g(N):"-"}),e.jsx(b,{icon:Ce,label:"Status",value:R?"Error":"Stable"})]})}),e.jsxs("div",{className:"dashboard-shell overflow-hidden rounded-[26px]",children:[e.jsxs("div",{className:"flex items-center gap-2.5 border-b border-white/6 px-5 py-4",children:[e.jsx(E,{className:"h-4 w-4 text-sky-300"}),e.jsx("h2",{className:"text-xl font-semibold tracking-[-0.04em] text-white",children:"Trace hierarchy"}),e.jsxs("span",{className:"ml-auto text-xs font-mono tracking-[0.18em] text-slate-500",children:[g(N)," total"]})]}),_.length>0?e.jsx("div",{className:"py-2",children:_.map(r=>K(r))}):e.jsxs("div",{className:"empty-state h-[280px]",children:[e.jsx(P,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No spans found for this trace"})]})]}),e.jsx(Y,{children:d&&e.jsxs(e.Fragment,{children:[e.jsx(M.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},className:"fixed inset-0 z-50 bg-black/60 backdrop-blur-sm",onClick:()=>o(!1)}),e.jsxs(M.div,{initial:{opacity:0,scale:.95,y:20},animate:{opacity:1,scale:1,y:0},exit:{opacity:0,scale:.95,y:20},transition:{type:"spring",bounce:.15,duration:.4},className:"fixed left-1/2 top-1/2 z-50 w-full max-w-2xl -translate-x-1/2 -translate-y-1/2 rounded-[24px] border border-white/10 bg-[linear-gradient(180deg,rgba(12,18,32,0.98),rgba(4,8,18,0.99))] p-6 shadow-[0_40px_100px_rgba(0,0,0,0.5)]",children:[e.jsxs("div",{className:"mb-5 flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"flex h-10 w-10 items-center justify-center rounded-2xl border border-emerald-400/20 bg-emerald-400/8",children:e.jsx(X,{className:"h-4.5 w-4.5 text-emerald-300"})}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold text-white",children:"Trace Replay"}),e.jsx("p",{className:"text-xs text-slate-500",children:"Re-send the same prompts and compare responses"})]})]}),e.jsx("button",{onClick:()=>o(!1),className:"flex h-8 w-8 items-center justify-center rounded-xl border border-white/8 bg-white/5 text-slate-400 transition-colors hover:text-white",children:e.jsx(L,{className:"h-4 w-4"})})]}),!y&&!H&&e.jsxs("div",{className:"space-y-4",children:[e.jsx("div",{className:"rounded-xl border border-amber-400/20 bg-amber-500/8 p-3 text-xs text-amber-200/80",children:"Your API key is sent directly to the provider and is never stored by LLMTap."}),e.jsxs("div",{children:[e.jsx("label",{className:"mb-1.5 block text-xs font-medium text-slate-400",children:"Provider API Key"}),e.jsx("input",{type:"password",value:p,onChange:r=>j(r.target.value),placeholder:"sk-... or anthropic key",className:"w-full rounded-xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-white placeholder:text-slate-600 focus:border-emerald-400/30 focus:outline-none"})]}),F&&e.jsx("div",{className:"rounded-xl border border-rose-400/20 bg-rose-500/8 p-3 text-sm text-rose-200",children:F}),e.jsx("button",{type:"button",disabled:!p.trim(),onClick:ne,className:"w-full rounded-xl bg-emerald-500 px-4 py-3 text-sm font-semibold text-white transition-colors hover:bg-emerald-400 disabled:cursor-not-allowed disabled:opacity-40",children:"Send Replay Request"})]}),H&&e.jsxs("div",{className:"flex flex-col items-center gap-3 py-12",children:[e.jsx(xe,{className:"h-8 w-8 animate-spin text-emerald-300"}),e.jsxs("p",{className:"text-sm text-slate-400",children:["Replaying against ",x[0]?.providerName," API..."]})]}),y&&(()=>{const r=x.find(m=>m.spanId===S)??x[0],u=r?.outputMessages?.map(m=>k(m.content)).join(`
-`)??"";return e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"grid grid-cols-3 gap-3 text-center",children:[e.jsxs("div",{className:"rounded-xl border border-white/8 bg-white/4 p-3",children:[e.jsx("div",{className:"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-500",children:"Tokens"}),e.jsxs("div",{className:"mt-1 font-mono text-sm text-white",children:[r.totalTokens," ",e.jsx("span",{className:"text-slate-500",children:"vs"})," ",y.totalTokens]})]}),e.jsxs("div",{className:"rounded-xl border border-white/8 bg-white/4 p-3",children:[e.jsx("div",{className:"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-500",children:"Duration"}),e.jsxs("div",{className:"mt-1 font-mono text-sm text-white",children:[g(r.duration??0)," ",e.jsx("span",{className:"text-slate-500",children:"vs"})," ",g(y.duration)]})]}),e.jsxs("div",{className:"rounded-xl border border-white/8 bg-white/4 p-3",children:[e.jsx("div",{className:"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-500",children:"Model"}),e.jsx("div",{className:"mt-1 truncate font-mono text-xs text-white",children:y.responseModel})]})]}),e.jsxs("div",{className:"grid gap-3 md:grid-cols-2",children:[e.jsxs("div",{children:[e.jsx("div",{className:"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500",children:"Original Response"}),e.jsx("div",{className:"max-h-[300px] overflow-y-auto rounded-xl border border-white/8 bg-white/4 p-3 text-sm leading-6 text-slate-300",children:u||e.jsx("span",{className:"text-slate-600",children:"No content captured"})})]}),e.jsxs("div",{children:[e.jsx("div",{className:"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-emerald-400/80",children:"Replay Response"}),e.jsx("div",{className:"max-h-[300px] overflow-y-auto rounded-xl border border-emerald-400/12 bg-emerald-400/4 p-3 text-sm leading-6 text-slate-300",children:y.content||e.jsx("span",{className:"text-slate-600",children:"Empty response"})})]})]}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx("button",{type:"button",onClick:()=>{C(null),$(null)},className:"flex-1 rounded-xl border border-white/10 bg-white/5 px-4 py-2.5 text-sm text-slate-300 transition-colors hover:bg-white/10",children:"Replay Again"}),e.jsx("button",{type:"button",onClick:()=>o(!1),className:"flex-1 rounded-xl bg-emerald-500 px-4 py-2.5 text-sm font-semibold text-white transition-colors hover:bg-emerald-400",children:"Done"})]})]})})()]})]})})]})}export{dt as default};

package/dist/dashboard/assets/Traces-D6m-Ef3q.js

@@ -1 +0,0 @@
-import{c as Q,u as oe,r,j as e,A as H,m as I,X as U,S as de,C as ce,D as xe,L as me,k as X,h as he}from"./index-M3DwcRrc.js";import{u as pe,P as ue,b as k,d as B,c as C,a as ee}from"./format-CNuIwzac.js";import{C as be,S as P,A as je}from"./StatusDot-CjYDb6xj.js";import{P as G,A as W,C as ge,a as fe,b as se}from"./constants-BzCnW506.js";import{C as Ne,M as ve,g as we}from"./content-DqloWqre.js";import{Z as ye}from"./zap-DjNN7wJp.js";import{C as Se}from"./clock-BEYeaSdD.js";import{L as ke}from"./layers-BQ0MpYqk.js";const Ce=[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",key:"afitv7"}],["path",{d:"M12 3v18",key:"108xh3"}]],K=Q("columns-2",Ce);const Te=[["path",{d:"M21 10.656V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h12.344",key:"2acyp4"}],["path",{d:"m9 11 3 3L22 4",key:"1pflzl"}]],O=Q("square-check-big",Te);const De=[["rect",{width:"18",height:"18",x:"3",y:"3",rx:"2",key:"afitv7"}]],J=Q("square",De),Y=[25,50,100,200];function Ie({trace:t,onClose:a}){const h=t.totalDuration??(t.endTime?t.endTime-t.startTime:0),[p,u]=r.useState(!1);return e.jsxs(I.aside,{initial:{x:"100%",opacity:0},animate:{x:0,opacity:1},exit:{x:"100%",opacity:0},transition:{type:"spring",bounce:.12,duration:.45},onAnimationComplete:()=>u(!0),className:`fixed inset-y-0 right-0 z-50 flex w-full max-w-md flex-col border-l border-white/8 bg-[rgba(6,10,22,0.97)] shadow-[−40px_0_80px_rgba(0,0,0,0.5)] ${p?"backdrop-blur-xl":""}`,children:[e.jsxs("div",{className:"flex items-center justify-between border-b border-white/6 px-5 py-4",children:[e.jsxs("div",{className:"min-w-0",children:[e.jsx("div",{className:"hud-label",children:"Quick preview"}),e.jsx("h3",{className:"mt-1 truncate text-lg font-semibold tracking-[-0.04em] text-white",children:t.name})]}),e.jsx("button",{type:"button",onClick:a,className:"flex h-9 w-9 items-center justify-center rounded-xl border border-white/8 bg-white/4 text-slate-400 transition-colors hover:bg-white/8 hover:text-white",children:e.jsx(U,{className:"h-4 w-4"})})]}),e.jsxs("div",{className:"flex-1 overflow-y-auto px-5 py-5",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Trace ID"}),e.jsx("div",{className:"mt-1 break-all font-mono text-sm text-slate-300",children:t.traceId})]}),e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Status"}),e.jsxs("div",{className:"mt-2 flex items-center gap-2",children:[e.jsx(P,{status:t.status}),e.jsx("span",{className:`text-sm font-medium ${t.status==="error"?"text-rose-300":"text-emerald-300"}`,children:t.status==="error"?"Error":"Healthy"})]})]}),e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Duration"}),e.jsxs("div",{className:"mt-2 flex items-center gap-2",children:[e.jsx(Se,{className:"h-4 w-4 text-sky-300"}),e.jsx("span",{className:"text-sm font-medium text-white",children:h>0?C(h):"N/A"})]})]})]}),e.jsxs("div",{className:"grid grid-cols-3 gap-3",children:[e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-4 text-center",children:[e.jsx("div",{className:"hud-label",children:"Spans"}),e.jsx("div",{className:"mt-2 text-xl font-semibold text-white",children:t.spanCount}),e.jsx(ke,{className:"mx-auto mt-1 h-4 w-4 text-emerald-300/60"})]}),e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-4 text-center",children:[e.jsx("div",{className:"hud-label",children:"Tokens"}),e.jsx("div",{className:"mt-2 text-xl font-semibold text-white",children:ee(t.totalTokens)}),e.jsx(ce,{className:"mx-auto mt-1 h-4 w-4 text-sky-300/60"})]}),e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-4 text-center",children:[e.jsx("div",{className:"hud-label",children:"Cost"}),e.jsx("div",{className:"mt-2 text-xl font-semibold text-white",children:k(t.totalCost)}),e.jsx(xe,{className:"mx-auto mt-1 h-4 w-4 text-amber-300/60"})]})]}),e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Started"}),e.jsxs("div",{className:"mt-1 text-sm text-slate-300",children:[new Date(t.startTime).toLocaleString()," (",B(t.startTime),")"]}),t.endTime&&e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"hud-label mt-3",children:"Ended"}),e.jsx("div",{className:"mt-1 text-sm text-slate-300",children:new Date(t.endTime).toLocaleString()})]})]})]}),e.jsxs(me,{to:`/trace/${t.traceId}`,className:"mt-5 flex w-full items-center justify-center gap-2 rounded-2xl border border-emerald-400/20 bg-[linear-gradient(135deg,rgba(16,185,129,0.12),rgba(14,165,233,0.08))] px-5 py-3 text-sm font-medium text-emerald-300 transition-colors hover:bg-[linear-gradient(135deg,rgba(16,185,129,0.22),rgba(14,165,233,0.14))]",children:["Open full trace detail",e.jsx(se,{className:"h-4 w-4"})]})]})]})}function Pe({traceA:t,traceB:a}){const[h,p]=r.useState([]),[u,i]=r.useState([]),[n,N]=r.useState(!0);if(r.useEffect(()=>{let w=!1;return N(!0),Promise.all([X(t.traceId),X(a.traceId)]).then(([c,m])=>{w||(p(c.spans),i(m.spans),N(!1))}),()=>{w=!0}},[t.traceId,a.traceId]),n)return e.jsx("div",{className:"flex items-center justify-center py-8 text-sm text-slate-500",children:"Loading responses..."});const l=w=>w.flatMap(c=>(c.outputMessages??[]).filter(m=>m.role==="assistant").map(m=>({spanName:c.name,model:c.responseModel??c.requestModel,content:we(m.content)}))),b=l(h),v=l(u),g=Math.max(b.length,v.length);return g===0?e.jsx("div",{className:"flex items-center justify-center py-8 text-sm text-slate-500",children:"No assistant responses found in either trace."}):e.jsx("div",{className:"space-y-3",children:Array.from({length:g},(w,c)=>{const m=b[c],x=v[c];return e.jsxs("div",{className:"grid grid-cols-2 gap-3",children:[e.jsx("div",{className:"rounded-2xl border border-emerald-400/10 bg-white/3 p-3",children:m?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"mb-1.5 flex items-center gap-2",children:[e.jsx("span",{className:"rounded-full border border-emerald-400/16 bg-emerald-400/10 px-2 py-0.5 text-[10px] font-bold uppercase tracking-[0.12em] text-emerald-200",children:"assistant"}),e.jsx("span",{className:"font-mono text-[10px] text-slate-500",children:m.model})]}),e.jsx("pre",{className:"whitespace-pre-wrap font-mono text-xs leading-relaxed text-slate-200",children:m.content||e.jsx("span",{className:"text-slate-600 italic",children:"empty response"})})]}):e.jsx("div",{className:"text-xs italic text-slate-600",children:"No response"})}),e.jsx("div",{className:"rounded-2xl border border-sky-400/10 bg-white/3 p-3",children:x?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"mb-1.5 flex items-center gap-2",children:[e.jsx("span",{className:"rounded-full border border-sky-400/16 bg-sky-400/10 px-2 py-0.5 text-[10px] font-bold uppercase tracking-[0.12em] text-sky-200",children:"assistant"}),e.jsx("span",{className:"font-mono text-[10px] text-slate-500",children:x.model})]}),e.jsx("pre",{className:"whitespace-pre-wrap font-mono text-xs leading-relaxed text-slate-200",children:x.content||e.jsx("span",{className:"text-slate-600 italic",children:"empty response"})})]}):e.jsx("div",{className:"text-xs italic text-slate-600",children:"No response"})})]},c)})})}function Me({traceA:t,traceB:a,onClose:h}){const[p,u]=r.useState("metrics"),i=t.totalDuration??(t.endTime?t.endTime-t.startTime:0),n=a.totalDuration??(a.endTime?a.endTime-a.startTime:0),N=[{label:"Status",a:t.status,b:a.status,better:t.status===a.status?"tie":t.status==="ok"?"a":"b"},{label:"Spans",a:String(t.spanCount),b:String(a.spanCount)},{label:"Tokens",a:t.totalTokens.toLocaleString(),b:a.totalTokens.toLocaleString(),diff:t.totalTokens!==a.totalTokens?`${a.totalTokens-t.totalTokens>0?"+":""}${(a.totalTokens-t.totalTokens).toLocaleString()}`:"same",better:t.totalTokens===a.totalTokens?"tie":t.totalTokens<a.totalTokens?"a":"b"},{label:"Cost",a:k(t.totalCost),b:k(a.totalCost),diff:t.totalCost!==a.totalCost?`${a.totalCost-t.totalCost>0?"+":""}${k(Math.abs(a.totalCost-t.totalCost))}`:"same",better:t.totalCost===a.totalCost?"tie":t.totalCost<a.totalCost?"a":"b"},{label:"Duration",a:i>0?C(i):"N/A",b:n>0?C(n):"N/A",diff:i>0&&n>0&&i!==n?`${n-i>0?"+":""}${C(Math.abs(n-i))}`:i===n?"same":void 0,better:i===n?"tie":i>0&&n>0&&i<n?"a":"b"}];return e.jsxs(I.div,{initial:{opacity:0,y:24},animate:{opacity:1,y:0},exit:{opacity:0,y:24},transition:{duration:.3,ease:[.22,1,.36,1]},className:"dashboard-shell rounded-[26px] px-5 py-5 sm:px-6",children:[e.jsxs("div",{className:"mb-5 flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Comparison mode"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Side-by-side analysis"})]}),e.jsxs("button",{type:"button",onClick:h,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(U,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Close comparison"})]})]}),e.jsxs("div",{className:"mb-4 flex gap-2",children:[e.jsxs("button",{type:"button",onClick:()=>u("metrics"),className:`inline-flex items-center gap-1.5 rounded-full border px-3.5 py-1.5 text-xs font-semibold transition-colors ${p==="metrics"?"border-emerald-400/20 bg-emerald-400/10 text-emerald-200":"border-white/8 bg-white/4 text-slate-400 hover:text-white"}`,children:[e.jsx(K,{className:"h-3 w-3"}),"Metrics"]}),e.jsxs("button",{type:"button",onClick:()=>u("responses"),className:`inline-flex items-center gap-1.5 rounded-full border px-3.5 py-1.5 text-xs font-semibold transition-colors ${p==="responses"?"border-emerald-400/20 bg-emerald-400/10 text-emerald-200":"border-white/8 bg-white/4 text-slate-400 hover:text-white"}`,children:[e.jsx(ve,{className:"h-3 w-3"}),"Response diff"]})]}),p==="metrics"?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"mb-4 grid grid-cols-[140px_1fr_1fr_120px] gap-3",children:[e.jsx("div",{}),e.jsxs("div",{className:"rounded-2xl border border-emerald-400/15 bg-emerald-400/5 p-3",children:[e.jsx("div",{className:"hud-label",children:"Trace A"}),e.jsx("div",{className:"mt-1 truncate text-sm font-medium text-white",children:t.name}),e.jsx("div",{className:"mt-0.5 font-mono text-[10px] text-slate-500",children:t.traceId.slice(0,16)})]}),e.jsxs("div",{className:"rounded-2xl border border-sky-400/15 bg-sky-400/5 p-3",children:[e.jsx("div",{className:"hud-label",children:"Trace B"}),e.jsx("div",{className:"mt-1 truncate text-sm font-medium text-white",children:a.name}),e.jsx("div",{className:"mt-0.5 font-mono text-[10px] text-slate-500",children:a.traceId.slice(0,16)})]}),e.jsx("div",{className:"flex items-center justify-center text-[11px] uppercase tracking-[0.18em] text-slate-500",children:"Delta"})]}),e.jsx("div",{className:"space-y-2",children:N.map(l=>e.jsxs("div",{className:"grid grid-cols-[140px_1fr_1fr_120px] items-center gap-3 rounded-2xl border border-white/6 bg-white/4 px-4 py-3",children:[e.jsx("div",{className:"text-xs font-medium uppercase tracking-wider text-slate-400",children:l.label}),e.jsx("div",{className:`text-sm font-mono ${l.better==="a"?"text-emerald-300":(l.better==="tie","text-slate-300")}`,children:l.label==="Status"?e.jsxs("span",{className:"inline-flex items-center gap-1.5",children:[e.jsx(P,{status:t.status}),l.a]}):l.a}),e.jsx("div",{className:`text-sm font-mono ${l.better==="b"?"text-emerald-300":(l.better==="tie","text-slate-300")}`,children:l.label==="Status"?e.jsxs("span",{className:"inline-flex items-center gap-1.5",children:[e.jsx(P,{status:a.status}),l.b]}):l.b}),e.jsx("div",{className:"text-center text-xs font-mono text-slate-500",children:l.diff??"--"})]},l.label))})]}):e.jsx(Pe,{traceA:t,traceB:a})]})}function He(){const[t,a]=oe(),h=t.get("q")??"",p=r.useDeferredValue(h),u=t.get("status"),i=u==="ok"||u==="error"?u:"",n=Number(t.get("periodHours")??"24"),N=Number(t.get("pageSize")??"50"),l=Y.includes(N)?N:50,b=Math.max(1,Number(t.get("page")??"1")||1),v=(b-1)*l,[g,w]=r.useState(null),[c,m]=r.useState("desc"),[x,M]=r.useState(new Set),[_,$]=r.useState(null),[te,L]=r.useState(!1),T=r.useMemo(()=>({limit:l,offset:v,q:p.trim()||void 0,status:i||void 0,periodHours:G.some(s=>s.value===n)?n:24}),[p,l,v,n,i]),{data:V,isLoading:ae}=pe({queryKey:["traces",T],queryFn:()=>he(T)}),q=V?.traces??[],S=V?.total??0,Z=Math.max(1,Math.ceil(S/l));function le(s){g===s?m(o=>o==="asc"?"desc":"asc"):(w(s),m("desc"))}const j=r.useMemo(()=>g?[...q].sort((s,o)=>{const d=s[g]??0,f=o[g]??0;return c==="asc"?d-f:f-d}):q,[q,g,c]),D=j.length>0&&j.every(s=>x.has(s.traceId)),re=r.useCallback(()=>{M(s=>{const o=new Set(s);if(D)for(const d of j)o.delete(d.traceId);else for(const d of j)o.add(d.traceId);return o})},[D,j]),ie=r.useCallback(s=>{M(o=>{const d=new Set(o);return d.has(s)?d.delete(s):d.add(s),d})},[]),ne=r.useCallback(()=>{M(new Set),L(!1)},[]),z=r.useMemo(()=>j.filter(s=>x.has(s.traceId)),[j,x]),E=x.size===2,R=h.length>0||i.length>0||T.periodHours!==24;function y(s,o=!0){a(d=>{const f=new URLSearchParams(d);for(const[A,F]of Object.entries(s))F===void 0||F===""?f.delete(A):f.set(A,String(F));return o&&f.delete("page"),f},{replace:!0})}return e.jsxs(e.Fragment,{children:[e.jsxs(ue,{eyebrow:"Trace Explorer",title:"Deep-dive into every trace flowing through the system.",description:"Explore, compare, and inspect individual traces with full visibility into span counts, token usage, cost, and execution timing.",aside:e.jsx("div",{className:"insight-panel",children:e.jsxs("div",{className:"grid gap-3",children:[e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Total traces"}),e.jsxs("div",{className:"mt-2 flex items-center justify-between",children:[e.jsx("div",{className:"text-lg font-medium text-white",children:ee(S)}),e.jsx(W,{className:"h-4 w-4 text-emerald-300"})]}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:"Matching current filters"})]}),x.size>0&&e.jsxs("div",{className:"rounded-2xl border border-sky-400/15 bg-sky-400/5 p-4",children:[e.jsx("div",{className:"hud-label",children:"Selected"}),e.jsxs("div",{className:"mt-2 flex items-center justify-between",children:[e.jsxs("div",{className:"text-lg font-medium text-white",children:[x.size," trace",x.size!==1&&"s"]}),e.jsx(K,{className:"h-4 w-4 text-sky-300"})]}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:E?"Ready to compare":"Select exactly 2 to compare"})]})]})}),children:[e.jsx(H,{children:x.size>0&&e.jsx(I.div,{initial:{opacity:0,gridTemplateRows:"0fr"},animate:{opacity:1,gridTemplateRows:"1fr"},exit:{opacity:0,gridTemplateRows:"0fr"},transition:{duration:.25,ease:"easeOut"},style:{display:"grid"},children:e.jsx("div",{className:"overflow-hidden",children:e.jsxs("div",{className:"dashboard-shell flex items-center justify-between gap-4 rounded-[24px] px-5 py-3",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("span",{className:"status-chip",children:[e.jsx(O,{className:"h-3.5 w-3.5 text-emerald-300"}),e.jsxs("span",{children:[x.size," selected"]})]}),e.jsxs("button",{type:"button",onClick:ne,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(Ne,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Clear"})]})]}),e.jsxs("button",{type:"button",disabled:!E,onClick:()=>L(!0),className:`inline-flex items-center gap-2 rounded-2xl border px-4 py-2 text-sm font-medium transition-all ${E?"border-emerald-400/20 bg-[linear-gradient(135deg,rgba(16,185,129,0.14),rgba(14,165,233,0.08))] text-emerald-300 hover:bg-[linear-gradient(135deg,rgba(16,185,129,0.24),rgba(14,165,233,0.14))]":"cursor-not-allowed border-white/6 bg-white/4 text-slate-500"}`,children:[e.jsx(K,{className:"h-4 w-4"}),"Compare traces"]})]})})})}),e.jsx(H,{children:te&&z.length===2&&e.jsx(Me,{traceA:z[0],traceB:z[1],onClose:()=>L(!1)})}),e.jsxs("section",{className:"dashboard-shell rounded-[26px] px-4 py-4 sm:px-5 sm:py-5",children:[e.jsxs("div",{className:"mb-4 rounded-[24px] border border-white/8 bg-[linear-gradient(180deg,rgba(7,14,26,0.95),rgba(4,8,18,0.98))] p-4",children:[e.jsxs("div",{className:"flex flex-wrap items-start justify-between gap-3",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Search console"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Trace explorer"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("span",{className:"status-chip",children:[e.jsx(ye,{className:"h-3.5 w-3.5 text-amber-300"}),e.jsxs("span",{children:[S," traces"]})]}),e.jsxs("button",{type:"button",onClick:()=>y({q:void 0,status:void 0,periodHours:void 0}),disabled:!R,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(U,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Clear"})]})]})]}),e.jsxs("div",{className:"mt-4 grid gap-3 md:grid-cols-[minmax(0,1.8fr)_minmax(0,0.6fr)_minmax(0,0.6fr)]",children:[e.jsxs("label",{className:"relative block",children:[e.jsx(de,{className:"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-slate-500"}),e.jsx("input",{value:h,onChange:s=>y({q:s.target.value||void 0}),placeholder:"Search by trace name, ID, or keyword...",className:"w-full rounded-2xl border border-white/8 bg-white/4 py-3 pl-10 pr-4 text-sm text-white placeholder:text-slate-500 focus:border-emerald-400/30 focus:bg-white/6 focus:outline-none"})]}),e.jsxs("select",{value:i,onChange:s=>y({status:s.target.value||void 0}),className:"w-full rounded-2xl border border-white/8 bg-white/4 px-4 py-3 text-sm text-white focus:border-emerald-400/30 focus:bg-white/6 focus:outline-none",children:[e.jsx("option",{value:"",children:"All states"}),e.jsx("option",{value:"ok",children:"Healthy only"}),e.jsx("option",{value:"error",children:"Errors only"})]}),e.jsx("select",{value:String(T.periodHours??24),onChange:s=>y({periodHours:Number(s.target.value)===24?void 0:Number(s.target.value)}),className:"w-full rounded-2xl border border-white/8 bg-white/4 px-4 py-3 text-sm text-white focus:border-amber-400/30 focus:bg-white/6 focus:outline-none",children:G.map(s=>e.jsx("option",{value:s.value,children:s.label},s.value))})]})]}),ae?e.jsx("div",{className:"empty-state h-[400px] text-slate-500",children:"Loading traces..."}):j.length===0?e.jsxs("div",{className:"empty-state h-[400px]",children:[e.jsx(W,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:R?"No traces match these filters":"No traces recorded yet"}),e.jsx("div",{className:"mt-1 text-sm text-slate-500",children:R?"Try adjusting the search or time window":"Start sending spans to populate the explorer"})]}):e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"overflow-x-auto",children:e.jsxs("table",{className:"w-full border-separate border-spacing-y-1.5 text-sm",children:[e.jsx("thead",{children:e.jsxs("tr",{className:"text-left text-[11px] uppercase tracking-[0.18em] text-slate-500",children:[e.jsx("th",{className:"px-3 py-2 text-center",children:e.jsx("button",{type:"button",onClick:re,className:"inline-flex items-center justify-center transition-colors hover:text-slate-300",title:D?"Deselect all":"Select all",children:D?e.jsx(O,{className:"h-4 w-4 text-emerald-300"}):e.jsx(J,{className:"h-4 w-4"})})}),e.jsx("th",{className:"px-3 py-2 w-10",children:"State"}),e.jsx("th",{className:"px-3 py-2",children:"Trace"}),e.jsx("th",{className:"px-3 py-2",children:"ID"}),[["spanCount","Spans"],["totalTokens","Tokens"],["totalCost","Cost"],["startTime","When"]].map(([s,o])=>e.jsx("th",{className:"px-3 py-2 text-right",children:e.jsxs("button",{type:"button",onClick:()=>le(s),className:"inline-flex items-center gap-1 transition-colors hover:text-slate-300",children:[o,g===s?c==="asc"?e.jsx(ge,{className:"h-3 w-3"}):e.jsx(be,{className:"h-3 w-3"}):e.jsx(fe,{className:"h-3 w-3 opacity-30"})]})},s)),e.jsx("th",{className:"px-3 py-2 text-right",children:"Duration"})]})}),e.jsx("tbody",{children:j.map(s=>{const o=x.has(s.traceId),d=s.totalDuration??(s.endTime?s.endTime-s.startTime:0);return e.jsxs("tr",{onClick:()=>$(s),className:`cursor-pointer rounded-2xl border transition-colors ${o?"border-emerald-400/20 bg-emerald-400/5":"border-white/6 bg-white/4 hover:bg-white/6"}`,children:[e.jsx("td",{className:"rounded-l-2xl px-3 py-3 text-center",onClick:f=>f.stopPropagation(),children:e.jsx("button",{type:"button",onClick:()=>ie(s.traceId),className:"inline-flex items-center justify-center transition-colors hover:text-emerald-300",children:o?e.jsx(O,{className:"h-4 w-4 text-emerald-300"}):e.jsx(J,{className:"h-4 w-4 text-slate-500"})})}),e.jsx("td",{className:"px-3 py-3",children:e.jsx(P,{status:s.status})}),e.jsx("td",{className:"px-3 py-3",children:e.jsx("span",{className:"inline-flex max-w-[280px] items-center gap-2 text-sm font-medium text-white",children:e.jsx("span",{className:"truncate",children:s.name})})}),e.jsx("td",{className:"px-3 py-3",children:e.jsx("span",{className:"font-mono text-[11px] uppercase tracking-[0.12em] text-slate-500",children:s.traceId.slice(0,12)})}),e.jsx("td",{className:"px-3 py-3 text-right font-mono text-xs text-slate-300",children:s.spanCount}),e.jsx("td",{className:"px-3 py-3 text-right font-mono text-xs text-slate-300",children:s.totalTokens.toLocaleString()}),e.jsx("td",{className:"px-3 py-3 text-right font-mono text-xs text-slate-300",children:k(s.totalCost)}),e.jsx("td",{className:"px-3 py-3 text-right text-xs text-slate-500",children:B(s.startTime)}),e.jsx("td",{className:"rounded-r-2xl px-3 py-3 text-right font-mono text-xs text-slate-400",children:d>0?C(d):"--"})]},s.traceId)})})]})}),e.jsxs("div",{className:"mt-4 flex items-center justify-between gap-3 px-1",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"text-xs text-slate-500",children:S>0?`Showing ${v+1}-${Math.min(v+j.length,S)} of ${S}`:"Awaiting traces"}),e.jsx("select",{value:String(l),onChange:s=>y({pageSize:Number(s.target.value)===50?void 0:Number(s.target.value)}),className:"rounded-xl border border-white/8 bg-white/4 px-2 py-1.5 text-xs text-slate-300 focus:border-emerald-400/30 focus:outline-none",children:Y.map(s=>e.jsxs("option",{value:s,children:[s," / page"]},s))})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("button",{type:"button",onClick:()=>y({page:b>2?b-1:void 0},!1),disabled:b<=1,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(je,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Previous"})]}),e.jsxs("span",{className:"text-xs text-slate-500",children:[b," / ",Z]}),e.jsxs("button",{type:"button",onClick:()=>y({page:b+1},!1),disabled:b>=Z,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx("span",{children:"Next"}),e.jsx(se,{className:"h-3.5 w-3.5"})]})]})]})]})]})]}),e.jsx(H,{children:_&&e.jsxs(e.Fragment,{children:[e.jsx(I.div,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},onClick:()=>$(null),className:"fixed inset-0 z-40 bg-black/50 backdrop-blur-sm"},"overlay"),e.jsx(Ie,{trace:_,onClose:()=>$(null)},_.traceId)]})})]})}export{He as default};