agenttop 0.9.4 → 0.10.1

package/dist/index.js

@@ -19,18 +19,18 @@ import {
   setNickname,
   startMcpServer,
   unarchiveSession
-} from "./chunk-3LEBAMTZ.js";
+} from "./chunk-24HX2MSZ.js";
 
 // src/index.tsx
 import { readFileSync as readFileSync3 } from "fs";
 import { join as join5, dirname as dirname4 } from "path";
 import { fileURLToPath as fileURLToPath3 } from "url";
-import React16 from "react";
+import React17 from "react";
 import { render } from "ink";
 
 // src/ui/App.tsx
-import { useState as useState15, useEffect as useEffect9, useCallback as useCallback6 } from "react";
-import { Box as Box15, Text as Text14, useApp, useStdout as useStdout3 } from "ink";
+import { useState as useState16, useEffect as useEffect9, useCallback as useCallback6 } from "react";
+import { Box as Box16, Text as Text15, useApp, useStdout as useStdout3 } from "ink";
 
 // src/config/themes.ts
 var COLOR_KEYS = [
@@ -694,7 +694,19 @@ var summarizeInput = (call) => {
   }
 };
 var ActivityFeed = React3.memo(
-  ({ events, sessionSlug, sessionId, isActive, focused, height, scrollOffset, filter, merged, mergedSessions }) => {
+  ({
+    events,
+    sessionSlug,
+    sessionId,
+    isActive,
+    focused,
+    height,
+    scrollOffset,
+    filter,
+    merged,
+    mergedSessions,
+    selectedEventIndex
+  }) => {
     const viewportRows = height - 2;
     const totalEvents = events.length;
     const start = Math.max(0, totalEvents - viewportRows - scrollOffset);
@@ -709,6 +721,7 @@ var ActivityFeed = React3.memo(
         slugColorMap.set(s.sessionId, TAG_COLORS[i % TAG_COLORS.length]);
       });
     }
+    const hasSelection = focused && selectedEventIndex !== void 0;
     return /* @__PURE__ */ jsxs3(
       Box3,
       {
@@ -732,30 +745,34 @@ var ActivityFeed = React3.memo(
                 "]"
               ] })
             ] }),
-            focused && canScroll && !isAtBottom && /* @__PURE__ */ jsxs3(Text3, { color: colors.muted, children: [
-              "[",
-              totalEvents - end + viewportRows,
-              "/",
-              totalEvents,
-              "]"
+            /* @__PURE__ */ jsxs3(Box3, { children: [
+              hasSelection && /* @__PURE__ */ jsx3(Text3, { color: colors.muted, children: "enter:detail " }),
+              focused && canScroll && !isAtBottom && /* @__PURE__ */ jsxs3(Text3, { color: colors.muted, children: [
+                "[",
+                totalEvents - end + viewportRows,
+                "/",
+                totalEvents,
+                "]"
+              ] })
             ] })
           ] }),
           visible.length === 0 && /* @__PURE__ */ jsx3(Box3, { paddingX: 1, paddingY: 1, children: /* @__PURE__ */ jsx3(Text3, { color: colors.muted, italic: true, children: sessionSlug || merged ? "Waiting for activity..." : "Select a session" }) }),
           visible.map((event, i) => {
-            const tag = merged ? event.slug.slice(0, 4) : null;
-            const tagColor = merged ? slugColorMap.get(event.sessionId) || colors.muted : void 0;
+            const call = event.call;
+            const globalIndex = start + i;
+            const isSelected = hasSelection && globalIndex === selectedEventIndex;
+            const tag = merged ? call.slug.slice(0, 4) : null;
+            const tagColor = merged ? slugColorMap.get(call.sessionId) || colors.muted : void 0;
             return /* @__PURE__ */ jsxs3(Box3, { paddingX: 1, children: [
               tag && /* @__PURE__ */ jsx3(Text3, { color: tagColor, children: tag.padEnd(5) }),
-              /* @__PURE__ */ jsxs3(Text3, { color: colors.muted, children: [
-                formatTime(event.timestamp),
-                " "
-              ] }),
-              /* @__PURE__ */ jsx3(Text3, { color: getToolColor(event.toolName), bold: true, children: event.toolName.padEnd(8) }),
-              /* @__PURE__ */ jsxs3(Text3, { color: colors.text, children: [
+              /* @__PURE__ */ jsx3(Text3, { color: isSelected ? colors.bright : colors.muted, underline: isSelected, children: formatTime(call.timestamp) }),
+              /* @__PURE__ */ jsx3(Text3, { children: " " }),
+              /* @__PURE__ */ jsx3(Text3, { color: getToolColor(call.toolName), bold: true, underline: isSelected, children: call.toolName.padEnd(8) }),
+              /* @__PURE__ */ jsxs3(Text3, { color: isSelected ? colors.bright : colors.text, underline: isSelected, children: [
                 " ",
-                summarizeInput(event)
+                summarizeInput(call)
               ] })
-            ] }, `${event.timestamp}-${i}`);
+            ] }, `${call.timestamp}-${i}`);
           }),
           focused && canScroll && !isAtTop && visible.length > 0 && /* @__PURE__ */ jsx3(Box3, { paddingX: 1, justifyContent: "flex-end", children: /* @__PURE__ */ jsx3(Text3, { color: colors.muted, children: isAtBottom ? "" : "G:bottom " }) }),
           !merged && sessionId && isActive === false && /* @__PURE__ */ jsxs3(Box3, { paddingX: 1, flexDirection: "column", children: [
@@ -1080,10 +1097,224 @@ var FooterBar = React7.memo(
   ] })
 );
 
