@flanksource/clicky-ui 0.3.10 → 0.3.11

package/dist/data/ai/SessionViewer.cjs

@@ -2,31 +2,21 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
+const reactDom = require("react-dom");
 const utils = require("../../lib/utils.cjs");
 const Icon = require("../Icon.cjs");
-const CodeBlock = require("../CodeBlock.cjs");
 const useDensity = require("../../hooks/use-density.cjs");
 const densityProvider = require("../../hooks/density-provider.cjs");
 const SessionViewer_model = require("./SessionViewer.model.cjs");
+const SessionViewer_grouping = require("./SessionViewer.grouping.cjs");
+const SessionViewer_rows = require("./SessionViewer.rows.cjs");
+const ContextMeter = require("../chat/ContextMeter.cjs");
+const providerIcons = require("../chat/provider-icons.cjs");
+const sessionCost = require("./session-cost.cjs");
 const sessionCategories = require("./session-categories.cjs");
 const SessionViewerMenu = require("./SessionViewerMenu.cjs");
+const useSessionScroll = require("./use-session-scroll.cjs");
 const UiRobotAi = require("../../icons/components/UiRobotAi.cjs");
-const UiUserCircle = require("../../icons/components/UiUserCircle.cjs");
-const UiWarningTriangle = require("../../icons/components/UiWarningTriangle.cjs");
-const UiBrain = require("../../icons/components/UiBrain.cjs");
-const UiSparkles = require("../../icons/components/UiSparkles.cjs");
-const UiChevronDown = require("../../icons/components/UiChevronDown.cjs");
-const DISC_TONE = {
-  sky: "bg-sky-100 text-sky-700 [[data-theme=dark]_&]:bg-sky-500/15 [[data-theme=dark]_&]:text-sky-300",
-  amber: "bg-amber-100 text-amber-700 [[data-theme=dark]_&]:bg-amber-500/15 [[data-theme=dark]_&]:text-amber-300",
-  violet: "bg-violet-100 text-violet-700 [[data-theme=dark]_&]:bg-violet-500/15 [[data-theme=dark]_&]:text-violet-300",
-  emerald: "bg-emerald-100 text-emerald-700 [[data-theme=dark]_&]:bg-emerald-500/15 [[data-theme=dark]_&]:text-emerald-300",
-  rose: "bg-rose-100 text-rose-700 [[data-theme=dark]_&]:bg-rose-500/15 [[data-theme=dark]_&]:text-rose-300",
-  indigo: "bg-indigo-100 text-indigo-700 [[data-theme=dark]_&]:bg-indigo-500/15 [[data-theme=dark]_&]:text-indigo-300",
-  fuchsia: "bg-fuchsia-100 text-fuchsia-700 [[data-theme=dark]_&]:bg-fuchsia-500/15 [[data-theme=dark]_&]:text-fuchsia-300",
-  pink: "bg-pink-100 text-pink-700 [[data-theme=dark]_&]:bg-pink-500/15 [[data-theme=dark]_&]:text-pink-300",
-  slate: "bg-muted text-muted-foreground"
-};
 function toggleInSet(set, value) {
   const next = new Set(set);
   if (next.has(value)) next.delete(value);
@@ -40,10 +30,24 @@ function SessionViewer({
   showThinking = true,
   showHeader = true,
   showMenu = true,
+  menuContainer,
   defaultDensity,
-  defaultTheme
+  defaultTheme,
+  scrollable = false,
+  windowSize = 60,
+  batchSize = 40,
+  showRowMetadata = false,
+  showRaw = false,
+  pendingTools = [],
+  onPendingToolDecision
 }) {
-  const allEvents = react.useMemo(() => SessionViewer_model.normalizeSession(session), [session]);
+  var _a;
+  const allEvents = react.useMemo(
+    () => mergePendingTools(SessionViewer_model.normalizeSession(session), pendingTools),
+    [session, pendingTools]
+  );
+  const displayItems = react.useMemo(() => SessionViewer_grouping.collapseWaitRuns(allEvents), [allEvents]);
+  const metadata = react.useMemo(() => SessionViewer_model.getSessionMetadata(session), [session]);
   const pageDensity = useDensity.useDensityValue();
   const [densityOverride, setDensityOverride] = react.useState(defaultDensity);
   const [themeOverride, setThemeOverride] = react.useState(defaultTheme);
@@ -57,7 +61,17 @@ function SessionViewer({
   const filters = react.useMemo(() => sessionCategories.collectSessionFilters(allEvents), [allEvents]);
   const hasThinking = react.useMemo(() => allEvents.some((e) => e.kind === "thinking"), [allEvents]);
   const visibility = { hiddenCategories, hiddenTools, hiddenSources, showThinking: effectiveShowThinking };
-  const events = allEvents.filter((event) => sessionCategories.isEventVisible(event, visibility));
+  const items = displayItems.filter(
+    (item) => sessionCategories.isEventVisible(SessionViewer_grouping.isSessionEventGroup(item) ? item.representative : item, visibility)
+  );
+  const resetKey = `${allEvents.length}:${((_a = allEvents[0]) == null ? void 0 : _a.id) ?? ""}`;
+  const { scrollRef, contentRef, startIndex } = useSessionScroll.useSessionScroll({
+    total: items.length,
+    enabled: scrollable,
+    windowSize,
+    batchSize,
+    resetKey
+  });
   if (allEvents.length === 0) {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
@@ -76,200 +90,198 @@ function SessionViewer({
     ...densityOverride ? { "data-density": densityOverride } : {},
     ...themeOverride ? { "data-theme": themeOverride } : {}
   };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("text-sm", className), ...dataAttrs, children: /* @__PURE__ */ jsxRuntime.jsxs(densityProvider.DensityValueProvider, { density: effectiveDensity, children: [
-    (showHeader || showMenu) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-density-3 flex items-center justify-between gap-density-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-x-density-3 gap-y-1 text-xs text-muted-foreground", children: [
-        showHeader && summary.model && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 font-medium text-foreground", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiRobotAi.UiRobotAi, className: "size-3.5" }),
-          summary.model
-        ] }),
-        showHeader && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-          summary.toolCount,
-          " actions"
-        ] }),
-        showHeader && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-          summary.messageCount,
-          " messages"
-        ] })
-      ] }),
-      showMenu && /* @__PURE__ */ jsxRuntime.jsx(
-        SessionViewerMenu.SessionViewerMenu,
+  const menu = showMenu ? /* @__PURE__ */ jsxRuntime.jsx(
+    SessionViewerMenu.SessionViewerMenu,
+    {
+      density: densityOverride,
+      onDensityChange: setDensityOverride,
+      theme: themeOverride,
+      onThemeChange: setThemeOverride,
+      filters,
+      hiddenCategories,
+      hiddenTools,
+      hiddenSources,
+      onToggleCategory: (category) => setHiddenCategories((set) => toggleInSet(set, category)),
+      onToggleTool: (tool) => setHiddenTools((set) => toggleInSet(set, tool)),
+      onToggleSource: (source) => setHiddenSources((set) => toggleInSet(set, source)),
+      showThinking: effectiveShowThinking,
+      onToggleThinking: () => setShowThinkingOverride(!effectiveShowThinking),
+      hasThinking
+    }
+  ) : null;
+  const inlineMenu = menu && !menuContainer;
+  const list = items.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-md border border-dashed border-border p-density-4 text-center text-sm text-muted-foreground", children: "All actions are hidden by the active filters." }) : (
+    // In scrollable mode only the newest `startIndex..` slice is mounted; `last`
+    // is measured against the full length so the timeline connector stays right.
+    /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "relative", children: items.slice(startIndex).map((item, index) => {
+      const last = startIndex + index === items.length - 1;
+      return SessionViewer_grouping.isSessionEventGroup(item) ? /* @__PURE__ */ jsxRuntime.jsx(
+        SessionViewer_rows.WaitGroupRow,
         {
-          density: densityOverride,
-          onDensityChange: setDensityOverride,
-          theme: themeOverride,
-          onThemeChange: setThemeOverride,
-          filters,
-          hiddenCategories,
-          hiddenTools,
-          hiddenSources,
-          onToggleCategory: (category) => setHiddenCategories((set) => toggleInSet(set, category)),
-          onToggleTool: (tool) => setHiddenTools((set) => toggleInSet(set, tool)),
-          onToggleSource: (source) => setHiddenSources((set) => toggleInSet(set, source)),
-          showThinking: effectiveShowThinking,
-          onToggleThinking: () => setShowThinkingOverride(!effectiveShowThinking),
-          hasThinking
-        }
-      )
-    ] }),
-    events.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-md border border-dashed border-border p-density-4 text-center text-sm text-muted-foreground", children: "All actions are hidden by the active filters." }) : /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "relative", children: events.map((event, index) => /* @__PURE__ */ jsxRuntime.jsx(
-      SessionRow,
-      {
-        event,
-        last: index === events.length - 1,
-        defaultExpanded
-      },
-      event.id
-    )) })
-  ] }) });
-}
-function SessionRow({
-  event,
-  last,
-  defaultExpanded
-}) {
-  if (event.kind === "user") return /* @__PURE__ */ jsxRuntime.jsx(UserRow, { event });
-  const visual = eventVisual(event);
-  return /* @__PURE__ */ jsxRuntime.jsxs("li", { "data-event-kind": event.kind, className: "relative flex gap-density-3 pb-density-4 last:pb-0", children: [
-    !last && /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "absolute bottom-0 left-[10px] top-[22px] w-px bg-border" }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "span",
+          group: item,
+          last,
+          defaultExpanded,
+          showRowMetadata,
+          showRaw,
+          onPendingToolDecision
+        },
+        item.id
+      ) : /* @__PURE__ */ jsxRuntime.jsx(
+        SessionViewer_rows.SessionRow,
+        {
+          event: item,
+          last,
+          defaultExpanded,
+          showRowMetadata,
+          showRaw,
+          onPendingToolDecision
+        },
+        item.id
+      );
+    }) })
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("text-sm", scrollable && "flex h-full min-h-0 flex-col", className), ...dataAttrs, children: /* @__PURE__ */ jsxRuntime.jsxs(densityProvider.DensityValueProvider, { density: effectiveDensity, children: [
+    menu && menuContainer && reactDom.createPortal(menu, menuContainer),
+    (showHeader || inlineMenu) && /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
       {
         className: utils.cn(
-          "relative z-[1] flex h-[21px] w-[21px] shrink-0 items-center justify-center rounded-full",
-          DISC_TONE[visual.tone]
+          "flex items-center justify-between gap-density-3",
+          scrollable ? "shrink-0 border-b border-border px-density-4 py-density-2 md:px-density-6" : "mb-density-3"
         ),
-        children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: visual.icon, className: "h-3 w-3" })
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-x-density-3 gap-y-1 text-xs text-muted-foreground", children: [
+            showHeader && summary.model && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1 font-medium text-foreground", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiRobotAi.UiRobotAi, className: "size-3.5" }),
+              summary.model
+            ] }),
+            showHeader && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+              summary.toolCount,
+              " actions"
+            ] }),
+            showHeader && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+              summary.messageCount,
+              " messages"
+            ] }),
+            showHeader && metadata && /* @__PURE__ */ jsxRuntime.jsx(SessionMetadataBadges, { metadata })
+          ] }),
+          inlineMenu && menu
+        ]
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1 pt-px", children: /* @__PURE__ */ jsxRuntime.jsx(EventBody, { event, visual, defaultExpanded }) })
-  ] });
-}
-function UserRow({ event }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("li", { "data-event-kind": "user", className: "relative flex justify-end pb-density-4 last:pb-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex max-w-[85%] items-start gap-density-3", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-0.5 text-right text-xs font-medium text-muted-foreground", children: "You" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "whitespace-pre-wrap break-words rounded-lg bg-accent px-density-3 py-density-2 text-right leading-relaxed text-accent-foreground", children: event.text })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "span",
-      {
-        className: utils.cn(
-          "relative z-[1] flex h-[21px] w-[21px] shrink-0 items-center justify-center rounded-full",
-          DISC_TONE.slate
-        ),
-        children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiUserCircle.UiUserCircle, className: "h-3 w-3" })
-      }
-    )
+    scrollable ? /* @__PURE__ */ jsxRuntime.jsx("div", { ref: scrollRef, className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref: contentRef, className: "p-density-4 md:p-density-6", children: list }) }) : list
   ] }) });
 }
