@tonyclaw/agent-inspector 2.0.7 → 2.0.8

package/src/components/proxy-viewer/anatomy/contextIntelligence.ts

@@ -0,0 +1,414 @@
+import { safeGetOwnProperty } from "../../../lib/objectUtils";
+import type { AnatomyRole, AnatomySegment } from "./types";
+
+export type ContextRiskLevel = "unknown" | "ok" | "watch" | "danger";
+
+export type ContextWindowSource = "request" | "model-rule" | "unknown";
+
+export type ContextWindow = {
+  tokens: number | null;
+  label: string;
+  source: ContextWindowSource;
+};
+
+export type RoleUsage = {
+  role: AnatomyRole;
+  label: string;
+  tokens: number;
+  percent: number;
+};
+
+export type ContextDiagnostic = {
+  kind: "duplicate" | "history-bloat" | "tool-schema" | "system-heavy";
+  severity: "watch" | "danger";
+  title: string;
+  detail: string;
+};
+
+export type ContextIntelligence = {
+  model: string | null;
+  contextWindow: ContextWindow;
+  estimatedInputTokens: number;
+  outputReserveTokens: number | null;
+  windowUsedTokens: number | null;
+  remainingInputTokens: number | null;
+  remainingAfterReserveTokens: number | null;
+  usagePercent: number | null;
+  riskLevel: ContextRiskLevel;
+  roleUsages: RoleUsage[];
+  largestRole: RoleUsage | null;
+  diagnostics: ContextDiagnostic[];
+};
+
+type MatchMode = "prefix" | "includes";
+
+type ModelContextRule = {
+  family: string;
+  tokens: number;
+  mode: MatchMode;
+  patterns: readonly string[];
+};
+
+const WATCH_USAGE_PERCENT = 0.75;
+const DANGER_USAGE_PERCENT = 0.9;
+const LONG_TOOL_SCHEMA_TOKENS = 8_000;
+const LARGE_ROLE_PERCENT = 0.35;
+const DUPLICATE_MIN_TOKENS = 40;
+const DUPLICATE_MIN_CHARS = 160;
+const HISTORY_BLOAT_SEGMENTS = 18;
+const HISTORY_BLOAT_TOKENS = 60_000;
+const HISTORY_BLOAT_PERCENT = 0.7;
+const SYSTEM_HEAVY_TOKENS = 3_000;
+const SYSTEM_HEAVY_PERCENT = 0.3;
+
+const EXPLICIT_CONTEXT_WINDOW_FIELDS = [
+  "context_window",
+  "contextWindow",
+  "context_length",
+  "contextLength",
+  "max_context_length",
+  "maxContextLength",
+  "max_input_tokens",
+  "maxInputTokens",
+] as const;
+
+const OUTPUT_RESERVE_FIELDS = [
+  "max_tokens",
+  "maxTokens",
+  "max_completion_tokens",
+  "maxCompletionTokens",
+  "max_output_tokens",
+  "maxOutputTokens",
+] as const;
+
+const MODEL_CONTEXT_RULES: readonly ModelContextRule[] = [
+  {
+    family: "OpenAI GPT-4.1",
+    tokens: 1_047_576,
+    mode: "prefix",
+    patterns: ["gpt-4.1"],
+  },
+  {
+    family: "OpenAI GPT-4o",
+    tokens: 128_000,
+    mode: "prefix",
+    patterns: ["gpt-4o"],
+  },
+  {
+    family: "OpenAI o-series",
+    tokens: 128_000,
+    mode: "prefix",
+    patterns: ["o1", "o3", "o4"],
+  },
+  {
+    family: "Anthropic Claude",
+    tokens: 200_000,
+    mode: "prefix",
+    patterns: ["claude-"],
+  },
+  {
+    family: "DeepSeek",
+    tokens: 64_000,
+    mode: "prefix",
+    patterns: ["deepseek-"],
+  },
+  {
+    family: "MiniMax",
+    tokens: 1_000_000,
+    mode: "includes",
+    patterns: ["minimax"],
+  },
+];
+
+const ROLE_LABELS: Record<AnatomyRole, string> = {
+  system: "System",
+  user: "User messages",
+  assistant: "Assistant messages",
+  tool: "Tool results",
+  tools: "Tool definitions",
+};
+
+function readPositiveInteger(value: unknown): number | null {
+  if (typeof value === "number") {
+    if (Number.isFinite(value) && value > 0) return Math.floor(value);
+    return null;
+  }
+
+  if (typeof value === "string") {
+    const parsed = Number(value);
+    if (Number.isFinite(parsed) && parsed > 0) return Math.floor(parsed);
+  }
+
+  return null;
+}
+
+function readPositiveIntegerField(parsed: unknown, fields: readonly string[]): number | null {
+  for (const field of fields) {
+    const value = readPositiveInteger(safeGetOwnProperty(parsed, field));
+    if (value !== null) return value;
+  }
+  return null;
+}
+
+export function readRequestModel(parsed: unknown): string | null {
+  const value = safeGetOwnProperty(parsed, "model");
+  if (typeof value !== "string") return null;
+  const trimmed = value.trim();
+  return trimmed === "" ? null : trimmed;
+}
+
+function matchesRule(model: string, rule: ModelContextRule): boolean {
+  switch (rule.mode) {
+    case "prefix":
+      return rule.patterns.some((pattern) => model.startsWith(pattern));
+    case "includes":
+      return rule.patterns.some((pattern) => model.includes(pattern));
+  }
+}
+
+export function resolveContextWindow(model: string | null, parsed: unknown): ContextWindow {
+  const explicitWindow = readPositiveIntegerField(parsed, EXPLICIT_CONTEXT_WINDOW_FIELDS);
+  if (explicitWindow !== null) {
+    return {
+      tokens: explicitWindow,
+      label: "Request metadata",
+      source: "request",
+    };
+  }
+
+  if (model === null) {
+    return {
+      tokens: null,
+      label: "Unknown model",
+      source: "unknown",
+    };
+  }
+
+  const normalized = model.trim().toLowerCase();
+  for (const rule of MODEL_CONTEXT_RULES) {
+    if (matchesRule(normalized, rule)) {
+      return {
+        tokens: rule.tokens,
+        label: rule.family,
+        source: "model-rule",
+      };
+    }
+  }
+
+  return {
+    tokens: null,
+    label: "No local rule",
+    source: "unknown",
+  };
+}
+
+function clampPercent(value: number): number {
+  if (value < 0) return 0;
+  if (value > 1) return 1;
+  return value;
+}
+
+function riskLevel(usagePercent: number | null): ContextRiskLevel {
+  if (usagePercent === null) return "unknown";
+  if (usagePercent >= DANGER_USAGE_PERCENT) return "danger";
+  if (usagePercent >= WATCH_USAGE_PERCENT) return "watch";
+  return "ok";
+}
+
+function sumSegments(segments: readonly AnatomySegment[], role: AnatomyRole): number {
+  return segments
+    .filter((segment) => segment.role === role)
+    .reduce((sum, segment) => sum + segment.size, 0);
+}
+
+function buildRoleUsages(segments: readonly AnatomySegment[], total: number): RoleUsage[] {
+  const roles: AnatomyRole[] = ["system", "user", "assistant", "tool", "tools"];
+  return roles
+    .map((role) => {
+      const tokens = sumSegments(segments, role);
+      return {
+        role,
+        label: ROLE_LABELS[role],
+        tokens,
+        percent: total > 0 ? tokens / total : 0,
+      };
+    })
+    .filter((usage) => usage.tokens > 0)
+    .sort((a, b) => b.tokens - a.tokens);
+}
+
+function normalizeDuplicateText(text: string): string {
+  return text.replace(/\s+/g, " ").trim().toLowerCase();
+}
+
+function duplicateDiagnostic(segments: readonly AnatomySegment[]): ContextDiagnostic | null {
+  type DuplicateBucket = {
+    count: number;
+    tokens: number;
+    firstTokens: number;
+    label: string;
+  };
+
+  const buckets = new Map<string, DuplicateBucket>();
+  for (const segment of segments) {
+    if (segment.size < DUPLICATE_MIN_TOKENS) continue;
+    if (segment.characters < DUPLICATE_MIN_CHARS) continue;
+    const normalized = normalizeDuplicateText(segment.text);
+    if (normalized === "") continue;
+    const existing = buckets.get(normalized);
+    if (existing === undefined) {
+      buckets.set(normalized, {
+        count: 1,
+        tokens: segment.size,
+        firstTokens: segment.size,
+        label: segment.label,
+      });
+      continue;
+    }
+    buckets.set(normalized, {
+      count: existing.count + 1,
+      tokens: existing.tokens + segment.size,
+      firstTokens: existing.firstTokens,
+      label: existing.label,
+    });
+  }
+
+  let repeatedGroups = 0;
+  let repeatedSegments = 0;
+  let repeatedTokens = 0;
+  let largest: DuplicateBucket | null = null;
+  for (const bucket of buckets.values()) {
+    if (bucket.count < 2) continue;
+    repeatedGroups += 1;
+    repeatedSegments += bucket.count;
+    repeatedTokens += bucket.tokens - bucket.firstTokens;
+    if (largest === null || bucket.tokens > largest.tokens) largest = bucket;
+  }
+
+  if (repeatedGroups === 0 || largest === null) return null;
+
+  return {
+    kind: "duplicate",
+    severity: repeatedTokens >= LONG_TOOL_SCHEMA_TOKENS ? "danger" : "watch",
+    title: "Duplicate context",
+    detail: `${String(repeatedSegments)} repeated blocks across ${String(
+      repeatedGroups,
+    )} group${repeatedGroups === 1 ? "" : "s"}, ~${String(repeatedTokens)} repeated tokens.`,
+  };
+}
+
+function diagnosticsForRolePressure(
+  roleUsages: readonly RoleUsage[],
+  total: number,
+  messageSegmentCount: number,
+): ContextDiagnostic[] {
+  const diagnostics: ContextDiagnostic[] = [];
+  const toolUsage = roleUsages.find((usage) => usage.role === "tools") ?? null;
+  if (
+    toolUsage !== null &&
+    (toolUsage.tokens >= LONG_TOOL_SCHEMA_TOKENS ||
+      (toolUsage.percent >= LARGE_ROLE_PERCENT && toolUsage.tokens >= SYSTEM_HEAVY_TOKENS))
+  ) {
+    diagnostics.push({
+      kind: "tool-schema",
+      severity: toolUsage.tokens >= LONG_TOOL_SCHEMA_TOKENS ? "danger" : "watch",
+      title: "Large tool schema",
+      detail: `Tool definitions take ${Math.round(toolUsage.percent * 100)}% of request context.`,
+    });
+  }
+
+  const systemUsage = roleUsages.find((usage) => usage.role === "system") ?? null;
+  if (
+    systemUsage !== null &&
+    systemUsage.tokens >= SYSTEM_HEAVY_TOKENS &&
+    systemUsage.percent >= SYSTEM_HEAVY_PERCENT
+  ) {
+    diagnostics.push({
+      kind: "system-heavy",
+      severity: "watch",
+      title: "Large system prompt",
+      detail: `System instructions take ${Math.round(systemUsage.percent * 100)}% of request context.`,
+    });
+  }
+
+  const historyTokens = roleUsages
+    .filter((usage) => usage.role === "user" || usage.role === "assistant" || usage.role === "tool")
+    .reduce((sum, usage) => sum + usage.tokens, 0);
+  const historyPercent = total > 0 ? historyTokens / total : 0;
+  if (
+    messageSegmentCount >= HISTORY_BLOAT_SEGMENTS &&
+    (historyTokens >= HISTORY_BLOAT_TOKENS || historyPercent >= HISTORY_BLOAT_PERCENT)
+  ) {
+    diagnostics.push({
+      kind: "history-bloat",
+      severity: historyPercent >= 0.85 ? "danger" : "watch",
+      title: "Conversation history growth",
+      detail: `${String(messageSegmentCount)} message blocks take ${Math.round(
+        historyPercent * 100,
+      )}% of request context.`,
+    });
+  }
+
+  return diagnostics;
+}
+
+export function analyzeContextIntelligence({
+  segments,
+  inputTokens,
+  parsed,
+  model,
+}: {
+  segments: readonly AnatomySegment[];
+  inputTokens: number | null;
+  parsed: unknown;
+  model: string | null;
+}): ContextIntelligence {
+  const totalEstimatedTokens = segments.reduce((sum, segment) => sum + segment.size, 0);
+  const requestModel = model ?? readRequestModel(parsed);
+  const estimatedInputTokens = inputTokens ?? totalEstimatedTokens;
+  const outputReserveTokens = readPositiveIntegerField(parsed, OUTPUT_RESERVE_FIELDS);
+  const contextWindow = resolveContextWindow(requestModel, parsed);
+  const reservedTokens = outputReserveTokens ?? 0;
+  const windowUsedTokens =
+    contextWindow.tokens === null ? null : estimatedInputTokens + reservedTokens;
+  const remainingInputTokens =
+    contextWindow.tokens === null ? null : contextWindow.tokens - estimatedInputTokens;
+  const remainingAfterReserveTokens =
+    contextWindow.tokens === null
+      ? null
+      : contextWindow.tokens - estimatedInputTokens - reservedTokens;
+  const usagePercent =
+    contextWindow.tokens === null || windowUsedTokens === null
+      ? null
+      : clampPercent(windowUsedTokens / contextWindow.tokens);
+  const roleUsages = buildRoleUsages(segments, totalEstimatedTokens);
+  const largestRole = roleUsages[0] ?? null;
+  const messageSegmentCount = segments.filter((segment) => segment.role !== "tools").length;
+  const duplicate = duplicateDiagnostic(segments);
+  const diagnostics = diagnosticsForRolePressure(
+    roleUsages,
+    totalEstimatedTokens,
+    messageSegmentCount,
+  );
+  if (duplicate !== null) diagnostics.unshift(duplicate);
+
+  return {
+    model: requestModel,
+    contextWindow,
+    estimatedInputTokens,
+    outputReserveTokens,
+    windowUsedTokens,
+    remainingInputTokens,
+    remainingAfterReserveTokens,
+    usagePercent,
+    riskLevel: riskLevel(usagePercent),
+    roleUsages,
+    largestRole,
+    diagnostics,
+  };
+}
+
+export const CONTEXT_USAGE_THRESHOLDS = {
+  watch: WATCH_USAGE_PERCENT,
+  danger: DANGER_USAGE_PERCENT,
+} as const;

