llmtap 0.1.4 → 0.1.6

package/dist/dashboard/assets/Costs-DcNWZXjX.js

@@ -0,0 +1 @@
+import{r as j,d as y,j as e}from"./query-BSZkMKN4.js";import{a as w,f as C}from"./index-jVcSWGwX.js";import{L as k,y as T}from"./charts-BXAtT8sy.js";import{b as i,c as P,P as D}from"./format-CgXokIEM.js";import{D as S}from"./DataTable-CBsuKoTx.js";import{N as x}from"./number-ticker-C1hiu1bi.js";import{a as v}from"./provider-colors-DcHYMgVv.js";import{m as l}from"./motion-Bw6xJyTE.js";import{I as $,Z as L,$ as K,a0 as M,a1 as N,O as A,y as F,a2 as R}from"./icons-DhpK1vUv.js";const E=["emerald","sky","indigo","amber","orange","pink"],b={container:{transition:{staggerChildren:.08}},item:{hidden:{opacity:0,y:20,scale:.97},show:{opacity:1,y:0,scale:1,transition:{duration:.4,ease:[.22,1,.36,1]}}}};function h({label:r,value:o,sub:t,icon:n,gradient:a}){return e.jsxs(l.div,{variants:b.item,className:"metric-card",children:[e.jsx("div",{className:`metric-orb ${a}`,children:n}),e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:r}),e.jsx("div",{className:"mt-1 text-3xl font-semibold tracking-[-0.04em] text-white",children:o}),t&&e.jsx("div",{className:"mt-2 text-sm text-slate-400",children:t})]})]})}function H(){const[r,o]=j.useState([{id:"totalCost",desc:!0}]),{data:t,isLoading:n}=y({queryKey:["stats"],queryFn:()=>C(24)}),a=t?.byModel??[],d=t?.byProvider??[],p=a.map(s=>({name:s.model.length>22?`${s.model.slice(0,20)}...`:s.model,cost:Number(s.totalCost.toFixed(6)),tokens:s.totalTokens,calls:s.spanCount})),c=d.map(s=>({name:s.provider,value:Number(s.totalCost.toFixed(6))})),f=j.useMemo(()=>[{accessorKey:"model",header:"Model",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs font-semibold text-slate-100",children:s.original.model})},{accessorKey:"provider",header:"Provider",cell:({row:s})=>e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"h-2.5 w-2.5 rounded-full",style:{backgroundColor:v[s.original.provider]??"#a855f6",boxShadow:`0 0 10px ${v[s.original.provider]??"#a855f6"}`}}),e.jsx("span",{className:"text-xs font-medium capitalize text-slate-200",children:s.original.provider})]})},{accessorKey:"spanCount",header:"Calls",cell:({row:s})=>e.jsx("span",{className:"inline-flex items-center justify-center rounded-md border border-white/8 bg-slate-950/70 px-2 py-0.5 font-mono text-xs text-slate-400",children:s.original.spanCount}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"totalTokens",header:"Tokens",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs text-slate-300",children:s.original.totalTokens.toLocaleString()}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"totalCost",header:"Cost",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs font-semibold text-white",children:i(s.original.totalCost)}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"avgDuration",header:"Avg Duration",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs text-slate-500",children:s.original.avgDuration?P(s.original.avgDuration):"-"}),meta:{className:"text-right",cellClassName:"text-right"}}],[a]);return n?e.jsxs("div",{className:"mx-auto max-w-[1500px] space-y-8",children:[e.jsx("div",{className:"skeleton-panel h-44 rounded-[28px]"}),e.jsx("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-3",children:[...Array(3)].map((s,m)=>e.jsxs("div",{className:"metric-card",children:[e.jsx("div",{className:"skeleton-panel h-12 w-12 rounded-2xl"}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("div",{className:"skeleton-panel h-3 w-20 rounded-full"}),e.jsx("div",{className:"skeleton-panel h-8 w-28 rounded-full"})]})]},m))})]}):e.jsxs(D,{eyebrow:"Economic Layer",title:"Understand where every token is converting into spend.",description:"The economics view is now built like a cost cockpit. It surfaces burn concentration, provider mix, and the models that are consuming budget fastest.",aside:e.jsxs("div",{className:"insight-panel",children:[e.jsx(w,{}),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:"Highest model spend"}),e.jsx("div",{className:"mt-2 text-base font-medium text-white",children:a[0]?.model??"Awaiting traffic"}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:a[0]?`${i(a[0].totalCost)} across ${a[0].spanCount} calls`:"No model cost data yet"})]}),e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Provider spread"}),e.jsxs("div",{className:"mt-2 text-base font-medium text-white",children:[d.length," active providers"]}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:"Cost dominance becomes obvious here before it becomes expensive."})]})]})]}),children:[e.jsxs(l.div,{className:"grid grid-cols-1 gap-4 md:grid-cols-3",variants:b.container,initial:"hidden",animate:"show",children:[e.jsx(h,{icon:e.jsx($,{className:"h-5 w-5"}),label:"Total Cost",value:e.jsx(x,{value:t?.totalCost??0,decimalPlaces:t&&(t.totalCost??0)<.01?4:2,prefix:"$"}),sub:"Accumulated over the last 24 hours",gradient:"bg-[linear-gradient(135deg,rgba(250,204,21,0.18),rgba(249,115,22,0.18))] text-amber-200"}),e.jsx(h,{icon:e.jsx(L,{className:"h-5 w-5"}),label:"Token Volume",value:e.jsx(x,{value:t?.totalTokens??0}),sub:`${t?.totalSpans??0} model calls observed`,gradient:"bg-[linear-gradient(135deg,rgba(56,189,248,0.18),rgba(168,85,247,0.18))] text-sky-200"}),e.jsx(h,{icon:e.jsx(K,{className:"h-5 w-5"}),label:"Models in Rotation",value:e.jsx(x,{value:a.length}),sub:`${d.length} providers contributing to spend`,gradient:"bg-[linear-gradient(135deg,rgba(52,211,153,0.18),rgba(14,165,233,0.18))] text-emerald-200"})]}),e.jsxs("div",{className:"grid gap-5 xl:grid-cols-[minmax(0,1.1fr)_minmax(360px,0.9fr)]",children:[e.jsxs(l.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 justify-between",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Model ranking"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Cost by model"})]}),e.jsxs("span",{className:"status-chip",children:[e.jsx(M,{className:"h-3.5 w-3.5 text-sky-300"}),e.jsx("span",{children:"Spend concentration"})]})]}),p.length>0?e.jsx(k,{data:p,index:"name",categories:["cost"],colors:["emerald"],layout:"vertical",valueFormatter:i,showAnimation:!0,showLegend:!1,showGridLines:!1,className:"min-h-[320px]"}):e.jsxs("div",{className:"empty-state h-[320px]",children:[e.jsx(N,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No cost data yet"}),e.jsx("div",{className:"text-center text-sm text-slate-400",children:"Model spend will stack up here as soon as traffic hits the collector."})]})]}),e.jsxs(l.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 justify-between",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Provider mix"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Who is taking the budget"})]}),e.jsx(A,{className:"h-4 w-4 text-sky-300"})]}),c.length>0?e.jsxs("div",{className:"flex flex-col gap-6 lg:flex-row lg:items-center",children:[e.jsx(T,{data:c,category:"value",index:"name",colors:[...E],valueFormatter:i,showAnimation:!0,showLabel:!1,className:"h-[260px] lg:max-w-[260px]"}),e.jsx("div",{className:"flex-1 space-y-3",children:c.map((s,m)=>{const u=["#34d399","#38bdf8","#818cf8","#f59e0b","#f97316","#f472b6"],g=u[m%u.length];return e.jsx("div",{className:"rounded-2xl border border-white/6 bg-white/4 p-3.5",children:e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("span",{className:"h-3 w-3 shrink-0 rounded-sm",style:{backgroundColor:g,boxShadow:`0 0 10px ${g}50`}}),e.jsx("span",{className:"flex-1 text-sm font-medium capitalize text-white",children:s.name}),e.jsx("span",{className:"font-mono text-xs text-slate-400",children:i(s.value)})]})},s.name)})})]}):e.jsxs("div",{className:"empty-state h-[260px]",children:[e.jsx(F,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No providers yet"}),e.jsx("div",{className:"text-center text-sm text-slate-400",children:"Provider allocation appears here as soon as at least one model call is captured."})]})]})]}),a.length>0?e.jsxs(l.div,{className:"dashboard-shell overflow-hidden rounded-[26px] px-4 py-4 sm:px-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:.25,duration:.35},children:[e.jsxs("div",{className:"mb-3 flex items-center justify-between gap-3 px-1",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Detailed ledger"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Breakdown by model"})]}),e.jsxs("span",{className:"status-chip",children:[e.jsx(R,{className:"h-3.5 w-3.5 text-sky-300"}),e.jsxs("span",{children:[a.length," models"]})]})]}),e.jsx(S,{columns:f,data:a,sorting:r,onSortingChange:o})]}):e.jsx(l.div,{className:"dashboard-shell rounded-[26px] p-16",initial:{opacity:0},animate:{opacity:1},children:e.jsxs("div",{className:"empty-state",children:[e.jsx(N,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No cost data yet"}),e.jsx("div",{className:"max-w-sm text-center text-sm text-slate-400",children:"Start making traced model calls and the economic layer will fill in automatically."})]})})]})}export{H as default};

package/dist/dashboard/assets/Dashboard-Dkx38fyX.js

@@ -0,0 +1,9 @@
+import{r as o,j as e,d as O}from"./query-BSZkMKN4.js";import{c as ce,u as de,L as oe,a as xe,f as me,b as he,d as pe}from"./index-jVcSWGwX.js";import{N as ue}from"./charts-BXAtT8sy.js";import{f as je,P as ge,a as U,b as S,c as E,d as X}from"./format-CgXokIEM.js";import{S as fe}from"./StatusDot-BAf4TSfE.js";import{S as T,a as P,b as A,c as $,d as p,B}from"./select-CbYE6Q0M.js";import{N as R}from"./number-ticker-C1hiu1bi.js";import{P as Q}from"./constants-OlSc-7iA.js";import{R as ve,C as Ne,k as D,l as W,G as be,X as we,S as ye,A as Y,m as Se,n as ke,o as Ce,p as Z,q as _e,T as J,r as Te,j as Pe,O as Ae}from"./icons-DhpK1vUv.js";import{m as $e}from"./motion-Bw6xJyTE.js";function De({children:a,className:N,spotlightColor:x="rgba(52, 211, 153, 0.15)"}){const n=o.useRef(null),[l,b]=o.useState({x:0,y:0}),[u,j]=o.useState(0);function k(c){if(!n.current)return;const r=n.current.getBoundingClientRect();b({x:c.clientX-r.left,y:c.clientY-r.top})}return e.jsxs("div",{ref:n,onMouseMove:k,onMouseEnter:()=>j(1),onMouseLeave:()=>j(0),className:ce("relative overflow-hidden",N),children:[e.jsx("div",{className:"pointer-events-none absolute -inset-px opacity-0 transition-opacity duration-300",style:{opacity:u,background:`radial-gradient(600px circle at ${l.x}px ${l.y}px, ${x}, transparent 40%)`}}),a]})}const ee=[12,25,50,100];function I({label:a,value:N,detail:x,accent:n,icon:l}){return e.jsxs(De,{className:"metric-card",children:[e.jsx("div",{className:`metric-orb ${n}`,children:l}),e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:a}),e.jsx("div",{className:"mt-1 text-3xl font-semibold tracking-[-0.04em] text-white",children:N}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:x})]})]})}function ze(){const[a,N]=de(),x=a.get("q")??"",n=o.useDeferredValue(x),l=a.get("provider")??"",b=a.get("status"),u=b==="ok"||b==="error"?b:"",j=Number(a.get("periodHours")??"24"),k=Number(a.get("pageSize")??"12"),c=ee.includes(k)?k:12,r=Math.max(1,Number(a.get("page")??"1")||1),C=(r-1)*c,m=o.useMemo(()=>({limit:c,offset:C,q:n.trim()||void 0,provider:l||void 0,status:u||void 0,periodHours:Q.some(s=>s.value===j)?j:24}),[n,c,C,j,l,u]),{data:t}=O({queryKey:["stats",m.periodHours],queryFn:()=>me(m.periodHours??24)}),{data:H,isLoading:se}=O({queryKey:["traces",m],queryFn:()=>he(m)}),{data:te}=O({queryKey:["insights"],queryFn:pe,refetchInterval:6e4}),F=te?.insights??[],q=H?.traces??[],w=H?.total??0,ae=Math.max(1,Math.ceil(w/c)),[g,le]=o.useState(null),[L,G]=o.useState("desc");function re(s){g===s?G(i=>i==="asc"?"desc":"asc"):(le(s),G("desc"))}const y=o.useMemo(()=>g?[...q].sort((s,i)=>{const _=s[g]??0,h=i[g]??0;return L==="asc"?_-h:h-_}):q,[q,g,L]),f=t?.byProvider[0],v=y[0],ie=[...new Set(t?.byProvider.map(s=>s.provider)??[])],V=t?.costOverTime.map(s=>({time:je(s.timestamp),cost:s.cost}))??[],ne=t&&t.totalSpans>0?t.totalCost/t.totalSpans:0,z=x.length>0||l.length>0||u.length>0||m.periodHours!==24;function d(s,i=!0){N(_=>{const h=new URLSearchParams(_);for(const[K,M]of Object.entries(s))M===void 0||M===""?h.delete(K):h.set(K,String(M));return i&&h.delete("page"),h},{replace:!0})}return e.jsxs(ge,{eyebrow:"Flight Deck",title:"Read the behavior of every model call like a live system.",description:"The dashboard should act like an operator console. This version adds a real trace search surface, URL-synced filters, and paginated queue control.",aside:e.jsxs("div",{className:"insight-panel",children:[e.jsx(xe,{}),e.jsxs("div",{className:"mt-4 grid gap-3",children:[e.jsxs("div",{className:"surface-strong rounded-2xl p-4",children:[e.jsx("div",{className:"hud-label",children:"Dominant provider"}),e.jsxs("div",{className:"mt-2 flex items-center justify-between",children:[e.jsx("div",{className:"text-lg font-medium capitalize text-white",children:f?.provider??"Awaiting traffic"}),e.jsx(Ae,{className:"h-4 w-4 text-sky-300"})]}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:f?`${f.spanCount} calls, ${S(f.totalCost)} spend`:"No provider activity yet"})]}),e.jsxs("div",{className:"surface-strong rounded-2xl p-4",children:[e.jsx("div",{className:"hud-label",children:"Latest trace"}),e.jsx("div",{className:"mt-2 text-base font-medium text-white",children:v?.name??"No recent traces"}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:v?`${X(v.startTime)} / ${v.spanCount} spans`:"Start sending spans to populate the deck"})]})]})]}),children:[e.jsxs("div",{className:"grid gap-4 md:grid-cols-2 xl:grid-cols-4",children:[e.jsx(I,{label:"Trace Volume",value:e.jsx(R,{value:t?.totalTraces??0,className:"tabular-nums"}),detail:`${t?.totalSpans??0} spans in window`,icon:e.jsx(ve,{className:"h-5 w-5"}),accent:"bg-[linear-gradient(135deg,rgba(52,211,153,0.18),rgba(14,165,233,0.18))] text-emerald-200"}),e.jsx(I,{label:"Token Throughput",value:U(t?.totalTokens??0),detail:"Token load across the active filter window",icon:e.jsx(Ne,{className:"h-5 w-5"}),accent:"bg-[linear-gradient(135deg,rgba(56,189,248,0.18),rgba(168,85,247,0.18))] text-sky-200"}),e.jsx(I,{label:"Spend Velocity",value:e.jsx(R,{value:t?.totalCost??0,decimalPlaces:t&&t.totalCost<.01?4:2,prefix:"$",className:"tabular-nums"}),detail:`${S(ne)} average cost per call`,icon:e.jsx(D,{className:"h-5 w-5"}),accent:"bg-[linear-gradient(135deg,rgba(251,191,36,0.18),rgba(249,115,22,0.18))] text-amber-200"}),e.jsx(I,{label:"Risk Surface",value:e.jsx(R,{value:Math.round((t?.errorRate??0)*100),suffix:"%",className:"tabular-nums"}),detail:`${t?.errorCount??0} failing calls`,icon:e.jsx(W,{className:"h-5 w-5"}),accent:"bg-[linear-gradient(135deg,rgba(244,63,94,0.18),rgba(168,85,247,0.18))] text-rose-200"})]}),e.jsxs("div",{className:"grid gap-5 xl:grid-cols-[minmax(0,1.5fr)_minmax(320px,0.95fr)]",children:[e.jsxs("section",{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:"Economic pulse"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Cost gradient"})]}),e.jsxs("div",{className:"status-chip",children:[e.jsx(be,{className:"h-3.5 w-3.5 text-sky-300"}),e.jsxs("span",{children:[m.periodHours,"h window"]})]})]}),V.length>0?e.jsx(ue,{data:V,index:"time",categories:["cost"],colors:["emerald"],valueFormatter:S,showAnimation:!0,showLegend:!1,showGridLines:!1,className:"h-80",curveType:"monotone"}):e.jsxs("div",{className:"empty-state h-[320px]",children:[e.jsx(D,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No cost movement yet"})]})]}),e.jsxs("section",{className:"dashboard-shell rounded-[26px] px-5 py-5 sm:px-6",children:[e.jsxs("div",{className:"mb-5",children:[e.jsx("div",{className:"hud-label",children:"Provider pressure"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Allocation by provider"})]}),e.jsx("div",{className:"space-y-4",children:(t?.byProvider??[]).map(s=>{const i=(t?.totalCost??0)>0?s.totalCost/(t?.totalCost??1)*100:0;return e.jsxs("div",{className:"surface-muted rounded-2xl p-4",children:[e.jsxs("div",{className:"flex items-center justify-between gap-3",children:[e.jsxs("div",{children:[e.jsx("div",{className:"text-sm font-medium capitalize text-white",children:s.provider}),e.jsxs("div",{className:"text-xs text-slate-400",children:[s.spanCount," calls / ",U(s.totalTokens)," tokens"]})]}),e.jsxs("div",{className:"text-right",children:[e.jsx("div",{className:"text-sm font-medium text-white",children:S(s.totalCost)}),e.jsx("div",{className:"text-xs text-slate-500",children:E(s.avgDuration)})]})]}),e.jsx("div",{className:"mt-3 h-2 overflow-hidden rounded-full bg-slate-900/80",children:e.jsx($e.div,{className:"h-full w-full origin-left rounded-full bg-[linear-gradient(90deg,#34d399,#38bdf8)]",initial:{scaleX:0},animate:{scaleX:Math.max(i,4)/100},transition:{duration:.5,ease:"easeOut"}})})]},s.provider)})})]})]}),e.jsxs("div",{className:"grid gap-5 xl:grid-cols-[minmax(0,1.45fr)_minmax(320px,0.85fr)]",children:[e.jsxs("section",{className:"dashboard-shell rounded-[26px] px-4 py-4 sm:px-5 sm:py-5",children:[e.jsxs("div",{className:"surface-strong mb-4 rounded-[24px] 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 dispatch queue"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs("span",{className:"status-chip",children:[w," matches"]}),e.jsxs("button",{type:"button",onClick:()=>d({q:void 0,provider:void 0,status:void 0,periodHours:void 0}),disabled:!z,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(we,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Clear"})]})]})]}),e.jsxs("div",{className:"mt-4 grid gap-3 xl:grid-cols-[minmax(0,1.7fr)_repeat(3,minmax(0,0.7fr))]",children:[e.jsxs("label",{className:"field-surface relative block rounded-2xl",children:[e.jsx(ye,{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:x,onChange:s=>d({q:s.target.value||void 0}),placeholder:"Search traces, models, providers, errors",className:"w-full rounded-2xl bg-transparent py-3 pl-10 pr-4 text-sm text-white placeholder:text-slate-500 focus:outline-none"})]}),e.jsxs(T,{value:l||"__all__",onValueChange:s=>d({provider:s==="__all__"?void 0:s}),children:[e.jsx(P,{className:"w-full rounded-2xl py-3",children:e.jsx(A,{placeholder:"All providers"})}),e.jsxs($,{children:[e.jsx(p,{value:"__all__",children:"All providers"}),ie.map(s=>e.jsx(p,{value:s,children:s},s))]})]}),e.jsxs(T,{value:u||"__all__",onValueChange:s=>d({status:s==="__all__"?void 0:s}),children:[e.jsx(P,{className:"w-full rounded-2xl py-3",children:e.jsx(A,{placeholder:"All states"})}),e.jsxs($,{children:[e.jsx(p,{value:"__all__",children:"All states"}),e.jsx(p,{value:"ok",children:"Healthy only"}),e.jsx(p,{value:"error",children:"Errors only"})]})]}),e.jsxs(T,{value:String(m.periodHours??24),onValueChange:s=>d({periodHours:Number(s)===24?void 0:Number(s)}),children:[e.jsx(P,{className:"w-full rounded-2xl py-3",children:e.jsx(A,{})}),e.jsx($,{children:Q.map(s=>e.jsx(p,{value:String(s.value),children:s.label},s.value))})]})]})]}),se?e.jsx("div",{className:"empty-state h-[280px] text-slate-500",children:"Loading trace queue..."}):y.length===0&&!z?e.jsxs("div",{className:"surface-strong rounded-2xl p-6 sm:p-8",children:[e.jsxs("div",{className:"flex flex-col items-center gap-3 text-center",children:[e.jsx(Y,{className:"h-10 w-10 text-amber-400/60"}),e.jsxs("div",{children:[e.jsx("div",{className:"text-lg font-semibold text-white",children:"No traces recorded yet"}),e.jsx("p",{className:"mt-1 text-sm text-slate-400",children:"Get started in 3 steps — takes under a minute."})]})]}),e.jsxs("div",{className:"mx-auto mt-6 flex max-w-3xl flex-col gap-4",children:[e.jsxs("div",{className:"surface-muted rounded-xl p-4",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-2",children:[e.jsx("span",{className:"flex h-5 w-5 items-center justify-center rounded-full bg-amber-400/20 text-[10px] font-bold text-amber-400",children:"1"}),e.jsx("span",{className:"text-xs font-semibold uppercase tracking-wider text-amber-400",children:"Install the SDK"})]}),e.jsx("pre",{className:"overflow-x-auto rounded-lg bg-black/40 p-3 text-sm leading-relaxed text-green-400 select-all",children:"npm install @llmtap/sdk"})]}),e.jsxs("div",{className:"surface-muted rounded-xl p-4",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-2",children:[e.jsx("span",{className:"flex h-5 w-5 items-center justify-center rounded-full bg-amber-400/20 text-[10px] font-bold text-amber-400",children:"2"}),e.jsx("span",{className:"text-xs font-semibold uppercase tracking-wider text-amber-400",children:"Wrap your client & use normally"})]}),e.jsx("pre",{className:"overflow-x-auto rounded-lg bg-black/40 p-3 text-sm leading-relaxed text-green-400 select-all whitespace-pre",children:`import { wrap } from "@llmtap/sdk";
+import OpenAI from "openai";
+
+const client = wrap(new OpenAI());
+
+const res = await client.chat.completions.create({
+  model: "gpt-4o-mini",
+  messages: [{ role: "user", content: "Hello!" }],
+});`})]}),e.jsxs("div",{className:"surface-muted rounded-xl p-4",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-2",children:[e.jsx("span",{className:"flex h-5 w-5 items-center justify-center rounded-full bg-amber-400/20 text-[10px] font-bold text-amber-400",children:"3"}),e.jsx("span",{className:"text-xs font-semibold uppercase tracking-wider text-amber-400",children:"Start the collector"})]}),e.jsx("pre",{className:"overflow-x-auto rounded-lg bg-black/40 p-3 text-sm leading-relaxed text-green-400 select-all",children:"npx llmtap"}),e.jsx("p",{className:"mt-2 text-xs text-slate-500",children:"Run your app and traces will appear here automatically."})]})]}),e.jsx("div",{className:"surface-muted mx-auto mt-4 max-w-3xl rounded-lg px-4 py-2.5",children:e.jsxs("p",{className:"text-center text-xs text-slate-500",children:["Works with ",e.jsx("span",{className:"text-slate-400",children:"OpenAI"}),", ",e.jsx("span",{className:"text-slate-400",children:"Anthropic"}),", ",e.jsx("span",{className:"text-slate-400",children:"Google Gemini"}),", ",e.jsx("span",{className:"text-slate-400",children:"DeepSeek"}),", ",e.jsx("span",{className:"text-slate-400",children:"Groq"}),", ",e.jsx("span",{className:"text-slate-400",children:"Together"}),", ",e.jsx("span",{className:"text-slate-400",children:"Fireworks"}),", ",e.jsx("span",{className:"text-slate-400",children:"OpenRouter"}),", and any OpenAI-compatible provider."]})})]}):y.length===0?e.jsxs("div",{className:"empty-state h-[280px]",children:[e.jsx(Y,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No traces match these filters"})]}):e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"overflow-x-auto",children:e.jsxs("table",{className:"w-full border-separate border-spacing-y-2 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-4 py-2",children:"State"}),e.jsx("th",{className:"px-4 py-2",children:"Trace"}),[["spanCount","Spans"],["totalTokens","Tokens"],["totalCost","Cost"],["startTime","When"]].map(([s,i])=>e.jsx("th",{className:"px-4 py-2 text-right",children:e.jsxs("button",{type:"button",onClick:()=>re(s),className:"inline-flex items-center gap-1 transition-colors hover:text-slate-300",children:[i,g===s?L==="asc"?e.jsx(Se,{className:"h-3 w-3"}):e.jsx(ke,{className:"h-3 w-3"}):e.jsx(Ce,{className:"h-3 w-3 opacity-30"})]})},s))]})}),e.jsx("tbody",{children:y.map(s=>e.jsxs("tr",{className:"table-row-surface rounded-2xl",children:[e.jsx("td",{className:"rounded-l-2xl px-4 py-4",children:e.jsx(fe,{status:s.status})}),e.jsx("td",{className:"px-4 py-4",children:e.jsxs(oe,{to:`/trace/${s.traceId}`,className:"group inline-flex max-w-[380px] flex-col gap-1 text-sm font-medium text-white transition-colors hover:text-emerald-300",children:[e.jsxs("span",{className:"inline-flex items-center gap-2",children:[e.jsx("span",{className:"truncate",children:s.name}),e.jsx(Z,{className:"h-3.5 w-3.5 opacity-0 transition-all group-hover:translate-x-0.5 group-hover:opacity-100"})]}),e.jsxs("span",{className:"font-mono text-[10px] uppercase tracking-[0.16em] text-slate-500",children:[s.traceId.slice(0,12),s.totalDuration?` / ${E(s.totalDuration)}`:""]})]})}),e.jsx("td",{className:"px-4 py-4 text-right font-mono text-xs text-slate-300",children:s.spanCount}),e.jsx("td",{className:"px-4 py-4 text-right font-mono text-xs text-slate-300",children:s.totalTokens.toLocaleString()}),e.jsx("td",{className:"px-4 py-4 text-right font-mono text-xs text-slate-300",children:S(s.totalCost)}),e.jsx("td",{className:"rounded-r-2xl px-4 py-4 text-right text-xs text-slate-500",children:X(s.startTime)})]},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:w>0?`Showing ${C+1}-${Math.min(C+y.length,w)} of ${w}`:"Awaiting traces"}),e.jsxs(T,{value:String(c),onValueChange:s=>d({pageSize:Number(s)===12?void 0:Number(s)}),children:[e.jsx(P,{className:"w-auto rounded-xl px-2 py-1.5 text-xs",children:e.jsx(A,{})}),e.jsx($,{children:ee.map(s=>e.jsxs(p,{value:String(s),children:[s," / page"]},s))})]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsxs(B,{variant:"outline",size:"sm",onClick:()=>d({page:r>2?r-1:void 0},!1),disabled:r<=1,children:[e.jsx(_e,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Previous"})]}),e.jsxs(B,{variant:"outline",size:"sm",onClick:()=>d({page:r+1},!1),disabled:r>=ae,children:[e.jsx("span",{children:"Next"}),e.jsx(Z,{className:"h-3.5 w-3.5"})]})]})]})]})]}),e.jsxs("section",{className:"dashboard-shell rounded-[26px] px-5 py-5",children:[e.jsxs("div",{className:"mb-5",children:[e.jsx("div",{className:"hud-label",children:"Intelligence layer"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Insights"})]}),e.jsx("div",{className:"space-y-4",children:F.length>0?F.map(s=>e.jsxs("div",{className:`rounded-2xl border p-4 ${s.severity==="critical"?"border-rose-400/20 bg-rose-500/8":s.severity==="warning"?"border-amber-400/20 bg-amber-500/8":"border-white/6 bg-white/4"}`,children:[e.jsxs("div",{className:"mb-2 flex items-center justify-between gap-2",children:[e.jsxs("div",{className:"flex items-center gap-2 text-sm font-medium text-white",children:[s.type==="cost_anomaly"&&e.jsx(J,{className:"h-4 w-4 text-amber-300"}),s.type==="error_pattern"&&e.jsx(W,{className:"h-4 w-4 text-rose-300"}),s.type==="model_recommendation"&&e.jsx(Te,{className:"h-4 w-4 text-sky-300"}),s.type==="token_waste"&&e.jsx(D,{className:"h-4 w-4 text-purple-300"}),s.title]}),s.metric&&e.jsx("span",{className:"shrink-0 rounded-full border border-white/10 bg-white/6 px-2 py-0.5 text-[10px] font-mono text-slate-400",children:s.metric})]}),e.jsx("p",{className:"text-sm leading-6 text-slate-400",children:s.description})]},s.id)):e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"surface-muted rounded-2xl p-4",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-2 text-sm font-medium text-white",children:[e.jsx(Pe,{className:"h-4 w-4 text-sky-300"}),"Health read"]}),e.jsx("p",{className:"text-sm leading-6 text-slate-400",children:(t?.errorRate??0)>.05?"Error rate is elevated. Start with the most recent failed trace and inspect provider or tool payloads.":"Error pressure is currently low. Use this window to compare provider cost drift and latency patterns."})]}),e.jsxs("div",{className:"surface-muted rounded-2xl p-4",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-2 text-sm font-medium text-white",children:[e.jsx(D,{className:"h-4 w-4 text-emerald-300"}),"Spend insight"]}),e.jsx("p",{className:"text-sm leading-6 text-slate-400",children:f?`${f.provider} currently leads cost share. If that is unexpected, inspect the filtered queue for bursty workflows.`:"Provider concentration will appear here once traces land."})]}),e.jsxs("div",{className:"surface-muted rounded-2xl p-4",children:[e.jsxs("div",{className:"mb-2 flex items-center gap-2 text-sm font-medium text-white",children:[e.jsx(J,{className:"h-4 w-4 text-amber-300"}),"Queue focus"]}),e.jsx("p",{className:"text-sm leading-6 text-slate-400",children:v?`Latest traffic is "${v.name}". Open it to inspect hierarchy, timing, and payload shape.`:"No active traces yet. Generate a request through an instrumented client to validate the pipeline."})]})]})})]})]})]})}export{ze as default};

package/dist/dashboard/assets/DataTable-CBsuKoTx.js

@@ -0,0 +1 @@
+import{r as n,j as e,e as y,f as d,h as v,i as T}from"./query-BSZkMKN4.js";import{c as s}from"./index-jVcSWGwX.js";import{a4 as R,a5 as D,o as C}from"./icons-DhpK1vUv.js";const u=n.forwardRef(({className:l,...t},o)=>e.jsx("div",{className:"relative w-full overflow-auto",children:e.jsx("table",{ref:o,className:s("w-full caption-bottom text-sm",l),...t})}));u.displayName="Table";const f=n.forwardRef(({className:l,...t},o)=>e.jsx("thead",{ref:o,className:s("[&_tr]:border-b [&_tr]:border-white/6",l),...t}));f.displayName="TableHeader";const g=n.forwardRef(({className:l,...t},o)=>e.jsx("tbody",{ref:o,className:s("[&_tr:last-child]:border-0",l),...t}));g.displayName="TableBody";const k=n.forwardRef(({className:l,...t},o)=>e.jsx("tfoot",{ref:o,className:s("border-t border-white/6 bg-white/3 font-medium [&>tr]:last:border-b-0",l),...t}));k.displayName="TableFooter";const b=n.forwardRef(({className:l,...t},o)=>e.jsx("tr",{ref:o,className:s("border-b border-white/5 transition-colors hover:bg-white/[0.03] data-[state=selected]:bg-emerald-500/[0.06]",l),...t}));b.displayName="TableRow";const h=n.forwardRef(({className:l,...t},o)=>e.jsx("th",{ref:o,className:s("h-10 px-3 text-left align-middle text-xs font-semibold uppercase tracking-wider text-slate-500 [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",l),...t}));h.displayName="TableHead";const w=n.forwardRef(({className:l,...t},o)=>e.jsx("td",{ref:o,className:s("px-3 py-3 align-middle text-slate-300 [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",l),...t}));w.displayName="TableCell";const S=n.forwardRef(({className:l,...t},o)=>e.jsx("caption",{ref:o,className:s("mt-4 text-sm text-slate-500",l),...t}));S.displayName="TableCaption";function A({columns:l,data:t,sorting:o,onSortingChange:N,emptyState:j,rowClassName:i,onRowClick:m}){const x=y({data:t,columns:l,state:o?{sorting:o}:void 0,onSortingChange:N,getCoreRowModel:T(),getSortedRowModel:v(),manualPagination:!0});return t.length===0?j??e.jsx("div",{className:"empty-state h-[260px] text-slate-500",children:"No rows available."}):e.jsx("div",{className:"overflow-hidden rounded-[24px] border border-white/6 bg-[linear-gradient(180deg,rgba(8,13,24,0.88),rgba(4,8,18,0.96))]",children:e.jsxs(u,{className:"min-w-full",children:[e.jsx(f,{className:"sticky top-0 z-10 bg-[rgba(5,9,18,0.92)] backdrop-blur-xl",children:x.getHeaderGroups().map(r=>e.jsx(b,{className:"hover:bg-transparent",children:r.headers.map(a=>{const c=a.column.getCanSort(),p=a.column.getIsSorted();return e.jsx(h,{className:s("h-12 whitespace-nowrap px-4 text-[10px] tracking-[0.24em] text-slate-500",a.column.columnDef.meta&&typeof a.column.columnDef.meta=="object"&&"className"in a.column.columnDef.meta?String(a.column.columnDef.meta.className):void 0),children:a.isPlaceholder?null:c?e.jsxs("button",{type:"button",onClick:a.column.getToggleSortingHandler(),className:"inline-flex items-center gap-1.5 transition-colors hover:text-slate-200",children:[d(a.column.columnDef.header,a.getContext()),p==="asc"?e.jsx(R,{className:"h-3 w-3"}):p==="desc"?e.jsx(D,{className:"h-3 w-3"}):e.jsx(C,{className:"h-3 w-3 opacity-35"})]}):d(a.column.columnDef.header,a.getContext())},a.id)})},r.id))}),e.jsx(g,{children:x.getRowModel().rows.map(r=>e.jsx(b,{onClick:m?()=>m(r):void 0,className:s("group border-white/0 bg-transparent hover:bg-transparent",m?"cursor-pointer":void 0,typeof i=="function"?i(r):i),children:r.getVisibleCells().map((a,c)=>e.jsx(w,{className:s("table-row-surface px-4 py-4 transition-all duration-200 group-hover:border-white/12 group-hover:shadow-[0_18px_40px_rgba(0,0,0,0.16)]",c===0?"rounded-l-2xl":void 0,c===r.getVisibleCells().length-1?"rounded-r-2xl":void 0,a.column.columnDef.meta&&typeof a.column.columnDef.meta=="object"&&"cellClassName"in a.column.columnDef.meta?String(a.column.columnDef.meta.cellClassName):void 0),children:d(a.column.columnDef.cell,a.getContext())},a.id))},r.id))})]})})}export{A as D};

package/dist/dashboard/assets/Models-CESHenJX.js

@@ -0,0 +1 @@
+import{r as m,d as v,j as e}from"./query-BSZkMKN4.js";import{a as N,f as j}from"./index-jVcSWGwX.js";import{D as y}from"./DataTable-CBsuKoTx.js";import{a as x,b as o,c as h,P as b}from"./format-CgXokIEM.js";import{N as f}from"./number-ticker-C1hiu1bi.js";import{a as p}from"./provider-colors-DcHYMgVv.js";import{m as l}from"./motion-Bw6xJyTE.js";import{y as C,x as w,C as k,G as M}from"./icons-DhpK1vUv.js";import"./charts-BXAtT8sy.js";function u({rows:t,valueFormatter:i,barClassName:n}){const r=Math.max(...t.map(s=>s.value),1);return e.jsx("div",{className:"space-y-3",children:t.map(s=>e.jsxs("div",{className:"rounded-2xl border border-white/6 bg-[linear-gradient(180deg,rgba(10,16,28,0.9),rgba(5,10,20,0.94))] p-4",children:[e.jsxs("div",{className:"flex items-center justify-between gap-4",children:[e.jsx("span",{className:"truncate text-sm font-medium text-slate-200",children:s.name}),e.jsx("span",{className:"font-mono text-xs text-slate-400",children:i(s.value)})]}),e.jsx("div",{className:"mt-3 h-2.5 overflow-hidden rounded-full bg-slate-950/80",children:e.jsx(l.div,{className:`h-full rounded-full ${n}`,initial:{width:0},animate:{width:`${Math.max(s.value/r*100,6)}%`},transition:{duration:.45,ease:"easeOut"}})})]},s.name))})}function E(){const[t,i]=m.useState([{id:"totalCost",desc:!0}]),{data:n,isLoading:r}=v({queryKey:["stats",168],queryFn:()=>j(168)}),s=n?.byModel??[],d=s.map(a=>({name:a.model.length>20?`${a.model.slice(0,18)}...`:a.model,value:a.avgDuration})).filter(a=>a.value>0).slice(0,8),c=s.map(a=>({name:a.model.length>20?`${a.model.slice(0,18)}...`:a.model,value:a.totalTokens})).filter(a=>a.value>0).slice(0,8),g=m.useMemo(()=>[{accessorKey:"model",header:"Model",cell:({row:a})=>e.jsx("div",{className:"font-mono text-xs font-semibold text-slate-100",children:a.original.model})},{accessorKey:"provider",header:"Provider",cell:({row:a})=>e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"h-2.5 w-2.5 rounded-full",style:{backgroundColor:p[a.original.provider]??"#a855f6",boxShadow:`0 0 10px ${p[a.original.provider]??"#a855f6"}`}}),e.jsx("span",{className:"text-xs font-medium capitalize text-slate-200",children:a.original.provider})]})},{accessorKey:"spanCount",header:"Calls",cell:({row:a})=>e.jsx("span",{className:"inline-flex items-center justify-center rounded-md border border-white/8 bg-slate-950/70 px-2 py-0.5 font-mono text-xs text-slate-400",children:a.original.spanCount}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"totalTokens",header:"Tokens",cell:({row:a})=>e.jsx("span",{className:"font-mono text-xs text-slate-300",children:x(a.original.totalTokens)}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"totalCost",header:"Cost",cell:({row:a})=>e.jsx("span",{className:"font-mono text-xs font-semibold text-white",children:o(a.original.totalCost)}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"avgDuration",header:"Avg Latency",cell:({row:a})=>e.jsx("span",{className:"font-mono text-xs text-slate-400",children:a.original.avgDuration?h(a.original.avgDuration):"-"}),meta:{className:"text-right",cellClassName:"text-right"}},{id:"costPerCall",header:"Cost/Call",accessorFn:a=>a.spanCount>0?a.totalCost/a.spanCount:0,cell:({row:a})=>e.jsx("span",{className:"font-mono text-xs text-slate-500",children:a.original.spanCount>0?o(a.original.totalCost/a.original.spanCount):"-"}),meta:{className:"text-right",cellClassName:"text-right"}}],[]);return r?e.jsxs("div",{className:"mx-auto max-w-[1500px] space-y-8",children:[e.jsx("div",{className:"skeleton-panel h-44 rounded-[28px]"}),e.jsx("div",{className:"skeleton-panel h-80 rounded-[24px]"})]}):e.jsx(b,{eyebrow:"Model Intelligence",title:"Every model. Every metric. One surface.",description:"Compare cost, token volume, latency, and call frequency across all models in your rotation. Identify the models consuming the most budget and the ones delivering the best performance.",aside:e.jsxs("div",{className:"insight-panel",children:[e.jsx(N,{}),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:"Models active"}),e.jsx("div",{className:"mt-2 text-lg font-medium text-white",children:e.jsx(f,{value:s.length})}),e.jsxs("div",{className:"mt-1 text-sm text-slate-400",children:["Across ",new Set(s.map(a=>a.provider)).size," providers"]})]}),e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Highest cost model"}),e.jsx("div",{className:"mt-2 text-base font-medium text-white",children:s[0]?.model??"No data"}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:s[0]?o(s[0].totalCost):"-"})]})]})]}),children:s.length>0?e.jsxs(e.Fragment,{children:[e.jsxs(l.div,{className:"dashboard-shell overflow-hidden rounded-[26px] px-4 py-4 sm:px-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{duration:.35},children:[e.jsxs("div",{className:"mb-3 flex items-center justify-between gap-3 px-1",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Model roster"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Performance by model"})]}),e.jsxs("span",{className:"status-chip",children:[e.jsx(C,{className:"h-3.5 w-3.5 text-sky-300"}),e.jsxs("span",{children:[s.length," models"]})]})]}),e.jsx(y,{columns:g,data:s,sorting:t,onSortingChange:i})]}),e.jsxs("div",{className:"grid gap-5 xl:grid-cols-2",children:[e.jsxs(l.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 justify-between",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Latency profile"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Average latency by model"})]}),e.jsx(w,{className:"h-4 w-4 text-sky-300"})]}),d.length>0?e.jsx(u,{rows:d,valueFormatter:h,barClassName:"bg-[linear-gradient(90deg,rgba(56,189,248,0.95),rgba(34,211,238,0.78))]"}):e.jsx("div",{className:"empty-state h-[280px] text-slate-500",children:"No latency data available yet."})]}),e.jsxs(l.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 justify-between",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Token distribution"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Token volume by model"})]}),e.jsx(k,{className:"h-4 w-4 text-emerald-300"})]}),c.length>0?e.jsx(u,{rows:c,valueFormatter:x,barClassName:"bg-[linear-gradient(90deg,rgba(52,211,153,0.95),rgba(14,165,233,0.78))]"}):e.jsx("div",{className:"empty-state h-[280px] text-slate-500",children:"No token distribution data available yet."})]})]})]}):e.jsx("div",{className:"dashboard-shell rounded-[26px] p-16",children:e.jsxs("div",{className:"empty-state",children:[e.jsx(M,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No models tracked yet"}),e.jsx("div",{className:"max-w-sm text-center text-sm text-slate-400",children:"Start sending traced API calls and model metrics will populate automatically."})]})})})}export{E as default};

package/dist/dashboard/assets/Sessions-BcRE0OFh.js

@@ -0,0 +1,3 @@
+import{r as i,d as g,j as e}from"./query-BSZkMKN4.js";import{L as N,a as j,o as f}from"./index-jVcSWGwX.js";import{D as b}from"./DataTable-CBsuKoTx.js";import{a as v,b as r,d as n,P as y}from"./format-CgXokIEM.js";import{N as C}from"./number-ticker-C1hiu1bi.js";import{M as c,T as w,a3 as S}from"./icons-DhpK1vUv.js";import{m as k}from"./motion-Bw6xJyTE.js";import"./charts-BXAtT8sy.js";function F(){const[d,m]=i.useState([{id:"lastSeen",desc:!0}]),{data:o,isLoading:x}=g({queryKey:["sessions"],queryFn:()=>f(168)}),t=o?.sessions??[],l=o?.total??0,h=t.reduce((s,a)=>s+a.totalCost,0),p=t.reduce((s,a)=>s+a.traceCount,0),u=i.useMemo(()=>[{accessorKey:"sessionId",header:"Session ID",cell:({row:s})=>e.jsxs(N,{to:`/traces?q=${encodeURIComponent(s.original.sessionId)}`,className:"group inline-flex items-center gap-2",children:[e.jsx(c,{className:"h-4 w-4 text-sky-300"}),e.jsx("span",{className:"font-mono text-xs font-semibold text-slate-100 transition-colors group-hover:text-emerald-300",children:s.original.sessionId.length>28?`${s.original.sessionId.slice(0,26)}...`:s.original.sessionId})]})},{accessorKey:"traceCount",header:"Traces",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs text-slate-300",children:s.original.traceCount}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"spanCount",header:"Spans",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs text-slate-300",children:s.original.spanCount}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"totalTokens",header:"Tokens",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs text-slate-300",children:v(s.original.totalTokens)}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"totalCost",header:"Cost",cell:({row:s})=>e.jsx("span",{className:"font-mono text-xs font-semibold text-white",children:r(s.original.totalCost)}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"errorCount",header:"Errors",cell:({row:s})=>s.original.errorCount>0?e.jsxs("span",{className:"inline-flex items-center gap-1 rounded-full border border-rose-400/20 bg-rose-400/10 px-2 py-0.5 text-[10px] font-bold text-rose-300",children:[e.jsx(w,{className:"h-3 w-3"}),s.original.errorCount]}):e.jsx("span",{className:"font-mono text-xs text-slate-500",children:"0"}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"firstSeen",header:"First Seen",cell:({row:s})=>e.jsx("span",{className:"text-xs text-slate-500",children:n(s.original.firstSeen)}),meta:{className:"text-right",cellClassName:"text-right"}},{accessorKey:"lastSeen",header:"Last Active",cell:({row:s})=>e.jsx("span",{className:"text-xs text-slate-500",children:n(s.original.lastSeen)}),meta:{className:"text-right",cellClassName:"text-right"}}],[]);return x?e.jsxs("div",{className:"mx-auto max-w-[1500px] space-y-8",children:[e.jsx("div",{className:"skeleton-panel h-44 rounded-[28px]"}),e.jsx("div",{className:"skeleton-panel h-80 rounded-[24px]"})]}):e.jsx(y,{eyebrow:"Session Fabric",title:"Multi-turn conversations, grouped and measured.",description:"Sessions collect related traces into logical units. Track total cost and token volume across entire user conversations, multi-step agent runs, or workflow pipelines.",aside:e.jsxs("div",{className:"insight-panel",children:[e.jsx(j,{}),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:"Active sessions"}),e.jsx("div",{className:"mt-2 text-lg font-medium text-white",children:e.jsx(C,{value:l})}),e.jsxs("div",{className:"mt-1 text-sm text-slate-400",children:[p," traces across all sessions"]})]}),e.jsxs("div",{className:"rounded-2xl border border-white/8 bg-white/4 p-4",children:[e.jsx("div",{className:"hud-label",children:"Session spend"}),e.jsx("div",{className:"mt-2 text-base font-medium text-white",children:r(h)}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:"Combined cost across visible sessions"})]})]})]}),children:t.length>0?e.jsxs(k.div,{className:"dashboard-shell overflow-hidden rounded-[26px] px-4 py-4 sm:px-5",initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{duration:.35},children:[e.jsxs("div",{className:"mb-3 flex items-center justify-between gap-3 px-1",children:[e.jsxs("div",{children:[e.jsx("div",{className:"hud-label",children:"Session registry"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold tracking-[-0.04em] text-white",children:"Tracked sessions"})]}),e.jsxs("span",{className:"status-chip",children:[e.jsx(S,{className:"h-3.5 w-3.5 text-sky-300"}),e.jsxs("span",{children:[l," sessions"]})]})]}),e.jsx(b,{columns:u,data:t,sorting:d,onSortingChange:m})]}):e.jsx("div",{className:"dashboard-shell rounded-[26px] p-16",children:e.jsxs("div",{className:"empty-state",children:[e.jsx(c,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:"No sessions tracked yet"}),e.jsxs("div",{className:"max-w-md text-center text-sm text-slate-400",children:["Sessions appear when you pass a ",e.jsx("code",{className:"rounded bg-white/8 px-1.5 py-0.5 font-mono text-emerald-300",children:"sessionId"})," to the SDK. This groups related traces into logical conversations or workflows."]}),e.jsx("pre",{className:"mt-4 max-w-lg rounded-2xl border border-white/8 bg-white/4 p-4 text-left font-mono text-xs text-slate-300",children:`import { init } from "@llmtap/sdk";
+
+init({ sessionId: "user-session-123" });`})]})})})}export{F as default};

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

@@ -0,0 +1,12 @@
+import{j as e,r as o,u as Le,d as Fe}from"./query-BSZkMKN4.js";import{R as Be,p as le,e as Ue,q as ne,W as ze,C as Je,s as Qe,T as qe,D as Ge,g as ie,O as Ke,v as Ve,w as We,x as He,c as g,t as c,y as Ye,z as Xe,a as Ze,A as et,B as tt,E as st,F as at}from"./index-jVcSWGwX.js";import{P as rt,d as se}from"./format-CgXokIEM.js";import{f as de,S as ot,a as lt,b as nt,c as it,d as w}from"./select-CbYE6Q0M.js";import{m as y}from"./motion-Bw6xJyTE.js";import{a6 as dt,z as P,Q as ct,E as R,a7 as pt,b as xt,D as mt,X as ae,a8 as ht,a9 as ut,aa as gt,ab as bt}from"./icons-DhpK1vUv.js";import"./charts-BXAtT8sy.js";var ce="AlertDialog",[ft]=We(ce,[le]),h=le(),pe=s=>{const{__scopeAlertDialog:a,...r}=s,n=h(a);return e.jsx(Be,{...n,...r,modal:!0})};pe.displayName=ce;var yt="AlertDialogTrigger",jt=o.forwardRef((s,a)=>{const{__scopeAlertDialog:r,...n}=s,i=h(r);return e.jsx(He,{...i,...n,ref:a})});jt.displayName=yt;var vt="AlertDialogPortal",xe=s=>{const{__scopeAlertDialog:a,...r}=s,n=h(a);return e.jsx(Ue,{...n,...r})};xe.displayName=vt;var wt="AlertDialogOverlay",me=o.forwardRef((s,a)=>{const{__scopeAlertDialog:r,...n}=s,i=h(r);return e.jsx(Ke,{...i,...n,ref:a})});me.displayName=wt;var N="AlertDialogContent",[Nt,Ct]=ft(N),Dt=Ve("AlertDialogContent"),he=o.forwardRef((s,a)=>{const{__scopeAlertDialog:r,children:n,...i}=s,u=h(r),b=o.useRef(null),O=ne(a,b),C=o.useRef(null);return e.jsx(ze,{contentName:N,titleName:ue,docsSlug:"alert-dialog",children:e.jsx(Nt,{scope:r,cancelRef:C,children:e.jsxs(Je,{role:"alertdialog",...u,...i,ref:O,onOpenAutoFocus:Qe(i.onOpenAutoFocus,x=>{x.preventDefault(),C.current?.focus({preventScroll:!0})}),onPointerDownOutside:x=>x.preventDefault(),onInteractOutside:x=>x.preventDefault(),children:[e.jsx(Dt,{children:n}),e.jsx(St,{contentRef:b})]})})})});he.displayName=N;var ue="AlertDialogTitle",ge=o.forwardRef((s,a)=>{const{__scopeAlertDialog:r,...n}=s,i=h(r);return e.jsx(qe,{...i,...n,ref:a})});ge.displayName=ue;var be="AlertDialogDescription",fe=o.forwardRef((s,a)=>{const{__scopeAlertDialog:r,...n}=s,i=h(r);return e.jsx(Ge,{...i,...n,ref:a})});fe.displayName=be;var At="AlertDialogAction",ye=o.forwardRef((s,a)=>{const{__scopeAlertDialog:r,...n}=s,i=h(r);return e.jsx(ie,{...i,...n,ref:a})});ye.displayName=At;var je="AlertDialogCancel",ve=o.forwardRef((s,a)=>{const{__scopeAlertDialog:r,...n}=s,{cancelRef:i}=Ct(je,r),u=h(r),b=ne(a,i);return e.jsx(ie,{...u,...n,ref:b})});ve.displayName=je;var St=({contentRef:s})=>{const a=`\`${N}\` requires a description for the component to be accessible for screen reader users.
+
+You can add a description to the \`${N}\` by passing a \`${be}\` component as a child, which also benefits sighted users by adding visible context to the dialog.
+
+Alternatively, you can use your own component as a description by assigning it an \`id\` and passing the same value to the \`aria-describedby\` prop in \`${N}\`. If the description is confusing or duplicative for sighted users, you can use the \`@radix-ui/react-visually-hidden\` primitive as a wrapper around your description component.
+
+For more information, see https://radix-ui.com/primitives/docs/components/alert-dialog`;return o.useEffect(()=>{document.getElementById(s.current?.getAttribute("aria-describedby"))||console.warn(a)},[a,s]),null},Pt=pe,Rt=xe,we=me,Ne=he,Ce=ye,De=ve,Ae=ge,Se=fe;const re=Pt,Ot=Rt,Pe=o.forwardRef(({className:s,...a},r)=>e.jsx(we,{className:g("fixed inset-0 z-50 bg-black/60 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",s),...a,ref:r}));Pe.displayName=we.displayName;const _=o.forwardRef(({className:s,...a},r)=>e.jsxs(Ot,{children:[e.jsx(Pe,{}),e.jsx(Ne,{ref:r,className:g("fixed left-1/2 top-1/2 z-50 grid w-full max-w-lg -translate-x-1/2 -translate-y-1/2 gap-4 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)] backdrop-blur-2xl duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",s),...a})]}));_.displayName=Ne.displayName;const I=({className:s,...a})=>e.jsx("div",{className:g("flex flex-col gap-1.5 text-center sm:text-left",s),...a});I.displayName="AlertDialogHeader";const L=({className:s,...a})=>e.jsx("div",{className:g("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",s),...a});L.displayName="AlertDialogFooter";const F=o.forwardRef(({className:s,...a},r)=>e.jsx(Ae,{ref:r,className:g("text-lg font-semibold text-white",s),...a}));F.displayName=Ae.displayName;const B=o.forwardRef(({className:s,...a},r)=>e.jsx(Se,{ref:r,className:g("text-sm text-slate-400",s),...a}));B.displayName=Se.displayName;const U=o.forwardRef(({className:s,...a},r)=>e.jsx(Ce,{ref:r,className:g(de(),s),...a}));U.displayName=Ce.displayName;const z=o.forwardRef(({className:s,...a},r)=>e.jsx(De,{ref:r,className:g(de({variant:"outline"}),s),...a}));z.displayName=De.displayName;function oe(s){if(s===0)return"0 B";const a=["B","KB","MB","GB"],r=Math.min(Math.floor(Math.log(s)/Math.log(1024)),a.length-1);return`${(s/Math.pow(1024,r)).toFixed(r===0?0:1)} ${a[r]}`}function A({label:s,value:a,mono:r}){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:s}),e.jsx("span",{className:`text-sm font-medium text-white ${r?"font-mono":""}`,children:a})]})}function Lt(){const s=Le(),[a,r]=o.useState(!1),[n,i]=o.useState(!1),[u,b]=o.useState(!1),[O,C]=o.useState(null),[x,J]=o.useState([]),[Re,E]=o.useState(!1),[p,j]=o.useState({provider:"",model:"",inputCostPer1M:"",outputCostPer1M:""}),[D,Oe]=o.useState("30"),[Ee,Q]=o.useState(!1),[T,q]=o.useState(null),[G,K]=o.useState(!1),[k,Te]=o.useState(""),[$,ke]=o.useState("llmtap"),[V,W]=o.useState(!1),[M,S]=o.useState(null),[H,Y]=o.useState(!1),[$e,X]=o.useState(!1),[Me,Z]=o.useState(!1),{data:d}=Fe({queryKey:["db-info"],queryFn:at});async function _e(){r(!0);try{await et(),i(!0),s.invalidateQueries(),c.success("Trace data cleared",{description:"The local collector database has been reset."}),setTimeout(()=>i(!1),3e3)}catch(t){c.error("Reset failed",{description:t instanceof Error?t.message:String(t)})}finally{r(!1)}}async function ee(t){K(!0);try{const l=await tt(t);q(l.deletedSpans),Q(!0),s.invalidateQueries(),c.success("Retention applied",{description:l.deletedSpans>0?`Deleted ${l.deletedSpans} old spans.`:"No spans needed cleanup for the selected window."}),setTimeout(()=>{Q(!1),q(null)},4e3)}catch(l){c.error("Retention failed",{description:l instanceof Error?l.message:String(l)})}finally{K(!1)}}async function te(t){b(!0);try{const l=await st(t),v=new Blob([l],{type:t==="json"?"application/json":"text/csv"}),m=URL.createObjectURL(v),f=document.createElement("a");f.href=m,f.download=`llmtap-traces-${new Date().toISOString().slice(0,10)}.${t}`,document.body.appendChild(f),f.click(),document.body.removeChild(f),URL.revokeObjectURL(m),c.success(`Exported ${t.toUpperCase()}`,{description:"Trace data was downloaded successfully."})}catch(l){c.error("Export failed",{description:l instanceof Error?l.message:String(l)})}finally{b(!1)}}function Ie(t,l){navigator.clipboard.writeText(t).catch(()=>{}),C(l),c.success("Copied to clipboard",{description:"Database path copied."}),setTimeout(()=>C(null),2e3)}return e.jsxs(e.Fragment,{children:[e.jsx(rt,{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(Ze,{}),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:d?oe(d.sizeBytes):"..."}),e.jsxs("div",{className:"mt-1 text-sm text-slate-400",children:[d?.spanCount??0," spans stored"]})]})})]}),children:e.jsxs("div",{className:"grid gap-5 xl:grid-cols-2",children:[e.jsxs(y.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(dt,{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(A,{label:"Size on disk",value:d?oe(d.sizeBytes):"-"}),e.jsx(A,{label:"Total spans",value:String(d?.spanCount??0),mono:!0}),e.jsx(A,{label:"Total traces",value:String(d?.traceCount??0),mono:!0}),e.jsx(A,{label:"Journal mode",value:d?.walMode?.toUpperCase()??"-",mono:!0}),e.jsx(A,{label:"Data range",value:d?.oldestSpan&&d?.newestSpan?`${se(d.oldestSpan)} to ${se(d.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:d?.path??"-"}),d?.path&&e.jsx("button",{type:"button",onClick:()=>Ie(d.path,"path"),className:"rounded-lg border border-white/8 bg-white/4 p-1.5 text-slate-400 transition-colors hover:text-white",children:O==="path"?e.jsx(P,{className:"h-3 w-3 text-emerald-300"}):e.jsx(ct,{className:"h-3 w-3"})})]})]})]})]}),e.jsxs("div",{className:"space-y-5",children:[e.jsxs(y.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(R,{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:()=>te("json"),disabled:u,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(R,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:u?"Exporting...":"Export JSON"})]}),e.jsxs("button",{type:"button",onClick:()=>te("csv"),disabled:u,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(R,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:u?"Exporting...":"Export CSV"})]})]})]}),e.jsxs(y.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(pt,{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:()=>X(!0),disabled:a,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:n?e.jsxs(e.Fragment,{children:[e.jsx(P,{className:"h-4 w-4 text-emerald-300"}),e.jsx("span",{children:"Data cleared"})]}):e.jsxs(e.Fragment,{children:[e.jsx(xt,{className:`h-4 w-4 ${a?"animate-spin":""}`}),e.jsx("span",{children:a?"Resetting...":"Reset all data"})]})})]}),e.jsxs(y.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(mt,{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."}),x.length>0&&e.jsx("div",{className:"mb-4 space-y-2",children:x.map((t,l)=>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:()=>J(v=>v.filter((m,f)=>f!==l)),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(ae,{className:"h-3 w-3"})})]})]},`${t.provider}-${t.model}`))}),Re?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:p.provider,onChange:t=>j(l=>({...l,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:p.model,onChange:t=>j(l=>({...l,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:p.inputCostPer1M,onChange:t=>j(l=>({...l,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:p.outputCostPer1M,onChange:t=>j(l=>({...l,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:()=>{p.provider&&p.model&&p.inputCostPer1M&&p.outputCostPer1M&&(J(t=>[...t,{...p}]),c.success("Pricing override added",{description:`${p.provider}/${p.model} is ready to use.`}),j({provider:"",model:"",inputCostPer1M:"",outputCostPer1M:""}),E(!1))},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(P,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Add"})]}),e.jsxs("button",{type:"button",onClick:()=>{E(!1),j({provider:"",model:"",inputCostPer1M:"",outputCostPer1M:""})},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(ae,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Cancel"})]})]})]}):e.jsxs("button",{type:"button",onClick:()=>E(!0),className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(ht,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Add pricing override"})]}),x.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";
+${x.map(t=>`setPricing("${t.provider}", "${t.model}", ${t.inputCostPer1M}, ${t.outputCostPer1M});`).join(`
+`)}`})]})]}),e.jsxs(y.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(ut,{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(ot,{value:D,onValueChange:t=>Oe(t),children:[e.jsx(lt,{className:"w-[160px] rounded-2xl py-3",children:e.jsx(nt,{})}),e.jsxs(it,{children:[e.jsx(w,{value:"7",children:"7 days"}),e.jsx(w,{value:"14",children:"14 days"}),e.jsx(w,{value:"30",children:"30 days"}),e.jsx(w,{value:"90",children:"90 days"}),e.jsx(w,{value:"365",children:"1 year"}),e.jsx(w,{value:"0",children:"Keep forever"})]})]}),e.jsx("button",{type:"button",onClick:async()=>{const t=parseInt(D,10);if(t>0){Z(!0);return}await ee(t)},disabled:G,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:Ee?e.jsxs(e.Fragment,{children:[e.jsx(P,{className:"h-3.5 w-3.5 text-emerald-300"}),e.jsx("span",{children:T!==null&&T>0?`Cleaned ${T} spans`:"Applied"})]}):e.jsx("span",{children:G?"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 ",D]}),"."]})]}),e.jsxs(y.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(gt,{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:H,onClick:async()=>{Y(!0);try{const t=await Ye(1e3,$),l=new Blob([t],{type:"application/json"}),v=URL.createObjectURL(l),m=document.createElement("a");m.href=v,m.download="llmtap-export.otlp.json",document.body.appendChild(m),m.click(),document.body.removeChild(m),URL.revokeObjectURL(v),c.success("OTLP export downloaded",{description:"The collector export was saved as OTLP JSON."})}catch(t){c.error("Export failed",{description:t instanceof Error?t.message:String(t)})}finally{Y(!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(R,{className:"h-3.5 w-3.5"}),H?"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=>{Te(t.target.value),S(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:$,onChange:t=>ke(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||V,onClick:async()=>{W(!0),S(null);try{const t=await Xe(k,{service:$});S(`Forwarded ${t.spanCount} spans`),c.success("OTLP forward complete",{description:`Forwarded ${t.spanCount} spans to the target endpoint.`})}catch(t){S(`Error: ${t instanceof Error?t.message:String(t)}`),c.error("OTLP forward failed",{description:t instanceof Error?t.message:String(t)})}finally{W(!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:V?"Sending...":"Send"})]}),M&&e.jsx("p",{className:`mt-2 text-xs ${M.startsWith("Error")?"text-rose-400":"text-emerald-400"}`,children:M})]}),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(y.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(bt,{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."})]})]})]})]})]})}),e.jsx(re,{open:$e,onOpenChange:X,children:e.jsxs(_,{children:[e.jsxs(I,{children:[e.jsx(F,{children:"Delete all trace data?"}),e.jsx(B,{children:"This will permanently delete all stored traces and spans. This action cannot be undone."})]}),e.jsxs(L,{children:[e.jsx(z,{children:"Cancel"}),e.jsx(U,{onClick:()=>_e(),className:"border-rose-400/20 bg-rose-500 text-white hover:bg-rose-400",children:"Delete all data"})]})]})}),e.jsx(re,{open:Me,onOpenChange:Z,children:e.jsxs(_,{children:[e.jsxs(I,{children:[e.jsx(F,{children:"Apply data retention?"}),e.jsxs(B,{children:["This will delete all trace data older than ",D," days. This action cannot be undone."]})]}),e.jsxs(L,{children:[e.jsx(z,{children:"Cancel"}),e.jsx(U,{onClick:()=>ee(parseInt(D,10)),className:"border-rose-400/20 bg-rose-500 text-white hover:bg-rose-400",children:"Delete old data"})]})]})})]})}export{Lt as default};

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