-function eventVisual(event) {
-  switch (event.kind) {
-    case "tool": {
-      const action = SessionViewer_model.getSessionAction(event.tool ?? "");
-      return { icon: action.icon, tone: action.tone, label: action.label };
+function mergePendingTools(events, pendingTools) {
+  const merged = [...events];
+  for (const [index, pending] of pendingTools.entries()) {
+    const matches = merged.filter(
+      (event) => event.kind === "tool" && (pending.toolCallId && event.toolCallId === pending.toolCallId || pending.approvalId && event.approvalId === pending.approvalId || pending.sessionId && event.sessionId === pending.sessionId && event.tool === pending.tool)
+    );
+    const match = matches.length === 1 ? matches[0] : void 0;
+    if (match) {
+      Object.assign(match, {
+        pending: true,
+        toolInput: pending.input ?? match.toolInput,
+        toolCallId: pending.toolCallId ?? match.toolCallId,
+        approvalId: pending.approvalId ?? match.approvalId,
+        sessionId: pending.sessionId ?? match.sessionId
+      });
+    } else {
+      merged.push({
+        id: `pending-${pending.approvalId ?? pending.toolCallId ?? `${pending.tool}-${index}`}`,
+        kind: "tool",
+        tool: pending.tool,
+        ...pending.input ? { toolInput: pending.input } : {},
+        ...pending.toolCallId ? { toolCallId: pending.toolCallId } : {},
+        ...pending.approvalId ? { approvalId: pending.approvalId } : {},
+        ...pending.sessionId ? { sessionId: pending.sessionId } : {},
+        pending: true
+      });
     }
-    case "user":
-      return { icon: UiUserCircle.UiUserCircle, tone: "slate", label: "User" };
-    case "assistant":
-      return { icon: UiSparkles.UiSparkles, tone: "indigo", label: "Assistant" };
-    case "thinking":
-      return { icon: UiBrain.UiBrain, tone: "slate", label: "Thinking" };
-    case "error":
-      return { icon: UiWarningTriangle.UiWarningTriangle, tone: "rose", label: "Error" };
   }
+  return merged;
 }
-function EventBody({
-  event,
-  visual,
-  defaultExpanded
-}) {
-  if (event.kind === "tool") return /* @__PURE__ */ jsxRuntime.jsx(ToolBody, { event, label: visual.label, defaultExpanded });
-  if (event.kind === "thinking") return /* @__PURE__ */ jsxRuntime.jsx(ThinkingBody, { event });
-  if (event.kind === "error") return /* @__PURE__ */ jsxRuntime.jsx(ErrorBody, { event });
-  return /* @__PURE__ */ jsxRuntime.jsx(MessageBody, { event, label: visual.label });
-}
-function ToolBody({
-  event,
-  label,
-  defaultExpanded
-}) {
-  const summary = SessionViewer_model.summarizeToolInput(event.tool ?? "", event.toolInput);
-  const hasDetail = event.toolInput !== void 0 || event.toolResponse !== void 0;
-  const [open, setOpen] = react.useState(defaultExpanded);
-  const header = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium text-foreground", children: label }),
-    summary && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate font-mono text-xs text-muted-foreground", children: summary })
-  ] });
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "not-prose", children: [
-    hasDetail ? /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
+function SessionMetadataBadges({ metadata }) {
+  var _a, _b, _c, _d, _e, _f;
+  const capabilityBadges = [
+    countBadge("tool", (_a = metadata.capabilities) == null ? void 0 : _a.tools),
+    countBadge("mcp", (_b = metadata.capabilities) == null ? void 0 : _b.pendingMcpServers),
+    countBadge("agent", (_c = metadata.capabilities) == null ? void 0 : _c.agents),
+    countBadge("skill", (_d = metadata.capabilities) == null ? void 0 : _d.skills)
+  ].filter(Boolean);
+  const badges = [
+    ...((_e = metadata.turns) == null ? void 0 : _e.length) ? [{ key: "turns", label: countLabel(metadata.turns.length, "turn") }] : [],
+    ...capabilityBadges,
+    ...!metadata.context && metadata.budget ? [{ key: "budget", label: budgetLabel(metadata.budget) }] : [],
+    ...((_f = metadata.events) == null ? void 0 : _f.length) ? [{ key: "events", label: countLabel(metadata.events.length, "event") }] : []
+  ];
+  const modelIcon = metadata.provider ? providerIcons.providerIcon(metadata.provider) : void 0;
+  if (badges.length === 0 && !metadata.context) return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    badges.map((badge) => /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
       {
-        type: "button",
-        "aria-expanded": open,
-        onClick: () => setOpen((value) => !value),
-        className: "flex w-full items-center gap-1.5 text-left hover:text-foreground",
-        children: [
-          header,
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Icon.Icon,
-            {
-              icon: UiChevronDown.UiChevronDown,
-              className: utils.cn("ml-auto size-3 shrink-0 text-muted-foreground transition-transform", open && "rotate-180")
-            }
-          )
-        ]
+        title: badge.title,
+        className: "inline-flex max-w-40 items-center rounded border border-border px-1.5 py-0.5 text-[11px] text-muted-foreground",
+        children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: badge.label })
+      },
+      badge.key
+    )),
+    metadata.context && /* @__PURE__ */ jsxRuntime.jsx(
+      ContextMeter.ContextMeter,
+      {
+        mode: "bar",
+        usedPercent: 100 - metadata.context.freePercent,
+        usedTokens: metadata.context.usedTokens,
+        windowTokens: metadata.context.windowTokens,
+        model: metadata.model,
+        ...modelIcon ? { modelIcon } : {},
+        ...metadata.usage ? {
+          tokens: {
+            input: metadata.usage.inputTokens,
+            output: metadata.usage.outputTokens,
+            reasoning: metadata.usage.reasoningTokens,
+            cacheRead: metadata.usage.cacheReadTokens,
+            cacheWrite: metadata.usage.cacheWriteTokens,
+            total: sessionCost.tokenTotal(metadata.usage)
+          }
+        } : {},
+        ...metadata.cost ? {
+          cost: {
+            input: metadata.cost.inputCost,
+            output: metadata.cost.outputCost,
+            reasoning: metadata.cost.reasoningCost,
+            cacheRead: metadata.cost.cacheReadCost,
+            cacheWrite: metadata.cost.cacheWriteCost,
+            total: sessionCost.costTotal(metadata.cost)
+          }
+        } : {},
+        ...metadata.budget ? { budget: metadata.budget } : {}
       }
-    ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1.5", children: header }),
-    (event.model || event.source) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-0.5 flex gap-density-2 text-[11px] text-muted-foreground", children: [
-      event.source && /* @__PURE__ */ jsxRuntime.jsx("span", { children: event.source }),
-      event.model && /* @__PURE__ */ jsxRuntime.jsx("span", { children: event.model }),
-      event.reasoningEffort && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-        "effort: ",
-        event.reasoningEffort
-      ] })
-    ] }),
-    open && hasDetail && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1.5 space-y-1.5", children: [
-      event.toolInput !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(DetailBlock, { language: "json", source: JSON.stringify(event.toolInput, null, 2) }),
-      event.toolResponse !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(ResponseBlock, { response: event.toolResponse })
-    ] })
+    )
   ] });
 }