package/src/routes/__root.tsx

@@ -18,6 +18,7 @@ export const Route = createRootRoute({
     ],
   }),
   component: RootComponent,
+  notFoundComponent: RootNotFoundComponent,
 });
 
 function RootComponent() {
@@ -28,6 +29,32 @@ function RootComponent() {
   );
 }
 
+function RootNotFoundComponent() {
+  return (
+    <RootDocument>
+      <main className="min-h-screen bg-background text-foreground">
+        <div className="mx-auto flex min-h-screen w-full max-w-3xl flex-col justify-center px-6 py-16">
+          <div className="border-border/70 bg-card/60 rounded-lg border p-8 shadow-sm">
+            <div className="text-muted-foreground font-mono text-xs uppercase tracking-wider">
+              404
+            </div>
+            <h1 className="mt-3 text-2xl font-semibold">Page not found</h1>
+            <p className="text-muted-foreground mt-3 max-w-xl text-sm leading-6">
+              This route is not part of the Agent Inspector UI or API surface.
+            </p>
+            <a
+              href="/"
+              className="bg-primary text-primary-foreground hover:bg-primary/90 mt-6 inline-flex h-9 items-center justify-center rounded-md px-4 text-sm font-medium transition-colors"
+            >
+              Open Agent Inspector
+            </a>
+          </div>
+        </div>
+      </main>
+    </RootDocument>
+  );
+}
+
 function RootDocument({ children }: Readonly<{ children: ReactNode }>) {
   return (
     <html lang="en" className="dark">

package/.output/public/assets/RequestAnatomy-CKbvIgaN.js

@@ -1 +0,0 @@
-import{r as f,j as e}from"./main-BlDtK0Nn.js";import{c as A,f as h,s as D,b as y,t as R,v as L,w as T}from"./ProxyViewerContainer-BHq0dkQG.js";const F=[["circle",{cx:"12",cy:"12",r:"10",key:"1mglay"}],["path",{d:"M12 16v-4",key:"1dtifu"}],["path",{d:"M12 8h.01",key:"e9boi3"}]],U=A("info",F),B={system:"System",user:"User",assistant:"Assistant",tool:"Tool Results",tools:"Tool Definitions"},_={system:"bg-sky-500/70",user:"bg-emerald-500/70",assistant:"bg-violet-500/70",tool:"bg-sky-400/55",tools:"bg-slate-500/70"},V={system:"focus-visible:ring-sky-300",user:"focus-visible:ring-emerald-300",assistant:"focus-visible:ring-violet-300",tool:"focus-visible:ring-sky-300",tools:"focus-visible:ring-slate-300"},C=12,$=1,I=80,O=24;function q(o){return o.length<=O?o:`${o.slice(0,O-3)}...`}function G(o){const r=o.replace(/\s+/g," ").trim();return r.length<=I?r:`${r.slice(0,I)}...`}function E(o){return o>=10?`${o.toFixed(0)}%`:o>=1?`${o.toFixed(1)}%`:o>0?"<1%":"0%"}const W=f.memo(function({segments:r,totalTokens:i,showLabels:x=!0,onActivate:m}){const c=f.useMemo(()=>i>0?i:r.reduce((s,t)=>s+t.size,0),[r,i]),n=r.slice(0,C),l=r.slice(C),u=l.reduce((s,t)=>s+t.size,0),d=l.length,p=C,M=p+d-1,b=d>0,g=m!==void 0,S=f.useMemo(()=>n.reduce((s,t)=>s+t.size,0),[n]),w=f.useMemo(()=>`Request context: ~${h(c)} tokens across ${r.length} segment${r.length===1?"":"s"}`,[r.length,c]);return r.length===0||c<=0?e.jsx("div",{role:"img","aria-label":w,className:"h-6"}):e.jsx(D,{delayDuration:150,children:e.jsxs("div",{role:"img","aria-label":w,className:"flex flex-col gap-1.5",children:[e.jsxs("div",{className:"relative flex h-6 w-full overflow-hidden rounded border border-border/40 bg-muted/30","data-testid":"anatomy-segment-bar",children:[n.map((s,t)=>{const a=c>0?s.size/c*100:0,v=Math.max($,a),j=y("h-full border-r border-background/80 last:border-r-0",g?"opacity-90 hover:opacity-100 focus:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-1 focus-visible:ring-offset-background":"opacity-90",_[s.role],g?V[s.role]:""),N={width:`${v}%`},z=`${s.label}, ${E(a)}, ~${h(s.size)} tokens`;return e.jsxs(R,{children:[e.jsx(L,{asChild:!0,children:g?e.jsx("button",{type:"button",role:"button",tabIndex:0,onClick:()=>m(s),onKeyDown:k=>{(k.key==="Enter"||k.key===" ")&&(k.preventDefault(),m(s))},"data-anatomy-path":s.path,"aria-label":z,className:j,style:N}):e.jsx("span",{"aria-label":z,className:j,style:N})}),e.jsxs(T,{side:"bottom",className:"max-w-sm text-xs p-2 space-y-0.5",children:[e.jsxs("div",{className:"font-semibold",children:[s.label," - ",E(a)," - ~",h(s.size)," ","tokens"]}),e.jsx("div",{className:"text-muted-foreground",children:B[s.role]}),e.jsxs("div",{className:"text-muted-foreground",children:[s.characters.toLocaleString()," chars"]}),s.text.length>0&&e.jsx("div",{className:"text-muted-foreground/90 break-words whitespace-pre-wrap",children:G(s.text)})]})]},`${s.path}-${t}`)}),b&&e.jsxs(R,{children:[e.jsx(L,{asChild:!0,children:e.jsxs("div",{role:"img","aria-label":`${d} additional segments`,className:"flex h-full items-center justify-center bg-muted-foreground/30 px-1.5 text-[10px] font-mono text-background",style:{width:`${Math.max($,u/c*100)}%`},children:["... +",d]})}),e.jsxs(T,{side:"bottom",className:"text-xs",children:[d," more segment",d===1?"":"s"," (indices"," ",p,"-",M,")"]})]})]}),x&&e.jsxs("div",{className:"flex w-full gap-1 text-[10px] text-muted-foreground",children:[n.map((s,t)=>{const a=c>0?s.size/c*100:0,v=Math.max($,a);return e.jsxs("div",{className:"flex flex-col gap-0.5 truncate",style:{width:`${v}%`},title:`${s.label} - ${E(a)} - ~${h(s.size)} tokens`,children:[e.jsx("span",{className:"truncate font-mono text-foreground/80",children:q(s.label)}),e.jsxs("span",{className:"truncate font-mono text-muted-foreground/70",children:[E(a)," - ~",h(s.size)]})]},`label-${s.path}-${t}`)}),b&&e.jsxs("div",{className:"flex flex-col gap-0.5 truncate text-muted-foreground",style:{width:`${Math.max($,u/c*100)}%`},children:[e.jsxs("span",{className:"truncate font-mono text-foreground/60",children:["... +",d]}),e.jsxs("span",{className:"truncate font-mono text-muted-foreground/60",children:["~",h(u)]})]})]}),S<c*.1&&e.jsx("div",{className:"h-0"})]})})}),H=.25,J=5,K=["system","user","assistant","tool","tools"],X={system:"instructions",user:"user turns",assistant:"assistant turns",tool:"tool results",tools:"tool schemas"},Y=[{value:"role",label:"By Role"},{value:"segment",label:"By Segment"}];function P(o){return o>=10?`${o.toFixed(0)}%`:o>=1?`${o.toFixed(1)}%`:o>0?"<1%":"0%"}function Q(o){const r=[];for(const i of K){const x=o.filter(u=>u.role===i);if(x.length===0)continue;const m=x.reduce((u,d)=>u+d.size,0),c=x.reduce((u,d)=>u+d.characters,0),n=B[i],l=`${x.length} segment${x.length===1?"":"s"} grouped as ${X[i]}`;r.push({role:i,label:n,size:m,characters:c,text:l,path:`role:${i}`})}return r}function Z(o){return[...o].sort((r,i)=>i.size-r.size).slice(0,J)}function se({parsed:o,inputTokens:r,onSegmentActivate:i,segments:x}){const[m,c]=f.useState("role"),n=f.useMemo(()=>x??null,[x]),l=f.useMemo(()=>(n??[]).reduce((t,a)=>t+a.size,0),[n]),u=f.useMemo(()=>n===null?[]:Q(n),[n]),d=f.useMemo(()=>n===null?[]:Z(n),[n]),p=f.useMemo(()=>n===null||r===null||l===0?!1:Math.abs(r-l)/Math.max(r,l)>=H,[r,n,l]);if(n===null||n.length===0||o===null&&x===void 0)return null;const M=r!==null&&p?"text-amber-400":"text-muted-foreground",b=m==="role"?u:n,g=l>0?l:b.reduce((t,a)=>t+a.size,0),S=m==="segment"?i:void 0,w=`${String(n.length)} segment${n.length===1?"":"s"}`,s=r===null?"Provider input unknown":`Provider input ${h(r)}`;return e.jsx(D,{delayDuration:150,children:e.jsxs("div",{className:"px-4 py-3 space-y-3","data-testid":"anatomy-root",children:[e.jsxs("div",{className:"flex flex-wrap items-start justify-between gap-3",children:[e.jsxs("div",{className:"min-w-0",children:[e.jsx("div",{className:"text-sm font-semibold text-foreground",children:"Request Context"}),e.jsxs("div",{className:y("mt-0.5 text-xs font-mono tabular-nums",M),children:["Estimated ~",h(l)," tokens | ",s," | ",w]})]}),e.jsx("div",{className:"inline-flex shrink-0 rounded border border-border bg-muted/20 p-0.5",role:"group","aria-label":"Context breakdown mode",children:Y.map(t=>e.jsx("button",{type:"button","aria-pressed":m===t.value,onClick:()=>c(t.value),className:y("h-6 rounded-sm px-2 text-[11px] font-medium transition-colors",m===t.value?"bg-background text-foreground shadow-sm":"text-muted-foreground hover:text-foreground"),children:t.label},t.value))})]}),p&&e.jsxs("div",{className:"inline-flex items-center gap-1.5 text-xs text-amber-400",children:[e.jsxs(R,{children:[e.jsx(L,{asChild:!0,children:e.jsx("button",{type:"button",className:"inline-flex items-center hover:text-amber-300","aria-label":"Token estimate differs from provider input",children:e.jsx(U,{className:"size-3.5"})})}),e.jsx(T,{className:"max-w-xs text-xs",children:"The bar uses a local token estimate. Provider input tokens remain the source of truth for billing and context-window usage."})]}),"Estimate differs from provider-reported input."]}),e.jsx(W,{segments:b,totalTokens:g,showLabels:m==="segment",onActivate:S}),e.jsx("div",{className:"flex flex-wrap items-center gap-x-3 gap-y-1.5 text-[11px] text-muted-foreground",children:u.map(t=>{const a=l>0?t.size/l*100:0;return e.jsxs("div",{className:"inline-flex items-center gap-1.5",children:[e.jsx("span",{"aria-hidden":"true",className:y("size-2.5 rounded-[2px]",_[t.role])}),e.jsx("span",{children:t.label}),e.jsx("span",{className:"font-mono text-muted-foreground/70",children:P(a)})]},t.role)})}),e.jsxs("div",{className:"space-y-1.5",children:[e.jsx("div",{className:"text-xs font-medium text-foreground",children:"Top Contributors"}),e.jsx("div",{className:"grid gap-1",children:d.map((t,a)=>{const v=l>0?t.size/l*100:0,j=i,N=e.jsxs(e.Fragment,{children:[e.jsx("span",{className:"w-5 shrink-0 text-right font-mono text-muted-foreground/70",children:String(a+1)}),e.jsx("span",{"aria-hidden":"true",className:y("size-2.5 shrink-0 rounded-[2px]",_[t.role])}),e.jsx("span",{className:"min-w-0 flex-1 truncate text-left",children:t.label}),e.jsxs("span",{className:"shrink-0 font-mono text-muted-foreground",children:[P(v)," | ~",h(t.size)]})]});return j!==void 0?e.jsx("button",{type:"button",onClick:()=>j(t),className:"flex h-7 items-center gap-2 rounded px-1.5 text-xs text-muted-foreground hover:bg-muted/40 hover:text-foreground",title:"Jump to this request block",children:N},`${t.path}-${a}`):e.jsx("div",{className:"flex h-7 items-center gap-2 rounded px-1.5 text-xs text-muted-foreground",children:N},`${t.path}-${a}`)})})]})]})})}export{se as RequestAnatomy};

package/.output/public/assets/_sessionId-BJTz6t5l.js

@@ -1 +0,0 @@
-import{R as s,j as e}from"./main-BlDtK0Nn.js";import{P as i}from"./ProxyViewerContainer-BHq0dkQG.js";function t(){const{sessionId:o}=s.useParams();return e.jsx(i,{initialSessionId:o},o)}export{t as component};

package/.output/public/assets/index-Cf9U0Ekq.js

@@ -1 +0,0 @@
-import{P as o}from"./ProxyViewerContainer-BHq0dkQG.js";import"./main-BlDtK0Nn.js";const r=o;export{r as component};