@@ -0,0 +1 @@
+import{j as e}from"./query-BSZkMKN4.js";import{c as s}from"./index-jVcSWGwX.js";function l({status:t,className:a}){const r=t==="error";return e.jsxs("span",{className:s("relative flex h-3.5 w-3.5 items-center justify-center",a),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{l as S};

package/dist/dashboard/assets/TraceDetail-ByibqI-g.js

@@ -0,0 +1,17 @@
+import{j as e,r as h,d as ie}from"./query-BSZkMKN4.js";import{c as ce,i as de,L as pe,j as xe,k as me,l as he,m as ue,n as ge,a as be,t as $,r as fe,h as je}from"./index-jVcSWGwX.js";import{P as Ne,b as v,c as g}from"./format-CgXokIEM.js";import{g as w}from"./content-BRoZVvRJ.js";import{p as ye,d as ve}from"./provider-colors-DcHYMgVv.js";import{S as we}from"./StatusDot-BAf4TSfE.js";import{q as ke,z as _,B as Ce,F as Te,E as $e,H as U,y as O,Z as Se,I as G,x as L,O as Ie,d as Me,t as Q,J as Re,N as _e,Q as Oe,U as Le,n as z,w as Y,V as Pe,Y as Ee,_ as De}from"./icons-DhpK1vUv.js";import{m as V,A as Ae}from"./motion-Bw6xJyTE.js";import"./charts-BXAtT8sy.js";function Be({provider:s,className:r}){const n=s.toLowerCase(),o=ye[n]??ve;return e.jsx("span",{className:ce("inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold capitalize",o.bg,o.text,o.border,r),children:s})}function Fe(s){const r=new Map,n=[];for(const l of s)r.set(l.spanId,{span:l,children:[]});for(const l of s){const i=r.get(l.spanId);i&&(l.parentSpanId&&r.has(l.parentSpanId)?r.get(l.parentSpanId)?.children.push(i):n.push(i))}const o=l=>{l.sort((i,t)=>i.span.startTime-t.span.startTime);for(const i of l)o(i.children)};return o(n),n}function P(s){return s.children.reduce((r,n)=>r+1+P(n),0)}function He(){const[s,r]=h.useState(null);function n(o,l){navigator.clipboard.writeText(o),r(l),$.success("Copied to clipboard",{description:`${l} copied successfully.`}),setTimeout(()=>r(null),2e3)}return{copied:s,copy:n}}function y({text:s,label:r,copied:n,onCopy:o}){return e.jsx("button",{type:"button",onClick:l=>{l.stopPropagation(),o(s,r)},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===r?e.jsx(_,{className:"h-3 w-3 text-emerald-300"}):e.jsx(Oe,{className:"h-3 w-3"})})}function b({icon:s,label:r,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(s,{className:"h-3 w-3"}),r]}),e.jsx("div",{className:"font-mono text-sm font-semibold text-slate-100",children:n})]})}function Je({role:s,type:r}){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"},o=r==="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[s]??o}`,children:s})}function W(s){return!s||typeof s=="string"?!1:s.some(r=>r.type==="image_url"||r.type==="image")}function E(s){return s.map(r=>r.type==="image_url"&&r.image_url?.url?r.image_url.url:r.type==="image"&&r.source?.data?`data:${r.source.media_type||"image/png"};base64,${r.source.data}`:null).filter(r=>{if(!r)return!1;if(r.startsWith("data:image/"))return!0;try{const n=new URL(r);return n.protocol==="http:"||n.protocol==="https:"}catch{return!1}})}function qe(s){const r=w(s);let n=r?Math.ceil(r.length/4):0;if(s&&typeof s!="string"){const o=s.filter(l=>l.type==="image_url"||l.type==="image").length;n+=o*85}return n}function X({message:s,type:r,copied:n,onCopy:o}){const l=s.content,i=w(l),t=l&&typeof l!="string"?E(l):[],d=r==="input"?"border-white/8":"border-emerald-400/10",c=`msg-${r}-${s.role}-${i.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(Je,{role:s.role,type:r}),s.name&&e.jsx("span",{className:"font-mono text-[10px] text-slate-500",children:s.name}),t.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(Ee,{className:"h-2.5 w-2.5"}),t.length," image",t.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:["~",qe(l)," tok"]}),i&&e.jsx(y,{text:i,label:c,copied:n,onCopy:o})]})]}),i&&e.jsx("pre",{className:"mt-2.5 whitespace-pre-wrap font-mono text-xs leading-relaxed text-slate-200",children:Ye(i)}),t.length>0&&e.jsx("div",{className:"mt-2.5 flex flex-wrap gap-2",children:t.map((p,f)=>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 ${f+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"})})]},f))})]})}function Ke({span:s,copied:r,onCopy:n}){const o=s.inputMessages?.length??0,l=s.outputMessages?.length??0,[i,t]=h.useState(o>3),[d,c]=h.useState(l>3);return e.jsx(V.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:Le,label:"Model",value:s.responseModel??s.requestModel??"-"}),e.jsx(b,{icon:O,label:"Tokens",value:`${s.inputTokens} in / ${s.outputTokens} out`}),e.jsx(b,{icon:G,label:"Cost",value:v(s.totalCost)}),e.jsx(b,{icon:L,label:"Duration",value:s.duration?g(s.duration):"-"})]})}),e.jsxs("div",{className:"flex flex-wrap items-center gap-2",children:[e.jsx(y,{text:s.spanId,label:"spanId",copied:r,onCopy:n}),e.jsxs("span",{className:"font-mono text-[10px] text-slate-500",children:["span: ",s.spanId.slice(0,12),"..."]}),s.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: ",s.sessionId]})]}),s.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: ",s.temperature]})]}),s.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: ",s.topP]})]}),s.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: ",s.maxTokens]})]})]}),s.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(Q,{className:"h-4 w-4"}),s.errorType??"error"]}),s.errorMessage&&e.jsx(y,{text:s.errorMessage,label:"error",copied:r,onCopy:n})]}),e.jsx("div",{className:"font-mono text-xs leading-relaxed text-rose-200/70",children:s.errorMessage})]}),s.inputMessages&&s.inputMessages.length>0&&e.jsxs("div",{children:[e.jsxs("button",{type:"button",onClick:()=>t(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(z,{className:`h-3.5 w-3.5 transition-transform ${i?"-rotate-90":""}`}),e.jsx(Y,{className:"h-3.5 w-3.5"}),"Input messages (",s.inputMessages.length,")"]}),!i&&e.jsx("div",{className:"space-y-2",children:s.inputMessages.map((p,f)=>e.jsx(X,{message:p,type:"input",copied:r,onCopy:n},`in-${p.role}-${f}`))})]}),s.outputMessages&&s.outputMessages.length>0&&e.jsxs("div",{children:[e.jsxs("button",{type:"button",onClick:()=>c(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(z,{className:`h-3.5 w-3.5 transition-transform ${d?"-rotate-90":""}`}),e.jsx(Y,{className:"h-3.5 w-3.5"}),"Output messages (",s.outputMessages.length,")"]}),!d&&e.jsx("div",{className:"space-y-2",children:s.outputMessages.map((p,f)=>e.jsx(X,{message:p,type:"output",copied:r,onCopy:n},`out-${p.role}-${f}`))})]}),s.toolCalls&&s.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(Pe,{className:"h-3.5 w-3.5"}),"Tool calls (",s.toolCalls.length,")"]}),e.jsx("div",{className:"space-y-2",children:s.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(y,{text:p.arguments,label:`tool-${p.id}`,copied:r,onCopy:n})]}),e.jsx("pre",{className:"mt-2.5 overflow-x-auto font-mono text-xs leading-relaxed text-slate-200",children:Z(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 Z(s){try{return JSON.stringify(JSON.parse(s),null,2)}catch{return s}}function Ue(s){const r=s.providerName?.toLowerCase()??"",n=s.requestModel??s.responseModel??"unknown",o=(s.inputMessages??[]).map(t=>({role:t.role,content:typeof t.content=="string"?t.content:t.content??""})),i=JSON.stringify({model:n,messages:o}).replace(/'/g,"'\\''");return r==="openai"?`curl https://api.openai.com/v1/chat/completions \\
+  -H "Authorization: Bearer $OPENAI_API_KEY" \\
+  -H "Content-Type: application/json" \\
+  -d '${i}'`:r==="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:s.maxTokens??1024,messages:o.filter(c=>c.role!=="system"),...o.find(c=>c.role==="system")?{system:o.find(c=>c.role==="system").content}:{}}).replace(/'/g,"'\\''")}'`:r==="google"?`curl "https://generativelanguage.googleapis.com/v1beta/models/${n}:generateContent?key=$GOOGLE_API_KEY" \\
+  -H "Content-Type: application/json" \\
+  -d '${i}'`:`curl https://api.example.com/v1/chat/completions \\
+  -H "Authorization: Bearer $API_KEY" \\
+  -H "Content-Type: application/json" \\
+  -d '${i}'`}function ze(s,r,n,o,l,i){const t=[];t.push("# Trace Report"),t.push(""),t.push(`**Trace ID:** \`${s}\``),t.push(`**Status:** ${i?"Error":"Stable"}`),t.push(`**Total Spans:** ${r.length}`),t.push(`**Total Tokens:** ${n.toLocaleString()}`),t.push(`**Total Cost:** ${v(o)}`),t.push(`**Duration:** ${g(l)}`),t.push(""),t.push("---"),t.push("");for(const d of r){if(t.push(`## Span: ${d.name}`),t.push(""),t.push("| Field | Value |"),t.push("|-------|-------|"),t.push(`| Span ID | \`${d.spanId}\` |`),t.push(`| Provider | ${d.providerName} |`),t.push(`| Model | ${d.responseModel??d.requestModel??"-"} |`),t.push(`| Operation | ${d.operationName} |`),t.push(`| Tokens | ${d.inputTokens} in / ${d.outputTokens} out |`),t.push(`| Cost | ${v(d.totalCost)} |`),t.push(`| Duration | ${d.duration?g(d.duration):"-"} |`),t.push(`| Status | ${d.status} |`),t.push(""),d.inputMessages&&d.inputMessages.length>0){t.push("### Input Messages"),t.push("");for(const c of d.inputMessages)t.push(`**[${c.role}]${c.name?` (${c.name})`:""}**`),t.push(""),t.push(w(c.content)||"_empty_"),W(c.content)&&t.push(`
+_[${E(c.content).length} image(s) attached]_`),t.push("")}if(d.outputMessages&&d.outputMessages.length>0){t.push("### Output Messages"),t.push("");for(const c of d.outputMessages)t.push(`**[${c.role}]${c.name?` (${c.name})`:""}**`),t.push(""),t.push(w(c.content)||"_empty_"),W(c.content)&&t.push(`
+_[${E(c.content).length} image(s) attached]_`),t.push("")}if(d.toolCalls&&d.toolCalls.length>0){t.push("### Tool Calls"),t.push("");for(const c of d.toolCalls)t.push(`**${c.name}** (\`${c.id}\`)`),t.push(""),t.push("```json"),t.push(Z(c.arguments)),t.push("```"),c.result&&(t.push(""),t.push("Result:"),t.push("```"),t.push(c.result),t.push("```")),t.push("")}t.push("---"),t.push("")}return t.join(`
+`)}function Ye(s){const r=/```(\w*)\n?([\s\S]*?)```/g,n=[];let o=0,l,i=0;for(;(l=r.exec(s))!==null;){l.index>o&&n.push(e.jsx("span",{children:s.slice(o,l.index)},i++));const t=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:[t&&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(De,{className:"h-3 w-3"}),t]}),e.jsx("span",{className:"block font-mono text-[11px] leading-relaxed text-emerald-200/80",children:d})]},i++)),o=l.index+l[0].length}return o<s.length&&n.push(e.jsx("span",{children:s.slice(o)},i++)),n.length===0?s:n}function rs(){const{traceId:s}=de(),[r,n]=h.useState(null),[o,l]=h.useState({}),{copied:i,copy:t}=He(),[d,c]=h.useState(!1),[p,f]=h.useState(""),[D,A]=h.useState(!1),[j,k]=h.useState(null),[B,C]=h.useState(null),[S,ee]=h.useState(null),{data:se,isLoading:te}=ie({queryKey:["trace",s],queryFn:()=>je(s),enabled:!!s}),x=se?.spans??[],I=h.useMemo(()=>Fe(x),[x]),M=x.length>0?Math.min(...x.map(a=>a.startTime)):0,N=(x.length>0?Math.max(...x.map(a=>a.endTime??a.startTime)):0)-M||1,F=x.reduce((a,u)=>a+u.totalTokens,0),H=x.reduce((a,u)=>a+u.totalCost,0),R=x.some(a=>a.status==="error");function ae(){const a=new Blob([JSON.stringify(x,null,2)],{type:"application/json"}),u=URL.createObjectURL(a),m=document.createElement("a");m.href=u,m.download=`trace-${s?.slice(0,12)}.json`,document.body.appendChild(m),m.click(),document.body.removeChild(m),URL.revokeObjectURL(u),$.success("Trace exported",{description:"The full trace payload was downloaded as JSON."})}async function re(){if(!(!S||!p.trim())){A(!0),C(null),k(null);try{const a=await fe(S,p.trim());k(a),$.success("Replay complete",{description:`Received a fresh response from ${a.provider}.`})}catch(a){C(a instanceof Error?a.message:String(a)),$.error("Replay failed",{description:a instanceof Error?a.message:String(a)})}finally{A(!1)}}}function ne(a){ee(a),c(!0),k(null),C(null)}const J=(a,u=0)=>{const m=a.span.spanId===r,q=a.children.length>0,K=o[a.span.spanId]??!1,le=(a.span.startTime-M)/N*100,oe=Math.max(((a.span.endTime??a.span.startTime)-a.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:q?e.jsx("button",{type:"button",onClick:()=>l(T=>({...T,[a.span.spanId]:!T[a.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(_e,{className:`h-4 w-4 transition-transform ${K?"":"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:a.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(we,{status:a.span.status}),e.jsxs("div",{className:"min-w-0",children:[e.jsx("div",{className:"truncate text-sm font-medium text-white",children:a.span.name}),e.jsxs("div",{className:"mt-1 flex flex-wrap items-center gap-2.5",children:[e.jsx(Be,{provider:a.span.providerName}),e.jsx("span",{className:"font-mono text-[10px] uppercase tracking-[0.16em] text-slate-500",children:a.span.operationName}),q?e.jsxs("span",{className:"font-mono text-[10px] uppercase tracking-[0.16em] text-slate-500",children:[P(a)," child",P(a)===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(a.span.startTime-M),"ms"]}),e.jsx("span",{children:a.span.duration?g(a.span.duration):"instant"})]}),e.jsx("div",{className:"relative h-8 overflow-hidden rounded-full bg-slate-950/90",children:e.jsx(V.div,{className:`absolute bottom-1 top-1 origin-left rounded-full ${a.span.status==="error"?"bg-[linear-gradient(90deg,#fb7185,#f97316)]":"bg-[linear-gradient(90deg,#34d399,#38bdf8)]"}`,style:{left:`${le}%`,width:`${Math.max(oe,.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:v(a.span.totalCost)}),e.jsxs("div",{children:[a.span.totalTokens.toLocaleString()," tok"]})]})]})]})}),e.jsx(Ae,{children:m?e.jsx(Ke,{span:a.span,copied:i,onCopy:t}):null}),!K&&a.children.map(T=>J(T,u+1))]},a.span.spanId)};return te?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(Ne,{eyebrow:"Trace Console",title:s?`Trace ${s.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(be,{}),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(Q,{className:"h-4 w-4 text-rose-300"}),"Error state"]}):e.jsxs(e.Fragment,{children:[e.jsx(Re,{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:[I.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(ke,{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:s}),e.jsx(y,{text:s??"",label:"traceId",copied:i,onCopy:t})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[x.length>0&&e.jsxs("button",{type:"button",onClick:()=>{const a=x[0];t(Ue(a),"curl")},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[i==="curl"?e.jsx(_,{className:"h-3.5 w-3.5 text-emerald-300"}):e.jsx(Ce,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:i==="curl"?"Copied!":"Copy as cURL"})]}),x.length>0&&e.jsxs("button",{type:"button",onClick:()=>{t(ze(s??"",x,F,H,N,R),"markdown")},className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[i==="markdown"?e.jsx(_,{className:"h-3.5 w-3.5 text-emerald-300"}):e.jsx(Te,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:i==="markdown"?"Copied!":"Copy as Markdown"})]}),e.jsxs("button",{type:"button",onClick:ae,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx($e,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Export JSON"})]}),x.length>0&&e.jsxs("button",{type:"button",onClick:()=>ne(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(U,{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:O,label:"Spans",value:String(x.length)}),e.jsx(b,{icon:Se,label:"Tokens",value:F.toLocaleString()}),e.jsx(b,{icon:G,label:"Cost",value:v(H)}),e.jsx(b,{icon:L,label:"Duration",value:x.length>0?g(N):"-"}),e.jsx(b,{icon:Ie,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(L,{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"]})]}),I.length>0?e.jsx("div",{className:"py-2",children:I.map(a=>J(a))}):e.jsxs("div",{className:"empty-state h-[280px]",children:[e.jsx(O,{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(xe,{open:d,onOpenChange:a=>!a&&c(!1),children:e.jsxs(me,{className:"max-w-2xl",children:[e.jsx(he,{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(U,{className:"h-4.5 w-4.5 text-emerald-300"})}),e.jsxs("div",{children:[e.jsx(ue,{children:"Trace Replay"}),e.jsx(ge,{children:"Re-send the same prompts and compare responses"})]})]})}),!j&&!D&&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:a=>f(a.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"})]}),B&&e.jsx("div",{className:"rounded-xl border border-rose-400/20 bg-rose-500/8 p-3 text-sm text-rose-200",children:B}),e.jsx("button",{type:"button",disabled:!p.trim(),onClick:re,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"})]}),D&&e.jsxs("div",{className:"flex flex-col items-center gap-3 py-12",children:[e.jsx(Me,{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..."]})]}),j&&(()=>{const a=x.find(m=>m.spanId===S)??x[0],u=a?.outputMessages?.map(m=>w(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:[a.totalTokens," ",e.jsx("span",{className:"text-slate-500",children:"vs"})," ",j.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(a.duration??0)," ",e.jsx("span",{className:"text-slate-500",children:"vs"})," ",g(j.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:j.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:j.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:()=>{k(null),C(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:()=>c(!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{rs as default};

package/dist/dashboard/assets/Traces-D9kJG7O9.js

@@ -0,0 +1 @@
+import{r,j as e,d as ye}from"./query-BSZkMKN4.js";import{P as Se,R as Ce,e as Te,C as le,T as Q,g as ke,c as D,D as re,O as ne,u as De,L as Ie,h as J,b as Pe}from"./index-jVcSWGwX.js";import{P as _e,b as T,d as ie,c as k,a as oe}from"./format-CgXokIEM.js";import{S as _}from"./StatusDot-BAf4TSfE.js";import{e as Le,S as z,a as V,b as F,c as U,d as C}from"./select-CbYE6Q0M.js";import{X as Z,s as A,t as Me,u as K,Z as Re,S as $e,A as B,v as ee,m as Ee,n as He,o as Oe,q as qe,p as de,w as ze,x as Ve,y as Fe,C as Ue,D as Ae}from"./icons-DhpK1vUv.js";import{P as se}from"./constants-OlSc-7iA.js";import{g as Ke}from"./content-BRoZVvRJ.js";import{A as te,m as ce}from"./motion-Bw6xJyTE.js";import"./charts-BXAtT8sy.js";var Qe=Object.freeze({position:"absolute",border:0,width:1,height:1,padding:0,margin:-1,overflow:"hidden",clip:"rect(0, 0, 0, 0)",whiteSpace:"nowrap",wordWrap:"normal"}),Ze="VisuallyHidden",xe=r.forwardRef((s,a)=>e.jsx(Se.span,{...s,ref:a,style:{...Qe,...s.style}}));xe.displayName=Ze;var We=xe;const Xe=Ce,Ye=Te,me=r.forwardRef(({className:s,...a},n)=>e.jsx(ne,{className:D("fixed inset-0 z-50 bg-black/50 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",s),...a,ref:n}));me.displayName=ne.displayName;const Ge=Le("fixed z-50 gap-4 border border-white/8 bg-[linear-gradient(180deg,rgba(8,14,28,0.98),rgba(4,8,18,0.99))] shadow-[0_40px_100px_rgba(0,0,0,0.5)] backdrop-blur-2xl transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-300",{variants:{side:{top:"inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",bottom:"inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",left:"inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",right:"inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-md"}},defaultVariants:{side:"right"}}),he=r.forwardRef(({side:s="right",className:a,children:n,...h},u)=>e.jsxs(Ye,{children:[e.jsx(me,{}),e.jsxs(le,{ref:u,className:D(Ge({side:s}),a),...h,children:[e.jsx(We,{children:e.jsx(Q,{children:"Panel"})}),n,e.jsxs(ke,{className:"absolute right-4 top-4 rounded-xl p-1.5 text-slate-400 transition-colors hover:bg-white/8 hover:text-slate-200 focus:outline-none focus:ring-2 focus:ring-emerald-400/50",children:[e.jsx(Z,{className:"h-4 w-4"}),e.jsx("span",{className:"sr-only",children:"Close"})]})]})]}));he.displayName=le.displayName;const pe=({className:s,...a})=>e.jsx("div",{className:D("flex flex-col gap-2 p-5",s),...a});pe.displayName="SheetHeader";const ue=r.forwardRef(({className:s,...a},n)=>e.jsx(Q,{ref:n,className:D("text-lg font-semibold text-white",s),...a}));ue.displayName=Q.displayName;const be=r.forwardRef(({className:s,...a},n)=>e.jsx(re,{ref:n,className:D("text-sm text-slate-400",s),...a}));be.displayName=re.displayName;const ae=[25,50,100,200];function Je({trace:s,onClose:a}){const n=s.totalDuration??(s.endTime?s.endTime-s.startTime:0);return e.jsx(Xe,{open:!0,onOpenChange:h=>!h&&a(),children:e.jsxs(he,{side:"right",className:"flex flex-col overflow-y-auto",children:[e.jsxs(pe,{className:"border-b border-white/6",children:[e.jsx("div",{className:"hud-label",children:"Quick preview"}),e.jsx(ue,{className:"truncate",children:s.name}),e.jsx(be,{className:"sr-only",children:"Trace preview panel"})]}),e.jsxs("div",{className:"flex-1 space-y-4 p-5",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:s.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(_,{status:s.status}),e.jsx("span",{className:`text-sm font-medium ${s.status==="error"?"text-rose-300":"text-emerald-300"}`,children:s.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(Ve,{className:"h-4 w-4 text-sky-300"}),e.jsx("span",{className:"text-sm font-medium text-white",children:n>0?k(n):"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:s.spanCount}),e.jsx(Fe,{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:oe(s.totalTokens)}),e.jsx(Ue,{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:T(s.totalCost)}),e.jsx(Ae,{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(s.startTime).toLocaleString()," (",ie(s.startTime),")"]}),s.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(s.endTime).toLocaleString()})]})]}),e.jsxs(Ie,{to:`/trace/${s.traceId}`,className:"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(de,{className:"h-4 w-4"})]})]})]})})}function Be({traceA:s,traceB:a}){const[n,h]=r.useState([]),[u,i]=r.useState([]),[o,N]=r.useState(!0);if(r.useEffect(()=>{let w=!1;return N(!0),Promise.all([J(s.traceId),J(a.traceId)]).then(([x,p])=>{w||(h(x.spans),i(p.spans),N(!1))}),()=>{w=!0}},[s.traceId,a.traceId]),o)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(x=>(x.outputMessages??[]).filter(p=>p.role==="assistant").map(p=>({spanName:x.name,model:x.responseModel??x.requestModel,content:Ke(p.content)}))),b=l(n),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,x)=>{const p=b[x],m=v[x];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:p?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:p.model})]}),e.jsx("pre",{className:"whitespace-pre-wrap font-mono text-xs leading-relaxed text-slate-200",children:p.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: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-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: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"})})]},x)})})}function es({traceA:s,traceB:a,onClose:n}){const[h,u]=r.useState("metrics"),i=s.totalDuration??(s.endTime?s.endTime-s.startTime:0),o=a.totalDuration??(a.endTime?a.endTime-a.startTime:0),N=[{label:"Status",a:s.status,b:a.status,better:s.status===a.status?"tie":s.status==="ok"?"a":"b"},{label:"Spans",a:String(s.spanCount),b:String(a.spanCount)},{label:"Tokens",a:s.totalTokens.toLocaleString(),b:a.totalTokens.toLocaleString(),diff:s.totalTokens!==a.totalTokens?`${a.totalTokens-s.totalTokens>0?"+":""}${(a.totalTokens-s.totalTokens).toLocaleString()}`:"same",better:s.totalTokens===a.totalTokens?"tie":s.totalTokens<a.totalTokens?"a":"b"},{label:"Cost",a:T(s.totalCost),b:T(a.totalCost),diff:s.totalCost!==a.totalCost?`${a.totalCost-s.totalCost>0?"+":""}${T(Math.abs(a.totalCost-s.totalCost))}`:"same",better:s.totalCost===a.totalCost?"tie":s.totalCost<a.totalCost?"a":"b"},{label:"Duration",a:i>0?k(i):"N/A",b:o>0?k(o):"N/A",diff:i>0&&o>0&&i!==o?`${o-i>0?"+":""}${k(Math.abs(o-i))}`:i===o?"same":void 0,better:i===o?"tie":i>0&&o>0&&i<o?"a":"b"}];return e.jsxs(ce.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:n,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(Z,{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 ${h==="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 ${h==="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(ze,{className:"h-3 w-3"}),"Response diff"]})]}),h==="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:s.name}),e.jsx("div",{className:"mt-0.5 font-mono text-[10px] text-slate-500",children:s.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(_,{status:s.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(_,{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(Be,{traceA:s,traceB:a})]})}function xs(){const[s,a]=De(),n=s.get("q")??"",h=r.useDeferredValue(n),u=s.get("status"),i=u==="ok"||u==="error"?u:"",o=Number(s.get("periodHours")??"24"),N=Number(s.get("pageSize")??"50"),l=ae.includes(N)?N:50,b=Math.max(1,Number(s.get("page")??"1")||1),v=(b-1)*l,[g,w]=r.useState(null),[x,p]=r.useState("desc"),[m,L]=r.useState(new Set),[M,W]=r.useState(null),[je,R]=r.useState(!1),I=r.useMemo(()=>({limit:l,offset:v,q:h.trim()||void 0,status:i||void 0,periodHours:se.some(t=>t.value===o)?o:24}),[h,l,v,o,i]),{data:X,isLoading:ge}=ye({queryKey:["traces",I],queryFn:()=>Pe(I)}),$=X?.traces??[],S=X?.total??0,Y=Math.max(1,Math.ceil(S/l));function fe(t){g===t?p(d=>d==="asc"?"desc":"asc"):(w(t),p("desc"))}const j=r.useMemo(()=>g?[...$].sort((t,d)=>{const c=t[g]??0,f=d[g]??0;return x==="asc"?c-f:f-c}):$,[$,g,x]),P=j.length>0&&j.every(t=>m.has(t.traceId)),Ne=r.useCallback(()=>{L(t=>{const d=new Set(t);if(P)for(const c of j)d.delete(c.traceId);else for(const c of j)d.add(c.traceId);return d})},[P,j]),ve=r.useCallback(t=>{L(d=>{const c=new Set(d);return c.has(t)?c.delete(t):c.add(t),c})},[]),we=r.useCallback(()=>{L(new Set),R(!1)},[]),E=r.useMemo(()=>j.filter(t=>m.has(t.traceId)),[j,m]),H=m.size===2,O=n.length>0||i.length>0||I.periodHours!==24;function y(t,d=!0){a(c=>{const f=new URLSearchParams(c);for(const[G,q]of Object.entries(t))q===void 0||q===""?f.delete(G):f.set(G,String(q));return d&&f.delete("page"),f},{replace:!0})}return e.jsxs(e.Fragment,{children:[e.jsxs(_e,{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:"surface-strong rounded-2xl 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:oe(S)}),e.jsx(B,{className:"h-4 w-4 text-emerald-300"})]}),e.jsx("div",{className:"mt-1 text-sm text-slate-400",children:"Matching current filters"})]}),m.size>0&&e.jsxs("div",{className:"rounded-2xl border border-sky-400/15 bg-sky-400/8 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:[m.size," trace",m.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:H?"Ready to compare":"Select exactly 2 to compare"})]})]})}),children:[e.jsx(te,{children:m.size>0&&e.jsx(ce.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(A,{className:"h-3.5 w-3.5 text-emerald-300"}),e.jsxs("span",{children:[m.size," selected"]})]}),e.jsxs("button",{type:"button",onClick:we,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8",children:[e.jsx(Me,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Clear"})]})]}),e.jsxs("button",{type:"button",disabled:!H,onClick:()=>R(!0),className:`inline-flex items-center gap-2 rounded-2xl border px-4 py-2 text-sm font-medium transition-all ${H?"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(te,{children:je&&E.length===2&&e.jsx(es,{traceA:E[0],traceB:E[1],onClose:()=>R(!1)})}),e.jsxs("section",{className:"dashboard-shell rounded-[26px] px-4 py-4 sm:px-5 sm:py-5",children:[e.jsxs("div",{className:"surface-strong mb-4 rounded-[24px] 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(Re,{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:!O,className:"status-chip transition-colors hover:border-white/16 hover:bg-white/8 disabled:cursor-not-allowed disabled:opacity-50",children:[e.jsx(Z,{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:"field-surface relative block rounded-2xl",children:[e.jsx($e,{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:n,onChange:t=>y({q:t.target.value||void 0}),placeholder:"Search by trace name, ID, or keyword...",className:"w-full rounded-2xl bg-transparent py-3 pl-10 pr-4 text-sm text-white placeholder:text-slate-500 focus:outline-none"})]}),e.jsxs(z,{value:i||"__all__",onValueChange:t=>y({status:t==="__all__"?void 0:t}),children:[e.jsx(V,{className:"w-full rounded-2xl py-3",children:e.jsx(F,{placeholder:"All states"})}),e.jsxs(U,{children:[e.jsx(C,{value:"__all__",children:"All states"}),e.jsx(C,{value:"ok",children:"Healthy only"}),e.jsx(C,{value:"error",children:"Errors only"})]})]}),e.jsxs(z,{value:String(I.periodHours??24),onValueChange:t=>y({periodHours:Number(t)===24?void 0:Number(t)}),children:[e.jsx(V,{className:"w-full rounded-2xl py-3",children:e.jsx(F,{})}),e.jsx(U,{children:se.map(t=>e.jsx(C,{value:String(t.value),children:t.label},t.value))})]})]})]}),ge?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(B,{className:"h-8 w-8 text-slate-500"}),e.jsx("div",{className:"text-base font-medium text-white",children:O?"No traces match these filters":"No traces recorded yet"}),e.jsx("div",{className:"mt-1 text-sm text-slate-500",children:O?"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:Ne,className:"inline-flex items-center justify-center transition-colors hover:text-slate-300",title:P?"Deselect all":"Select all",children:P?e.jsx(A,{className:"h-4 w-4 text-emerald-300"}):e.jsx(ee,{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(([t,d])=>e.jsx("th",{className:"px-3 py-2 text-right",children:e.jsxs("button",{type:"button",onClick:()=>fe(t),className:"inline-flex items-center gap-1 transition-colors hover:text-slate-300",children:[d,g===t?x==="asc"?e.jsx(Ee,{className:"h-3 w-3"}):e.jsx(He,{className:"h-3 w-3"}):e.jsx(Oe,{className:"h-3 w-3 opacity-30"})]})},t)),e.jsx("th",{className:"px-3 py-2 text-right",children:"Duration"})]})}),e.jsx("tbody",{children:j.map(t=>{const d=m.has(t.traceId),c=t.totalDuration??(t.endTime?t.endTime-t.startTime:0);return e.jsxs("tr",{onClick:()=>W(t),className:`cursor-pointer rounded-2xl transition-colors ${d?"border border-emerald-400/20 bg-emerald-400/8":"table-row-surface"}`,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:()=>ve(t.traceId),className:"inline-flex items-center justify-center transition-colors hover:text-emerald-300",children:d?e.jsx(A,{className:"h-4 w-4 text-emerald-300"}):e.jsx(ee,{className:"h-4 w-4 text-slate-500"})})}),e.jsx("td",{className:"px-3 py-3",children:e.jsx(_,{status:t.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:t.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:t.traceId.slice(0,12)})}),e.jsx("td",{className:"px-3 py-3 text-right font-mono text-xs text-slate-300",children:t.spanCount}),e.jsx("td",{className:"px-3 py-3 text-right font-mono text-xs text-slate-300",children:t.totalTokens.toLocaleString()}),e.jsx("td",{className:"px-3 py-3 text-right font-mono text-xs text-slate-300",children:T(t.totalCost)}),e.jsx("td",{className:"px-3 py-3 text-right text-xs text-slate-500",children:ie(t.startTime)}),e.jsx("td",{className:"rounded-r-2xl px-3 py-3 text-right font-mono text-xs text-slate-400",children:c>0?k(c):"--"})]},t.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.jsxs(z,{value:String(l),onValueChange:t=>y({pageSize:Number(t)===50?void 0:Number(t)}),children:[e.jsx(V,{className:"w-auto rounded-xl px-2 py-1.5 text-xs",children:e.jsx(F,{})}),e.jsx(U,{children:ae.map(t=>e.jsxs(C,{value:String(t),children:[t," / page"]},t))})]})]}),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(qe,{className:"h-3.5 w-3.5"}),e.jsx("span",{children:"Previous"})]}),e.jsxs("span",{className:"text-xs text-slate-500",children:[b," / ",Y]}),e.jsxs("button",{type:"button",onClick:()=>y({page:b+1},!1),disabled:b>=Y,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(de,{className:"h-3.5 w-3.5"})]})]})]})]})]})]}),M&&e.jsx(Je,{trace:M,onClose:()=>W(null)},M.traceId)]})}export{xs as default};