-function ResponseBlock({ response }) {
-  const trimmed = response.trim();
-  const isJson = trimmed.startsWith("{") || trimmed.startsWith("[");
-  return /* @__PURE__ */ jsxRuntime.jsx(DetailBlock, { language: isJson ? "json" : "text", source: response });
-}
-function DetailBlock({ language, source }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-x-auto text-xs", children: /* @__PURE__ */ jsxRuntime.jsx(CodeBlock.CodeBlock, { language, source }) });
+function countBadge(label, values) {
+  const count = (values == null ? void 0 : values.length) ?? 0;
+  if (!count) return null;
+  return { key: label, label: countLabel(count, label), title: values == null ? void 0 : values.join(", ") };
 }
-function MessageBody({ event, label }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-0.5 text-xs font-medium text-muted-foreground", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "whitespace-pre-wrap break-words leading-relaxed text-foreground", children: event.text })
-  ] });
+function countLabel(count, label) {
+  if (label === "mcp") return `${count} mcp`;
+  return `${count} ${label}${count === 1 ? "" : "s"}`;
 }
-function ThinkingBody({ event }) {
-  const [open, setOpen] = react.useState(false);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "not-prose", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        type: "button",
-        "aria-expanded": open,
-        onClick: () => setOpen((value) => !value),
-        className: "flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "italic", children: "Reasoning" }),
-          /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiChevronDown.UiChevronDown, className: utils.cn("size-3 transition-transform", open && "rotate-180") })
-        ]
-      }
-    ),
-    open && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 whitespace-pre-wrap break-words border-l-2 border-border pl-density-3 text-xs italic leading-relaxed text-muted-foreground", children: event.text })
-  ] });
+function budgetLabel(budget) {
+  if (budget.total !== void 0 && budget.total > 0) {
+    return `budget ${formatUSD(budget.used ?? 0)}/${formatUSD(budget.total)}`;
+  }
+  if (budget.remaining !== void 0) return `budget ${formatUSD(budget.remaining)} left`;
+  if (budget.used !== void 0) return `budget ${formatUSD(budget.used)} used`;
+  return "budget";
 }