-// src/ui/components/SettingsMenu.tsx
-import React8, { useState as useState3, useMemo, useEffect as useEffect2, useRef } from "react";
-import { Box as Box8, Text as Text8, useInput as useInput2, useStdout } from "ink";
+// src/ui/components/ToolCallDetail.tsx
+import React8, { useState as useState3 } from "react";
+import { Box as Box8, Text as Text8, useInput as useInput2 } from "ink";
 import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+var formatTime3 = (ts) => {
+  const d = new Date(ts);
+  return d.toLocaleTimeString("en-GB", { hour12: false });
+};
+var renderBash = (event) => {
+  const lines = [];
+  const cmd = String(event.call.toolInput.command || "");
+  lines.push("$ " + cmd);
+  if (event.result) {
+    lines.push("");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderRead = (event) => {
+  const lines = [];
+  lines.push("file: " + String(event.call.toolInput.file_path || ""));
+  if (event.call.toolInput.offset) lines.push("offset: " + String(event.call.toolInput.offset));
+  if (event.call.toolInput.limit) lines.push("limit: " + String(event.call.toolInput.limit));
+  if (event.result) {
+    lines.push("");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderWrite = (event) => {
+  const lines = [];
+  lines.push("file: " + String(event.call.toolInput.file_path || ""));
+  const content = String(event.call.toolInput.content || "");
+  if (content) {
+    lines.push("");
+    lines.push("--- content ---");
+    lines.push(...content.split("\n"));
+  }
+  if (event.result) {
+    lines.push("");
+    lines.push("--- result ---");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderEdit = (event) => {
+  const lines = [];
+  lines.push("file: " + String(event.call.toolInput.file_path || ""));
+  const oldStr = String(event.call.toolInput.old_string || "");
+  const newStr = String(event.call.toolInput.new_string || "");
+  if (oldStr || newStr) {
+    lines.push("");
+    for (const l of oldStr.split("\n")) {
+      lines.push("- " + l);
+    }
+    lines.push("---");
+    for (const l of newStr.split("\n")) {
+      lines.push("+ " + l);
+    }
+  }
+  if (event.result) {
+    lines.push("");
+    lines.push("--- result ---");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderGrepGlob = (event) => {
+  const lines = [];
+  const pattern = String(event.call.toolInput.pattern || "");
+  const path = String(event.call.toolInput.path || "");
+  lines.push("pattern: " + pattern);
+  if (path) lines.push("path: " + path);
+  if (event.result) {
+    lines.push("");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderTask = (event) => {
+  const lines = [];
+  const desc = String(event.call.toolInput.description || "");
+  const prompt = String(event.call.toolInput.prompt || "");
+  lines.push("description: " + desc);
+  if (prompt) {
+    lines.push("");
+    lines.push("--- prompt ---");
+    lines.push(...prompt.split("\n"));
+  }
+  if (event.result) {
+    lines.push("");
+    lines.push("--- result ---");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderWebFetch = (event) => {
+  const lines = [];
+  lines.push("url: " + String(event.call.toolInput.url || ""));
+  if (event.call.toolInput.prompt) lines.push("prompt: " + String(event.call.toolInput.prompt));
+  if (event.result) {
+    lines.push("");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderWebSearch = (event) => {
+  const lines = [];
+  lines.push("query: " + String(event.call.toolInput.query || ""));
+  if (event.result) {
+    lines.push("");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var renderDefault = (event) => {
+  const lines = [];
+  lines.push("--- input ---");
+  lines.push(JSON.stringify(event.call.toolInput, null, 2));
+  if (event.result) {
+    lines.push("");
+    lines.push("--- result ---");
+    lines.push(...event.result.content.split("\n"));
+  }
+  return lines;
+};
+var getDetailLines = (event) => {
+  switch (event.call.toolName) {
+    case "Bash":
+      return renderBash(event);
+    case "Read":
+      return renderRead(event);
+    case "Write":
+      return renderWrite(event);
+    case "Edit":
+      return renderEdit(event);
+    case "Grep":
+    case "Glob":
+      return renderGrepGlob(event);
+    case "Task":
+      return renderTask(event);
+    case "WebFetch":
+      return renderWebFetch(event);
+    case "WebSearch":
+      return renderWebSearch(event);
+    default:
+      return renderDefault(event);
+  }
+};
+var ToolCallDetail = React8.memo(({ event, focused, height }) => {
+  const [scrollOffset, setScrollOffset] = useState3(0);
+  const contentLines = getDetailLines(event);
+  const viewportRows = height - 4;
+  const maxScroll = Math.max(0, contentLines.length - viewportRows);
+  const start = Math.min(scrollOffset, maxScroll);
+  const visible = contentLines.slice(start, start + viewportRows);
+  useInput2(
+    (input, key) => {
+      if (!focused) return;
+      if (input === "j" || key.downArrow) setScrollOffset((s) => Math.min(s + 1, maxScroll));
+      if (input === "k" || key.upArrow) setScrollOffset((s) => Math.max(s - 1, 0));
+      if (input === "G") setScrollOffset(maxScroll);
+      if (input === "g") setScrollOffset(0);
+    },
+    { isActive: focused }
+  );
+  return /* @__PURE__ */ jsxs8(
+    Box8,
+    {
+      flexDirection: "column",
+      flexGrow: 1,
+      flexShrink: 1,
+      overflow: "hidden",
+      borderStyle: "single",
+      borderColor: focused ? colors.primary : colors.border,
+      children: [
+        /* @__PURE__ */ jsxs8(Box8, { paddingX: 1, justifyContent: "space-between", children: [
+          /* @__PURE__ */ jsxs8(Box8, { children: [
+            /* @__PURE__ */ jsx8(Text8, { color: getToolColor(event.call.toolName), bold: true, children: event.call.toolName }),
+            /* @__PURE__ */ jsxs8(Text8, { color: colors.muted, children: [
+              " ",
+              formatTime3(event.call.timestamp)
+            ] }),
+            /* @__PURE__ */ jsxs8(Text8, { color: colors.muted, children: [
+              " ",
+              event.call.slug
+            ] }),
+            event.result?.isError && /* @__PURE__ */ jsx8(Text8, { color: colors.error, children: " ERROR" })
+          ] }),
+          /* @__PURE__ */ jsx8(Text8, { color: colors.muted, children: "Esc:back j/k:scroll" })
+        ] }),
+        /* @__PURE__ */ jsx8(Box8, { flexDirection: "column", paddingX: 1, children: visible.map((line, i) => {
+          let lineColor = colors.text;
+          if (line.startsWith("- ") && event.call.toolName === "Edit") lineColor = colors.error;
+          else if (line.startsWith("+ ") && event.call.toolName === "Edit") lineColor = colors.secondary;
+          else if (line.startsWith("$ ")) lineColor = colors.bright;
+          else if (line.startsWith("---")) lineColor = colors.muted;
+          else if (event.result?.isError) lineColor = colors.error;
+          return /* @__PURE__ */ jsx8(Text8, { color: lineColor, wrap: "truncate", children: line }, `${start + i}`);
+        }) }),
+        contentLines.length > viewportRows && /* @__PURE__ */ jsx8(Box8, { paddingX: 1, justifyContent: "flex-end", children: /* @__PURE__ */ jsxs8(Text8, { color: colors.muted, children: [
+          "[",
+          start + 1,
+          "-",
+          Math.min(start + viewportRows, contentLines.length),
+          "/",
+          contentLines.length,
+          "]"
+        ] }) })
+      ]
+    }
+  );
+});
+
+// src/ui/components/SettingsMenu.tsx
+import React9, { useState as useState4, useMemo, useEffect as useEffect2, useRef } from "react";
+import { Box as Box9, Text as Text9, useInput as useInput3, useStdout } from "ink";
+import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 var KEYBIND_LABELS = {
   quit: "Quit",
   navUp: "Navigate up",
@@ -1243,13 +1474,13 @@ var buildMenuItems = () => {
 };
 var MENU_ITEMS = buildMenuItems();
 var SELECTABLE_INDICES = MENU_ITEMS.map((item, i) => item.type !== "header" ? i : -1).filter((i) => i >= 0);
-var SettingsMenu = React8.memo(({ config, onClose, onOpenThemeMenu }) => {
+var SettingsMenu = React9.memo(({ config, onClose, onOpenThemeMenu }) => {
   const { stdout } = useStdout();
   const termHeight = stdout?.rows ?? 40;
-  const [localConfig, setLocalConfig] = useState3(() => JSON.parse(JSON.stringify(config)));
-  const [selectablePos, setSelectablePos] = useState3(0);
-  const [rebinding, setRebinding] = useState3(false);
-  const [toast, setToast] = useState3("");
+  const [localConfig, setLocalConfig] = useState4(() => JSON.parse(JSON.stringify(config)));
+  const [selectablePos, setSelectablePos] = useState4(0);
+  const [rebinding, setRebinding] = useState4(false);
+  const [toast, setToast] = useState4("");
   const toastTimer = useRef(null);
   const showToast = (msg) => {
     if (toastTimer.current) clearTimeout(toastTimer.current);
@@ -1267,7 +1498,7 @@ var SettingsMenu = React8.memo(({ config, onClose, onOpenThemeMenu }) => {
     () => Math.max(...MENU_ITEMS.filter((i) => i.type !== "header").map((i) => i.label.length)),
     []
   );
-  useInput2((input, key) => {
+  useInput3((input, key) => {
     if (rebinding) {
       const item = MENU_ITEMS[selectedIndex];
       let newKey;
@@ -1331,8 +1562,8 @@ var SettingsMenu = React8.memo(({ config, onClose, onOpenThemeMenu }) => {
   const scrollStart = Math.max(0, Math.min(menuItemIndex - halfView, MENU_ITEMS.length - contentHeight));
   const visibleItems = MENU_ITEMS.slice(Math.max(0, scrollStart), Math.max(0, scrollStart) + contentHeight);
   const visibleStartIndex = Math.max(0, scrollStart);
-  return /* @__PURE__ */ jsx8(Box8, { flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsxs8(
-    Box8,
+  return /* @__PURE__ */ jsx9(Box9, { flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsxs9(
+    Box9,
     {
       borderStyle: "round",
       borderColor: colors.primary,
@@ -1341,9 +1572,9 @@ var SettingsMenu = React8.memo(({ config, onClose, onOpenThemeMenu }) => {
       paddingY: 1,
       height: termHeight,
       children: [
-        /* @__PURE__ */ jsxs8(Box8, { justifyContent: "space-between", marginBottom: 1, children: [
-          /* @__PURE__ */ jsx8(Text8, { color: colors.header, bold: true, children: "SETTINGS" }),
-          /* @__PURE__ */ jsxs8(Text8, { color: colors.muted, children: [
+        /* @__PURE__ */ jsxs9(Box9, { justifyContent: "space-between", marginBottom: 1, children: [
+          /* @__PURE__ */ jsx9(Text9, { color: colors.header, bold: true, children: "SETTINGS" }),
+          /* @__PURE__ */ jsxs9(Text9, { color: colors.muted, children: [
             "esc to save & close ",
             rebinding ? "| backspace to reset" : ""
           ] })
@@ -1352,7 +1583,7 @@ var SettingsMenu = React8.memo(({ config, onClose, onOpenThemeMenu }) => {
           const realIndex = visibleStartIndex + vi;
           const isSelected = realIndex === selectedIndex;
           if (item.type === "header") {
-            return /* @__PURE__ */ jsx8(Box8, { marginTop: realIndex > 0 ? 1 : 0, children: /* @__PURE__ */ jsxs8(Text8, { color: colors.accent, bold: true, children: [
+            return /* @__PURE__ */ jsx9(Box9, { marginTop: realIndex > 0 ? 1 : 0, children: /* @__PURE__ */ jsxs9(Text9, { color: colors.accent, bold: true, children: [
               "  ",
               item.label
             ] }) }, `h-${item.label}`);
@@ -1363,45 +1594,45 @@ var SettingsMenu = React8.memo(({ config, onClose, onOpenThemeMenu }) => {
           const valueColor = isRebindingThis ? colors.warning : value === "ON" ? colors.secondary : value === "OFF" ? colors.error : colors.bright;
           const isReset = item.key === "resetAllKeybinds";
           const dots = isReset ? "" : ".".repeat(Math.max(2, maxLabelLen - item.label.length + 4)) + " ";
-          return /* @__PURE__ */ jsxs8(Box8, { children: [
-            /* @__PURE__ */ jsxs8(Text8, { color: isSelected ? colors.primary : colors.text, children: [
+          return /* @__PURE__ */ jsxs9(Box9, { children: [
+            /* @__PURE__ */ jsxs9(Text9, { color: isSelected ? colors.primary : colors.text, children: [
               isSelected ? "> " : "  ",
               " ",
               item.label,
               " ",
               dots
             ] }),
-            !isReset && /* @__PURE__ */ jsx8(Text8, { color: valueColor, children: displayValue })
+            !isReset && /* @__PURE__ */ jsx9(Text9, { color: valueColor, children: displayValue })
           ] }, `${item.section}-${item.key}`);
         }),
-        toast && /* @__PURE__ */ jsx8(Box8, { marginTop: 1, paddingX: 2, children: /* @__PURE__ */ jsx8(Text8, { color: colors.warning, children: toast }) })
+        toast && /* @__PURE__ */ jsx9(Box9, { marginTop: 1, paddingX: 2, children: /* @__PURE__ */ jsx9(Text9, { color: colors.warning, children: toast }) })
       ]
     }
   ) });
 });
 
 // src/ui/components/ThemeMenu.tsx
-import React10, { useState as useState5, useCallback, useRef as useRef2, useEffect as useEffect3 } from "react";
-import { Box as Box10, Text as Text10, useInput as useInput4, useStdout as useStdout2 } from "ink";
+import React11, { useState as useState6, useCallback, useRef as useRef2, useEffect as useEffect3 } from "react";
+import { Box as Box11, Text as Text11, useInput as useInput5, useStdout as useStdout2 } from "ink";
 
 // src/ui/components/ThemeEditor.tsx
-import React9, { useState as useState4 } from "react";
-import { Box as Box9, Text as Text9, useInput as useInput3 } from "ink";
-import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
+import React10, { useState as useState5 } from "react";
+import { Box as Box10, Text as Text10, useInput as useInput4 } from "ink";
+import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 var ALL_KEYS = [
   ...COLOR_KEYS.map((key) => ({ group: "colors", key })),
   ...TOOL_COLOR_KEYS.map((key) => ({ group: "toolColors", key }))
 ];
 var isValidHex = (v) => /^#[0-9A-Fa-f]{6}$/.test(v);
-var ThemeEditor = React9.memo(({ theme, onSave, onCancel }) => {
-  const [editColors, setEditColors] = useState4({ ...theme.colors });
-  const [editToolColors, setEditToolColors] = useState4({ ...theme.toolColors });
-  const [selectedIdx, setSelectedIdx] = useState4(0);
-  const [editing, setEditing] = useState4(false);
-  const [inputValue, setInputValue] = useState4("");
+var ThemeEditor = React10.memo(({ theme, onSave, onCancel }) => {
+  const [editColors, setEditColors] = useState5({ ...theme.colors });
+  const [editToolColors, setEditToolColors] = useState5({ ...theme.toolColors });
+  const [selectedIdx, setSelectedIdx] = useState5(0);
+  const [editing, setEditing] = useState5(false);
+  const [inputValue, setInputValue] = useState5("");
   const currentTarget = ALL_KEYS[selectedIdx];
   const getCurrentValue = (t) => t.group === "colors" ? editColors[t.key] : editToolColors[t.key];
-  useInput3((input, key) => {
+  useInput4((input, key) => {
     if (editing) {
       if (key.escape) {
         setEditing(false);
@@ -1451,15 +1682,15 @@ var ThemeEditor = React9.memo(({ theme, onSave, onCancel }) => {
       onSave({ ...theme, colors: editColors, toolColors: editToolColors });
     }
   });
-  return /* @__PURE__ */ jsxs9(Box9, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-    /* @__PURE__ */ jsxs9(Box9, { justifyContent: "space-between", marginBottom: 1, children: [
-      /* @__PURE__ */ jsxs9(Text9, { color: colors.header, bold: true, children: [
+  return /* @__PURE__ */ jsxs10(Box10, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsxs10(Box10, { justifyContent: "space-between", marginBottom: 1, children: [
+      /* @__PURE__ */ jsxs10(Text10, { color: colors.header, bold: true, children: [
         "EDIT THEME: ",
         theme.name
       ] }),
-      /* @__PURE__ */ jsx9(Text9, { color: colors.muted, children: "enter:edit s:save esc:cancel" })
+      /* @__PURE__ */ jsx10(Text10, { color: colors.muted, children: "enter:edit s:save esc:cancel" })
     ] }),
-    /* @__PURE__ */ jsx9(Box9, { marginBottom: 1, children: /* @__PURE__ */ jsxs9(Text9, { color: colors.accent, bold: true, children: [
+    /* @__PURE__ */ jsx10(Box10, { marginBottom: 1, children: /* @__PURE__ */ jsxs10(Text10, { color: colors.accent, bold: true, children: [
       " ",
       "COLORS"
     ] }) }),
@@ -1467,20 +1698,20 @@ var ThemeEditor = React9.memo(({ theme, onSave, onCancel }) => {
       const isSelected = selectedIdx === i;
       const value = editColors[k];
       const isEditingThis = editing && isSelected;
-      return /* @__PURE__ */ jsxs9(Box9, { children: [
-        /* @__PURE__ */ jsxs9(Text9, { color: isSelected ? colors.primary : colors.text, children: [
+      return /* @__PURE__ */ jsxs10(Box10, { children: [
+        /* @__PURE__ */ jsxs10(Text10, { color: isSelected ? colors.primary : colors.text, children: [
           isSelected ? "> " : "  ",
           " ",
           k.padEnd(12)
         ] }),
-        /* @__PURE__ */ jsx9(Text9, { color: value, children: isEditingThis ? inputValue + "_" : value }),
-        /* @__PURE__ */ jsxs9(Text9, { color: value, children: [
+        /* @__PURE__ */ jsx10(Text10, { color: value, children: isEditingThis ? inputValue + "_" : value }),
+        /* @__PURE__ */ jsxs10(Text10, { color: value, children: [
           " ",
           "\u2588\u2588"
         ] })
       ] }, k);
     }),
-    /* @__PURE__ */ jsx9(Box9, { marginTop: 1, marginBottom: 1, children: /* @__PURE__ */ jsxs9(Text9, { color: colors.accent, bold: true, children: [
+    /* @__PURE__ */ jsx10(Box10, { marginTop: 1, marginBottom: 1, children: /* @__PURE__ */ jsxs10(Text10, { color: colors.accent, bold: true, children: [
       " ",
       "TOOL COLORS"
     ] }) }),
@@ -1489,14 +1720,14 @@ var ThemeEditor = React9.memo(({ theme, onSave, onCancel }) => {
       const isSelected = selectedIdx === realIdx;
       const value = editToolColors[k];
       const isEditingThis = editing && isSelected;
-      return /* @__PURE__ */ jsxs9(Box9, { children: [
-        /* @__PURE__ */ jsxs9(Text9, { color: isSelected ? colors.primary : colors.text, children: [
+      return /* @__PURE__ */ jsxs10(Box10, { children: [
+        /* @__PURE__ */ jsxs10(Text10, { color: isSelected ? colors.primary : colors.text, children: [
           isSelected ? "> " : "  ",
           " ",
           k.padEnd(12)
         ] }),
-        /* @__PURE__ */ jsx9(Text9, { color: value, children: isEditingThis ? inputValue + "_" : value }),
-        /* @__PURE__ */ jsxs9(Text9, { color: value, children: [
+        /* @__PURE__ */ jsx10(Text10, { color: value, children: isEditingThis ? inputValue + "_" : value }),
+        /* @__PURE__ */ jsxs10(Text10, { color: value, children: [
           " ",
           "\u2588\u2588"
         ] })
@@ -1506,17 +1737,17 @@ var ThemeEditor = React9.memo(({ theme, onSave, onCancel }) => {
 });
 
 // src/ui/components/ThemeMenu.tsx
-import { jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
-var ThemeMenu = React10.memo(({ config, onClose }) => {
+import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
+var ThemeMenu = React11.memo(({ config, onClose }) => {
   const { stdout } = useStdout2();
   const termHeight = stdout?.rows ?? 40;
-  const [localConfig, setLocalConfig] = useState5(() => JSON.parse(JSON.stringify(config)));
-  const [selectedIdx, setSelectedIdx] = useState5(0);
-  const [view, setView] = useState5("list");
-  const [editingTheme, setEditingTheme] = useState5(null);
-  const [nameInput, setNameInput] = useState5("");
-  const [namingAction, setNamingAction] = useState5("copy");
-  const [toast, setToast] = useState5("");
+  const [localConfig, setLocalConfig] = useState6(() => JSON.parse(JSON.stringify(config)));
+  const [selectedIdx, setSelectedIdx] = useState6(0);
+  const [view, setView] = useState6("list");
+  const [editingTheme, setEditingTheme] = useState6(null);
+  const [nameInput, setNameInput] = useState6("");
+  const [namingAction, setNamingAction] = useState6("copy");
+  const [toast, setToast] = useState6("");
   const toastTimer = useRef2(null);
   const showToast = (msg) => {
     if (toastTimer.current) clearTimeout(toastTimer.current);
@@ -1544,7 +1775,7 @@ var ThemeMenu = React10.memo(({ config, onClose }) => {
     },
     [previewTheme]
   );
-  useInput4((input, key) => {
+  useInput5((input, key) => {
     if (view === "naming") {
       if (key.escape) {
         setView("list");
@@ -1681,15 +1912,15 @@ var ThemeMenu = React10.memo(({ config, onClose }) => {
     setEditingTheme(null);
   }, [localConfig]);
   if (view === "editor" && editingTheme) {
-    return /* @__PURE__ */ jsx10(Box10, { flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsx10(Box10, { borderStyle: "round", borderColor: colors.primary, flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsx10(ThemeEditor, { theme: editingTheme, onSave: handleEditorSave, onCancel: handleEditorCancel }) }) });
+    return /* @__PURE__ */ jsx11(Box11, { flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsx11(Box11, { borderStyle: "round", borderColor: colors.primary, flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsx11(ThemeEditor, { theme: editingTheme, onSave: handleEditorSave, onCancel: handleEditorCancel }) }) });
   }
   const contentHeight = termHeight - 8;
   const halfView = Math.floor(contentHeight / 2);
   const scrollStart = Math.max(0, Math.min(selectedIdx - halfView, themes.length - contentHeight));
   const visibleThemes = themes.slice(Math.max(0, scrollStart), Math.max(0, scrollStart) + contentHeight);
   const visibleStartIdx = Math.max(0, scrollStart);
-  return /* @__PURE__ */ jsx10(Box10, { flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsxs10(
-    Box10,
+  return /* @__PURE__ */ jsx11(Box11, { flexDirection: "column", height: termHeight, children: /* @__PURE__ */ jsxs11(
+    Box11,
     {
       borderStyle: "round",
       borderColor: colors.primary,
@@ -1698,16 +1929,16 @@ var ThemeMenu = React10.memo(({ config, onClose }) => {
       paddingY: 1,
       height: termHeight,
       children: [
-        /* @__PURE__ */ jsxs10(Box10, { justifyContent: "space-between", marginBottom: 1, children: [
-          /* @__PURE__ */ jsx10(Text10, { color: colors.header, bold: true, children: "THEMES" }),
-          /* @__PURE__ */ jsx10(Text10, { color: colors.muted, children: "enter:apply c:copy e:edit r:rename d:delete esc:back" })
+        /* @__PURE__ */ jsxs11(Box11, { justifyContent: "space-between", marginBottom: 1, children: [
+          /* @__PURE__ */ jsx11(Text11, { color: colors.header, bold: true, children: "THEMES" }),
+          /* @__PURE__ */ jsx11(Text11, { color: colors.muted, children: "enter:apply c:copy e:edit r:rename d:delete esc:back" })
         ] }),
-        view === "naming" && /* @__PURE__ */ jsxs10(Box10, { marginBottom: 1, children: [
-          /* @__PURE__ */ jsxs10(Text10, { color: colors.warning, children: [
+        view === "naming" && /* @__PURE__ */ jsxs11(Box11, { marginBottom: 1, children: [
+          /* @__PURE__ */ jsxs11(Text11, { color: colors.warning, children: [
             namingAction === "copy" ? "New name" : "Rename to",
             ": "
           ] }),
-          /* @__PURE__ */ jsxs10(Text10, { color: colors.bright, children: [
+          /* @__PURE__ */ jsxs11(Text11, { color: colors.bright, children: [
             nameInput,
             "_"
           ] })
@@ -1716,38 +1947,38 @@ var ThemeMenu = React10.memo(({ config, onClose }) => {
           const realIdx = visibleStartIdx + vi;
           const isSelected = realIdx === selectedIdx;
           const isActive = theme.name === localConfig.theme;
-          return /* @__PURE__ */ jsxs10(Box10, { children: [
-            /* @__PURE__ */ jsxs10(Text10, { color: isSelected ? colors.primary : colors.text, children: [
+          return /* @__PURE__ */ jsxs11(Box11, { children: [
+            /* @__PURE__ */ jsxs11(Text11, { color: isSelected ? colors.primary : colors.text, children: [
               isSelected ? "> " : "  ",
               isActive ? "* " : "  ",
               theme.name
             ] }),
-            /* @__PURE__ */ jsx10(Text10, { color: colors.muted, children: theme.builtin ? " (built-in)" : " (custom)" }),
-            /* @__PURE__ */ jsx10(Text10, { children: " " }),
-            /* @__PURE__ */ jsx10(Text10, { color: theme.colors.primary, children: "\u2588" }),
-            /* @__PURE__ */ jsx10(Text10, { color: theme.colors.secondary, children: "\u2588" }),
-            /* @__PURE__ */ jsx10(Text10, { color: theme.colors.accent, children: "\u2588" }),
-            /* @__PURE__ */ jsx10(Text10, { color: theme.colors.warning, children: "\u2588" }),
-            /* @__PURE__ */ jsx10(Text10, { color: theme.colors.error, children: "\u2588" })
+            /* @__PURE__ */ jsx11(Text11, { color: colors.muted, children: theme.builtin ? " (built-in)" : " (custom)" }),
+            /* @__PURE__ */ jsx11(Text11, { children: " " }),
+            /* @__PURE__ */ jsx11(Text11, { color: theme.colors.primary, children: "\u2588" }),
+            /* @__PURE__ */ jsx11(Text11, { color: theme.colors.secondary, children: "\u2588" }),
+            /* @__PURE__ */ jsx11(Text11, { color: theme.colors.accent, children: "\u2588" }),
+            /* @__PURE__ */ jsx11(Text11, { color: theme.colors.warning, children: "\u2588" }),
+            /* @__PURE__ */ jsx11(Text11, { color: theme.colors.error, children: "\u2588" })
           ] }, theme.name);
         }),
-        toast && /* @__PURE__ */ jsx10(Box10, { marginTop: 1, paddingX: 2, children: /* @__PURE__ */ jsx10(Text10, { color: colors.warning, children: toast }) })
+        toast && /* @__PURE__ */ jsx11(Box11, { marginTop: 1, paddingX: 2, children: /* @__PURE__ */ jsx11(Text11, { color: colors.warning, children: toast }) })
       ]
     }
   ) });
 });
 
 // src/ui/components/ThemePickerModal.tsx
-import React11, { useState as useState6, useEffect as useEffect4 } from "react";
-import { Box as Box11, Text as Text11, useInput as useInput5 } from "ink";
-import { jsx as jsx11, jsxs as jsxs11 } from "react/jsx-runtime";
-var ThemePickerModal = React11.memo(({ onSelect, onSkip, onDismiss }) => {
-  const [selectedIndex, setSelectedIndex] = useState6(0);
+import React12, { useState as useState7, useEffect as useEffect4 } from "react";
+import { Box as Box12, Text as Text12, useInput as useInput6 } from "ink";
+import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+var ThemePickerModal = React12.memo(({ onSelect, onSkip, onDismiss }) => {
+  const [selectedIndex, setSelectedIndex] = useState7(0);
   const themes = BUILTIN_THEMES;
   useEffect4(() => {
     applyTheme(themes[selectedIndex]);
   }, [selectedIndex]);
-  useInput5((input, key) => {
+  useInput6((input, key) => {
     if (key.upArrow) setSelectedIndex((i) => Math.max(0, i - 1));
     if (key.downArrow) setSelectedIndex((i) => Math.min(themes.length - 1, i + 1));
     if (key.return) onSelect(themes[selectedIndex].name);
@@ -1756,33 +1987,33 @@ var ThemePickerModal = React11.memo(({ onSelect, onSkip, onDismiss }) => {
   });
   const renderSwatch = (theme) => {
     const c = theme.colors;
-    return /* @__PURE__ */ jsxs11(Text11, { children: [
-      /* @__PURE__ */ jsx11(Text11, { color: c.primary, children: "\u2588" }),
-      /* @__PURE__ */ jsx11(Text11, { color: c.secondary, children: "\u2588" }),
-      /* @__PURE__ */ jsx11(Text11, { color: c.accent, children: "\u2588" }),
-      /* @__PURE__ */ jsx11(Text11, { color: c.warning, children: "\u2588" }),
-      /* @__PURE__ */ jsx11(Text11, { color: c.error, children: "\u2588" })
+    return /* @__PURE__ */ jsxs12(Text12, { children: [
+      /* @__PURE__ */ jsx12(Text12, { color: c.primary, children: "\u2588" }),
+      /* @__PURE__ */ jsx12(Text12, { color: c.secondary, children: "\u2588" }),
+      /* @__PURE__ */ jsx12(Text12, { color: c.accent, children: "\u2588" }),
+      /* @__PURE__ */ jsx12(Text12, { color: c.warning, children: "\u2588" }),
+      /* @__PURE__ */ jsx12(Text12, { color: c.error, children: "\u2588" })
     ] });
   };
-  return /* @__PURE__ */ jsx11(Box11, { flexDirection: "column", paddingX: 4, paddingY: 1, children: /* @__PURE__ */ jsxs11(Box11, { borderStyle: "round", borderColor: colors.primary, flexDirection: "column", paddingX: 3, paddingY: 1, children: [
-    /* @__PURE__ */ jsx11(Box11, { marginBottom: 1, children: /* @__PURE__ */ jsx11(Text11, { color: colors.header, bold: true, children: "Choose a theme" }) }),
-    /* @__PURE__ */ jsx11(Box11, { marginBottom: 1, children: /* @__PURE__ */ jsx11(Text11, { color: colors.text, children: "Select a theme to get started. You can change this later in settings (s)." }) }),
-    themes.map((theme, i) => /* @__PURE__ */ jsxs11(Box11, { children: [
-      /* @__PURE__ */ jsx11(Text11, { color: i === selectedIndex ? colors.primary : colors.muted, children: i === selectedIndex ? "> " : "  " }),
+  return /* @__PURE__ */ jsx12(Box12, { flexDirection: "column", paddingX: 4, paddingY: 1, children: /* @__PURE__ */ jsxs12(Box12, { borderStyle: "round", borderColor: colors.primary, flexDirection: "column", paddingX: 3, paddingY: 1, children: [
+    /* @__PURE__ */ jsx12(Box12, { marginBottom: 1, children: /* @__PURE__ */ jsx12(Text12, { color: colors.header, bold: true, children: "Choose a theme" }) }),
+    /* @__PURE__ */ jsx12(Box12, { marginBottom: 1, children: /* @__PURE__ */ jsx12(Text12, { color: colors.text, children: "Select a theme to get started. You can change this later in settings (s)." }) }),
+    themes.map((theme, i) => /* @__PURE__ */ jsxs12(Box12, { children: [
+      /* @__PURE__ */ jsx12(Text12, { color: i === selectedIndex ? colors.primary : colors.muted, children: i === selectedIndex ? "> " : "  " }),
       renderSwatch(theme),
-      /* @__PURE__ */ jsxs11(Text11, { color: i === selectedIndex ? colors.bright : colors.text, children: [
+      /* @__PURE__ */ jsxs12(Text12, { color: i === selectedIndex ? colors.bright : colors.text, children: [
         " ",
         theme.name
       ] })
     ] }, theme.name)),
-    /* @__PURE__ */ jsx11(Box11, { marginTop: 1, flexDirection: "column", children: /* @__PURE__ */ jsx11(Text11, { color: colors.muted, children: "Enter = select | n = not now | d = don't ask again" }) })
+    /* @__PURE__ */ jsx12(Box12, { marginTop: 1, flexDirection: "column", children: /* @__PURE__ */ jsx12(Text12, { color: colors.muted, children: "Enter = select | n = not now | d = don't ask again" }) })
   ] }) });
 });
 
 // src/ui/components/GuidedTour.tsx
-import React12, { useState as useState7 } from "react";
-import { Box as Box12, Text as Text12, useInput as useInput6 } from "ink";
-import { jsx as jsx12, jsxs as jsxs12 } from "react/jsx-runtime";
+import React13, { useState as useState8 } from "react";
+import { Box as Box13, Text as Text13, useInput as useInput7 } from "ink";
+import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
 var STEPS = [
   {
     title: "Session list",
@@ -1813,11 +2044,11 @@ var STEPS = [
     body: "Press s to open settings. Customise keybindings, manage themes, and configure updates."
   }
 ];
-var GuidedTour = React12.memo(({ onComplete, onSkip }) => {
-  const [stepIndex, setStepIndex] = useState7(0);
+var GuidedTour = React13.memo(({ onComplete, onSkip }) => {
+  const [stepIndex, setStepIndex] = useState8(0);
   const step = STEPS[stepIndex];
   const isLast = stepIndex === STEPS.length - 1;
-  useInput6((input, key) => {
+  useInput7((input, key) => {
     if (key.return || key.rightArrow) {
       if (isLast) onComplete();
       else setStepIndex((i) => i + 1);
@@ -1825,17 +2056,17 @@ var GuidedTour = React12.memo(({ onComplete, onSkip }) => {
     if (key.leftArrow && stepIndex > 0) setStepIndex((i) => i - 1);
     if (input === "q" || key.escape) onSkip();
   });
-  return /* @__PURE__ */ jsx12(Box12, { flexDirection: "column", paddingX: 4, paddingY: 1, children: /* @__PURE__ */ jsxs12(Box12, { borderStyle: "round", borderColor: colors.primary, flexDirection: "column", paddingX: 3, paddingY: 1, children: [
-    /* @__PURE__ */ jsx12(Box12, { marginBottom: 1, children: /* @__PURE__ */ jsxs12(Text12, { color: colors.header, bold: true, children: [
+  return /* @__PURE__ */ jsx13(Box13, { flexDirection: "column", paddingX: 4, paddingY: 1, children: /* @__PURE__ */ jsxs13(Box13, { borderStyle: "round", borderColor: colors.primary, flexDirection: "column", paddingX: 3, paddingY: 1, children: [
+    /* @__PURE__ */ jsx13(Box13, { marginBottom: 1, children: /* @__PURE__ */ jsxs13(Text13, { color: colors.header, bold: true, children: [
       "Quick tour (",
       stepIndex + 1,
       "/",
       STEPS.length,
       ")"
     ] }) }),
-    /* @__PURE__ */ jsx12(Box12, { marginBottom: 1, children: /* @__PURE__ */ jsx12(Text12, { color: colors.bright, bold: true, children: step.title }) }),
-    /* @__PURE__ */ jsx12(Box12, { marginBottom: 1, children: /* @__PURE__ */ jsx12(Text12, { color: colors.text, children: step.body }) }),
-    /* @__PURE__ */ jsxs12(Text12, { color: colors.muted, children: [
+    /* @__PURE__ */ jsx13(Box13, { marginBottom: 1, children: /* @__PURE__ */ jsx13(Text13, { color: colors.bright, bold: true, children: step.title }) }),
+    /* @__PURE__ */ jsx13(Box13, { marginBottom: 1, children: /* @__PURE__ */ jsx13(Text13, { color: colors.text, children: step.body }) }),
+    /* @__PURE__ */ jsxs13(Text13, { color: colors.muted, children: [
       isLast ? "Enter = finish" : "Enter/\u2192 = next",
       " | ",
       stepIndex > 0 ? "\u2190 = back | " : "",
@@ -1845,19 +2076,19 @@ var GuidedTour = React12.memo(({ onComplete, onSkip }) => {
 });
 
 // src/ui/components/ConfirmModal.tsx
-import React13 from "react";
-import { Box as Box13, Text as Text13, useInput as useInput7 } from "ink";
-import { jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
-var ConfirmModal = React13.memo(({ title, message, onConfirm, onCancel }) => {
-  useInput7((input, key) => {
+import React14 from "react";
+import { Box as Box14, Text as Text14, useInput as useInput8 } from "ink";
+import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
+var ConfirmModal = React14.memo(({ title, message, onConfirm, onCancel }) => {
+  useInput8((input, key) => {
     if (input === "y" || input === "Y") {
       onConfirm();
     } else if (input === "n" || input === "N" || key.escape) {
       onCancel();
     }
   });
-  return /* @__PURE__ */ jsxs13(
-    Box13,
+  return /* @__PURE__ */ jsxs14(
+    Box14,
     {
       borderStyle: "round",
       borderColor: colors.warning,
@@ -1866,19 +2097,19 @@ var ConfirmModal = React13.memo(({ title, message, onConfirm, onCancel }) => {
       paddingY: 1,
       alignSelf: "center",
       children: [
-        /* @__PURE__ */ jsx13(Text13, { color: colors.warning, bold: true, children: title }),
-        /* @__PURE__ */ jsx13(Text13, { color: colors.text, children: message }),
-        /* @__PURE__ */ jsx13(Box13, { marginTop: 1, children: /* @__PURE__ */ jsx13(Text13, { color: colors.muted, children: "[y] confirm [n/esc] cancel" }) })
+        /* @__PURE__ */ jsx14(Text14, { color: colors.warning, bold: true, children: title }),
+        /* @__PURE__ */ jsx14(Text14, { color: colors.text, children: message }),
+        /* @__PURE__ */ jsx14(Box14, { marginTop: 1, children: /* @__PURE__ */ jsx14(Text14, { color: colors.muted, children: "[y] confirm [n/esc] cancel" }) })
       ]
     }
   );
 });
 
 // src/ui/components/SplitPanel.tsx
-import React14 from "react";
-import { Box as Box14 } from "ink";
-import { jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
-var SplitPanel = React14.memo(
+import React15 from "react";
+import { Box as Box15 } from "ink";
+import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+var SplitPanel = React15.memo(
   ({
     activePanel,
     leftSession,
@@ -1893,7 +2124,7 @@ var SplitPanel = React14.memo(
     rightShowDetail,
     height
   }) => {
-    const left = leftShowDetail && leftSession ? /* @__PURE__ */ jsx14(SessionDetail, { session: leftSession, focused: activePanel === "left", height }) : /* @__PURE__ */ jsx14(
+    const left = leftShowDetail && leftSession ? /* @__PURE__ */ jsx15(SessionDetail, { session: leftSession, focused: activePanel === "left", height }) : /* @__PURE__ */ jsx15(
       ActivityFeed,
       {
         events: leftEvents,
@@ -1906,7 +2137,7 @@ var SplitPanel = React14.memo(
         filter: leftFilter || void 0
       }
     );
-    const right = rightShowDetail && rightSession ? /* @__PURE__ */ jsx14(SessionDetail, { session: rightSession, focused: activePanel === "right", height }) : /* @__PURE__ */ jsx14(
+    const right = rightShowDetail && rightSession ? /* @__PURE__ */ jsx15(SessionDetail, { session: rightSession, focused: activePanel === "right", height }) : /* @__PURE__ */ jsx15(
       ActivityFeed,
       {
         events: rightEvents,
@@ -1919,9 +2150,9 @@ var SplitPanel = React14.memo(
         filter: rightFilter || void 0
       }
     );
-    return /* @__PURE__ */ jsxs14(Box14, { flexDirection: "row", flexGrow: 1, children: [
-      /* @__PURE__ */ jsx14(
-        Box14,
+    return /* @__PURE__ */ jsxs15(Box15, { flexDirection: "row", flexGrow: 1, children: [
+      /* @__PURE__ */ jsx15(
+        Box15,
         {
           flexGrow: 1,
           borderStyle: "single",
@@ -1939,7 +2170,7 @@ var SplitPanel = React14.memo(
 );
 
 // src/ui/hooks/useSessions.ts
-import { useState as useState8, useEffect as useEffect5, useCallback as useCallback2, useRef as useRef3, useMemo as useMemo2 } from "react";
+import { useState as useState9, useEffect as useEffect5, useCallback as useCallback2, useRef as useRef3, useMemo as useMemo2 } from "react";
 
 // src/discovery/sessionsAsync.ts
 import { readdir, stat as stat2 } from "fs/promises";
@@ -2424,9 +2655,9 @@ var enrichAndFilter = (found, usageOverrides, filter, archivedIds, viewingArchiv
   return enriched;
 };
 var useSessions = (allUsers, filter, archivedIds, viewingArchive) => {
-  const [sessions2, setSessions] = useState8([]);
-  const [selectedIndex, setSelectedIndex] = useState8(0);
-  const [expandedKeys, setExpandedKeys] = useState8(/* @__PURE__ */ new Set());
+  const [sessions2, setSessions] = useState9([]);
+  const [selectedIndex, setSelectedIndex] = useState9(0);
+  const [expandedKeys, setExpandedKeys] = useState9(/* @__PURE__ */ new Set());
   const usageOverrides = useRef3(/* @__PURE__ */ new Map());
   const refresh = useCallback2(() => {
     const found = getCachedSessions();
@@ -2502,16 +2733,18 @@ var useSessions = (allUsers, filter, archivedIds, viewingArchive) => {
 };
 
 // src/ui/hooks/useActivityStream.ts
-import { useState as useState9, useEffect as useEffect6, useRef as useRef4 } from "react";
+import { useState as useState10, useEffect as useEffect6, useRef as useRef4, useMemo as useMemo3 } from "react";
 var MAX_EVENTS = 200;
 var useActivityStream = (session, allUsers) => {
-  const [events, setEvents] = useState9([]);
+  const [calls, setCalls] = useState10([]);
+  const [results, setResults] = useState10([]);
   const watcherRef = useRef4(null);
   const sessions2 = session === null ? [] : Array.isArray(session) ? session : [session];
   const sessionKey = sessions2.map((s) => s.sessionId).sort().join(",");
   const sessionIdSet = new Set(sessions2.map((s) => s.sessionId));
   useEffect6(() => {
-    setEvents([]);
+    setCalls([]);
+    setResults([]);
     if (sessions2.length === 0) return;
     let cancelled = false;
     const loadExisting = async () => {
@@ -2520,25 +2753,32 @@ var useActivityStream = (session, allUsers) => {
       const allFiles = sessions2.flatMap((s) => s.outputFiles);
       const seen = /* @__PURE__ */ new Set();
       const existingCalls = [];
+      const existingResults = [];
       for (const file of allFiles) {
         if (cancelled) return;
         if (seen.has(file)) continue;
         seen.add(file);
-        if (cancelled) return;
-        const calls = await tempWatcher.readExistingAsync(file);
-        existingCalls.push(...calls);
+        const { calls: c, results: r } = await tempWatcher.readExistingWithResultsAsync(file);
+        existingCalls.push(...c);
+        existingResults.push(...r);
       }
       if (cancelled) return;
       existingCalls.sort((a, b) => a.timestamp - b.timestamp);
-      setEvents(existingCalls.slice(-MAX_EVENTS));
+      setCalls(existingCalls.slice(-MAX_EVENTS));
+      setResults(existingResults);
     };
     loadExisting();
-    const handler = (calls) => {
-      const matched = calls.filter((c) => sessionIdSet.has(c.sessionId));
+    const callHandler = (newCalls) => {
+      const matched = newCalls.filter((c) => sessionIdSet.has(c.sessionId));
       if (matched.length === 0) return;
-      setEvents((prev) => [...prev, ...matched].slice(-MAX_EVENTS));
+      setCalls((prev) => [...prev, ...matched].slice(-MAX_EVENTS));
     };
-    const watcher = new Watcher(handler, allUsers);
+    const resultHandler = (newResults) => {
+      const matched = newResults.filter((r) => sessionIdSet.has(r.sessionId));
+      if (matched.length === 0) return;
+      setResults((prev) => [...prev, ...matched]);
+    };
+    const watcher = new Watcher(callHandler, allUsers, void 0, void 0, resultHandler);
     watcherRef.current = watcher;
     watcher.start();
     return () => {
@@ -2547,22 +2787,31 @@ var useActivityStream = (session, allUsers) => {
       watcherRef.current = null;
     };
   }, [sessionKey, allUsers]);
-  return events;
+  return useMemo3(() => {
+    const resultMap = /* @__PURE__ */ new Map();
+    for (const r of results) {
+      resultMap.set(r.toolUseId, r);
+    }
+    return calls.map((call) => ({
+      call,
+      result: call.toolUseId ? resultMap.get(call.toolUseId) : void 0
+    }));
+  }, [calls, results]);
 };
 
 // src/ui/hooks/useFilteredEvents.ts
-import { useMemo as useMemo3 } from "react";
+import { useMemo as useMemo4 } from "react";
 var applyFilter = (events, filter) => {
   if (!filter) return events;
   const lower = filter.toLowerCase();
   return events.filter(
-    (e) => e.toolName.toLowerCase().includes(lower) || JSON.stringify(e.toolInput).toLowerCase().includes(lower)
+    (e) => e.call.toolName.toLowerCase().includes(lower) || JSON.stringify(e.call.toolInput).toLowerCase().includes(lower)
   );
 };
-var useFilteredEvents = (rawEvents, filter) => useMemo3(() => applyFilter(rawEvents, filter), [rawEvents, filter]);
+var useFilteredEvents = (rawEvents, filter) => useMemo4(() => applyFilter(rawEvents, filter), [rawEvents, filter]);
 
 // src/ui/hooks/useAlerts.ts
-import { useState as useState10, useEffect as useEffect7, useRef as useRef5 } from "react";
+import { useState as useState11, useEffect as useEffect7, useRef as useRef5 } from "react";
 
 // src/notifications.ts
 import { exec as exec2 } from "child_process";
@@ -2630,7 +2879,7 @@ var AlertLogger = class {
 // src/ui/hooks/useAlerts.ts
 var MAX_ALERTS = 100;
 var useAlerts = (enabled, alertLevel, allUsers, config) => {
-  const [alerts, setAlerts] = useState10([]);
+  const [alerts, setAlerts] = useState11([]);
   const engineRef = useRef5(new SecurityEngine(alertLevel));
   const watcherRef = useRef5(null);
   const loggerRef = useRef5(null);
@@ -2670,10 +2919,10 @@ var useAlerts = (enabled, alertLevel, allUsers, config) => {
 };
 
 // src/ui/hooks/useTextInput.ts
-import { useState as useState11, useCallback as useCallback3 } from "react";
+import { useState as useState12, useCallback as useCallback3 } from "react";
 var useTextInput = (onConfirm, onCancel) => {
-  const [value, setValue] = useState11("");
-  const [isActive, setIsActive] = useState11(false);
+  const [value, setValue] = useState12("");
+  const [isActive, setIsActive] = useState12(false);
   const start = useCallback3((initial = "") => {
     setValue(initial);
     setIsActive(true);
@@ -2723,7 +2972,7 @@ var useTextInput = (onConfirm, onCancel) => {
 };
 
 // src/ui/hooks/useKeyHandler.ts
-import { useInput as useInput8 } from "ink";
+import { useInput as useInput9 } from "ink";
 var matchKey = (binding, input, key) => {
   if (binding === "tab") return Boolean(key.tab);
   if (binding === "shift+tab") return Boolean(key.shift && key.tab);
@@ -2732,7 +2981,7 @@ var matchKey = (binding, input, key) => {
 };
 var useKeyHandler = (deps) => {
   const d = deps;
-  useInput8((input, key) => {
+  useInput9((input, key) => {
     if (d.showSetup || d.showSettings || d.confirmAction) return;
     if (d.inputMode === "nickname") {
       d.nicknameInput.handleInput(input, key);
@@ -2755,6 +3004,10 @@ var useKeyHandler = (deps) => {
       d.exit();
       return;
     }
+    if (d.showEventDetail) {
+      if (key.escape || key.return || key.leftArrow) d.setShowEventDetail(false);
+      return;
+    }
     if (d.showDetail && !d.splitMode) {
       if (key.escape || key.return || key.leftArrow) d.setShowDetail(false);
       return;
@@ -2929,10 +3182,21 @@ var useKeyHandler = (deps) => {
       if (matchKey(d.kb.navUp, input, key) || key.upArrow) d.selectPrev();
     }
     if (d.activePanel === "activity") {
-      if (matchKey(d.kb.navUp, input, key) || key.upArrow) d.setActivityScroll((s) => Math.min(s + 1, d.maxScroll));
-      if (matchKey(d.kb.navDown, input, key) || key.downArrow) d.setActivityScroll((s) => Math.max(s - 1, 0));
-      if (matchKey(d.kb.scrollBottom, input, key)) d.setActivityScroll(0);
-      if (matchKey(d.kb.scrollTop, input, key)) d.setActivityScroll(d.maxScroll);
+      if (matchKey(d.kb.navDown, input, key) || key.downArrow) {
+        d.setSelectedEventIndex((i) => Math.min(i + 1, d.activityEventCount - 1));
+      }
+      if (matchKey(d.kb.navUp, input, key) || key.upArrow) {
+        d.setSelectedEventIndex((i) => Math.max(i - 1, 0));
+      }
+      if (matchKey(d.kb.scrollBottom, input, key)) {
+        d.setSelectedEventIndex(d.activityEventCount - 1);
+      }
+      if (matchKey(d.kb.scrollTop, input, key)) {
+        d.setSelectedEventIndex(0);
+      }
+      if (matchKey(d.kb.detail, input, key) && d.activityEventCount > 0) {
+        d.setShowEventDetail(true);
+      }
     }
     if (d.activePanel === "left") {
       if (matchKey(d.kb.navUp, input, key) || key.upArrow) d.setLeftScroll((s) => Math.min(s + 1, d.leftMaxScroll));
@@ -2950,9 +3214,9 @@ var useKeyHandler = (deps) => {
 };
 
 // src/ui/hooks/useUpdateChecker.ts
-import { useState as useState12, useEffect as useEffect8 } from "react";
+import { useState as useState13, useEffect as useEffect8 } from "react";
 var useUpdateChecker = (disabled, checkOnLaunch, checkInterval) => {
-  const [updateInfo, setUpdateInfo] = useState12(null);
+  const [updateInfo, setUpdateInfo] = useState13(null);
   useEffect8(() => {
     if (disabled || !checkOnLaunch) return;
     let cancelled = false;
@@ -2973,7 +3237,7 @@ var useUpdateChecker = (disabled, checkOnLaunch, checkInterval) => {
 };
 
 // src/ui/hooks/useSetupFlow.ts
-import { useState as useState13, useCallback as useCallback4 } from "react";
+import { useState as useState14, useCallback as useCallback4 } from "react";
 
 // src/hooks/installer.ts
 import { existsSync, readFileSync, writeFileSync, copyFileSync, mkdirSync as mkdirSync2, chmodSync } from "fs";
@@ -3093,12 +3357,12 @@ var installMcpConfig = () => {
 
 // src/ui/hooks/useSetupFlow.ts
 var useSetupFlow = (initialConfig, firstRun) => {
-  const [liveConfig, setLiveConfig] = useState13(initialConfig);
-  const [showSetup, setShowSetup] = useState13(firstRun);
-  const [showThemePicker, setShowThemePicker] = useState13(false);
-  const [showTour, setShowTour] = useState13(false);
-  const [showSettings, setShowSettings] = useState13(false);
-  const [showThemeMenu, setShowThemeMenu] = useState13(false);
+  const [liveConfig, setLiveConfig] = useState14(initialConfig);
+  const [showSetup, setShowSetup] = useState14(firstRun);
+  const [showThemePicker, setShowThemePicker] = useState14(false);
+  const [showTour, setShowTour] = useState14(false);
+  const [showSettings, setShowSettings] = useState14(false);
+  const [showThemeMenu, setShowThemeMenu] = useState14(false);
   const handleSettingsClose = useCallback4((c) => {
     setLiveConfig(c);
     saveConfig(c);
@@ -3189,17 +3453,17 @@ var useSetupFlow = (initialConfig, firstRun) => {
 };
 
 // src/ui/hooks/useSplitPanel.ts
-import { useState as useState14, useCallback as useCallback5 } from "react";
+import { useState as useState15, useCallback as useCallback5 } from "react";
 var useSplitPanel = () => {
-  const [splitMode, setSplitMode] = useState14(false);
-  const [leftSession, setLeftSession] = useState14(null);
-  const [rightSession, setRightSession] = useState14(null);
-  const [leftScroll, setLeftScroll] = useState14(0);
-  const [rightScroll, setRightScroll] = useState14(0);
-  const [leftFilter, setLeftFilter] = useState14("");
-  const [rightFilter, setRightFilter] = useState14("");
-  const [leftShowDetail, setLeftShowDetail] = useState14(false);
-  const [rightShowDetail, setRightShowDetail] = useState14(false);
+  const [splitMode, setSplitMode] = useState15(false);
+  const [leftSession, setLeftSession] = useState15(null);
+  const [rightSession, setRightSession] = useState15(null);
+  const [leftScroll, setLeftScroll] = useState15(0);
+  const [rightScroll, setRightScroll] = useState15(0);
+  const [leftFilter, setLeftFilter] = useState15("");
+  const [rightFilter, setRightFilter] = useState15("");
+  const [leftShowDetail, setLeftShowDetail] = useState15(false);
+  const [rightShowDetail, setRightShowDetail] = useState15(false);
   const clearSplitState = useCallback5(() => {
     setSplitMode(false);
     setLeftSession(null);
@@ -3265,7 +3529,7 @@ var useSplitPanel = () => {
 };
 
 // src/ui/App.tsx
-import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
 var App = ({ options, config: initialConfig, version, firstRun }) => {
   const { exit } = useApp();
   const { stdout } = useStdout3();
@@ -3273,19 +3537,21 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
   const setup = useSetupFlow(initialConfig, firstRun);
   const split = useSplitPanel();
   const kb = setup.liveConfig.keybindings;
-  const [activePanel, setActivePanel] = useState15("sessions");
-  const [activityScroll, setActivityScroll] = useState15(0);
-  const [inputMode, setInputMode] = useState15("normal");
-  const [filter, setFilter] = useState15("");
-  const [activityFilter, setActivityFilter] = useState15("");
-  const [updateStatus, setUpdateStatus] = useState15("");
-  const [showDetail, setShowDetail] = useState15(false);
-  const [viewingArchive, setViewingArchive] = useState15(false);
-  const [confirmAction, setConfirmAction] = useState15(
+  const [activePanel, setActivePanel] = useState16("sessions");
+  const [activityScroll, setActivityScroll] = useState16(0);
+  const [inputMode, setInputMode] = useState16("normal");
+  const [filter, setFilter] = useState16("");
+  const [activityFilter, setActivityFilter] = useState16("");
+  const [updateStatus, setUpdateStatus] = useState16("");
+  const [showDetail, setShowDetail] = useState16(false);
+  const [viewingArchive, setViewingArchive] = useState16(false);
+  const [confirmAction, setConfirmAction] = useState16(
     null
   );
-  const [archivedIds, setArchivedIds] = useState15(() => new Set(Object.keys(getArchived())));
-  const [sidebarWidth, setSidebarWidth] = useState15(() => initialConfig.sidebarWidth ?? 30);
+  const [archivedIds, setArchivedIds] = useState16(() => new Set(Object.keys(getArchived())));
+  const [sidebarWidth, setSidebarWidth] = useState16(() => initialConfig.sidebarWidth ?? 30);
+  const [selectedEventIndex, setSelectedEventIndex] = useState16(0);
+  const [showEventDetail, setShowEventDetail] = useState16(false);
   const refreshArchived = useCallback6(() => setArchivedIds(new Set(Object.keys(getArchived()))), []);
   const persistSidebarWidth = useCallback6((v) => {
     setSidebarWidth((prev) => {
@@ -3357,7 +3623,26 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
   }, []);
   useEffect9(() => {
     setActivityScroll(0);
+    setSelectedEventIndex(0);
+    setShowEventDetail(false);
   }, [selectedSession?.sessionId, selectedGroup?.key]);
+  useEffect9(() => {
+    const totalEvents = events.length;
+    const vRows = termHeight - 3 - (options.noSecurity ? 0 : 6) - 1 - (inputMode !== "normal" ? 1 : 0) - 2;
+    if (vRows <= 0 || totalEvents === 0) return;
+    const start = Math.max(0, totalEvents - vRows - activityScroll);
+    const end = start + vRows;
+    if (selectedEventIndex < start) {
+      setActivityScroll(totalEvents - vRows - selectedEventIndex);
+    } else if (selectedEventIndex >= end) {
+      setActivityScroll(totalEvents - vRows - (selectedEventIndex - vRows + 1));
+    }
+  }, [selectedEventIndex, events.length]);
+  useEffect9(() => {
+    if (events.length > 0 && selectedEventIndex >= events.length) {
+      setSelectedEventIndex(events.length - 1);
+    }
+  }, [events.length]);
   const alertHeight = options.noSecurity ? 0 : 6;
   const mainHeight = termHeight - 3 - alertHeight - 1 - (inputMode !== "normal" ? 1 : 0);
   const viewportRows = mainHeight - 2;
@@ -3383,6 +3668,7 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
     showSetup: setup.showSetup,
     showSettings: setup.showSettings || setup.showThemeMenu || setup.showThemePicker || setup.showTour,
     showDetail,
+    showEventDetail,
     leftShowDetail: split.leftShowDetail,
     rightShowDetail: split.rightShowDetail,
     confirmAction,
@@ -3403,6 +3689,8 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
     maxScroll: Math.max(0, events.length - viewportRows),
     leftMaxScroll: Math.max(0, leftEvents.length - viewportRows),
     rightMaxScroll: Math.max(0, rightEvents.length - viewportRows),
+    activityEventCount: events.length,
+    selectedEventIndex,
     exit,
     selectNext,
     selectPrev,
@@ -3428,6 +3716,8 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
     setLeftScroll: split.setLeftScroll,
     setRightScroll: split.setRightScroll,
     setActivityScroll,
+    setSelectedEventIndex,
+    setShowEventDetail,
     setConfirmAction,
     setUpdateStatus,
     setSidebarWidth: persistSidebarWidth,
@@ -3489,10 +3779,10 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
       setup.setShowSetup(false);
       return null;
     }
-    return /* @__PURE__ */ jsx15(SetupModal, { steps, onComplete: setup.handleSetupComplete });
+    return /* @__PURE__ */ jsx16(SetupModal, { steps, onComplete: setup.handleSetupComplete });
   }
   if (setup.showThemePicker)
-    return /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx16(
       ThemePickerModal,
       {
         onSelect: setup.handleThemePickerSelect,
@@ -3500,10 +3790,10 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
         onDismiss: setup.handleThemePickerDismiss
       }
     );
-  if (setup.showTour) return /* @__PURE__ */ jsx15(GuidedTour, { onComplete: setup.handleTourComplete, onSkip: setup.handleTourSkip });
-  if (setup.showThemeMenu) return /* @__PURE__ */ jsx15(ThemeMenu, { config: setup.liveConfig, onClose: setup.handleThemeMenuClose });
+  if (setup.showTour) return /* @__PURE__ */ jsx16(GuidedTour, { onComplete: setup.handleTourComplete, onSkip: setup.handleTourSkip });
+  if (setup.showThemeMenu) return /* @__PURE__ */ jsx16(ThemeMenu, { config: setup.liveConfig, onClose: setup.handleThemeMenuClose });
   if (setup.showSettings)
-    return /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx16(
       SettingsMenu,
       {
         config: setup.liveConfig,
@@ -3512,7 +3802,7 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
       }
     );
   if (confirmAction) {
-    return /* @__PURE__ */ jsx15(Box15, { flexDirection: "column", height: termHeight, justifyContent: "center", alignItems: "center", children: /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx16(Box16, { flexDirection: "column", height: termHeight, justifyContent: "center", alignItems: "center", children: /* @__PURE__ */ jsx16(
       ConfirmModal,
       {
         title: confirmAction.title,
@@ -3524,7 +3814,8 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
   }
   const activitySlug = selectedGroup ? selectedGroup.key : selectedSession?.slug ?? null;
   const isMerged = selectedGroup !== null;
-  const rightPanel = split.splitMode ? /* @__PURE__ */ jsx15(
+  const selectedEvent = events[selectedEventIndex];
+  const rightPanel = split.splitMode ? /* @__PURE__ */ jsx16(
     SplitPanel,
     {
       activePanel,
@@ -3540,7 +3831,7 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
       rightShowDetail: split.rightShowDetail,
       height: mainHeight
     }
-  ) : showDetail && selectedSession ? /* @__PURE__ */ jsx15(SessionDetail, { session: selectedSession, focused: activePanel === "activity", height: mainHeight }) : /* @__PURE__ */ jsx15(
+  ) : showEventDetail && selectedEvent ? /* @__PURE__ */ jsx16(ToolCallDetail, { event: selectedEvent, focused: activePanel === "activity", height: mainHeight }) : showDetail && selectedSession ? /* @__PURE__ */ jsx16(SessionDetail, { session: selectedSession, focused: activePanel === "activity", height: mainHeight }) : /* @__PURE__ */ jsx16(
     ActivityFeed,
     {
       events,
@@ -3552,13 +3843,14 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
       scrollOffset: activityScroll,
       filter: activityFilter || void 0,
       merged: isMerged,
-      mergedSessions: selectedGroup?.sessions
+      mergedSessions: selectedGroup?.sessions,
+      selectedEventIndex
     }
   );
-  return /* @__PURE__ */ jsxs15(Box15, { flexDirection: "column", height: termHeight, children: [
-    /* @__PURE__ */ jsx15(StatusBar, { sessionCount: sessions2.length, alertCount: alerts.length, version, updateInfo }),
-    /* @__PURE__ */ jsxs15(Box15, { flexGrow: 1, height: mainHeight, children: [
-      /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsxs16(Box16, { flexDirection: "column", height: termHeight, children: [
+    /* @__PURE__ */ jsx16(StatusBar, { sessionCount: sessions2.length, alertCount: alerts.length, version, updateInfo }),
+    /* @__PURE__ */ jsxs16(Box16, { flexGrow: 1, height: mainHeight, children: [
+      /* @__PURE__ */ jsx16(
         SessionList,
         {
           visibleItems,
@@ -3573,19 +3865,19 @@ var App = ({ options, config: initialConfig, version, firstRun }) => {
       ),
       rightPanel
     ] }),
-    !options.noSecurity && /* @__PURE__ */ jsx15(AlertBar, { alerts }),
-    inputMode === "nickname" && /* @__PURE__ */ jsxs15(Box15, { paddingX: 1, children: [
-      /* @__PURE__ */ jsx15(Text14, { color: colors.primary, children: "nickname: " }),
-      /* @__PURE__ */ jsx15(Text14, { color: colors.bright, children: nicknameInput.value }),
-      /* @__PURE__ */ jsx15(Text14, { color: colors.muted, children: "_" })
+    !options.noSecurity && /* @__PURE__ */ jsx16(AlertBar, { alerts }),
+    inputMode === "nickname" && /* @__PURE__ */ jsxs16(Box16, { paddingX: 1, children: [
+      /* @__PURE__ */ jsx16(Text15, { color: colors.primary, children: "nickname: " }),
+      /* @__PURE__ */ jsx16(Text15, { color: colors.bright, children: nicknameInput.value }),
+      /* @__PURE__ */ jsx16(Text15, { color: colors.muted, children: "_" })
     ] }),
-    inputMode === "filter" && /* @__PURE__ */ jsxs15(Box15, { paddingX: 1, children: [
-      /* @__PURE__ */ jsx15(Text14, { color: colors.muted, children: activePanel === "sessions" ? "sessions" : activePanel === "left" ? "left" : activePanel === "right" ? "right" : "activity" }),
-      /* @__PURE__ */ jsx15(Text14, { color: colors.primary, children: "/" }),
-      /* @__PURE__ */ jsx15(Text14, { color: colors.bright, children: filterInput.value }),
-      /* @__PURE__ */ jsx15(Text14, { color: colors.muted, children: "_" })
+    inputMode === "filter" && /* @__PURE__ */ jsxs16(Box16, { paddingX: 1, children: [
+      /* @__PURE__ */ jsx16(Text15, { color: colors.muted, children: activePanel === "sessions" ? "sessions" : activePanel === "left" ? "left" : activePanel === "right" ? "right" : "activity" }),
+      /* @__PURE__ */ jsx16(Text15, { color: colors.primary, children: "/" }),
+      /* @__PURE__ */ jsx16(Text15, { color: colors.bright, children: filterInput.value }),
+      /* @__PURE__ */ jsx16(Text15, { color: colors.muted, children: "_" })
     ] }),
-    inputMode === "normal" && /* @__PURE__ */ jsx15(
+    inputMode === "normal" && /* @__PURE__ */ jsx16(
       FooterBar,
       {
         keybindings: kb,
@@ -3831,7 +4123,7 @@ var main = () => {
   if (options.noUpdates) config.updates.checkOnLaunch = false;
   if (options.noSecurity) config.security.enabled = false;
   if (firstRun) saveConfig(config);
-  render(React16.createElement(App, { options, config, version: VERSION, firstRun }));
+  render(React17.createElement(App, { options, config, version: VERSION, firstRun }));
 };
 main();
 //# sourceMappingURL=index.js.map