-function ErrorBody({ event }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-md border border-rose-200 bg-rose-50 px-density-3 py-1.5 text-xs text-rose-700 [[data-theme=dark]_&]:border-rose-500/30 [[data-theme=dark]_&]:bg-rose-500/10 [[data-theme=dark]_&]:text-rose-300", children: event.text });
+function formatUSD(value) {
+  if (value < 1 || !Number.isInteger(value)) return `$${value.toFixed(2)}`;
+  return `$${value.toFixed(0)}`;
 }
 exports.SessionViewer = SessionViewer;
 //# sourceMappingURL=SessionViewer.cjs.map

package/dist/data/ai/SessionViewer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SessionViewer.cjs","sources":["../../../src/data/ai/SessionViewer.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode } from \"react\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../Icon\";\nimport { CodeBlock } from \"../CodeBlock\";\nimport { useDensityValue, type Density } from \"../../hooks/use-density\";\nimport { DensityValueProvider } from \"../../hooks/density-provider\";\nimport {\n  UiBrain,\n  UiChevronDown,\n  UiRobotAi,\n  UiSparkles,\n  UiUserCircle,\n  UiWarningTriangle,\n} from \"../../icons\";\nimport {\n  getSessionAction,\n  normalizeSession,\n  summarizeSession,\n  summarizeToolInput,\n  type SessionEvent,\n  type SessionInput,\n  type SessionTone,\n} from \"./SessionViewer.model\";\nimport {\n  collectSessionFilters,\n  isEventVisible,\n  type SessionCategory,\n} from \"./session-categories\";\nimport { SessionViewerMenu, type SessionThemeOverride } from \"./SessionViewerMenu\";\n\nexport type {\n  SessionEntry,\n  SessionEvent,\n  SessionInput,\n  SessionActionMeta,\n} from \"./SessionViewer.model\";\nexport type { SessionThemeOverride } from \"./SessionViewerMenu\";\n\nexport interface SessionViewerProps {\n  /** A captain session: parsed `SessionEntry[]` or raw log text (JSON / JSONL). */\n  session: SessionInput;\n  className?: string;\n  /** Expand each tool call's input/output by default. Defaults to false. */\n  defaultExpanded?: boolean;\n  /** Render assistant reasoning (\"thinking\") blocks. Defaults to true. */\n  showThinking?: boolean;\n  /** Show the summary header (model + action counts). Defaults to true. */\n  showHeader?: boolean;\n  /** Show the 3-dot menu (density + category/tool/source filters). Defaults to true. */\n  showMenu?: boolean;\n  /** Initial density override; undefined inherits the page/document density. */\n  defaultDensity?: Density;\n  /** Initial theme override; undefined inherits the page/document `data-theme`. */\n  defaultTheme?: SessionThemeOverride;\n}\n\n// Disc colors per tone. The dark variants key off a `[data-theme=\"dark\"]`\n// ancestor (the document attribute set by ThemeProvider, or the component-level\n// override painted on this viewer's root) rather than Tailwind's `dark:` —\n// which this library compiles to `prefers-color-scheme` and so would ignore the\n// `data-theme` attribute. Written as literal class strings so Tailwind scans them.\nconst DISC_TONE: Record<SessionTone, string> = {\n  sky: \"bg-sky-100 text-sky-700 [[data-theme=dark]_&]:bg-sky-500/15 [[data-theme=dark]_&]:text-sky-300\",\n  amber: \"bg-amber-100 text-amber-700 [[data-theme=dark]_&]:bg-amber-500/15 [[data-theme=dark]_&]:text-amber-300\",\n  violet: \"bg-violet-100 text-violet-700 [[data-theme=dark]_&]:bg-violet-500/15 [[data-theme=dark]_&]:text-violet-300\",\n  emerald: \"bg-emerald-100 text-emerald-700 [[data-theme=dark]_&]:bg-emerald-500/15 [[data-theme=dark]_&]:text-emerald-300\",\n  rose: \"bg-rose-100 text-rose-700 [[data-theme=dark]_&]:bg-rose-500/15 [[data-theme=dark]_&]:text-rose-300\",\n  indigo: \"bg-indigo-100 text-indigo-700 [[data-theme=dark]_&]:bg-indigo-500/15 [[data-theme=dark]_&]:text-indigo-300\",\n  fuchsia: \"bg-fuchsia-100 text-fuchsia-700 [[data-theme=dark]_&]:bg-fuchsia-500/15 [[data-theme=dark]_&]:text-fuchsia-300\",\n  pink: \"bg-pink-100 text-pink-700 [[data-theme=dark]_&]:bg-pink-500/15 [[data-theme=dark]_&]:text-pink-300\",\n  slate: \"bg-muted text-muted-foreground\",\n};\n\nfunction toggleInSet<T>(set: ReadonlySet<T>, value: T): Set<T> {\n  const next = new Set(set);\n  if (next.has(value)) next.delete(value);\n  else next.add(value);\n  return next;\n}\n\n/**\n * SessionViewer renders a recorded AI coding-agent session (the captain\n * `pkg/ai/history` JSON schema — Claude Code / Codex transcripts) as a vertical\n * action log. Each entry sits on a tone-colored icon disc from the Flanksource\n * \"Agent Action Icons\" set; user prompts/selections are right-aligned like a\n * chat. Tool calls expand to their input and response. The \"3-dot\" menu mirrors\n * `captain history` filtering — toggle density and hide categories, tools or\n * sources.\n */\nexport function SessionViewer({\n  session,\n  className,\n  defaultExpanded = false,\n  showThinking = true,\n  showHeader = true,\n  showMenu = true,\n  defaultDensity,\n  defaultTheme,\n}: SessionViewerProps) {\n  const allEvents = useMemo(() => normalizeSession(session), [session]);\n\n  const pageDensity = useDensityValue();\n  const [densityOverride, setDensityOverride] = useState<Density | undefined>(defaultDensity);\n  const [themeOverride, setThemeOverride] = useState<SessionThemeOverride | undefined>(defaultTheme);\n  const [hiddenCategories, setHiddenCategories] = useState<ReadonlySet<SessionCategory>>(\n    () => new Set(),\n  );\n  const [hiddenTools, setHiddenTools] = useState<ReadonlySet<string>>(() => new Set());\n  const [hiddenSources, setHiddenSources] = useState<ReadonlySet<string>>(() => new Set());\n  // Undefined = follow the `showThinking` prop; the menu toggle sets an override.\n  const [showThinkingOverride, setShowThinkingOverride] = useState<boolean | undefined>(undefined);\n  const effectiveShowThinking = showThinkingOverride ?? showThinking;\n\n  const filters = useMemo(() => collectSessionFilters(allEvents), [allEvents]);\n  const hasThinking = useMemo(() => allEvents.some((e) => e.kind === \"thinking\"), [allEvents]);\n\n  const visibility = { hiddenCategories, hiddenTools, hiddenSources, showThinking: effectiveShowThinking };\n  const events = allEvents.filter((event) => isEventVisible(event, visibility));\n\n  if (allEvents.length === 0) {\n    return (\n      <div\n        className={cn(\n          \"rounded-md border border-dashed border-border p-density-4 text-center text-sm text-muted-foreground\",\n          className,\n        )}\n      >\n        No session activity.\n      </div>\n    );\n  }\n\n  const summary = summarizeSession(allEvents);\n  const effectiveDensity = densityOverride ?? pageDensity;\n  const dataAttrs: Record<string, string> = {\n    ...(densityOverride ? { \"data-density\": densityOverride } : {}),\n    ...(themeOverride ? { \"data-theme\": themeOverride } : {}),\n  };\n\n  return (\n    <div className={cn(\"text-sm\", className)} {...dataAttrs}>\n      <DensityValueProvider density={effectiveDensity}>\n        {(showHeader || showMenu) && (\n          <div className=\"mb-density-3 flex items-center justify-between gap-density-3\">\n            <div className=\"flex flex-wrap items-center gap-x-density-3 gap-y-1 text-xs text-muted-foreground\">\n              {showHeader && summary.model && (\n                <span className=\"inline-flex items-center gap-1 font-medium text-foreground\">\n                  <Icon icon={UiRobotAi} className=\"size-3.5\" />\n                  {summary.model}\n                </span>\n              )}\n              {showHeader && <span>{summary.toolCount} actions</span>}\n              {showHeader && <span>{summary.messageCount} messages</span>}\n            </div>\n            {showMenu && (\n              <SessionViewerMenu\n                density={densityOverride}\n                onDensityChange={setDensityOverride}\n                theme={themeOverride}\n                onThemeChange={setThemeOverride}\n                filters={filters}\n                hiddenCategories={hiddenCategories}\n                hiddenTools={hiddenTools}\n                hiddenSources={hiddenSources}\n                onToggleCategory={(category) =>\n                  setHiddenCategories((set) => toggleInSet(set, category))\n                }\n                onToggleTool={(tool) => setHiddenTools((set) => toggleInSet(set, tool))}\n                onToggleSource={(source) => setHiddenSources((set) => toggleInSet(set, source))}\n                showThinking={effectiveShowThinking}\n                onToggleThinking={() => setShowThinkingOverride(!effectiveShowThinking)}\n                hasThinking={hasThinking}\n              />\n            )}\n          </div>\n        )}\n\n        {events.length === 0 ? (\n          <div className=\"rounded-md border border-dashed border-border p-density-4 text-center text-sm text-muted-foreground\">\n            All actions are hidden by the active filters.\n          </div>\n        ) : (\n          <ol className=\"relative\">\n            {events.map((event, index) => (\n              <SessionRow\n                key={event.id}\n                event={event}\n                last={index === events.length - 1}\n                defaultExpanded={defaultExpanded}\n              />\n            ))}\n          </ol>\n        )}\n      </DensityValueProvider>\n    </div>\n  );\n}\n\nfunction SessionRow({\n  event,\n  last,\n  defaultExpanded,\n}: {\n  event: SessionEvent;\n  last: boolean;\n  defaultExpanded: boolean;\n}) {\n  if (event.kind === \"user\") return <UserRow event={event} />;\n\n  const visual = eventVisual(event);\n  return (\n    <li data-event-kind={event.kind} className=\"relative flex gap-density-3 pb-density-4 last:pb-0\">\n      {!last && <span aria-hidden className=\"absolute bottom-0 left-[10px] top-[22px] w-px bg-border\" />}\n      <span\n        className={cn(\n          \"relative z-[1] flex h-[21px] w-[21px] shrink-0 items-center justify-center rounded-full\",\n          DISC_TONE[visual.tone],\n        )}\n      >\n        <Icon icon={visual.icon} className=\"h-3 w-3\" />\n      </span>\n      <div className=\"min-w-0 flex-1 pt-px\">\n        <EventBody event={event} visual={visual} defaultExpanded={defaultExpanded} />\n      </div>\n    </li>\n  );\n}\n\n// User prompts and selections sit on the right, like a chat composer turn.\nfunction UserRow({ event }: { event: SessionEvent }) {\n  return (\n    <li data-event-kind=\"user\" className=\"relative flex justify-end pb-density-4 last:pb-0\">\n      <div className=\"flex max-w-[85%] items-start gap-density-3\">\n        <div className=\"min-w-0\">\n          <div className=\"mb-0.5 text-right text-xs font-medium text-muted-foreground\">You</div>\n          <div className=\"whitespace-pre-wrap break-words rounded-lg bg-accent px-density-3 py-density-2 text-right leading-relaxed text-accent-foreground\">\n            {event.text}\n          </div>\n        </div>\n        <span\n          className={cn(\n            \"relative z-[1] flex h-[21px] w-[21px] shrink-0 items-center justify-center rounded-full\",\n            DISC_TONE.slate,\n          )}\n        >\n          <Icon icon={UiUserCircle} className=\"h-3 w-3\" />\n        </span>\n      </div>\n    </li>\n  );\n}\n\ninterface EventVisual {\n  icon: StaticIconComponent;\n  tone: SessionTone;\n  label: string;\n}\n\nfunction eventVisual(event: SessionEvent): EventVisual {\n  switch (event.kind) {\n    case \"tool\": {\n      const action = getSessionAction(event.tool ?? \"\");\n      return { icon: action.icon, tone: action.tone, label: action.label };\n    }\n    case \"user\":\n      return { icon: UiUserCircle, tone: \"slate\", label: \"User\" };\n    case \"assistant\":\n      return { icon: UiSparkles, tone: \"indigo\", label: \"Assistant\" };\n    case \"thinking\":\n      return { icon: UiBrain, tone: \"slate\", label: \"Thinking\" };\n    case \"error\":\n      return { icon: UiWarningTriangle, tone: \"rose\", label: \"Error\" };\n  }\n}\n\nfunction EventBody({\n  event,\n  visual,\n  defaultExpanded,\n}: {\n  event: SessionEvent;\n  visual: EventVisual;\n  defaultExpanded: boolean;\n}) {\n  if (event.kind === \"tool\") return <ToolBody event={event} label={visual.label} defaultExpanded={defaultExpanded} />;\n  if (event.kind === \"thinking\") return <ThinkingBody event={event} />;\n  if (event.kind === \"error\") return <ErrorBody event={event} />;\n  return <MessageBody event={event} label={visual.label} />;\n}\n\nfunction ToolBody({\n  event,\n  label,\n  defaultExpanded,\n}: {\n  event: SessionEvent;\n  label: string;\n  defaultExpanded: boolean;\n}) {\n  const summary = summarizeToolInput(event.tool ?? \"\", event.toolInput);\n  const hasDetail = event.toolInput !== undefined || event.toolResponse !== undefined;\n  const [open, setOpen] = useState(defaultExpanded);\n\n  const header = (\n    <>\n      <span className=\"font-medium text-foreground\">{label}</span>\n      {summary && <span className=\"truncate font-mono text-xs text-muted-foreground\">{summary}</span>}\n    </>\n  );\n\n  return (\n    <div className=\"not-prose\">\n      {hasDetail ? (\n        <button\n          type=\"button\"\n          aria-expanded={open}\n          onClick={() => setOpen((value) => !value)}\n          className=\"flex w-full items-center gap-1.5 text-left hover:text-foreground\"\n        >\n          {header}\n          <Icon\n            icon={UiChevronDown}\n            className={cn(\"ml-auto size-3 shrink-0 text-muted-foreground transition-transform\", open && \"rotate-180\")}\n          />\n        </button>\n      ) : (\n        <div className=\"flex items-center gap-1.5\">{header}</div>\n      )}\n\n      {(event.model || event.source) && (\n        <div className=\"mt-0.5 flex gap-density-2 text-[11px] text-muted-foreground\">\n          {event.source && <span>{event.source}</span>}\n          {event.model && <span>{event.model}</span>}\n          {event.reasoningEffort && <span>effort: {event.reasoningEffort}</span>}\n        </div>\n      )}\n\n      {open && hasDetail && (\n        <div className=\"mt-1.5 space-y-1.5\">\n          {event.toolInput !== undefined && (\n            <DetailBlock language=\"json\" source={JSON.stringify(event.toolInput, null, 2)} />\n          )}\n          {event.toolResponse !== undefined && <ResponseBlock response={event.toolResponse} />}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction ResponseBlock({ response }: { response: string }) {\n  const trimmed = response.trim();\n  const isJson = trimmed.startsWith(\"{\") || trimmed.startsWith(\"[\");\n  return <DetailBlock language={isJson ? \"json\" : \"text\"} source={response} />;\n}\n\nfunction DetailBlock({ language, source }: { language: string; source: string }): ReactNode {\n  return (\n    <div className=\"overflow-x-auto text-xs\">\n      <CodeBlock language={language} source={source} />\n    </div>\n  );\n}\n\nfunction MessageBody({ event, label }: { event: SessionEvent; label: string }) {\n  return (\n    <div>\n      <div className=\"mb-0.5 text-xs font-medium text-muted-foreground\">{label}</div>\n      <div className=\"whitespace-pre-wrap break-words leading-relaxed text-foreground\">{event.text}</div>\n    </div>\n  );\n}\n\nfunction ThinkingBody({ event }: { event: SessionEvent }) {\n  const [open, setOpen] = useState(false);\n  return (\n    <div className=\"not-prose\">\n      <button\n        type=\"button\"\n        aria-expanded={open}\n        onClick={() => setOpen((value) => !value)}\n        className=\"flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground\"\n      >\n        <span className=\"italic\">Reasoning</span>\n        <Icon icon={UiChevronDown} className={cn(\"size-3 transition-transform\", open && \"rotate-180\")} />\n      </button>\n      {open && (\n        <div className=\"mt-1 whitespace-pre-wrap break-words border-l-2 border-border pl-density-3 text-xs italic leading-relaxed text-muted-foreground\">\n          {event.text}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction ErrorBody({ event }: { event: SessionEvent }) {\n  return (\n    <div className=\"rounded-md border border-rose-200 bg-rose-50 px-density-3 py-1.5 text-xs text-rose-700 [[data-theme=dark]_&]:border-rose-500/30 [[data-theme=dark]_&]:bg-rose-500/10 [[data-theme=dark]_&]:text-rose-300\">\n      {event.text}\n    </div>\n  );\n}\n"],"names":["useMemo","normalizeSession","useDensityValue","useState","collectSessionFilters","isEventVisible","jsx","cn","summarizeSession","jsxs","DensityValueProvider","Icon","UiRobotAi","SessionViewerMenu","UiUserCircle","getSessionAction","UiSparkles","UiBrain","UiWarningTriangle","summarizeToolInput","Fragment","UiChevronDown","CodeBlock"],"mappings":"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"}
+{"version":3,"file":"SessionViewer.cjs","sources":["../../../src/data/ai/SessionViewer.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"../../lib/utils\";\nimport { Icon } from \"../Icon\";\nimport { useDensityValue, type Density } from \"../../hooks/use-density\";\nimport { DensityValueProvider } from \"../../hooks/density-provider\";\nimport { UiRobotAi } from \"../../icons\";\nimport {\n  getSessionMetadata,\n  normalizeSession,\n  summarizeSession,\n  type SessionMetadataSummary,\n  type SessionEvent,\n  type SessionInput,\n} from \"./SessionViewer.model\";\nimport {\n  collapseWaitRuns,\n  isSessionEventGroup,\n} from \"./SessionViewer.grouping\";\nimport { SessionRow, WaitGroupRow } from \"./SessionViewer.rows\";\nimport { ContextMeter } from \"../chat/ContextMeter\";\nimport { providerIcon } from \"../chat/provider-icons\";\nimport { costTotal, tokenTotal } from \"./session-cost\";\nimport {\n  collectSessionFilters,\n  isEventVisible,\n  type SessionCategory,\n} from \"./session-categories\";\nimport { SessionViewerMenu, type SessionThemeOverride } from \"./SessionViewerMenu\";\nimport { useSessionScroll } from \"./use-session-scroll\";\n\nexport type {\n  SessionEntry,\n  SessionEvent,\n  SessionInput,\n  SessionActionMeta,\n} from \"./SessionViewer.model\";\nexport type { SessionThemeOverride } from \"./SessionViewerMenu\";\n\nexport interface SessionPendingTool {\n  tool: string;\n  input?: Record<string, unknown>;\n  toolCallId?: string;\n  approvalId?: string;\n  sessionId?: string;\n}\n\nexport interface SessionToolDecision {\n  event: SessionEvent;\n  allow: boolean;\n  message?: string;\n  answers?: Record<string, string | string[]>;\n}\n\nexport interface SessionViewerProps {\n  /** A captain session: parsed `SessionEntry[]` or raw log text (JSON / JSONL). */\n  session: SessionInput;\n  className?: string;\n  /** Expand each tool call's input/output by default. Defaults to false. */\n  defaultExpanded?: boolean;\n  /** Render assistant reasoning (\"thinking\") blocks. Defaults to true. */\n  showThinking?: boolean;\n  /** Show the summary header (model + action counts). Defaults to true. */\n  showHeader?: boolean;\n  /** Show the 3-dot menu (density + category/tool/source filters). Defaults to true. */\n  showMenu?: boolean;\n  /** Portal the 3-dot menu into this element instead of rendering it inline in\n   *  the summary header — lets a host place the menu in its own toolbar while the\n   *  filter/density state stays owned by the viewer. Ignored when `showMenu` is\n   *  false; falls back to inline rendering when null/undefined. */\n  menuContainer?: Element | null;\n  /** Initial density override; undefined inherits the page/document density. */\n  defaultDensity?: Density;\n  /** Initial theme override; undefined inherits the page/document `data-theme`. */\n  defaultTheme?: SessionThemeOverride;\n  /** Own an internal scroll container that fills its parent's height: render only\n   *  the newest screenful, stay pinned to the bottom (most recent activity), and\n   *  backfill older rows as the reader scrolls up. Off by default, so inline\n   *  consumers keep rendering the whole log in normal page flow. Requires a\n   *  height-bounded parent. */\n  scrollable?: boolean;\n  /** Rows rendered on first paint in `scrollable` mode. Defaults to 60. */\n  windowSize?: number;\n  /** Rows added each time older content loads in `scrollable` mode. Defaults to 40. */\n  batchSize?: number;\n  /** Show per-row timestamp/source/model/turn/agent metadata. Defaults to false. */\n  showRowMetadata?: boolean;\n  /** Show a per-row raw JSON payload expander when available. Defaults to false. */\n  showRaw?: boolean;\n  pendingTools?: readonly SessionPendingTool[];\n  onPendingToolDecision?: ((decision: SessionToolDecision) => Promise<void> | void) | undefined;\n}\n\nfunction toggleInSet<T>(set: ReadonlySet<T>, value: T): Set<T> {\n  const next = new Set(set);\n  if (next.has(value)) next.delete(value);\n  else next.add(value);\n  return next;\n}\n\n/**\n * SessionViewer renders a recorded AI coding-agent session (the captain\n * `pkg/ai/history` JSON schema — Claude Code / Codex transcripts) as a vertical\n * action log. Each entry sits on a tone-colored icon disc from the Flanksource\n * \"Agent Action Icons\" set; user prompts/selections are right-aligned like a\n * chat. Shell commands render inline as bash blocks and file ops as their\n * cwd-relative path — the icon carries the verb. Tool responses expand behind\n * a chevron, rendered bare (no panel chrome). The \"3-dot\" menu mirrors\n * `captain history` filtering — toggle density and hide categories, tools or\n * sources.\n */\nexport function SessionViewer({\n  session,\n  className,\n  defaultExpanded = false,\n  showThinking = true,\n  showHeader = true,\n  showMenu = true,\n  menuContainer,\n  defaultDensity,\n  defaultTheme,\n  scrollable = false,\n  windowSize = 60,\n  batchSize = 40,\n  showRowMetadata = false,\n  showRaw = false,\n  pendingTools = [],\n  onPendingToolDecision,\n}: SessionViewerProps) {\n  const allEvents = useMemo(\n    () => mergePendingTools(normalizeSession(session), pendingTools),\n    [session, pendingTools],\n  );\n  const displayItems = useMemo(() => collapseWaitRuns(allEvents), [allEvents]);\n  const metadata = useMemo(() => getSessionMetadata(session), [session]);\n\n  const pageDensity = useDensityValue();\n  const [densityOverride, setDensityOverride] = useState<Density | undefined>(defaultDensity);\n  const [themeOverride, setThemeOverride] = useState<SessionThemeOverride | undefined>(defaultTheme);\n  const [hiddenCategories, setHiddenCategories] = useState<ReadonlySet<SessionCategory>>(\n    () => new Set(),\n  );\n  const [hiddenTools, setHiddenTools] = useState<ReadonlySet<string>>(() => new Set());\n  const [hiddenSources, setHiddenSources] = useState<ReadonlySet<string>>(() => new Set());\n  // Undefined = follow the `showThinking` prop; the menu toggle sets an override.\n  const [showThinkingOverride, setShowThinkingOverride] = useState<boolean | undefined>(undefined);\n  const effectiveShowThinking = showThinkingOverride ?? showThinking;\n\n  const filters = useMemo(() => collectSessionFilters(allEvents), [allEvents]);\n  const hasThinking = useMemo(() => allEvents.some((e) => e.kind === \"thinking\"), [allEvents]);\n\n  const visibility = { hiddenCategories, hiddenTools, hiddenSources, showThinking: effectiveShowThinking };\n  const items = displayItems.filter((item) =>\n    isEventVisible(isSessionEventGroup(item) ? item.representative : item, visibility),\n  );\n\n  // Reset the window when the underlying session changes, not on filter toggles —\n  // so hiding a category doesn't yank the reader back to the bottom.\n  const resetKey = `${allEvents.length}:${allEvents[0]?.id ?? \"\"}`;\n  const { scrollRef, contentRef, startIndex } = useSessionScroll({\n    total: items.length,\n    enabled: scrollable,\n    windowSize,\n    batchSize,\n    resetKey,\n  });\n\n  if (allEvents.length === 0) {\n    return (\n      <div\n        className={cn(\n          \"rounded-md border border-dashed border-border p-density-4 text-center text-sm text-muted-foreground\",\n          className,\n        )}\n      >\n        No session activity.\n      </div>\n    );\n  }\n\n  const summary = summarizeSession(allEvents);\n  const effectiveDensity = densityOverride ?? pageDensity;\n  const dataAttrs: Record<string, string> = {\n    ...(densityOverride ? { \"data-density\": densityOverride } : {}),\n    ...(themeOverride ? { \"data-theme\": themeOverride } : {}),\n  };\n\n  const menu = showMenu ? (\n    <SessionViewerMenu\n      density={densityOverride}\n      onDensityChange={setDensityOverride}\n      theme={themeOverride}\n      onThemeChange={setThemeOverride}\n      filters={filters}\n      hiddenCategories={hiddenCategories}\n      hiddenTools={hiddenTools}\n      hiddenSources={hiddenSources}\n      onToggleCategory={(category) =>\n        setHiddenCategories((set) => toggleInSet(set, category))\n      }\n      onToggleTool={(tool) => setHiddenTools((set) => toggleInSet(set, tool))}\n      onToggleSource={(source) => setHiddenSources((set) => toggleInSet(set, source))}\n      showThinking={effectiveShowThinking}\n      onToggleThinking={() => setShowThinkingOverride(!effectiveShowThinking)}\n      hasThinking={hasThinking}\n    />\n  ) : null;\n  // When a host supplies `menuContainer`, the menu is portaled into it (e.g. the\n  // host's own toolbar) and the inline header collapses to just its summary.\n  const inlineMenu = menu && !menuContainer;\n\n  const list =\n    items.length === 0 ? (\n      <div className=\"rounded-md border border-dashed border-border p-density-4 text-center text-sm text-muted-foreground\">\n        All actions are hidden by the active filters.\n      </div>\n    ) : (\n      // In scrollable mode only the newest `startIndex..` slice is mounted; `last`\n      // is measured against the full length so the timeline connector stays right.\n      <ol className=\"relative\">\n        {items.slice(startIndex).map((item, index) => {\n          const last = startIndex + index === items.length - 1;\n          return isSessionEventGroup(item) ? (\n            <WaitGroupRow\n              key={item.id}\n              group={item}\n              last={last}\n              defaultExpanded={defaultExpanded}\n              showRowMetadata={showRowMetadata}\n              showRaw={showRaw}\n              onPendingToolDecision={onPendingToolDecision}\n            />\n          ) : (\n            <SessionRow\n              key={item.id}\n              event={item}\n              last={last}\n              defaultExpanded={defaultExpanded}\n              showRowMetadata={showRowMetadata}\n              showRaw={showRaw}\n              onPendingToolDecision={onPendingToolDecision}\n            />\n          );\n        })}\n      </ol>\n    );\n\n  return (\n    <div className={cn(\"text-sm\", scrollable && \"flex h-full min-h-0 flex-col\", className)} {...dataAttrs}>\n      <DensityValueProvider density={effectiveDensity}>\n        {menu && menuContainer && createPortal(menu, menuContainer)}\n        {(showHeader || inlineMenu) && (\n          <div\n            className={cn(\n              \"flex items-center justify-between gap-density-3\",\n              scrollable\n                ? \"shrink-0 border-b border-border px-density-4 py-density-2 md:px-density-6\"\n                : \"mb-density-3\",\n            )}\n          >\n            <div className=\"flex flex-wrap items-center gap-x-density-3 gap-y-1 text-xs text-muted-foreground\">\n              {showHeader && summary.model && (\n                <span className=\"inline-flex items-center gap-1 font-medium text-foreground\">\n                  <Icon icon={UiRobotAi} className=\"size-3.5\" />\n                  {summary.model}\n                </span>\n              )}\n              {showHeader && <span>{summary.toolCount} actions</span>}\n              {showHeader && <span>{summary.messageCount} messages</span>}\n              {showHeader && metadata && <SessionMetadataBadges metadata={metadata} />}\n            </div>\n            {inlineMenu && menu}\n          </div>\n        )}\n\n        {scrollable ? (\n          <div ref={scrollRef} className=\"min-h-0 flex-1 overflow-y-auto\">\n            <div ref={contentRef} className=\"p-density-4 md:p-density-6\">\n              {list}\n            </div>\n          </div>\n        ) : (\n          list\n        )}\n      </DensityValueProvider>\n    </div>\n  );\n}\n\nfunction mergePendingTools(\n  events: SessionEvent[],\n  pendingTools: readonly SessionPendingTool[],\n): SessionEvent[] {\n  const merged = [...events];\n  for (const [index, pending] of pendingTools.entries()) {\n    const matches = merged.filter((event) =>\n      event.kind === \"tool\" && (\n        (pending.toolCallId && event.toolCallId === pending.toolCallId) ||\n        (pending.approvalId && event.approvalId === pending.approvalId) ||\n        (pending.sessionId && event.sessionId === pending.sessionId && event.tool === pending.tool)\n      ),\n    );\n    const match = matches.length === 1 ? matches[0] : undefined;\n    if (match) {\n      Object.assign(match, {\n        pending: true,\n        toolInput: pending.input ?? match.toolInput,\n        toolCallId: pending.toolCallId ?? match.toolCallId,\n        approvalId: pending.approvalId ?? match.approvalId,\n        sessionId: pending.sessionId ?? match.sessionId,\n      });\n    } else {\n      merged.push({\n        id: `pending-${pending.approvalId ?? pending.toolCallId ?? `${pending.tool}-${index}`}`,\n        kind: \"tool\",\n        tool: pending.tool,\n        ...(pending.input ? { toolInput: pending.input } : {}),\n        ...(pending.toolCallId ? { toolCallId: pending.toolCallId } : {}),\n        ...(pending.approvalId ? { approvalId: pending.approvalId } : {}),\n        ...(pending.sessionId ? { sessionId: pending.sessionId } : {}),\n        pending: true,\n      });\n    }\n  }\n  return merged;\n}\n\nfunction SessionMetadataBadges({ metadata }: { metadata: SessionMetadataSummary }) {\n  const capabilityBadges = [\n    countBadge(\"tool\", metadata.capabilities?.tools),\n    countBadge(\"mcp\", metadata.capabilities?.pendingMcpServers),\n    countBadge(\"agent\", metadata.capabilities?.agents),\n    countBadge(\"skill\", metadata.capabilities?.skills),\n  ].filter(Boolean) as Array<{ key: string; label: string; title?: string }>;\n  // The context window renders as an interactive meter (bar + hover popover);\n  // budget rides in that popover, so it only gets a text badge when there is no\n  // context to attach it to.\n  const badges: Array<{ key: string; label: string; title?: string }> = [\n    ...(metadata.turns?.length ? [{ key: \"turns\", label: countLabel(metadata.turns.length, \"turn\") }] : []),\n    ...capabilityBadges,\n    ...(!metadata.context && metadata.budget\n      ? [{ key: \"budget\", label: budgetLabel(metadata.budget) }]\n      : []),\n    ...(metadata.events?.length ? [{ key: \"events\", label: countLabel(metadata.events.length, \"event\") }] : []),\n  ];\n  const modelIcon = metadata.provider ? providerIcon(metadata.provider) : undefined;\n  if (badges.length === 0 && !metadata.context) return null;\n  return (\n    <>\n      {badges.map((badge) => (\n        <span\n          key={badge.key}\n          title={badge.title}\n          className=\"inline-flex max-w-40 items-center rounded border border-border px-1.5 py-0.5 text-[11px] text-muted-foreground\"\n        >\n          <span className=\"truncate\">{badge.label}</span>\n        </span>\n      ))}\n      {metadata.context && (\n        <ContextMeter\n          mode=\"bar\"\n          usedPercent={100 - metadata.context.freePercent}\n          usedTokens={metadata.context.usedTokens}\n          windowTokens={metadata.context.windowTokens}\n          model={metadata.model}\n          {...(modelIcon ? { modelIcon } : {})}\n          {...(metadata.usage\n            ? {\n                tokens: {\n                  input: metadata.usage.inputTokens,\n                  output: metadata.usage.outputTokens,\n                  reasoning: metadata.usage.reasoningTokens,\n                  cacheRead: metadata.usage.cacheReadTokens,\n                  cacheWrite: metadata.usage.cacheWriteTokens,\n                  total: tokenTotal(metadata.usage),\n                },\n              }\n            : {})}\n          {...(metadata.cost\n            ? {\n                cost: {\n                  input: metadata.cost.inputCost,\n                  output: metadata.cost.outputCost,\n                  reasoning: metadata.cost.reasoningCost,\n                  cacheRead: metadata.cost.cacheReadCost,\n                  cacheWrite: metadata.cost.cacheWriteCost,\n                  total: costTotal(metadata.cost),\n                },\n              }\n            : {})}\n          {...(metadata.budget ? { budget: metadata.budget } : {})}\n        />\n      )}\n    </>\n  );\n}\n\nfunction countBadge(label: string, values: string[] | undefined) {\n  const count = values?.length ?? 0;\n  if (!count) return null;\n  return { key: label, label: countLabel(count, label), title: values?.join(\", \") };\n}\n\nfunction countLabel(count: number, label: string) {\n  if (label === \"mcp\") return `${count} mcp`;\n  return `${count} ${label}${count === 1 ? \"\" : \"s\"}`;\n}\n\nfunction budgetLabel(budget: { used?: number; total?: number; remaining?: number }) {\n  if (budget.total !== undefined && budget.total > 0) {\n    return `budget ${formatUSD(budget.used ?? 0)}/${formatUSD(budget.total)}`;\n  }\n  if (budget.remaining !== undefined) return `budget ${formatUSD(budget.remaining)} left`;\n  if (budget.used !== undefined) return `budget ${formatUSD(budget.used)} used`;\n  return \"budget\";\n}\n\nfunction formatUSD(value: number) {\n  if (value < 1 || !Number.isInteger(value)) return `$${value.toFixed(2)}`;\n  return `$${value.toFixed(0)}`;\n}\n"],"names":["useMemo","normalizeSession","collapseWaitRuns","getSessionMetadata","useDensityValue","useState","collectSessionFilters","isEventVisible","isSessionEventGroup","useSessionScroll","jsx","cn","summarizeSession","SessionViewerMenu","WaitGroupRow","SessionRow","jsxs","DensityValueProvider","createPortal","Icon","UiRobotAi","providerIcon","Fragment","ContextMeter","tokenTotal","costTotal"],"mappings":"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"}