@wrongstack/webui 0.256.0 → 0.257.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -888,6 +888,8 @@ var useUIStore = create4()(
888
888
  dockSection: null,
889
889
  fleetMonitorOpen: false,
890
890
  agentsMonitorOpen: false,
891
+ inspectorOpen: false,
892
+ inspectorTab: "fleet",
891
893
  selectActivity: (activity) => set({ activeActivity: activity }),
892
894
  toggleSidebar: () => set((state) => ({ sidebarOpen: !state.sidebarOpen })),
893
895
  setSidebarOpen: (open) => set({ sidebarOpen: open }),
@@ -935,20 +937,30 @@ var useUIStore = create4()(
935
937
  setDockSection: (section) => set({ dockSection: section }),
936
938
  toggleDockSection: (section) => set((s) => ({ dockSection: s.dockSection === section ? null : section })),
937
939
  setFleetMonitorOpen: (open) => set({ fleetMonitorOpen: open }),
938
- setAgentsMonitorOpen: (open) => set({ agentsMonitorOpen: open })
940
+ setAgentsMonitorOpen: (open) => set({ agentsMonitorOpen: open }),
941
+ setInspectorOpen: (open) => set({ inspectorOpen: open }),
942
+ setInspectorTab: (tab) => set({ inspectorTab: tab }),
943
+ toggleInspector: () => set((s) => ({ inspectorOpen: !s.inspectorOpen }))
939
944
  }),
940
945
  {
941
946
  name: "wrongstack-ui",
942
- version: 1,
947
+ version: 2,
943
948
  // v0 → v1: 'context'/'sessions' activities were removed and the
944
949
  // sidebar width bounds changed — coerce persisted values so a stale
945
950
  // localStorage entry can't select a panel that no longer exists.
946
- migrate: (persisted) => {
951
+ // v1 → v2: the modal FleetDrawer/AgentsDrawer were replaced by a
952
+ // single docked InspectorPanel; drop the stale drawer booleans so
953
+ // they can't force the (removed) fields back into state.
954
+ migrate: (persisted, version) => {
947
955
  const p = persisted ?? {};
948
956
  p.activeActivity = coerceActivity(p.activeActivity);
949
957
  if (typeof p.sidebarWidth === "number") {
950
958
  p.sidebarWidth = Math.max(SIDEBAR_MIN_WIDTH, Math.min(SIDEBAR_MAX_WIDTH, p.sidebarWidth));
951
959
  }
960
+ if (version < 2) {
961
+ delete p.fleetDrawerOpen;
962
+ delete p.agentsDrawerOpen;
963
+ }
952
964
  return p;
953
965
  },
954
966
  partialize: (s) => ({
@@ -961,7 +973,9 @@ var useUIStore = create4()(
961
973
  favoriteSessionIds: s.favoriteSessionIds,
962
974
  sessionNicknames: s.sessionNicknames,
963
975
  fileExplorerWidth: s.fileExplorerWidth,
964
- refineEnabled: s.refineEnabled
976
+ refineEnabled: s.refineEnabled,
977
+ inspectorOpen: s.inspectorOpen,
978
+ inspectorTab: s.inspectorTab
965
979
  })
966
980
  }
967
981
  )
@@ -2916,7 +2930,7 @@ function useWebSocket() {
2916
2930
  }
2917
2931
 
2918
2932
  // src/App.tsx
2919
- import { useEffect as useEffect44 } from "react";
2933
+ import { useEffect as useEffect45 } from "react";
2920
2934
 
2921
2935
  // src/components/ActivityBar.tsx
2922
2936
  import {
@@ -3105,8 +3119,16 @@ function ActivityBar() {
3105
3119
  {
3106
3120
  icon: /* @__PURE__ */ jsx3(LayoutGrid, { size: 16 }),
3107
3121
  label: "Fleet Monitor (Ctrl+Shift+M)",
3108
- active: useUIStore.getState().fleetMonitorOpen,
3109
- onClick: () => useUIStore.getState().setFleetMonitorOpen(!useUIStore.getState().fleetMonitorOpen)
3122
+ active: useUIStore.getState().inspectorOpen && useUIStore.getState().inspectorTab === "fleet",
3123
+ onClick: () => {
3124
+ const ui = useUIStore.getState();
3125
+ if (ui.inspectorOpen && ui.inspectorTab === "fleet") {
3126
+ ui.setInspectorOpen(false);
3127
+ } else {
3128
+ ui.setInspectorTab("fleet");
3129
+ ui.setInspectorOpen(true);
3130
+ }
3131
+ }
3110
3132
  }
3111
3133
  ),
3112
3134
  /* @__PURE__ */ jsx3(
@@ -3114,8 +3136,16 @@ function ActivityBar() {
3114
3136
  {
3115
3137
  icon: /* @__PURE__ */ jsx3(ActivityIconSvg, { size: 16 }),
3116
3138
  label: "Agents Monitor (Ctrl+Shift+A)",
3117
- active: useUIStore.getState().agentsMonitorOpen,
3118
- onClick: () => useUIStore.getState().setAgentsMonitorOpen(!useUIStore.getState().agentsMonitorOpen)
3139
+ active: useUIStore.getState().inspectorOpen && useUIStore.getState().inspectorTab === "agents",
3140
+ onClick: () => {
3141
+ const ui = useUIStore.getState();
3142
+ if (ui.inspectorOpen && ui.inspectorTab === "agents") {
3143
+ ui.setInspectorOpen(false);
3144
+ } else {
3145
+ ui.setInspectorTab("agents");
3146
+ ui.setInspectorOpen(true);
3147
+ }
3148
+ }
3119
3149
  }
3120
3150
  )
3121
3151
  ] }),
@@ -5029,7 +5059,7 @@ import {
5029
5059
  Terminal as Terminal4,
5030
5060
  Zap as Zap5
5031
5061
  } from "lucide-react";
5032
- import { memo as memo5, useCallback as useCallback10, useEffect as useEffect18, useMemo as useMemo8, useRef as useRef14, useState as useState24 } from "react";
5062
+ import { memo as memo5, useCallback as useCallback10, useEffect as useEffect19, useMemo as useMemo7, useRef as useRef14, useState as useState25 } from "react";
5033
5063
  import { VList } from "virtua";
5034
5064
 
5035
5065
  // src/components/AutonomyPicker.tsx
@@ -7744,7 +7774,7 @@ import {
7744
7774
  User,
7745
7775
  XCircle as XCircle5
7746
7776
  } from "lucide-react";
7747
- import { memo as memo3, useState as useState18 } from "react";
7777
+ import { memo as memo3, useState as useState19 } from "react";
7748
7778
  import ReactMarkdown from "react-markdown";
7749
7779
  import remarkGfm from "remark-gfm";
7750
7780
 
@@ -8096,10 +8126,11 @@ function JsonResult({
8096
8126
  }
8097
8127
 
8098
8128
  // src/components/NextStepsBar.tsx
8099
- import { ArrowRight as ArrowRight2, Lightbulb, MousePointerClick } from "lucide-react";
8100
- import { useMemo as useMemo5 } from "react";
8129
+ import { ArrowRight as ArrowRight2, Lightbulb, MousePointerClick, Timer as Timer2 } from "lucide-react";
8130
+ import { useEffect as useEffect14, useState as useState14 } from "react";
8101
8131
  import { jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
8102
- var NEXT_STEPS_RE = /💡\s*Next steps?\s*\n+((?:\d+\.\s+.+\n?)+)/i;
8132
+ var NEXT_STEPS_RE = /💡\s*Next steps?\s*\n+((?:\d+\.\s+.+(?:\s+auto="true")?\n?)+)/i;
8133
+ var ITEM_RE = /^(\d+)\.\s+(.+?)(?:\s+auto="true")?$/;
8103
8134
  function parseNextSteps(content) {
8104
8135
  const match = NEXT_STEPS_RE.exec(content);
8105
8136
  if (!match?.[1]) return [];
@@ -8107,9 +8138,11 @@ function parseNextSteps(content) {
8107
8138
  const lines = block.split("\n").filter(Boolean);
8108
8139
  const steps = [];
8109
8140
  for (const line of lines) {
8110
- const m = /^(\d+)\.\s+(.+)$/.exec(line.trim());
8141
+ const m = ITEM_RE.exec(line.trim());
8111
8142
  if (m) {
8112
- steps.push({ index: Number.parseInt(m[1], 10), text: m[2].trim() });
8143
+ const text = m[2].trim();
8144
+ const hasAuto = line.trim().endsWith('auto="true"');
8145
+ steps.push({ index: Number.parseInt(m[1], 10), text, auto: hasAuto });
8113
8146
  }
8114
8147
  }
8115
8148
  return steps.slice(0, 6);
@@ -8125,42 +8158,100 @@ function fillInput(text) {
8125
8158
  ta.dispatchEvent(new Event("input", { bubbles: true }));
8126
8159
  ta.focus();
8127
8160
  }
8161
+ function AutoCountdown({
8162
+ delayMs,
8163
+ onComplete
8164
+ }) {
8165
+ const [remaining, setRemaining] = useState14(Math.ceil(delayMs / 1e3));
8166
+ useEffect14(() => {
8167
+ if (remaining <= 0) {
8168
+ onComplete();
8169
+ return;
8170
+ }
8171
+ const timer = setTimeout(() => setRemaining((r) => r - 1), 1e3);
8172
+ return () => clearTimeout(timer);
8173
+ }, [remaining, onComplete]);
8174
+ return /* @__PURE__ */ jsxs21("span", { className: "flex items-center gap-1 text-xs text-primary font-medium", children: [
8175
+ /* @__PURE__ */ jsx23(Timer2, { className: "h-3 w-3" }),
8176
+ remaining,
8177
+ "s"
8178
+ ] });
8179
+ }
8128
8180
  function NextStepsBar({
8129
- steps
8181
+ steps,
8182
+ yoloMode = false,
8183
+ autoMode = false,
8184
+ autoDelayMs = 3e4,
8185
+ onAutoSubmit
8130
8186
  }) {
8131
8187
  if (steps.length === 0) return null;
8188
+ const showAutoCountdown = yoloMode && autoMode;
8189
+ const autoStep = showAutoCountdown ? steps.find((s) => s.auto) : void 0;
8132
8190
  return /* @__PURE__ */ jsxs21("div", { className: "mt-4 rounded-xl border border-primary/20 bg-primary/[0.03] overflow-hidden animate-message", children: [
8133
8191
  /* @__PURE__ */ jsxs21("div", { className: "flex items-center gap-2 px-3.5 py-2 border-b border-primary/10 bg-primary/[0.04]", children: [
8134
8192
  /* @__PURE__ */ jsx23("span", { className: "flex items-center justify-center w-5 h-5 rounded-md bg-primary/15 text-primary", children: /* @__PURE__ */ jsx23(Lightbulb, { className: "h-3 w-3" }) }),
8135
8193
  /* @__PURE__ */ jsx23("span", { className: "text-xs font-semibold text-foreground/90", children: "Next steps" }),
8136
- /* @__PURE__ */ jsx23("span", { className: "text-[10px] text-muted-foreground ml-auto", children: "click to fill input" })
8194
+ showAutoCountdown && autoStep ? /* @__PURE__ */ jsxs21("span", { className: "ml-auto flex items-center gap-1 text-xs text-primary", children: [
8195
+ /* @__PURE__ */ jsx23(Timer2, { className: "h-3 w-3" }),
8196
+ "auto-submitting in ",
8197
+ /* @__PURE__ */ jsx23(AutoCountdown, { delayMs: autoDelayMs, onComplete: () => onAutoSubmit?.(autoStep.text) })
8198
+ ] }) : /* @__PURE__ */ jsx23("span", { className: "text-[10px] text-muted-foreground ml-auto", children: "click to fill input" })
8137
8199
  ] }),
8138
- /* @__PURE__ */ jsx23("div", { className: "flex flex-col p-2 gap-1", children: steps.map((s) => /* @__PURE__ */ jsxs21(
8139
- "button",
8140
- {
8141
- type: "button",
8142
- onClick: () => fillInput(s.text),
8143
- className: "group flex items-center gap-2.5 w-full text-left px-3 py-2 rounded-lg transition-all\n hover:bg-primary/[0.08] hover:shadow-sm\n border border-transparent hover:border-primary/20",
8144
- title: `Click to fill: ${s.text}`,
8145
- children: [
8146
- /* @__PURE__ */ jsx23("span", { className: "flex items-center justify-center w-5 h-5 rounded-md bg-muted/80 group-hover:bg-primary/20\n text-[11px] font-mono font-semibold tabular-nums shrink-0\n text-muted-foreground group-hover:text-primary transition-colors", children: s.index }),
8147
- /* @__PURE__ */ jsx23(ArrowRight2, { className: "h-3.5 w-3.5 text-muted-foreground/60 group-hover:text-primary group-hover:translate-x-0.5 transition-all shrink-0" }),
8148
- /* @__PURE__ */ jsx23("span", { className: "text-sm leading-snug text-foreground/80 group-hover:text-foreground transition-colors flex-1 min-w-0", children: s.text }),
8149
- /* @__PURE__ */ jsx23(MousePointerClick, { className: "h-3.5 w-3.5 opacity-0 group-hover:opacity-100 text-primary/60 transition-all shrink-0" })
8150
- ]
8151
- },
8152
- s.index
8153
- )) })
8200
+ /* @__PURE__ */ jsx23("div", { className: "flex flex-col p-2 gap-1", children: steps.map((s) => {
8201
+ const isAutoSelected = showAutoCountdown && s.auto;
8202
+ return /* @__PURE__ */ jsxs21(
8203
+ "button",
8204
+ {
8205
+ type: "button",
8206
+ onClick: () => fillInput(s.text),
8207
+ className: `group flex items-center gap-2.5 w-full text-left px-3 py-2 rounded-lg transition-all border ${isAutoSelected ? "bg-primary/10 border-primary/30 ring-1 ring-primary/20" : "border-transparent hover:bg-primary/[0.08] hover:shadow-sm hover:border-primary/20"}`,
8208
+ title: `Click to fill: ${s.text}`,
8209
+ children: [
8210
+ /* @__PURE__ */ jsx23(
8211
+ "span",
8212
+ {
8213
+ className: `flex items-center justify-center w-5 h-5 rounded-md text-[11px] font-mono font-semibold tabular-nums shrink-0 transition-colors ${isAutoSelected ? "bg-primary/30 text-primary" : "bg-muted/80 group-hover:bg-primary/20 text-muted-foreground group-hover:text-primary"}`,
8214
+ children: s.index
8215
+ }
8216
+ ),
8217
+ /* @__PURE__ */ jsx23(
8218
+ ArrowRight2,
8219
+ {
8220
+ className: `h-3.5 w-3.5 shrink-0 transition-all ${isAutoSelected ? "text-primary" : "text-muted-foreground/60 group-hover:text-primary group-hover:translate-x-0.5"}`
8221
+ }
8222
+ ),
8223
+ /* @__PURE__ */ jsx23(
8224
+ "span",
8225
+ {
8226
+ className: `text-sm leading-snug flex-1 min-w-0 transition-colors ${isAutoSelected ? "text-foreground font-medium" : "text-foreground/80 group-hover:text-foreground"}`,
8227
+ children: s.text
8228
+ }
8229
+ ),
8230
+ s.auto && /* @__PURE__ */ jsxs21("span", { className: "flex items-center gap-1 text-[10px] text-primary/70", children: [
8231
+ /* @__PURE__ */ jsx23(Timer2, { className: "h-3 w-3" }),
8232
+ "auto"
8233
+ ] }),
8234
+ /* @__PURE__ */ jsx23(
8235
+ MousePointerClick,
8236
+ {
8237
+ className: `h-3.5 w-3.5 shrink-0 transition-all ${isAutoSelected ? "opacity-100 text-primary/60" : "opacity-0 group-hover:opacity-100 text-primary/60"}`
8238
+ }
8239
+ )
8240
+ ]
8241
+ },
8242
+ s.index
8243
+ );
8244
+ }) })
8154
8245
  ] });
8155
8246
  }
8156
8247
 
8157
8248
  // src/components/MessageBubble/CopyButton.tsx
8158
8249
  import { Copy as Copy3, Check as Check4 } from "lucide-react";
8159
- import { useState as useState15 } from "react";
8250
+ import { useState as useState16 } from "react";
8160
8251
 
8161
8252
  // src/components/MessageBubble/utils.tsx
8162
8253
  import { Check as Check3, Copy as Copy2, FileCode2 } from "lucide-react";
8163
- import { useCallback as useCallback8, useMemo as useMemo6, useState as useState14 } from "react";
8254
+ import { useCallback as useCallback8, useMemo as useMemo5, useState as useState15 } from "react";
8164
8255
  import rehypeHighlight from "rehype-highlight";
8165
8256
  import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
8166
8257
  async function copyToClipboard(text) {
@@ -8212,7 +8303,7 @@ function formatToolDuration(ms) {
8212
8303
  }
8213
8304
  var rehypePlugins = [rehypeHighlight];
8214
8305
  function CodeCopyButton({ text }) {
8215
- const [copied, setCopied] = useState14(false);
8306
+ const [copied, setCopied] = useState15(false);
8216
8307
  const handleCopy = useCallback8(async () => {
8217
8308
  const ok = await copyToClipboard(text);
8218
8309
  if (ok) {
@@ -8239,6 +8330,34 @@ function CodeCopyButton({ text }) {
8239
8330
  );
8240
8331
  }
8241
8332
  var markdownComponents = {
8333
+ next_steps({ children }) {
8334
+ const rawText = typeof children === "string" ? children : "";
8335
+ const steps = parseNextSteps(rawText);
8336
+ if (steps.length === 0) return null;
8337
+ return /* @__PURE__ */ jsxs22("div", { className: "mt-4 rounded-xl border border-primary/20 bg-primary/[0.03] overflow-hidden animate-message", children: [
8338
+ /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2 px-3.5 py-2 border-b border-primary/10 bg-primary/[0.04]", children: [
8339
+ /* @__PURE__ */ jsx24("span", { className: "flex items-center justify-center w-5 h-5 rounded-md bg-primary/15 text-primary text-xs", children: "\u{1F4A1}" }),
8340
+ /* @__PURE__ */ jsx24("span", { className: "text-xs font-semibold text-foreground/90", children: "Next steps" }),
8341
+ /* @__PURE__ */ jsx24("span", { className: "text-[10px] text-muted-foreground ml-auto", children: "click to fill input" })
8342
+ ] }),
8343
+ /* @__PURE__ */ jsx24("div", { className: "flex flex-col p-2 gap-1", children: steps.map((s) => /* @__PURE__ */ jsxs22(
8344
+ "button",
8345
+ {
8346
+ type: "button",
8347
+ onClick: () => fillInput(s.text),
8348
+ className: "group flex items-center gap-2.5 w-full text-left px-3 py-2 rounded-lg transition-all\n hover:bg-primary/[0.08] hover:shadow-sm\n border border-transparent hover:border-primary/20 cursor-pointer",
8349
+ title: `Click to fill: ${s.text}`,
8350
+ children: [
8351
+ /* @__PURE__ */ jsx24("span", { className: "flex items-center justify-center w-5 h-5 rounded-md bg-muted/80 group-hover:bg-primary/20\n text-[11px] font-mono font-semibold tabular-nums shrink-0\n text-muted-foreground group-hover:text-primary transition-colors", children: s.index }),
8352
+ /* @__PURE__ */ jsx24("span", { className: "h-3.5 w-3.5 text-muted-foreground/60 group-hover:text-primary group-hover:translate-x-0.5 transition-all shrink-0 text-xs", children: "\u2192" }),
8353
+ /* @__PURE__ */ jsx24("span", { className: "text-sm leading-snug text-foreground/80 group-hover:text-foreground transition-colors flex-1 min-w-0", children: s.text }),
8354
+ /* @__PURE__ */ jsx24("span", { className: "opacity-0 group-hover:opacity-100 text-primary/60 transition-all shrink-0 text-xs", children: "\u2197" })
8355
+ ]
8356
+ },
8357
+ s.index
8358
+ )) })
8359
+ ] });
8360
+ },
8242
8361
  code({
8243
8362
  inline,
8244
8363
  className,
@@ -8248,12 +8367,12 @@ var markdownComponents = {
8248
8367
  const match = /language-(\w+)/.exec(className ?? "");
8249
8368
  const codeText = String(children ?? "").replace(/\n$/, "");
8250
8369
  if (inline || !match) {
8251
- return /* @__PURE__ */ jsx24("code", { className: cn("rounded bg-muted/60 px-1.5 py-0.5 text-[0.85em] font-mono", className), ...props, children });
8370
+ return /* @__PURE__ */ jsx24("code", { className: cn("rounded border border-border/60 px-1.5 py-0.5 text-[0.85em] font-mono", className), ...props, children });
8252
8371
  }
8253
- const lines = useMemo6(() => codeText.split("\n"), [codeText]);
8372
+ const lines = useMemo5(() => codeText.split("\n"), [codeText]);
8254
8373
  const hasLineNumbers = lines.length > 1;
8255
- return /* @__PURE__ */ jsxs22("div", { className: "not-prose relative my-3 rounded-lg border bg-muted/30 overflow-hidden group/codeblock", children: [
8256
- /* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-between px-3 py-1 border-b bg-muted/40 text-xs", children: [
8374
+ return /* @__PURE__ */ jsxs22("div", { className: "not-prose relative my-3 rounded-lg border border-border overflow-hidden group/codeblock", children: [
8375
+ /* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-between px-3 py-1 border-b border-border text-xs", children: [
8257
8376
  /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2", children: [
8258
8377
  /* @__PURE__ */ jsx24(FileCode2, { className: "h-3 w-3 text-muted-foreground" }),
8259
8378
  /* @__PURE__ */ jsx24("span", { className: "font-mono text-muted-foreground font-medium", children: match[1] }),
@@ -8270,13 +8389,13 @@ var markdownComponents = {
8270
8389
  "pre",
8271
8390
  {
8272
8391
  "aria-hidden": true,
8273
- className: "text-xs font-mono leading-[1.55] py-3 pl-3 pr-2 text-muted-foreground/40 select-none border-r border-border/30 bg-muted/10 tabular-nums text-right shrink-0",
8392
+ className: "text-xs font-mono leading-[1.55] py-3 pl-3 pr-2 text-muted-foreground/40 select-none border-r border-border/30 tabular-nums text-right shrink-0",
8274
8393
  children: lines.map((_, i) => /* @__PURE__ */ jsx24("div", { children: i + 1 }, i))
8275
8394
  }
8276
8395
  ),
8277
8396
  /* @__PURE__ */ jsx24("pre", { className: "overflow-x-auto py-3 px-3 text-xs leading-[1.55] font-mono flex-1", children: /* @__PURE__ */ jsx24("code", { className: cn("hljs", className), ...props, children }) })
8278
8397
  ] }) : /* @__PURE__ */ jsx24("pre", { className: "overflow-x-auto p-3 text-xs leading-relaxed font-mono max-h-[40rem]", children: /* @__PURE__ */ jsx24("code", { className: cn("hljs", className), ...props, children }) }),
8279
- /* @__PURE__ */ jsx24("div", { className: "pointer-events-none absolute bottom-8 left-0 right-0 h-8 bg-gradient-to-t from-muted/30 to-transparent opacity-0 group-hover/codeblock:opacity-100 transition-opacity" })
8398
+ /* @__PURE__ */ jsx24("div", { className: "pointer-events-none absolute bottom-8 left-0 right-0 h-8 bg-gradient-to-t from-black/10 to-transparent opacity-0 group-hover/codeblock:opacity-100 transition-opacity" })
8280
8399
  ] });
8281
8400
  }
8282
8401
  };
@@ -8288,7 +8407,7 @@ function CopyButton({
8288
8407
  className,
8289
8408
  label = "Copy"
8290
8409
  }) {
8291
- const [copied, setCopied] = useState15(false);
8410
+ const [copied, setCopied] = useState16(false);
8292
8411
  return /* @__PURE__ */ jsx25(
8293
8412
  "button",
8294
8413
  {
@@ -8319,7 +8438,7 @@ function CopyButton({
8319
8438
 
8320
8439
  // src/components/MessageBubble/ErrorBody.tsx
8321
8440
  import { expectDefined as expectDefined10 } from "@wrongstack/core";
8322
- import { useState as useState16 } from "react";
8441
+ import { useState as useState17 } from "react";
8323
8442
  import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
8324
8443
  function detectStackBoundary(text) {
8325
8444
  const lines = text.split("\n");
@@ -8333,7 +8452,7 @@ function detectStackBoundary(text) {
8333
8452
  }
8334
8453
  function ErrorBodyWithStack({ text }) {
8335
8454
  const idx = detectStackBoundary(text);
8336
- const [open, setOpen] = useState16(false);
8455
+ const [open, setOpen] = useState17(false);
8337
8456
  if (idx === -1) {
8338
8457
  return /* @__PURE__ */ jsx26("pre", { className: "whitespace-pre-wrap break-words font-mono text-xs leading-relaxed", children: text });
8339
8458
  }
@@ -8366,10 +8485,10 @@ function ErrorBodyWithStack({ text }) {
8366
8485
  }
8367
8486
 
8368
8487
  // src/components/MessageBubble/ToolInputView.tsx
8369
- import { useState as useState17 } from "react";
8488
+ import { useState as useState18 } from "react";
8370
8489
  import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
8371
8490
  function ToolInputView({ input }) {
8372
- const [openKeys, setOpenKeys] = useState17({});
8491
+ const [openKeys, setOpenKeys] = useState18({});
8373
8492
  if (input === null || input === void 0 || typeof input !== "object" || Array.isArray(input)) {
8374
8493
  return /* @__PURE__ */ jsx27("pre", { className: "whitespace-pre-wrap break-all text-xs font-mono", children: JSON.stringify(input, null, 2) });
8375
8494
  }
@@ -8432,10 +8551,10 @@ var MessageBubble = memo3(function MessageBubble2({
8432
8551
  isFirst = false,
8433
8552
  isContinuation = false
8434
8553
  }) {
8435
- const [expandedTools, setExpandedTools] = useState18({});
8436
- const [editing, setEditing] = useState18(false);
8437
- const [editValue, setEditValue] = useState18("");
8438
- const [showRaw, setShowRaw] = useState18(false);
8554
+ const [expandedTools, setExpandedTools] = useState19({});
8555
+ const [editing, setEditing] = useState19(false);
8556
+ const [editValue, setEditValue] = useState19("");
8557
+ const [showRaw, setShowRaw] = useState19(false);
8439
8558
  const isUser = message.role === "user";
8440
8559
  const isTool = message.role === "tool";
8441
8560
  void message.role;
@@ -8451,6 +8570,14 @@ var MessageBubble = memo3(function MessageBubble2({
8451
8570
  const inputCost = useSessionStore((s) => s.inputCost);
8452
8571
  const outputCost = useSessionStore((s) => s.outputCost);
8453
8572
  const cacheReadCost = useSessionStore((s) => s.cacheReadCost);
8573
+ const localPrefs = useLocalPrefs();
8574
+ const { autonomy, yolo } = localPrefs;
8575
+ const handleAutoSubmit = (text) => {
8576
+ addMessage({ role: "user", content: text });
8577
+ setLoading(true);
8578
+ const client2 = getWSClient(wsUrl);
8579
+ client2.sendMessage(text);
8580
+ };
8454
8581
  const isLatestAssistant = (() => {
8455
8582
  if (message.role !== "assistant" || isLoading) return false;
8456
8583
  const all = useChatStore.getState().messages;
@@ -8623,7 +8750,16 @@ var MessageBubble = memo3(function MessageBubble2({
8623
8750
  isLatestAssistant && message.content && (() => {
8624
8751
  const steps = parseNextSteps(message.content);
8625
8752
  if (steps.length === 0) return null;
8626
- return /* @__PURE__ */ jsx28(NextStepsBar, { steps });
8753
+ return /* @__PURE__ */ jsx28(
8754
+ NextStepsBar,
8755
+ {
8756
+ steps,
8757
+ yoloMode: yolo,
8758
+ autoMode: autonomy === "auto",
8759
+ autoDelayMs: localPrefs.autonomyDelayMs,
8760
+ onAutoSubmit: handleAutoSubmit
8761
+ }
8762
+ );
8627
8763
  })(),
8628
8764
  /* @__PURE__ */ jsxs26("div", { className: cn("flex items-center gap-2 px-1", isUser ? "flex-row-reverse" : "flex-row"), children: [
8629
8765
  /* @__PURE__ */ jsx28("span", { className: "text-xs text-muted-foreground/50", children: new Date(message.timestamp).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) }),
@@ -8700,18 +8836,18 @@ var MessageBubble = memo3(function MessageBubble2({
8700
8836
 
8701
8837
  // src/components/ModePicker.tsx
8702
8838
  import { Check as Check5, ChevronDown as ChevronDown6 } from "lucide-react";
8703
- import { useEffect as useEffect14, useRef as useRef11, useState as useState19 } from "react";
8839
+ import { useEffect as useEffect15, useRef as useRef11, useState as useState20 } from "react";
8704
8840
  import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
8705
8841
  function ModePicker() {
8706
8842
  const mode = useSessionStore((s) => s.mode);
8707
8843
  const modes = useSessionStore((s) => s.modes);
8708
8844
  const { listModes, switchMode } = useWebSocket();
8709
- const [open, setOpen] = useState19(false);
8845
+ const [open, setOpen] = useState20(false);
8710
8846
  const rootRef = useRef11(null);
8711
- useEffect14(() => {
8847
+ useEffect15(() => {
8712
8848
  if (open) listModes();
8713
8849
  }, [open, listModes]);
8714
- useEffect14(() => {
8850
+ useEffect15(() => {
8715
8851
  if (!open) return;
8716
8852
  const onClick = (e) => {
8717
8853
  if (!rootRef.current?.contains(e.target)) setOpen(false);
@@ -8783,18 +8919,18 @@ function ModePicker() {
8783
8919
 
8784
8920
  // src/components/ProcessMonitor.tsx
8785
8921
  import { Shield, Square as Square3, Terminal as Terminal2, X as X6 } from "lucide-react";
8786
- import { useCallback as useCallback9, useEffect as useEffect15, useRef as useRef12, useState as useState20 } from "react";
8922
+ import { useCallback as useCallback9, useEffect as useEffect16, useRef as useRef12, useState as useState21 } from "react";
8787
8923
  import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
8788
8924
  function ProcessMonitor({
8789
8925
  open,
8790
8926
  onClose,
8791
8927
  className
8792
8928
  }) {
8793
- const [processes, setProcesses] = useState20([]);
8929
+ const [processes, setProcesses] = useState21([]);
8794
8930
  const ws = useWebSocket();
8795
8931
  const offRef = useRef12(null);
8796
8932
  const pollRef = useRef12(null);
8797
- useEffect15(() => {
8933
+ useEffect16(() => {
8798
8934
  if (!open || !ws.client?.isConnected) return;
8799
8935
  ws.client.send?.({ type: "process.list" });
8800
8936
  offRef.current = ws.client.on?.("process.list", (msg) => {
@@ -8941,8 +9077,12 @@ function ProcessMonitor({
8941
9077
 
8942
9078
  // src/components/SearchOverlay.tsx
8943
9079
  import { ArrowDown as ArrowDown2, ArrowUp as ArrowUp2, Search as Search2, X as X7 } from "lucide-react";
8944
- import { useEffect as useEffect16, useMemo as useMemo7, useRef as useRef13, useState as useState21 } from "react";
9080
+ import { useEffect as useEffect17, useMemo as useMemo6, useRef as useRef13, useState as useState22 } from "react";
8945
9081
  import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
9082
+ var HIGHLIGHT_STYLES = `
9083
+ ::highlight(chat-search) { background-color: hsl(var(--primary) / 0.3); color: inherit; }
9084
+ ::highlight(chat-search-active) { background-color: hsl(var(--primary) / 0.85); color: hsl(var(--primary-foreground)); }
9085
+ `;
8946
9086
  function SearchOverlay() {
8947
9087
  const open = useUIStore((s) => s.searchOpen);
8948
9088
  const setOpen = useUIStore((s) => s.setSearchOpen);
@@ -8951,12 +9091,20 @@ function SearchOverlay() {
8951
9091
  const messages = useChatStore((s) => s.messages);
8952
9092
  const requestScrollToMessage = useUIStore((s) => s.requestScrollToMessage);
8953
9093
  const inputRef = useRef13(null);
8954
- const [activeHit, setActiveHit] = useState21(0);
8955
- const [repaintNonce, setRepaintNonce] = useState21(0);
8956
- useEffect16(() => {
9094
+ const [activeHit, setActiveHit] = useState22(0);
9095
+ const [repaintNonce, setRepaintNonce] = useState22(0);
9096
+ useEffect17(() => {
8957
9097
  if (open) requestAnimationFrame(() => inputRef.current?.focus());
8958
9098
  }, [open]);
8959
- const hits = useMemo7(() => {
9099
+ useEffect17(() => {
9100
+ const style = document.createElement("style");
9101
+ style.textContent = HIGHLIGHT_STYLES;
9102
+ document.head.appendChild(style);
9103
+ return () => {
9104
+ document.head.removeChild(style);
9105
+ };
9106
+ }, []);
9107
+ const hits = useMemo6(() => {
8960
9108
  const q = query.trim().toLowerCase();
8961
9109
  if (!q) return [];
8962
9110
  return messages.filter((m) => {
@@ -8966,10 +9114,10 @@ function SearchOverlay() {
8966
9114
  return m.content.toLowerCase().includes(q);
8967
9115
  }).map((m) => m.id);
8968
9116
  }, [messages, query]);
8969
- useEffect16(() => {
9117
+ useEffect17(() => {
8970
9118
  if (activeHit >= hits.length) setActiveHit(0);
8971
9119
  }, [hits, activeHit]);
8972
- useEffect16(() => {
9120
+ useEffect17(() => {
8973
9121
  const win = window;
8974
9122
  const highlights = win.CSS?.highlights;
8975
9123
  const HighlightCtor = win.Highlight;
@@ -9023,7 +9171,7 @@ function SearchOverlay() {
9023
9171
  }
9024
9172
  return clear;
9025
9173
  }, [query, hits, activeHit, open, repaintNonce]);
9026
- useEffect16(() => {
9174
+ useEffect17(() => {
9027
9175
  const id = hits[activeHit];
9028
9176
  if (!id) return;
9029
9177
  requestScrollToMessage(id);
@@ -9109,7 +9257,7 @@ function SearchOverlay() {
9109
9257
  // src/components/ToolGroup.tsx
9110
9258
  import { expectDefined as expectDefined12 } from "@wrongstack/core";
9111
9259
  import { CheckCircle2 as CheckCircle26, ChevronDown as ChevronDown7, ChevronRight as ChevronRight5, Loader2 as Loader22, Terminal as Terminal3, XCircle as XCircle6 } from "lucide-react";
9112
- import { memo as memo4, useState as useState22 } from "react";
9260
+ import { memo as memo4, useState as useState23 } from "react";
9113
9261
  import { jsx as jsx32, jsxs as jsxs30 } from "react/jsx-runtime";
9114
9262
  function formatDuration2(ms) {
9115
9263
  if (ms < 1e3) return `${ms}ms`;
@@ -9123,7 +9271,7 @@ var ToolGroup = memo4(function ToolGroup2({
9123
9271
  defaultOpen = false,
9124
9272
  isContinuation = false
9125
9273
  }) {
9126
- const [open, setOpen] = useState22(defaultOpen);
9274
+ const [open, setOpen] = useState23(defaultOpen);
9127
9275
  if (tools.length === 1) {
9128
9276
  return /* @__PURE__ */ jsx32(MessageBubble, { message: expectDefined12(tools[0]), isFirst: true, isContinuation });
9129
9277
  }
@@ -9182,7 +9330,7 @@ import {
9182
9330
  Sparkles as Sparkles4,
9183
9331
  Zap as Zap4
9184
9332
  } from "lucide-react";
9185
- import { useEffect as useEffect17, useState as useState23 } from "react";
9333
+ import { useEffect as useEffect18, useState as useState24 } from "react";
9186
9334
  import { Fragment as Fragment8, jsx as jsx33, jsxs as jsxs31 } from "react/jsx-runtime";
9187
9335
  var CARDS = [
9188
9336
  {
@@ -9257,8 +9405,8 @@ function WelcomeScreen() {
9257
9405
  const wsConnected = useConfigStore((s) => s.wsConnected);
9258
9406
  const wsUrl = useConfigStore((s) => s.wsUrl);
9259
9407
  const setCurrentView = useUIStore((s) => s.setCurrentView);
9260
- const [savedCount, setSavedCount] = useState23(void 0);
9261
- useEffect17(() => {
9408
+ const [savedCount, setSavedCount] = useState24(void 0);
9409
+ useEffect18(() => {
9262
9410
  if (!wsConnected) return;
9263
9411
  const client2 = getWSClient(wsUrl);
9264
9412
  const off = client2.on("providers.saved", (msg) => {
@@ -9274,7 +9422,7 @@ function WelcomeScreen() {
9274
9422
  const recentPrompts = promptHistory.slice(0, 6);
9275
9423
  const { listSessions, resumeSession } = useWebSocket();
9276
9424
  const historyEntries = useHistoryStore((s) => s.entries);
9277
- useEffect17(() => {
9425
+ useEffect18(() => {
9278
9426
  if (wsConnected && historyEntries.length === 0) listSessions(10);
9279
9427
  }, [wsConnected]);
9280
9428
  const sessionNicknames = useUIStore((s) => s.sessionNicknames);
@@ -9518,12 +9666,12 @@ function ChatView() {
9518
9666
  const nickname = useUIStore((s) => sessionId ? s.sessionNicknames[sessionId] : void 0);
9519
9667
  const setSessionNickname = useUIStore((s) => s.setSessionNickname);
9520
9668
  const sessionTitle = session?.title;
9521
- const [renamingTitle, setRenamingTitle] = useState24(false);
9522
- const [titleDraft, setTitleDraft] = useState24("");
9669
+ const [renamingTitle, setRenamingTitle] = useState25(false);
9670
+ const [titleDraft, setTitleDraft] = useState25("");
9523
9671
  const historyEntries = useHistoryStore((s) => s.entries);
9524
- const [switcherOpen, setSwitcherOpen] = useState24(false);
9672
+ const [switcherOpen, setSwitcherOpen] = useState25(false);
9525
9673
  const switcherRef = useRef14(null);
9526
- useEffect18(() => {
9674
+ useEffect19(() => {
9527
9675
  if (!switcherOpen) return;
9528
9676
  const onClick = (e) => {
9529
9677
  if (!switcherRef.current?.contains(e.target)) setSwitcherOpen(false);
@@ -9540,10 +9688,10 @@ function ChatView() {
9540
9688
  }, [switcherOpen]);
9541
9689
  const { provider, model } = useConfigStore();
9542
9690
  const vlistRef = useRef14(null);
9543
- const rows = useMemo8(() => buildChatRows(messages), [messages]);
9691
+ const rows = useMemo7(() => buildChatRows(messages), [messages]);
9544
9692
  const childCountRef = useRef14(0);
9545
9693
  childCountRef.current = rows.length + 1;
9546
- const rowIndexById = useMemo8(() => {
9694
+ const rowIndexById = useMemo7(() => {
9547
9695
  const map = /* @__PURE__ */ new Map();
9548
9696
  rows.forEach((row, i) => {
9549
9697
  if (row.kind === "user") map.set(row.message.id, i);
@@ -9563,19 +9711,19 @@ function ChatView() {
9563
9711
  const ws = getWSClient();
9564
9712
  ws?.send?.({ type: "autonomy.switch", payload: { mode } });
9565
9713
  }, []);
9566
- const [processOpen, setProcessOpen] = useState24(false);
9567
- const [checkpointOpen, setCheckpointOpen] = useState24(false);
9568
- const [breakdownOpen, setBreakdownOpen] = useState24(false);
9569
- useEffect18(() => {
9714
+ const [processOpen, setProcessOpen] = useState25(false);
9715
+ const [checkpointOpen, setCheckpointOpen] = useState25(false);
9716
+ const [breakdownOpen, setBreakdownOpen] = useState25(false);
9717
+ useEffect19(() => {
9570
9718
  const handler = () => setBreakdownOpen(true);
9571
9719
  document.addEventListener("open:context-breakdown", handler);
9572
9720
  return () => document.removeEventListener("open:context-breakdown", handler);
9573
9721
  }, []);
9574
9722
  const ctxPct = maxContext > 0 && lastInputTokens > 0 ? Math.round(lastInputTokens / maxContext * 100) : 0;
9575
9723
  const ctxTone = ctxPct >= 85 ? "bg-red-500/15 text-red-600 dark:text-red-400" : ctxPct >= 70 ? "bg-amber-500/15 text-amber-600 dark:text-amber-400" : "bg-muted text-muted-foreground";
9576
- const [pinnedToBottom, setPinnedToBottom] = useState24(true);
9577
- const [unreadCount, setUnreadCount] = useState24(0);
9578
- const [scrolledDeep, setScrolledDeep] = useState24(false);
9724
+ const [pinnedToBottom, setPinnedToBottom] = useState25(true);
9725
+ const [unreadCount, setUnreadCount] = useState25(0);
9726
+ const [scrolledDeep, setScrolledDeep] = useState25(false);
9579
9727
  const lastSeenCount = useRef14(messages.length);
9580
9728
  const handleScroll = useCallback10(() => {
9581
9729
  const h = vlistRef.current;
@@ -9589,7 +9737,7 @@ function ChatView() {
9589
9737
  }
9590
9738
  setScrolledDeep(h.scrollOffset > h.viewportSize && h.scrollSize > h.viewportSize * 2.5);
9591
9739
  }, []);
9592
- useEffect18(() => {
9740
+ useEffect19(() => {
9593
9741
  const h = vlistRef.current;
9594
9742
  if (!h) return;
9595
9743
  if (pinnedToBottom) {
@@ -9600,7 +9748,7 @@ function ChatView() {
9600
9748
  if (delta > 0) setUnreadCount(delta);
9601
9749
  }
9602
9750
  }, [messages, pinnedToBottom]);
9603
- useEffect18(() => {
9751
+ useEffect19(() => {
9604
9752
  setPinnedToBottom(true);
9605
9753
  setUnreadCount(0);
9606
9754
  lastSeenCount.current = useChatStore.getState().messages.length;
@@ -9608,7 +9756,7 @@ function ChatView() {
9608
9756
  vlistRef.current?.scrollToIndex(childCountRef.current - 1, { align: "end" });
9609
9757
  });
9610
9758
  }, [sessionId]);
9611
- useEffect18(() => {
9759
+ useEffect19(() => {
9612
9760
  if (!scrollTarget) return;
9613
9761
  const idx = rowIndexById.get(scrollTarget.id);
9614
9762
  if (idx === void 0) return;
@@ -9623,14 +9771,14 @@ function ChatView() {
9623
9771
  const scrollToTop = useCallback10(() => {
9624
9772
  vlistRef.current?.scrollToIndex(0, { align: "start", smooth: true });
9625
9773
  }, []);
9626
- const [runStartedAt, setRunStartedAt] = useState24(null);
9627
- const [nowTick, setNowTick] = useState24(() => Date.now());
9774
+ const [runStartedAt, setRunStartedAt] = useState25(null);
9775
+ const [nowTick, setNowTick] = useState25(() => Date.now());
9628
9776
  const streamAnchor = useRef14(null);
9629
- useEffect18(() => {
9777
+ useEffect19(() => {
9630
9778
  if (isLoading && runStartedAt === null) setRunStartedAt(Date.now());
9631
9779
  if (!isLoading && runStartedAt !== null) setRunStartedAt(null);
9632
9780
  }, [isLoading, runStartedAt]);
9633
- useEffect18(() => {
9781
+ useEffect19(() => {
9634
9782
  if (!isLoading) return;
9635
9783
  const t = setInterval(() => setNowTick(Date.now()), 500);
9636
9784
  return () => clearInterval(t);
@@ -10062,7 +10210,7 @@ function ChatView() {
10062
10210
 
10063
10211
  // src/components/CodeEditor.tsx
10064
10212
  import { X as X8, Circle as Circle3 } from "lucide-react";
10065
- import { useCallback as useCallback11, useEffect as useEffect19, useMemo as useMemo9, useRef as useRef15 } from "react";
10213
+ import { useCallback as useCallback11, useEffect as useEffect20, useMemo as useMemo8, useRef as useRef15 } from "react";
10066
10214
  import Editor, { loader } from "@monaco-editor/react";
10067
10215
  import * as monaco2 from "monaco-editor";
10068
10216
 
@@ -10509,13 +10657,13 @@ function CodeEditor() {
10509
10657
  const updateContent = useFileStore((s) => s.updateContent);
10510
10658
  const { theme: appTheme } = useTheme();
10511
10659
  const editorRef = useRef15(null);
10512
- const activeFile = useMemo9(
10660
+ const activeFile = useMemo8(
10513
10661
  () => openFiles.find((f) => f.path === activeFilePath) ?? null,
10514
10662
  [openFiles, activeFilePath]
10515
10663
  );
10516
10664
  const language = activeFilePath ? getLanguage(activeFilePath) : "plaintext";
10517
10665
  const monacoTheme = getMonacoTheme();
10518
- useEffect19(() => {
10666
+ useEffect20(() => {
10519
10667
  const resolved = getMonacoTheme();
10520
10668
  monaco2.editor.setTheme(resolved);
10521
10669
  }, [appTheme]);
@@ -10531,7 +10679,7 @@ function CodeEditor() {
10531
10679
  },
10532
10680
  [activeFilePath, updateContent]
10533
10681
  );
10534
- useEffect19(() => {
10682
+ useEffect20(() => {
10535
10683
  const onKeyDown = (e) => {
10536
10684
  const mod = e.ctrlKey || e.metaKey;
10537
10685
  const tag = e.target?.tagName?.toLowerCase();
@@ -10597,7 +10745,7 @@ function CodeEditor() {
10597
10745
 
10598
10746
  // src/components/ConfirmDialog.tsx
10599
10747
  import { AlertTriangle as AlertTriangle3, FileEdit, Globe as Globe2, ShieldAlert, Terminal as Terminal5, Wrench as Wrench5 } from "lucide-react";
10600
- import { useEffect as useEffect20, useRef as useRef16 } from "react";
10748
+ import { useEffect as useEffect21, useRef as useRef16 } from "react";
10601
10749
 
10602
10750
  // src/components/ui/dialog.tsx
10603
10751
  import * as DialogPrimitive from "@radix-ui/react-dialog";
@@ -10733,7 +10881,7 @@ function ConfirmDialog() {
10733
10881
  }
10734
10882
  hideConfirm();
10735
10883
  };
10736
- useEffect20(() => {
10884
+ useEffect21(() => {
10737
10885
  if (!showConfirmDialog) return;
10738
10886
  const onKey = (e) => {
10739
10887
  const target = e.target;
@@ -10857,7 +11005,7 @@ function ConfirmDialog() {
10857
11005
  }
10858
11006
 
10859
11007
  // src/components/ConfirmModal.tsx
10860
- import { useEffect as useEffect21 } from "react";
11008
+ import { useEffect as useEffect22 } from "react";
10861
11009
  import { create as create15 } from "zustand";
10862
11010
  import { jsx as jsx39, jsxs as jsxs37 } from "react/jsx-runtime";
10863
11011
  var useConfirmModalStore = create15()((set, get) => ({
@@ -10879,7 +11027,7 @@ function confirmModal(options) {
10879
11027
  function ConfirmModalHost() {
10880
11028
  const request = useConfirmModalStore((s) => s.request);
10881
11029
  const settle = useConfirmModalStore((s) => s.settle);
10882
- useEffect21(() => {
11030
+ useEffect22(() => {
10883
11031
  if (!request) return;
10884
11032
  const onKey = (e) => {
10885
11033
  if (e.key === "Enter") {
@@ -10922,19 +11070,19 @@ function ConfirmModalHost() {
10922
11070
 
10923
11071
  // src/components/ConnectionBanner.tsx
10924
11072
  import { Loader2 as Loader23, RotateCcw as RotateCcw4, WifiOff, X as X10 } from "lucide-react";
10925
- import { useEffect as useEffect22, useState as useState25 } from "react";
11073
+ import { useEffect as useEffect23, useState as useState26 } from "react";
10926
11074
  import { jsx as jsx40, jsxs as jsxs38 } from "react/jsx-runtime";
10927
11075
  function ConnectionBanner() {
10928
11076
  const wsStatus = useConfigStore((s) => s.wsStatus);
10929
11077
  const wsUrl = useConfigStore((s) => s.wsUrl);
10930
- const [dismissed, setDismissed] = useState25(false);
10931
- const [now, setNow] = useState25(Date.now());
10932
- useEffect22(() => {
11078
+ const [dismissed, setDismissed] = useState26(false);
11079
+ const [now, setNow] = useState26(Date.now());
11080
+ useEffect23(() => {
10933
11081
  if (wsStatus.state !== "reconnecting") return;
10934
11082
  const id = setInterval(() => setNow(Date.now()), 500);
10935
11083
  return () => clearInterval(id);
10936
11084
  }, [wsStatus.state]);
10937
- useEffect22(() => {
11085
+ useEffect23(() => {
10938
11086
  if (wsStatus.state === "open") setDismissed(false);
10939
11087
  }, [wsStatus.state]);
10940
11088
  if (wsStatus.state === "open" || wsStatus.state === "connecting") return null;
@@ -11026,7 +11174,7 @@ var ErrorBoundary = class extends Component {
11026
11174
 
11027
11175
  // src/components/QuickModelSwitcher.tsx
11028
11176
  import { ArrowRight as ArrowRight4, Cpu as Cpu6, Search as Search4 } from "lucide-react";
11029
- import { useEffect as useEffect23, useMemo as useMemo10, useRef as useRef17, useState as useState26 } from "react";
11177
+ import { useEffect as useEffect24, useMemo as useMemo9, useRef as useRef17, useState as useState27 } from "react";
11030
11178
 
11031
11179
  // src/components/QuickModelSwitcher.filter.ts
11032
11180
  function buildModelCandidates(saved, modelsByProvider, query, currentProvider, currentModel) {
@@ -11058,17 +11206,17 @@ import { jsx as jsx42, jsxs as jsxs40 } from "react/jsx-runtime";
11058
11206
  function QuickModelSwitcher() {
11059
11207
  const open = useUIStore((s) => s.modelSwitcherOpen);
11060
11208
  const setOpen = useUIStore((s) => s.setModelSwitcherOpen);
11061
- const [query, setQuery] = useState26("");
11062
- const [selected, setSelected] = useState26(0);
11063
- const [saved, setSaved] = useState26([]);
11064
- const [modelsByProvider, setModelsByProvider] = useState26({});
11209
+ const [query, setQuery] = useState27("");
11210
+ const [selected, setSelected] = useState27(0);
11211
+ const [saved, setSaved] = useState27([]);
11212
+ const [modelsByProvider, setModelsByProvider] = useState27({});
11065
11213
  const inputRef = useRef17(null);
11066
11214
  const wsUrl = useConfigStore((s) => s.wsUrl);
11067
11215
  const currentProvider = useConfigStore((s) => s.provider);
11068
11216
  const currentModel = useConfigStore((s) => s.model);
11069
11217
  const paletteOpen = useUIStore((s) => s.paletteOpen);
11070
11218
  const { listSavedProviders, listProviderModels, switchModel } = useWebSocket();
11071
- useEffect23(() => {
11219
+ useEffect24(() => {
11072
11220
  const onKey = (e) => {
11073
11221
  const mod = e.ctrlKey || e.metaKey;
11074
11222
  if (mod && e.key.toLowerCase() === "m" && !e.shiftKey && !e.altKey) {
@@ -11085,7 +11233,7 @@ function QuickModelSwitcher() {
11085
11233
  window.addEventListener("keydown", onKey);
11086
11234
  return () => window.removeEventListener("keydown", onKey);
11087
11235
  }, [open, paletteOpen]);
11088
- useEffect23(() => {
11236
+ useEffect24(() => {
11089
11237
  const client2 = getWSClient(wsUrl);
11090
11238
  const offSaved = client2.on("providers.saved", (msg) => {
11091
11239
  const p = msg.payload;
@@ -11100,14 +11248,14 @@ function QuickModelSwitcher() {
11100
11248
  offModels();
11101
11249
  };
11102
11250
  }, [wsUrl]);
11103
- useEffect23(() => {
11251
+ useEffect24(() => {
11104
11252
  if (!open) return;
11105
11253
  setQuery("");
11106
11254
  setSelected(0);
11107
11255
  listSavedProviders();
11108
11256
  requestAnimationFrame(() => inputRef.current?.focus());
11109
11257
  }, [open, listSavedProviders]);
11110
- useEffect23(() => {
11258
+ useEffect24(() => {
11111
11259
  if (!open) return;
11112
11260
  for (const sp of saved) {
11113
11261
  if (!modelsByProvider[sp.id]) {
@@ -11115,7 +11263,7 @@ function QuickModelSwitcher() {
11115
11263
  }
11116
11264
  }
11117
11265
  }, [open, saved, modelsByProvider, listProviderModels]);
11118
- const candidates = useMemo10(
11266
+ const candidates = useMemo9(
11119
11267
  () => buildModelCandidates(
11120
11268
  saved,
11121
11269
  modelsByProvider,
@@ -11125,7 +11273,7 @@ function QuickModelSwitcher() {
11125
11273
  ),
11126
11274
  [saved, modelsByProvider, query, currentProvider, currentModel]
11127
11275
  );
11128
- useEffect23(() => {
11276
+ useEffect24(() => {
11129
11277
  if (selected >= candidates.length) setSelected(0);
11130
11278
  }, [candidates.length, selected]);
11131
11279
  const commit = (idx) => {
@@ -11238,7 +11386,7 @@ import {
11238
11386
  X as X11,
11239
11387
  Zap as Zap6
11240
11388
  } from "lucide-react";
11241
- import { useState as useState28, useEffect as useEffect24, useCallback as useCallback13 } from "react";
11389
+ import { useState as useState29, useEffect as useEffect25, useCallback as useCallback13 } from "react";
11242
11390
 
11243
11391
  // src/components/ui/input.tsx
11244
11392
  import * as React3 from "react";
@@ -11467,7 +11615,7 @@ import {
11467
11615
  Plus,
11468
11616
  Trash2 as Trash22
11469
11617
  } from "lucide-react";
11470
- import { useState as useState27, useCallback as useCallback12 } from "react";
11618
+ import { useState as useState28, useCallback as useCallback12 } from "react";
11471
11619
  import { Fragment as Fragment10, jsx as jsx48, jsxs as jsxs44 } from "react/jsx-runtime";
11472
11620
  var PROVIDER_FAMILIES = ["anthropic", "openai", "google", "openai-compatible"];
11473
11621
  function ProviderSection({
@@ -11487,15 +11635,15 @@ function ProviderSection({
11487
11635
  catalogQuery,
11488
11636
  setCatalogQuery
11489
11637
  }) {
11490
- const [showAddKeyForm, setShowAddKeyForm] = useState27(null);
11491
- const [newKeyLabel, setNewKeyLabel] = useState27("");
11492
- const [newKeyValue, setNewKeyValue] = useState27("");
11493
- const [showNewKeyValue, setShowNewKeyValue] = useState27(false);
11494
- const [showAddProviderForm, setShowAddProviderForm] = useState27(false);
11495
- const [newProviderId, setNewProviderId] = useState27("");
11496
- const [newProviderFamily, setNewProviderFamily] = useState27("openai-compatible");
11497
- const [newProviderBaseUrl, setNewProviderBaseUrl] = useState27("");
11498
- const [newProviderApiKey, setNewProviderApiKey] = useState27("");
11638
+ const [showAddKeyForm, setShowAddKeyForm] = useState28(null);
11639
+ const [newKeyLabel, setNewKeyLabel] = useState28("");
11640
+ const [newKeyValue, setNewKeyValue] = useState28("");
11641
+ const [showNewKeyValue, setShowNewKeyValue] = useState28(false);
11642
+ const [showAddProviderForm, setShowAddProviderForm] = useState28(false);
11643
+ const [newProviderId, setNewProviderId] = useState28("");
11644
+ const [newProviderFamily, setNewProviderFamily] = useState28("openai-compatible");
11645
+ const [newProviderBaseUrl, setNewProviderBaseUrl] = useState28("");
11646
+ const [newProviderApiKey, setNewProviderApiKey] = useState28("");
11499
11647
  const handleAddKey = useCallback12(
11500
11648
  (providerId) => {
11501
11649
  if (!newKeyLabel.trim() || !newKeyValue.trim()) return;
@@ -11879,16 +12027,16 @@ function SettingsPanel() {
11879
12027
  },
11880
12028
  [localPrefs, updatePrefs]
11881
12029
  );
11882
- const [catalogProviders, setCatalogProviders] = useState28([]);
11883
- const [catalogModels, setCatalogModels] = useState28({});
11884
- const [savedProviders, setSavedProviders] = useState28([]);
11885
- const [isLoadingCatalog, setIsLoadingCatalog] = useState28(false);
11886
- const [isLoadingModels, setIsLoadingModels] = useState28(false);
11887
- const [isLoadingSaved, setIsLoadingSaved] = useState28(false);
11888
- const [providerTab, setProviderTab] = useState28("catalog");
11889
- const [catalogQuery, setCatalogQuery] = useState28("");
12030
+ const [catalogProviders, setCatalogProviders] = useState29([]);
12031
+ const [catalogModels, setCatalogModels] = useState29({});
12032
+ const [savedProviders, setSavedProviders] = useState29([]);
12033
+ const [isLoadingCatalog, setIsLoadingCatalog] = useState29(false);
12034
+ const [isLoadingModels, setIsLoadingModels] = useState29(false);
12035
+ const [isLoadingSaved, setIsLoadingSaved] = useState29(false);
12036
+ const [providerTab, setProviderTab] = useState29("catalog");
12037
+ const [catalogQuery, setCatalogQuery] = useState29("");
11890
12038
  const currentCatalogProvider = catalogProviders.find((p) => p.id === provider);
11891
- useEffect24(() => {
12039
+ useEffect25(() => {
11892
12040
  const handleProviderCatalog = (msg) => {
11893
12041
  if (msg.type === "provider.catalog") {
11894
12042
  const payload = msg.payload;
@@ -12447,7 +12595,7 @@ import {
12447
12595
  Network as Network2,
12448
12596
  Zap as Zap7
12449
12597
  } from "lucide-react";
12450
- import { useCallback as useCallback14, useEffect as useEffect25, useState as useState29 } from "react";
12598
+ import { useCallback as useCallback14, useEffect as useEffect26, useState as useState30 } from "react";
12451
12599
  import { jsx as jsx51, jsxs as jsxs47 } from "react/jsx-runtime";
12452
12600
  function ProviderCard({
12453
12601
  provider,
@@ -12532,9 +12680,9 @@ function ApiKeyInput({
12532
12680
  providerId,
12533
12681
  onSave
12534
12682
  }) {
12535
- const [key, setKey] = useState29("");
12536
- const [label, setLabel] = useState29("default");
12537
- const [isLoading, setIsLoading] = useState29(false);
12683
+ const [key, setKey] = useState30("");
12684
+ const [label, setLabel] = useState30("default");
12685
+ const [isLoading, setIsLoading] = useState30(false);
12538
12686
  const handleSave = async () => {
12539
12687
  if (!key.trim()) return;
12540
12688
  setIsLoading(true);
@@ -12588,15 +12736,15 @@ function SetupScreen() {
12588
12736
  const { setCurrentView } = useUIStore();
12589
12737
  const { provider, model, setProvider, setModel, wsConnected, wsUrl } = useConfigStore();
12590
12738
  const ws = useWebSocket();
12591
- const [step, setStep] = useState29("provider");
12592
- const [catalogProviders, setCatalogProviders] = useState29([]);
12593
- const [catalogModels, setCatalogModels] = useState29({});
12594
- const [savedProviders, setSavedProviders] = useState29([]);
12595
- const [isLoadingCatalog, setIsLoadingCatalog] = useState29(false);
12596
- const [isLoadingModels, setIsLoadingModels] = useState29(false);
12597
- const [selectedProvider, setSelectedProvider] = useState29(null);
12598
- const [selectedModel, setSelectedModel] = useState29(null);
12599
- useEffect25(() => {
12739
+ const [step, setStep] = useState30("provider");
12740
+ const [catalogProviders, setCatalogProviders] = useState30([]);
12741
+ const [catalogModels, setCatalogModels] = useState30({});
12742
+ const [savedProviders, setSavedProviders] = useState30([]);
12743
+ const [isLoadingCatalog, setIsLoadingCatalog] = useState30(false);
12744
+ const [isLoadingModels, setIsLoadingModels] = useState30(false);
12745
+ const [selectedProvider, setSelectedProvider] = useState30(null);
12746
+ const [selectedModel, setSelectedModel] = useState30(null);
12747
+ useEffect26(() => {
12600
12748
  if (!wsConnected) return;
12601
12749
  const wsClient = getWSClient(wsUrl);
12602
12750
  const off1 = wsClient.on("provider.catalog", (msg) => {
@@ -12638,7 +12786,7 @@ function SetupScreen() {
12638
12786
  off3?.();
12639
12787
  };
12640
12788
  }, [wsConnected, wsUrl, provider, model]);
12641
- useEffect25(() => {
12789
+ useEffect26(() => {
12642
12790
  if (!selectedProvider || !wsConnected) return;
12643
12791
  const wsClient = getWSClient(wsUrl);
12644
12792
  if (!catalogModels[selectedProvider]) {
@@ -12844,7 +12992,7 @@ function SetupScreen() {
12844
12992
 
12845
12993
  // src/components/SessionsDashboard.tsx
12846
12994
  import { Clock as Clock9, Cpu as Cpu10, FolderGit2, Wifi, WifiOff as WifiOff2, Loader2 as Loader27 } from "lucide-react";
12847
- import { useCallback as useCallback15, useEffect as useEffect26, useState as useState30 } from "react";
12995
+ import { useCallback as useCallback15, useEffect as useEffect27, useState as useState31 } from "react";
12848
12996
  import { jsx as jsx52, jsxs as jsxs48 } from "react/jsx-runtime";
12849
12997
  function agentIcon(status) {
12850
12998
  switch (status) {
@@ -12907,9 +13055,9 @@ function fmtTimeAgo(iso) {
12907
13055
  return `${Math.floor(min / 60)}h ago`;
12908
13056
  }
12909
13057
  function SessionsDashboard() {
12910
- const [sessions, setSessions] = useState30([]);
12911
- const [loading, setLoading] = useState30(true);
12912
- const [error, setError] = useState30(null);
13058
+ const [sessions, setSessions] = useState31([]);
13059
+ const [loading, setLoading] = useState31(true);
13060
+ const [error, setError] = useState31(null);
12913
13061
  const fetchSessions = useCallback15(async () => {
12914
13062
  try {
12915
13063
  const res = await fetch("/api/sessions");
@@ -12930,7 +13078,7 @@ function SessionsDashboard() {
12930
13078
  setLoading(false);
12931
13079
  }
12932
13080
  }, []);
12933
- useEffect26(() => {
13081
+ useEffect27(() => {
12934
13082
  void fetchSessions();
12935
13083
  const t = setInterval(fetchSessions, 5e3);
12936
13084
  return () => clearInterval(t);
@@ -13023,7 +13171,7 @@ function SessionsDashboard() {
13023
13171
 
13024
13172
  // src/components/ShortcutsOverlay.tsx
13025
13173
  import { Keyboard as Keyboard3, X as X12 } from "lucide-react";
13026
- import { useEffect as useEffect27 } from "react";
13174
+ import { useEffect as useEffect28 } from "react";
13027
13175
  import { jsx as jsx53, jsxs as jsxs49 } from "react/jsx-runtime";
13028
13176
  var SHORTCUTS = [
13029
13177
  {
@@ -13085,7 +13233,7 @@ var SHORTCUTS = [
13085
13233
  function ShortcutsOverlay() {
13086
13234
  const open = useUIStore((s) => s.shortcutsOpen);
13087
13235
  const setOpen = useUIStore((s) => s.setShortcutsOpen);
13088
- useEffect27(() => {
13236
+ useEffect28(() => {
13089
13237
  const onKey = (e) => {
13090
13238
  const target = e.target;
13091
13239
  const tag = target?.tagName?.toLowerCase();
@@ -13179,7 +13327,7 @@ import {
13179
13327
  ReactFlowProvider
13180
13328
  } from "@xyflow/react";
13181
13329
  import "@xyflow/react/dist/style.css";
13182
- import { useCallback as useCallback16, useEffect as useEffect28, useState as useState31 } from "react";
13330
+ import { useCallback as useCallback16, useEffect as useEffect29, useState as useState32 } from "react";
13183
13331
  import {
13184
13332
  Bot as Bot8,
13185
13333
  Cpu as Cpu11,
@@ -13525,8 +13673,8 @@ function AgentFlowCanvas({ containerRef }) {
13525
13673
  const counters = useVizStore((s) => s.counters);
13526
13674
  const [nodes, setNodes, onNodesChange] = useNodesState([]);
13527
13675
  const [edges, setEdges, onEdgesChange] = useEdgesState([]);
13528
- const [selectedNode, setSelectedNode] = useState31(null);
13529
- useEffect28(() => {
13676
+ const [selectedNode, setSelectedNode] = useState32(null);
13677
+ useEffect29(() => {
13530
13678
  const rfNodes = [];
13531
13679
  const rfEdges = [];
13532
13680
  rfNodes.push({
@@ -13700,7 +13848,7 @@ function AgentFlowCanvas({ containerRef }) {
13700
13848
  setEdges(rfEdges);
13701
13849
  setTimeout(() => fitView({ padding: 0.2, duration: 300 }), 50);
13702
13850
  }, [session, projectName, iteration, fleetAgents, cost, lastInputTokens, maxContext, setNodes, setEdges, fitView]);
13703
- useEffect28(() => {
13851
+ useEffect29(() => {
13704
13852
  if (vizEvents.length === 0) return;
13705
13853
  const latestEvent = vizEvents[0];
13706
13854
  if (!latestEvent) return;
@@ -13906,7 +14054,7 @@ function AgentFlowCanvasWithProvider(props) {
13906
14054
 
13907
14055
  // src/components/SidePanel/index.tsx
13908
14056
  import { PanelLeftClose } from "lucide-react";
13909
- import { useEffect as useEffect35 } from "react";
14057
+ import { useEffect as useEffect36 } from "react";
13910
14058
 
13911
14059
  // src/components/FileExplorer.tsx
13912
14060
  import {
@@ -13927,7 +14075,7 @@ import {
13927
14075
  Loader2 as Loader28,
13928
14076
  Minimize2
13929
14077
  } from "lucide-react";
13930
- import { useCallback as useCallback17, useEffect as useEffect29, useMemo as useMemo12, useRef as useRef19, useState as useState32 } from "react";
14078
+ import { useCallback as useCallback17, useEffect as useEffect30, useMemo as useMemo11, useRef as useRef19, useState as useState33 } from "react";
13931
14079
  import { jsx as jsx56, jsxs as jsxs51 } from "react/jsx-runtime";
13932
14080
  var EXT_ICONS = {
13933
14081
  // ── Code ──
@@ -14048,10 +14196,10 @@ function TreeNodeItem({
14048
14196
  onSelect,
14049
14197
  onOpen
14050
14198
  }) {
14051
- const [expanded, setExpanded] = useState32(depth < 1);
14199
+ const [expanded, setExpanded] = useState33(depth < 1);
14052
14200
  const activeFilePath = useFileStore((s) => s.activeFilePath);
14053
14201
  const isActive = node.type === "file" && node.path === activeFilePath;
14054
- useEffect29(() => {
14202
+ useEffect30(() => {
14055
14203
  if (forceExpand !== null) setExpanded(forceExpand);
14056
14204
  }, [forceExpand]);
14057
14205
  if (node.type === "directory") {
@@ -14153,7 +14301,7 @@ function FileExplorer() {
14153
14301
  const segments = cwd.replace(/\\/g, "/").split("/").filter(Boolean);
14154
14302
  return (segments[segments.length - 1] ?? "") === projectName;
14155
14303
  })();
14156
- const breadcrumbs = useMemo12(() => {
14304
+ const breadcrumbs = useMemo11(() => {
14157
14305
  if (!cwd || !projectName) return [];
14158
14306
  const norm = cwd.replace(/\\/g, "/");
14159
14307
  const segments = norm.split("/").filter(Boolean);
@@ -14180,7 +14328,7 @@ function FileExplorer() {
14180
14328
  }));
14181
14329
  }, [cwd, projectName]);
14182
14330
  const bcRef = useRef19(null);
14183
- useEffect29(() => {
14331
+ useEffect30(() => {
14184
14332
  const el = bcRef.current;
14185
14333
  if (el && breadcrumbs.length > 1) {
14186
14334
  el.scrollLeft = el.scrollWidth;
@@ -14189,8 +14337,8 @@ function FileExplorer() {
14189
14337
  const handleBreadcrumbClick = useCallback17((crumbPath) => {
14190
14338
  getWSClient().send({ type: "working_dir.set", payload: { path: crumbPath } });
14191
14339
  }, []);
14192
- const [contextMenu, setContextMenu] = useState32(null);
14193
- useEffect29(() => {
14340
+ const [contextMenu, setContextMenu] = useState33(null);
14341
+ useEffect30(() => {
14194
14342
  if (!contextMenu) return;
14195
14343
  const close = () => setContextMenu(null);
14196
14344
  const onKey = (e) => {
@@ -14231,9 +14379,9 @@ function FileExplorer() {
14231
14379
  const parent = norm.split("/").slice(0, -1).join("/") || norm;
14232
14380
  getWSClient().send({ type: "working_dir.set", payload: { path: parent } });
14233
14381
  }, [cwd]);
14234
- const [showSpinner, setShowSpinner] = useState32(false);
14382
+ const [showSpinner, setShowSpinner] = useState33(false);
14235
14383
  const spinnerTimer = useRef19(null);
14236
- useEffect29(() => {
14384
+ useEffect30(() => {
14237
14385
  if (treeLoading) {
14238
14386
  spinnerTimer.current = setTimeout(() => setShowSpinner(true), 150);
14239
14387
  } else {
@@ -14244,9 +14392,9 @@ function FileExplorer() {
14244
14392
  if (spinnerTimer.current) clearTimeout(spinnerTimer.current);
14245
14393
  };
14246
14394
  }, [treeLoading]);
14247
- const [selectedPath, setSelectedPath] = useState32(null);
14248
- const [globalExpand, setGlobalExpand] = useState32(null);
14249
- const dirCount = useMemo12(() => {
14395
+ const [selectedPath, setSelectedPath] = useState33(null);
14396
+ const [globalExpand, setGlobalExpand] = useState33(null);
14397
+ const dirCount = useMemo11(() => {
14250
14398
  let count = 0;
14251
14399
  const walk = (nodes) => {
14252
14400
  for (const n of nodes) {
@@ -14257,7 +14405,7 @@ function FileExplorer() {
14257
14405
  walk(tree);
14258
14406
  return count;
14259
14407
  }, [tree]);
14260
- const cwdStats = useMemo12(() => {
14408
+ const cwdStats = useMemo11(() => {
14261
14409
  let files = 0;
14262
14410
  let dirs = 0;
14263
14411
  for (const n of tree) {
@@ -14298,7 +14446,7 @@ function FileExplorer() {
14298
14446
  );
14299
14447
  setSelectedPath(null);
14300
14448
  }, []);
14301
- useEffect29(() => {
14449
+ useEffect30(() => {
14302
14450
  if (activeFilePath) setSelectedPath(null);
14303
14451
  }, [activeFilePath]);
14304
14452
  if (showSpinner) {
@@ -14512,7 +14660,7 @@ import {
14512
14660
  UserCheck,
14513
14661
  Trash2 as Trash23
14514
14662
  } from "lucide-react";
14515
- import { useEffect as useEffect30, useState as useState33 } from "react";
14663
+ import { useEffect as useEffect31, useState as useState34 } from "react";
14516
14664
  import { jsx as jsx57, jsxs as jsxs52 } from "react/jsx-runtime";
14517
14665
  var TYPE_ICONS = {
14518
14666
  note: FileText5,
@@ -14536,12 +14684,12 @@ function fmtTime(iso) {
14536
14684
  function MailboxPanel({ className }) {
14537
14685
  const messages = useMailboxStore((s) => s.messages);
14538
14686
  const agents = useMailboxStore((s) => s.agents);
14539
- const [collapsed, setCollapsed] = useState33(false);
14540
- const [deleting, setDeleting] = useState33(false);
14687
+ const [collapsed, setCollapsed] = useState34(false);
14688
+ const [deleting, setDeleting] = useState34(false);
14541
14689
  const { client: client2 } = useWebSocket();
14542
- const [ready, setReady] = useState33(client2.status.state === "open");
14543
- useEffect30(() => client2.onStatus((s) => setReady(s.state === "open")), [client2]);
14544
- useEffect30(() => {
14690
+ const [ready, setReady] = useState34(client2.status.state === "open");
14691
+ useEffect31(() => client2.onStatus((s) => setReady(s.state === "open")), [client2]);
14692
+ useEffect31(() => {
14545
14693
  if (!ready) return;
14546
14694
  client2.send({ type: "mailbox.messages", payload: { limit: 30 } });
14547
14695
  client2.send({ type: "mailbox.agents", payload: {} });
@@ -14560,7 +14708,7 @@ function MailboxPanel({ className }) {
14560
14708
  setDeleting(true);
14561
14709
  client2.send({ type: "mailbox.clear" });
14562
14710
  }
14563
- useEffect30(() => {
14711
+ useEffect31(() => {
14564
14712
  if (deleting && messages.length === 0) setDeleting(false);
14565
14713
  }, [deleting, messages.length]);
14566
14714
  return /* @__PURE__ */ jsxs52("div", { className: cn("rounded-lg border border-border bg-card/60 backdrop-blur-sm", className), children: [
@@ -14669,22 +14817,22 @@ function MailboxPanel({ className }) {
14669
14817
 
14670
14818
  // src/components/ProjectsPanel.tsx
14671
14819
  import { ExternalLink, Folder as Folder3, FolderPlus, History as History3, Loader2 as Loader29 } from "lucide-react";
14672
- import { useCallback as useCallback18, useEffect as useEffect31, useRef as useRef20, useState as useState34 } from "react";
14820
+ import { useCallback as useCallback18, useEffect as useEffect32, useRef as useRef20, useState as useState35 } from "react";
14673
14821
  import { jsx as jsx58, jsxs as jsxs53 } from "react/jsx-runtime";
14674
14822
  function ProjectsPanel({ fullView }) {
14675
- const [projects, setProjects] = useState34([]);
14676
- const [loading, setLoading] = useState34(true);
14677
- const [adding, setAdding] = useState34(false);
14678
- const [folderPath, setFolderPath] = useState34("");
14679
- const [projectName, setProjectName] = useState34("");
14680
- const [dialogOpen, setDialogOpen] = useState34(false);
14823
+ const [projects, setProjects] = useState35([]);
14824
+ const [loading, setLoading] = useState35(true);
14825
+ const [adding, setAdding] = useState35(false);
14826
+ const [folderPath, setFolderPath] = useState35("");
14827
+ const [projectName, setProjectName] = useState35("");
14828
+ const [dialogOpen, setDialogOpen] = useState35(false);
14681
14829
  const projectNameRef = useRef20(null);
14682
- const [confirmSwitch, setConfirmSwitch] = useState34({ open: false, project: null, agentCount: 0 });
14830
+ const [confirmSwitch, setConfirmSwitch] = useState35({ open: false, project: null, agentCount: 0 });
14683
14831
  const fetchProjects = useCallback18(() => {
14684
14832
  const ws = getWSClient();
14685
14833
  ws.send({ type: "projects.list" });
14686
14834
  }, []);
14687
- useEffect31(() => {
14835
+ useEffect32(() => {
14688
14836
  setLoading(true);
14689
14837
  const ws = getWSClient();
14690
14838
  const offList = ws.on("projects.list", (msg) => {
@@ -14958,11 +15106,11 @@ function ProjectsPanel({ fullView }) {
14958
15106
 
14959
15107
  // src/components/SidePanel/AgentsPanel.tsx
14960
15108
  import { Bot as Bot10, LayoutGrid as LayoutGrid2, Wrench as Wrench8 } from "lucide-react";
14961
- import { useMemo as useMemo14, useState as useState36 } from "react";
15109
+ import { useMemo as useMemo13, useState as useState37 } from "react";
14962
15110
 
14963
15111
  // src/components/FleetPanel.tsx
14964
15112
  import { Bot as Bot9, Check as Check7, ChevronDown as ChevronDown9, ChevronRight as ChevronRight8, Clock as Clock11, Copy as Copy4, Cpu as Cpu12, Crown, Wrench as Wrench7, X as X14, Zap as Zap9 } from "lucide-react";
14965
- import { useCallback as useCallback19, useMemo as useMemo13, useState as useState35 } from "react";
15113
+ import { useCallback as useCallback19, useMemo as useMemo12, useState as useState36 } from "react";
14966
15114
 
14967
15115
  // src/components/ui/sparkline.tsx
14968
15116
  import { jsx as jsx59 } from "react/jsx-runtime";
@@ -15038,7 +15186,7 @@ function AgentDetail({
15038
15186
  const active = agent.status === "running";
15039
15187
  const tool = agent.currentTool ?? agent.lastTool;
15040
15188
  const elapsed = Date.now() - agent.startedAt;
15041
- const [copied, setCopied] = useState35(false);
15189
+ const [copied, setCopied] = useState36(false);
15042
15190
  const leaderId = useFleetStore((s) => s.leaderId);
15043
15191
  const isLeader = agent.id === leaderId;
15044
15192
  const handleCopy = useCallback19(async (text) => {
@@ -15339,9 +15487,9 @@ function FleetPanel({
15339
15487
  className
15340
15488
  }) {
15341
15489
  const agents = useFleetStore((s) => s.agents);
15342
- const [collapsed, setCollapsed] = useState35(true);
15343
- const [selectedId, setSelectedId] = useState35(null);
15344
- const list = useMemo13(() => {
15490
+ const [collapsed, setCollapsed] = useState36(true);
15491
+ const [selectedId, setSelectedId] = useState36(null);
15492
+ const list = useMemo12(() => {
15345
15493
  const arr = Array.from(agents.values());
15346
15494
  arr.sort((x, y) => {
15347
15495
  const xa = x.status === "running" ? 0 : 1;
@@ -15454,8 +15602,8 @@ function AgentRow2({ agent, onClick }) {
15454
15602
  function AgentsPanel() {
15455
15603
  const fleetAgents = useFleetStore((s) => s.agents);
15456
15604
  const setCurrentView = useUIStore((s) => s.setCurrentView);
15457
- const [selectedAgentId, setSelectedAgentId] = useState36(null);
15458
- const fleetList = useMemo14(() => {
15605
+ const [selectedAgentId, setSelectedAgentId] = useState37(null);
15606
+ const fleetList = useMemo13(() => {
15459
15607
  const arr = Array.from(fleetAgents.values());
15460
15608
  arr.sort((x, y) => {
15461
15609
  const xa = x.status === "running" ? 0 : 1;
@@ -15502,7 +15650,7 @@ function AgentsPanel() {
15502
15650
 
15503
15651
  // src/components/SidePanel/HistoryPanel.tsx
15504
15652
  import { LayoutGrid as LayoutGrid3 } from "lucide-react";
15505
- import { useEffect as useEffect33, useState as useState38 } from "react";
15653
+ import { useEffect as useEffect34, useState as useState39 } from "react";
15506
15654
 
15507
15655
  // src/components/SidePanel/SessionList.tsx
15508
15656
  import {
@@ -15514,7 +15662,7 @@ import {
15514
15662
  Trash2 as Trash24,
15515
15663
  X as X15
15516
15664
  } from "lucide-react";
15517
- import { useCallback as useCallback20, useEffect as useEffect32, useMemo as useMemo15, useState as useState37 } from "react";
15665
+ import { useCallback as useCallback20, useEffect as useEffect33, useMemo as useMemo14, useState as useState38 } from "react";
15518
15666
  import { Fragment as Fragment15, jsx as jsx62, jsxs as jsxs56 } from "react/jsx-runtime";
15519
15667
  var formatRelative = (iso) => {
15520
15668
  const ts = Date.parse(iso);
@@ -15545,10 +15693,10 @@ function SessionList({
15545
15693
  const toggleFavoriteSession = useUIStore((s) => s.toggleFavoriteSession);
15546
15694
  const sessionNicknames = useUIStore((s) => s.sessionNicknames);
15547
15695
  const setSessionNickname = useUIStore((s) => s.setSessionNickname);
15548
- const [renamingId, setRenamingId] = useState37(null);
15549
- const [renameDraft, setRenameDraft] = useState37("");
15550
- const [resumingId, setResumingId] = useState37(null);
15551
- useEffect32(() => {
15696
+ const [renamingId, setRenamingId] = useState38(null);
15697
+ const [renameDraft, setRenameDraft] = useState38("");
15698
+ const [resumingId, setResumingId] = useState38(null);
15699
+ useEffect33(() => {
15552
15700
  if (resumingId && historyEntries.some((e) => e.id === resumingId && e.isCurrent)) {
15553
15701
  setResumingId(null);
15554
15702
  }
@@ -15561,7 +15709,7 @@ function SessionList({
15561
15709
  },
15562
15710
  [resumeSession]
15563
15711
  );
15564
- const emptySessionIds = useMemo15(
15712
+ const emptySessionIds = useMemo14(
15565
15713
  () => getEmptySessionIds(historyEntries),
15566
15714
  [historyEntries]
15567
15715
  );
@@ -15775,8 +15923,8 @@ function HistoryPanel() {
15775
15923
  const { listSessions, resumeSession, deleteSession } = useWebSocket();
15776
15924
  const setCurrentView = useUIStore((s) => s.setCurrentView);
15777
15925
  const activeSessionId = useSessionStore((s) => s.session?.id);
15778
- const [query, setQuery] = useState38("");
15779
- useEffect33(() => {
15926
+ const [query, setQuery] = useState39("");
15927
+ useEffect34(() => {
15780
15928
  void activeSessionId;
15781
15929
  if (wsConnected) listSessions(50);
15782
15930
  }, [wsConnected, activeSessionId, listSessions]);
@@ -15827,7 +15975,7 @@ import {
15827
15975
  Wifi as Wifi2,
15828
15976
  WifiOff as WifiOff3
15829
15977
  } from "lucide-react";
15830
- import { useCallback as useCallback21, useEffect as useEffect34, useMemo as useMemo16, useState as useState39 } from "react";
15978
+ import { useCallback as useCallback21, useEffect as useEffect35, useMemo as useMemo15, useState as useState40 } from "react";
15831
15979
  import { jsx as jsx64, jsxs as jsxs58 } from "react/jsx-runtime";
15832
15980
  function fmtCost4(v) {
15833
15981
  if (v <= 0) return "$0.000";
@@ -15954,15 +16102,15 @@ function SessionPanel() {
15954
16102
  },
15955
16103
  [localPrefs, updatePrefs]
15956
16104
  );
15957
- const [breakdownOpen, setBreakdownOpen] = useState39(false);
16105
+ const [breakdownOpen, setBreakdownOpen] = useState40(false);
15958
16106
  const startedAt = session?.startedAt ?? null;
15959
- const [now, setNow] = useState39(() => Date.now());
15960
- useEffect34(() => {
16107
+ const [now, setNow] = useState40(() => Date.now());
16108
+ useEffect35(() => {
15961
16109
  if (!startedAt) return;
15962
16110
  const t = setInterval(() => setNow(Date.now()), 1e3);
15963
16111
  return () => clearInterval(t);
15964
16112
  }, [startedAt]);
15965
- const runningAgents = useMemo16(
16113
+ const runningAgents = useMemo15(
15966
16114
  () => Array.from(fleetAgents.values()).filter((a) => a.status === "running").length,
15967
16115
  [fleetAgents]
15968
16116
  );
@@ -16331,7 +16479,7 @@ function SidePanel() {
16331
16479
  const setSidebarWidth = useUIStore((s) => s.setSidebarWidth);
16332
16480
  const wsConnected = useConfigStore((s) => s.wsConnected);
16333
16481
  const { client: client2 } = useWebSocket();
16334
- useEffect35(() => {
16482
+ useEffect36(() => {
16335
16483
  if (activeActivity !== "files" || !wsConnected) return;
16336
16484
  useFileStore.getState().setTreeLoading(true);
16337
16485
  const cwd = useSessionStore.getState().cwd;
@@ -16398,22 +16546,22 @@ function SidePanel() {
16398
16546
 
16399
16547
  // src/components/WorkspaceDock.tsx
16400
16548
  import { Bot as Bot11, GitBranch as GitBranch3, ListTodo as ListTodo2, Maximize2 as Maximize22, Rocket as Rocket4, Target as Target3, Users as Users3 } from "lucide-react";
16401
- import { useCallback as useCallback26, useEffect as useEffect41, useMemo as useMemo17, useRef as useRef24, useState as useState46 } from "react";
16549
+ import { useCallback as useCallback26, useEffect as useEffect42, useMemo as useMemo16, useRef as useRef24, useState as useState47 } from "react";
16402
16550
 
16403
16551
  // src/components/CollabPanel.tsx
16404
16552
  import { Eye as Eye2, LogIn, LogOut, MessageSquareWarning, Pause as Pause5, Play as Play6, Users as Users2 } from "lucide-react";
16405
- import { useEffect as useEffect36, useState as useState40 } from "react";
16553
+ import { useEffect as useEffect37, useState as useState41 } from "react";
16406
16554
  import { jsx as jsx66, jsxs as jsxs60 } from "react/jsx-runtime";
16407
16555
  function CollabPanel({ sessionId, className }) {
16408
- const [participants, setParticipants] = useState40([]);
16409
- const [joined, setJoined] = useState40(false);
16410
- const [joinedRole, setJoinedRole] = useState40(null);
16411
- const [error, setError] = useState40(null);
16412
- const [openAnnotationCount, setOpenAnnotationCount] = useState40(0);
16413
- const [paused, setPaused] = useState40(false);
16556
+ const [participants, setParticipants] = useState41([]);
16557
+ const [joined, setJoined] = useState41(false);
16558
+ const [joinedRole, setJoinedRole] = useState41(null);
16559
+ const [error, setError] = useState41(null);
16560
+ const [openAnnotationCount, setOpenAnnotationCount] = useState41(0);
16561
+ const [paused, setPaused] = useState41(false);
16414
16562
  const wsUrl = useConfigStore((s) => s.wsUrl);
16415
16563
  const client2 = getWSClient(wsUrl);
16416
- useEffect36(() => {
16564
+ useEffect37(() => {
16417
16565
  const offs = [];
16418
16566
  offs.push(
16419
16567
  client2.on("collab.state", (msg) => {
@@ -16701,7 +16849,7 @@ import {
16701
16849
  TrendingUp,
16702
16850
  Minus
16703
16851
  } from "lucide-react";
16704
- import { useEffect as useEffect37, useState as useState41 } from "react";
16852
+ import { useEffect as useEffect38, useState as useState42 } from "react";
16705
16853
  import { jsx as jsx67, jsxs as jsxs61 } from "react/jsx-runtime";
16706
16854
  var TREND_ICON = {
16707
16855
  up: /* @__PURE__ */ jsx67(TrendingUp, { className: "h-3.5 w-3.5 text-emerald-500" }),
@@ -16736,8 +16884,8 @@ var STATE_CONFIG = {
16736
16884
  }
16737
16885
  };
16738
16886
  function GoalPanel({ goal, className }) {
16739
- const [collapsed, setCollapsed] = useState41(false);
16740
- useEffect37(() => {
16887
+ const [collapsed, setCollapsed] = useState42(false);
16888
+ useEffect38(() => {
16741
16889
  const ws = getWSClient();
16742
16890
  ws?.send?.({ type: "goal.get" });
16743
16891
  const timer = setInterval(() => {
@@ -16745,7 +16893,7 @@ function GoalPanel({ goal, className }) {
16745
16893
  }, 1e4);
16746
16894
  return () => clearInterval(timer);
16747
16895
  }, []);
16748
- useEffect37(() => {
16896
+ useEffect38(() => {
16749
16897
  if (!goal || goal.goalState === "completed" || goal.goalState === "failed" || goal.goalState === "abandoned") {
16750
16898
  setCollapsed(true);
16751
16899
  }
@@ -16865,11 +17013,11 @@ function GoalPanel({ goal, className }) {
16865
17013
  }
16866
17014
 
16867
17015
  // src/components/WorkDashboard.tsx
16868
- import { useState as useState45 } from "react";
17016
+ import { useState as useState46 } from "react";
16869
17017
 
16870
17018
  // src/components/TodosPanel.tsx
16871
17019
  import { CheckCircle2 as CheckCircle214, Circle as Circle7, Clock as Clock13, Trash2 as Trash25 } from "lucide-react";
16872
- import { useCallback as useCallback23, useEffect as useEffect38, useRef as useRef21, useState as useState42 } from "react";
17020
+ import { useCallback as useCallback23, useEffect as useEffect39, useRef as useRef21, useState as useState43 } from "react";
16873
17021
  import { jsx as jsx68, jsxs as jsxs62 } from "react/jsx-runtime";
16874
17022
  var STATUS_ORDER = {
16875
17023
  in_progress: 0,
@@ -16877,11 +17025,11 @@ var STATUS_ORDER = {
16877
17025
  completed: 2
16878
17026
  };
16879
17027
  function TodosPanel() {
16880
- const [todos, setTodos] = useState42([]);
16881
- const [collapsedSections, setCollapsedSections] = useState42(/* @__PURE__ */ new Set());
17028
+ const [todos, setTodos] = useState43([]);
17029
+ const [collapsedSections, setCollapsedSections] = useState43(/* @__PURE__ */ new Set());
16882
17030
  const ws = getWSClient();
16883
17031
  const offRef = useRef21(null);
16884
- useEffect38(() => {
17032
+ useEffect39(() => {
16885
17033
  ws.send({ type: "todos.get" });
16886
17034
  offRef.current = ws.on("todos.updated", (msg) => {
16887
17035
  const payload = msg?.payload;
@@ -17014,7 +17162,7 @@ function TodosPanel() {
17014
17162
 
17015
17163
  // src/components/TasksPanel.tsx
17016
17164
  import { CheckCircle2 as CheckCircle215, Circle as Circle8, Clock as Clock14, Pause as Pause6, XCircle as XCircle8, RotateCcw as RotateCcw5 } from "lucide-react";
17017
- import { useCallback as useCallback24, useEffect as useEffect39, useRef as useRef22, useState as useState43 } from "react";
17165
+ import { useCallback as useCallback24, useEffect as useEffect40, useRef as useRef22, useState as useState44 } from "react";
17018
17166
  import { jsx as jsx69, jsxs as jsxs63 } from "react/jsx-runtime";
17019
17167
  var STATUS_CONFIG2 = {
17020
17168
  pending: { icon: /* @__PURE__ */ jsx69(Circle8, { className: "w-3.5 h-3.5" }), label: "Pending", color: "text-muted-foreground/50" },
@@ -17039,11 +17187,11 @@ var TYPE_ICON = {
17039
17187
  chore: "\u{1F527}"
17040
17188
  };
17041
17189
  function TasksPanel() {
17042
- const [tasks, setTasks] = useState43([]);
17043
- const [collapsed, setCollapsed] = useState43(/* @__PURE__ */ new Set());
17190
+ const [tasks, setTasks] = useState44([]);
17191
+ const [collapsed, setCollapsed] = useState44(/* @__PURE__ */ new Set());
17044
17192
  const ws = getWSClient();
17045
17193
  const offRef = useRef22(null);
17046
- useEffect39(() => {
17194
+ useEffect40(() => {
17047
17195
  ws.getTasks();
17048
17196
  offRef.current = ws.on("tasks.updated", (msg) => {
17049
17197
  const payload = msg?.payload;
@@ -17183,7 +17331,7 @@ function TasksPanel() {
17183
17331
 
17184
17332
  // src/components/PlanPanel.tsx
17185
17333
  import { CheckCircle2 as CheckCircle216, Circle as Circle9, Clock as Clock15 } from "lucide-react";
17186
- import { useCallback as useCallback25, useEffect as useEffect40, useRef as useRef23, useState as useState44 } from "react";
17334
+ import { useCallback as useCallback25, useEffect as useEffect41, useRef as useRef23, useState as useState45 } from "react";
17187
17335
  import { jsx as jsx70, jsxs as jsxs64 } from "react/jsx-runtime";
17188
17336
  var STATUS_CONFIG3 = {
17189
17337
  open: { icon: /* @__PURE__ */ jsx70(Circle9, { className: "w-3.5 h-3.5" }), label: "Open", color: "text-muted-foreground/50" },
@@ -17191,11 +17339,11 @@ var STATUS_CONFIG3 = {
17191
17339
  done: { icon: /* @__PURE__ */ jsx70(CheckCircle216, { className: "w-3.5 h-3.5" }), label: "Done", color: "text-emerald-500" }
17192
17340
  };
17193
17341
  function PlanPanel() {
17194
- const [items, setItems] = useState44([]);
17195
- const [collapsed, setCollapsed] = useState44(/* @__PURE__ */ new Set());
17342
+ const [items, setItems] = useState45([]);
17343
+ const [collapsed, setCollapsed] = useState45(/* @__PURE__ */ new Set());
17196
17344
  const ws = getWSClient();
17197
17345
  const offRef = useRef23(null);
17198
- useEffect40(() => {
17346
+ useEffect41(() => {
17199
17347
  ws.getPlan();
17200
17348
  offRef.current = ws.on("plan.updated", (msg) => {
17201
17349
  const payload = msg?.payload;
@@ -17329,7 +17477,7 @@ var TABS = [
17329
17477
  { id: "plan", label: "Plan", icon: "\u{1F5FA}\uFE0F" }
17330
17478
  ];
17331
17479
  function WorkDashboard() {
17332
- const [activeTab, setActiveTab] = useState45("todos");
17480
+ const [activeTab, setActiveTab] = useState46("todos");
17333
17481
  return /* @__PURE__ */ jsxs65("div", { className: "rounded-lg border border-border bg-card/50 backdrop-blur-sm overflow-hidden", children: [
17334
17482
  /* @__PURE__ */ jsx71("div", { className: "flex border-b border-border/50 bg-muted/30", children: TABS.map((tab) => /* @__PURE__ */ jsxs65(
17335
17483
  "button",
@@ -17429,9 +17577,9 @@ function WorkspaceDock({ sessionId }) {
17429
17577
  () => toggleAutoPhaseAutonomous(!autoPhase.autonomous),
17430
17578
  [toggleAutoPhaseAutonomous, autoPhase.autonomous]
17431
17579
  );
17432
- const [worktreeView, setWorktreeView] = useState46("graph");
17580
+ const [worktreeView, setWorktreeView] = useState47("graph");
17433
17581
  const fleetTotal = fleetAgents.size;
17434
- const fleetRunning = useMemo17(
17582
+ const fleetRunning = useMemo16(
17435
17583
  () => Array.from(fleetAgents.values()).filter((a) => a.status === "running").length,
17436
17584
  [fleetAgents]
17437
17585
  );
@@ -17439,7 +17587,7 @@ function WorkspaceDock({ sessionId }) {
17439
17587
  const todosActive = todos.some((t) => t.status === "in_progress");
17440
17588
  const phasesActive = autoPhase.phases.length > 0;
17441
17589
  const prevPhaseCount = useRef24(autoPhase.phases.length);
17442
- useEffect41(() => {
17590
+ useEffect42(() => {
17443
17591
  const ui = useUIStore.getState();
17444
17592
  if (prevPhaseCount.current === 0 && autoPhase.phases.length > 0 && ui.dockSection === null) {
17445
17593
  ui.setDockSection("autophase");
@@ -17580,285 +17728,33 @@ function WorkspaceDock({ sessionId }) {
17580
17728
  ] });
17581
17729
  }
17582
17730
 
17583
- // src/components/AgentsMonitor.tsx
17584
- import { Bot as Bot12, ChevronLeft, ChevronRight as ChevronRight10, Cpu as Cpu14, Crown as Crown2, Loader2 as Loader211, Wrench as Wrench9, X as X16, Zap as Zap10 } from "lucide-react";
17585
- import { useCallback as useCallback27, useEffect as useEffect42, useMemo as useMemo18, useState as useState47 } from "react";
17731
+ // src/components/FleetMonitor.tsx
17732
+ import {
17733
+ Activity as Activity5,
17734
+ ArrowRight as ArrowRight6,
17735
+ Bot as Bot12,
17736
+ ChevronRight as ChevronRight11,
17737
+ Clock as Clock16,
17738
+ Cpu as Cpu14,
17739
+ Crown as Crown2,
17740
+ Database as Database4,
17741
+ DollarSign as DollarSign2,
17742
+ FolderOpen as FolderOpen5,
17743
+ Loader2 as Loader211,
17744
+ Timer as Timer3,
17745
+ Users as Users4,
17746
+ Wrench as Wrench9,
17747
+ XCircle as XCircle9,
17748
+ Zap as Zap10
17749
+ } from "lucide-react";
17750
+ import { useCallback as useCallback27, useEffect as useEffect43, useMemo as useMemo17, useState as useState48 } from "react";
17751
+
17752
+ // src/components/ui/dropdown-menu.tsx
17753
+ import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
17754
+ import { Check as Check8, ChevronRight as ChevronRight10, Circle as Circle10 } from "lucide-react";
17755
+ import * as React6 from "react";
17586
17756
  import { jsx as jsx73, jsxs as jsxs67 } from "react/jsx-runtime";
17587
- function fmtCost5(v) {
17588
- if (v <= 0) return "$0";
17589
- if (v >= 0.01) return `$${v.toFixed(3)}`;
17590
- return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
17591
- }
17592
- function fmtDuration3(ms) {
17593
- const sec = Math.floor(ms / 1e3);
17594
- if (sec < 60) return `${sec}s`;
17595
- const min = Math.floor(sec / 60);
17596
- return `${min}m ${sec % 60}s`;
17597
- }
17598
- var STATUS_META5 = {
17599
- running: { led: "bg-[hsl(var(--success))]", label: "running", pulse: true, badge: "bg-[hsl(var(--success))]/15 text-[hsl(var(--success))]" },
17600
- completed: { led: "bg-[hsl(var(--success))]", label: "done", pulse: false, badge: "bg-muted text-muted-foreground" },
17601
- failed: { led: "bg-destructive", label: "failed", pulse: false, badge: "bg-destructive/15 text-destructive" },
17602
- timeout: { led: "bg-[hsl(var(--warning))]", label: "timeout", pulse: false, badge: "bg-amber-500/15 text-amber-500" },
17603
- stopped: { led: "bg-muted-foreground", label: "stopped", pulse: false, badge: "bg-muted text-muted-foreground" }
17604
- };
17605
- function AgentCard2({ agent, isLeader }) {
17606
- const meta2 = STATUS_META5[agent.status];
17607
- const active = agent.status === "running";
17608
- const elapsed = Date.now() - agent.startedAt;
17609
- const toolLogSlice = agent.toolLog.slice(0, 8);
17610
- const last8Tools = [...toolLogSlice].reverse();
17611
- return /* @__PURE__ */ jsxs67("div", { className: cn(
17612
- "rounded-xl border p-4 space-y-3",
17613
- active ? "border-primary/20 bg-primary/[0.02]" : "border-border bg-card",
17614
- isLeader && "ring-2 ring-amber-500/30"
17615
- ), children: [
17616
- /* @__PURE__ */ jsxs67("div", { className: "flex items-start justify-between", children: [
17617
- /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2", children: [
17618
- /* @__PURE__ */ jsx73("span", { className: cn("led", meta2.led, meta2.pulse && "led-pulse", "mt-0.5") }),
17619
- /* @__PURE__ */ jsxs67("div", { children: [
17620
- /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-1.5", children: [
17621
- /* @__PURE__ */ jsx73("span", { className: "text-sm font-semibold", children: agent.name }),
17622
- isLeader && /* @__PURE__ */ jsx73(Crown2, { className: "h-3.5 w-3.5 text-amber-500", "aria-label": "leader" }),
17623
- agent.extensions > 0 && /* @__PURE__ */ jsxs67("span", { className: "inline-flex items-center gap-0.5 px-1.5 py-0.5 rounded-full bg-amber-500/15 text-[10px] text-amber-600 dark:text-amber-400 font-medium", children: [
17624
- /* @__PURE__ */ jsx73(Zap10, { className: "h-2.5 w-2.5" }),
17625
- "\xD7",
17626
- agent.extensions
17627
- ] })
17628
- ] }),
17629
- /* @__PURE__ */ jsx73("span", { className: cn("inline-block mt-0.5 px-1.5 py-0.5 rounded text-[10px] font-medium", meta2.badge), children: meta2.label })
17630
- ] })
17631
- ] }),
17632
- /* @__PURE__ */ jsx73("div", { className: "flex items-center gap-1 text-[10px] text-muted-foreground", children: isLeader && /* @__PURE__ */ jsx73("span", { className: "text-[9px] bg-amber-500/15 text-amber-600 dark:text-amber-400 px-1.5 py-0.5 rounded", children: "LEADER" }) })
17633
- ] }),
17634
- agent.description && /* @__PURE__ */ jsx73("p", { className: "text-xs text-muted-foreground leading-relaxed line-clamp-2", children: agent.description }),
17635
- agent.budgetWarning && /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-amber-500/10 border border-amber-500/20 text-xs", children: [
17636
- /* @__PURE__ */ jsx73(Zap10, { className: "h-3.5 w-3.5 text-amber-500 shrink-0" }),
17637
- /* @__PURE__ */ jsxs67("span", { className: "text-amber-600 dark:text-amber-400", children: [
17638
- "\u26A1 hitting ",
17639
- /* @__PURE__ */ jsx73("strong", { children: agent.budgetWarning.kind }),
17640
- " limit (",
17641
- agent.budgetWarning.used,
17642
- "/",
17643
- agent.budgetWarning.limit,
17644
- ") \u2014 extending"
17645
- ] })
17646
- ] }),
17647
- agent.failureReason && /* @__PURE__ */ jsx73("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-destructive/10 border border-destructive/20 text-xs", children: /* @__PURE__ */ jsxs67("span", { className: "text-destructive font-medium", children: [
17648
- "\u2717 ",
17649
- agent.failureReason
17650
- ] }) }),
17651
- /* @__PURE__ */ jsxs67("div", { className: "grid grid-cols-4 gap-2", children: [
17652
- /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
17653
- /* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Iters" }),
17654
- /* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.iteration })
17655
- ] }),
17656
- /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
17657
- /* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Tools" }),
17658
- /* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.toolCalls })
17659
- ] }),
17660
- /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
17661
- /* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Cost" }),
17662
- /* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtCost5(agent.costUsd) })
17663
- ] }),
17664
- /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
17665
- /* @__PURE__ */ jsx73("div", { className: "text-[10px] text-muted-foreground", children: "Elapsed" }),
17666
- /* @__PURE__ */ jsx73("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtDuration3(elapsed) })
17667
- ] })
17668
- ] }),
17669
- /* @__PURE__ */ jsxs67("div", { className: "space-y-1.5", children: [
17670
- /* @__PURE__ */ jsxs67("div", { className: "flex items-center justify-between", children: [
17671
- /* @__PURE__ */ jsx73("span", { className: "text-[10px] text-muted-foreground", children: "Activity (12 bins)" }),
17672
- /* @__PURE__ */ jsx73(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" })
17673
- ] }),
17674
- /* @__PURE__ */ jsx73(ContextBar, { pct: agent.ctxPct, tokens: agent.ctxTokens, maxTokens: agent.maxContext })
17675
- ] }),
17676
- (agent.provider || agent.model) && /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
17677
- /* @__PURE__ */ jsx73(Cpu14, { className: "h-3 w-3" }),
17678
- /* @__PURE__ */ jsxs67("span", { className: "font-mono", children: [
17679
- agent.provider ?? "?",
17680
- "/",
17681
- agent.model ?? "?"
17682
- ] })
17683
- ] }),
17684
- (agent.currentTool || agent.lastTool) && /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
17685
- /* @__PURE__ */ jsx73(Wrench9, { className: cn("h-3 w-3", active && "animate-pulse text-primary") }),
17686
- /* @__PURE__ */ jsx73("span", { className: "font-mono", children: agent.currentTool ?? agent.lastTool }),
17687
- active && /* @__PURE__ */ jsx73(Loader211, { className: "h-3 w-3 animate-spin" })
17688
- ] }),
17689
- agent.partialText && active && /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
17690
- /* @__PURE__ */ jsx73("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Streaming output" }),
17691
- /* @__PURE__ */ jsx73("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-3 leading-relaxed", children: agent.partialText })
17692
- ] }),
17693
- last8Tools.length > 0 && /* @__PURE__ */ jsxs67("div", { className: "space-y-1", children: [
17694
- /* @__PURE__ */ jsx73("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider", children: "Recent tools" }),
17695
- /* @__PURE__ */ jsx73("div", { className: "space-y-0.5", children: last8Tools.map((tool, i) => /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2 text-[10px] font-mono", children: [
17696
- /* @__PURE__ */ jsx73("span", { className: cn("shrink-0", tool.ok ? "text-[hsl(var(--success))]" : "text-destructive"), children: tool.ok ? "\u2713" : "\u2717" }),
17697
- /* @__PURE__ */ jsx73("span", { className: "text-muted-foreground truncate", children: tool.name }),
17698
- /* @__PURE__ */ jsx73("span", { className: "ml-auto tabular-nums text-muted-foreground shrink-0", children: tool.durationMs >= 1e3 ? `${(tool.durationMs / 1e3).toFixed(1)}s` : `${tool.durationMs}ms` })
17699
- ] }, i)) })
17700
- ] }),
17701
- agent.finalText && !active && /* @__PURE__ */ jsxs67("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
17702
- /* @__PURE__ */ jsx73("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Final output" }),
17703
- /* @__PURE__ */ jsx73("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-4 leading-relaxed", children: agent.finalText })
17704
- ] })
17705
- ] });
17706
- }
17707
- function AgentsMonitor({ onClose }) {
17708
- const fleetAgents = useFleetStore((s) => s.agents);
17709
- const leaderId = useFleetStore((s) => s.leaderId);
17710
- const [selectedIdx, setSelectedIdx] = useState47(0);
17711
- const fleetList = useMemo18(() => {
17712
- const arr = Array.from(fleetAgents.values());
17713
- arr.sort((x, y) => {
17714
- if (x.id === leaderId) return -1;
17715
- if (y.id === leaderId) return 1;
17716
- const xa = x.status === "running" ? 0 : 1;
17717
- const ya = y.status === "running" ? 0 : 1;
17718
- if (xa !== ya) return xa - ya;
17719
- return x.startedAt - y.startedAt;
17720
- });
17721
- return arr;
17722
- }, [fleetAgents, leaderId]);
17723
- const handleKeyDown = useCallback27(
17724
- (e) => {
17725
- if (e.key === "Escape") {
17726
- onClose();
17727
- return;
17728
- }
17729
- if (e.key === "ArrowDown") {
17730
- e.preventDefault();
17731
- setSelectedIdx((i) => Math.min(i + 1, fleetList.length - 1));
17732
- return;
17733
- }
17734
- if (e.key === "ArrowUp") {
17735
- e.preventDefault();
17736
- setSelectedIdx((i) => Math.max(i - 1, 0));
17737
- return;
17738
- }
17739
- },
17740
- [fleetList.length, onClose]
17741
- );
17742
- useEffect42(() => {
17743
- const handleGlobal = (e) => {
17744
- if (e.key === "Escape") onClose();
17745
- };
17746
- window.addEventListener("keydown", handleGlobal);
17747
- return () => window.removeEventListener("keydown", handleGlobal);
17748
- }, [onClose]);
17749
- const selectedAgent = fleetList[selectedIdx] ?? null;
17750
- return /* @__PURE__ */ jsxs67(
17751
- "div",
17752
- {
17753
- className: "fixed inset-0 z-50 flex flex-col bg-background/95 backdrop-blur-md",
17754
- onKeyDown: handleKeyDown,
17755
- tabIndex: -1,
17756
- children: [
17757
- /* @__PURE__ */ jsxs67("div", { className: "flex items-center justify-between px-4 py-3 border-b bg-card/80 backdrop-blur shrink-0", children: [
17758
- /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-3", children: [
17759
- /* @__PURE__ */ jsx73(Bot12, { className: "h-5 w-5 text-primary" }),
17760
- /* @__PURE__ */ jsx73("h2", { className: "text-sm font-semibold", children: "Agents Monitor" }),
17761
- /* @__PURE__ */ jsxs67("span", { className: "text-xs text-muted-foreground", children: [
17762
- fleetList.length,
17763
- " total"
17764
- ] })
17765
- ] }),
17766
- /* @__PURE__ */ jsxs67("div", { className: "flex items-center gap-2", children: [
17767
- /* @__PURE__ */ jsx73(
17768
- "button",
17769
- {
17770
- type: "button",
17771
- onClick: () => setSelectedIdx((i) => Math.max(i - 1, 0)),
17772
- className: "p-1.5 rounded-md hover:bg-muted transition-colors disabled:opacity-30",
17773
- disabled: selectedIdx === 0,
17774
- "aria-label": "Previous agent",
17775
- children: /* @__PURE__ */ jsx73(ChevronLeft, { className: "h-4 w-4" })
17776
- }
17777
- ),
17778
- /* @__PURE__ */ jsx73("span", { className: "text-xs tabular-nums text-muted-foreground font-mono", children: fleetList.length > 0 ? `${selectedIdx + 1}/${fleetList.length}` : "0/0" }),
17779
- /* @__PURE__ */ jsx73(
17780
- "button",
17781
- {
17782
- type: "button",
17783
- onClick: () => setSelectedIdx((i) => Math.min(i + 1, fleetList.length - 1)),
17784
- className: "p-1.5 rounded-md hover:bg-muted transition-colors disabled:opacity-30",
17785
- disabled: selectedIdx >= fleetList.length - 1,
17786
- "aria-label": "Next agent",
17787
- children: /* @__PURE__ */ jsx73(ChevronRight10, { className: "h-4 w-4" })
17788
- }
17789
- ),
17790
- /* @__PURE__ */ jsx73(
17791
- "button",
17792
- {
17793
- type: "button",
17794
- onClick: onClose,
17795
- className: "p-1.5 rounded-md hover:bg-muted transition-colors ml-2",
17796
- "aria-label": "Close agents monitor",
17797
- children: /* @__PURE__ */ jsx73(X16, { className: "h-4 w-4" })
17798
- }
17799
- )
17800
- ] })
17801
- ] }),
17802
- /* @__PURE__ */ jsx73("div", { className: "flex-1 overflow-y-auto p-4", children: fleetList.length === 0 ? /* @__PURE__ */ jsxs67("div", { className: "flex flex-col items-center justify-center h-full text-muted-foreground", children: [
17803
- /* @__PURE__ */ jsx73(Bot12, { className: "h-12 w-12 mb-3 opacity-20" }),
17804
- /* @__PURE__ */ jsx73("p", { className: "text-sm font-medium", children: "No agents active" })
17805
- ] }) : selectedAgent ? /* @__PURE__ */ jsx73("div", { className: "max-w-2xl mx-auto", children: /* @__PURE__ */ jsx73(AgentCard2, { agent: selectedAgent, isLeader: selectedAgent.id === leaderId }) }) : null }),
17806
- fleetList.length > 0 && /* @__PURE__ */ jsxs67("div", { className: "border-t bg-card/80 backdrop-blur shrink-0", children: [
17807
- /* @__PURE__ */ jsx73("div", { className: "px-4 py-2 flex items-center gap-2 overflow-x-auto", children: fleetList.map((agent, i) => /* @__PURE__ */ jsxs67(
17808
- "button",
17809
- {
17810
- type: "button",
17811
- onClick: () => setSelectedIdx(i),
17812
- className: cn(
17813
- "shrink-0 flex items-center gap-1.5 px-2 py-1 rounded-md text-[10px] transition-colors",
17814
- i === selectedIdx ? "bg-primary/15 text-primary ring-1 ring-primary/40" : "hover:bg-accent text-muted-foreground"
17815
- ),
17816
- children: [
17817
- /* @__PURE__ */ jsx73("span", { className: cn("led", STATUS_META5[agent.status].led, STATUS_META5[agent.status].pulse && "led-pulse", "shrink-0") }),
17818
- /* @__PURE__ */ jsx73("span", { children: agent.name }),
17819
- agent.id === leaderId && /* @__PURE__ */ jsx73(Crown2, { className: "h-2.5 w-2.5 text-amber-500 shrink-0" })
17820
- ]
17821
- },
17822
- agent.id
17823
- )) }),
17824
- /* @__PURE__ */ jsxs67("div", { className: "px-4 py-1.5 border-t text-[10px] text-muted-foreground flex items-center gap-4", children: [
17825
- /* @__PURE__ */ jsx73("span", { children: "\u2190\u2192 page" }),
17826
- /* @__PURE__ */ jsx73("span", { children: "\u2191\u2193 navigate list" }),
17827
- /* @__PURE__ */ jsx73("span", { children: "Esc close" })
17828
- ] })
17829
- ] })
17830
- ]
17831
- }
17832
- );
17833
- }
17834
-
17835
- // src/components/FleetMonitor.tsx
17836
- import {
17837
- Activity as Activity5,
17838
- ArrowRight as ArrowRight6,
17839
- Bot as Bot13,
17840
- ChevronRight as ChevronRight12,
17841
- Clock as Clock17,
17842
- Cpu as Cpu15,
17843
- Crown as Crown3,
17844
- Database as Database4,
17845
- DollarSign as DollarSign3,
17846
- FolderOpen as FolderOpen5,
17847
- Loader2 as Loader212,
17848
- Timer as Timer2,
17849
- Users as Users4,
17850
- Wrench as Wrench10,
17851
- XCircle as XCircle9,
17852
- Zap as Zap11
17853
- } from "lucide-react";
17854
- import { useCallback as useCallback28, useEffect as useEffect43, useMemo as useMemo19, useState as useState48 } from "react";
17855
-
17856
- // src/components/ui/dropdown-menu.tsx
17857
- import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
17858
- import { Check as Check8, ChevronRight as ChevronRight11, Circle as Circle10 } from "lucide-react";
17859
- import * as React6 from "react";
17860
- import { jsx as jsx74, jsxs as jsxs68 } from "react/jsx-runtime";
17861
- var DropdownMenuSubTrigger = React6.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs68(
17757
+ var DropdownMenuSubTrigger = React6.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs67(
17862
17758
  DropdownMenuPrimitive.SubTrigger,
17863
17759
  {
17864
17760
  ref,
@@ -17870,12 +17766,12 @@ var DropdownMenuSubTrigger = React6.forwardRef(({ className, inset, children, ..
17870
17766
  ...props,
17871
17767
  children: [
17872
17768
  children,
17873
- /* @__PURE__ */ jsx74(ChevronRight11, { className: "ml-auto h-4 w-4" })
17769
+ /* @__PURE__ */ jsx73(ChevronRight10, { className: "ml-auto h-4 w-4" })
17874
17770
  ]
17875
17771
  }
17876
17772
  ));
17877
17773
  DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
17878
- var DropdownMenuSubContent = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx74(
17774
+ var DropdownMenuSubContent = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx73(
17879
17775
  DropdownMenuPrimitive.SubContent,
17880
17776
  {
17881
17777
  ref,
@@ -17887,7 +17783,7 @@ var DropdownMenuSubContent = React6.forwardRef(({ className, ...props }, ref) =>
17887
17783
  }
17888
17784
  ));
17889
17785
  DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
17890
- var DropdownMenuContent = React6.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx74(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx74(
17786
+ var DropdownMenuContent = React6.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx73(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx73(
17891
17787
  DropdownMenuPrimitive.Content,
17892
17788
  {
17893
17789
  ref,
@@ -17900,7 +17796,7 @@ var DropdownMenuContent = React6.forwardRef(({ className, sideOffset = 4, ...pro
17900
17796
  }
17901
17797
  ) }));
17902
17798
  DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
17903
- var DropdownMenuItem = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx74(
17799
+ var DropdownMenuItem = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx73(
17904
17800
  DropdownMenuPrimitive.Item,
17905
17801
  {
17906
17802
  ref,
@@ -17913,7 +17809,7 @@ var DropdownMenuItem = React6.forwardRef(({ className, inset, ...props }, ref) =
17913
17809
  }
17914
17810
  ));
17915
17811
  DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
17916
- var DropdownMenuCheckboxItem = React6.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs68(
17812
+ var DropdownMenuCheckboxItem = React6.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs67(
17917
17813
  DropdownMenuPrimitive.CheckboxItem,
17918
17814
  {
17919
17815
  ref,
@@ -17924,13 +17820,13 @@ var DropdownMenuCheckboxItem = React6.forwardRef(({ className, children, checked
17924
17820
  checked,
17925
17821
  ...props,
17926
17822
  children: [
17927
- /* @__PURE__ */ jsx74("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx74(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx74(Check8, { className: "h-4 w-4" }) }) }),
17823
+ /* @__PURE__ */ jsx73("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx73(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx73(Check8, { className: "h-4 w-4" }) }) }),
17928
17824
  children
17929
17825
  ]
17930
17826
  }
17931
17827
  ));
17932
17828
  DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
17933
- var DropdownMenuRadioItem = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs68(
17829
+ var DropdownMenuRadioItem = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs67(
17934
17830
  DropdownMenuPrimitive.RadioItem,
17935
17831
  {
17936
17832
  ref,
@@ -17940,13 +17836,13 @@ var DropdownMenuRadioItem = React6.forwardRef(({ className, children, ...props }
17940
17836
  ),
17941
17837
  ...props,
17942
17838
  children: [
17943
- /* @__PURE__ */ jsx74("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx74(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx74(Circle10, { className: "h-2 w-2 fill-current" }) }) }),
17839
+ /* @__PURE__ */ jsx73("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx73(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx73(Circle10, { className: "h-2 w-2 fill-current" }) }) }),
17944
17840
  children
17945
17841
  ]
17946
17842
  }
17947
17843
  ));
17948
17844
  DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
17949
- var DropdownMenuLabel = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx74(
17845
+ var DropdownMenuLabel = React6.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx73(
17950
17846
  DropdownMenuPrimitive.Label,
17951
17847
  {
17952
17848
  ref,
@@ -17955,7 +17851,7 @@ var DropdownMenuLabel = React6.forwardRef(({ className, inset, ...props }, ref)
17955
17851
  }
17956
17852
  ));
17957
17853
  DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
17958
- var DropdownMenuSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx74(
17854
+ var DropdownMenuSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx73(
17959
17855
  DropdownMenuPrimitive.Separator,
17960
17856
  {
17961
17857
  ref,
@@ -17965,12 +17861,12 @@ var DropdownMenuSeparator = React6.forwardRef(({ className, ...props }, ref) =>
17965
17861
  ));
17966
17862
  DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
17967
17863
  var DropdownMenuShortcut = ({ className, ...props }) => {
17968
- return /* @__PURE__ */ jsx74("span", { className: cn("ml-auto text-xs tracking-widest opacity-60", className), ...props });
17864
+ return /* @__PURE__ */ jsx73("span", { className: cn("ml-auto text-xs tracking-widest opacity-60", className), ...props });
17969
17865
  };
17970
17866
  DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
17971
17867
 
17972
17868
  // src/components/ui/concurrency-gauge.tsx
17973
- import { jsx as jsx75, jsxs as jsxs69 } from "react/jsx-runtime";
17869
+ import { jsx as jsx74, jsxs as jsxs68 } from "react/jsx-runtime";
17974
17870
  function ConcurrencyGauge({
17975
17871
  current,
17976
17872
  max,
@@ -17981,14 +17877,14 @@ function ConcurrencyGauge({
17981
17877
  const empty = Math.max(0, max - filled);
17982
17878
  const pct = max > 0 ? filled / max * 100 : 0;
17983
17879
  const barColor = pct >= 90 ? "text-destructive" : pct >= 70 ? "text-[hsl(var(--warning))]" : "text-[hsl(var(--success))]";
17984
- return /* @__PURE__ */ jsxs69("span", { className, title: `Fleet concurrency: ${current}/${max}`, children: [
17985
- /* @__PURE__ */ jsxs69("span", { "aria-hidden": "true", className: "font-mono text-[10px] tracking-tight", children: [
17880
+ return /* @__PURE__ */ jsxs68("span", { className, title: `Fleet concurrency: ${current}/${max}`, children: [
17881
+ /* @__PURE__ */ jsxs68("span", { "aria-hidden": "true", className: "font-mono text-[10px] tracking-tight", children: [
17986
17882
  "[",
17987
- /* @__PURE__ */ jsx75("span", { className: barColor, children: "\u2588".repeat(filled) }),
17988
- /* @__PURE__ */ jsx75("span", { className: "text-[hsl(var(--muted))]", children: "\u2591".repeat(empty) }),
17883
+ /* @__PURE__ */ jsx74("span", { className: barColor, children: "\u2588".repeat(filled) }),
17884
+ /* @__PURE__ */ jsx74("span", { className: "text-[hsl(var(--muted))]", children: "\u2591".repeat(empty) }),
17989
17885
  "]"
17990
17886
  ] }),
17991
- showLabel && /* @__PURE__ */ jsxs69("span", { className: "ml-1.5 tabular-nums text-[10px] text-muted-foreground font-mono", children: [
17887
+ showLabel && /* @__PURE__ */ jsxs68("span", { className: "ml-1.5 tabular-nums text-[10px] text-muted-foreground font-mono", children: [
17992
17888
  current,
17993
17889
  "/",
17994
17890
  max
@@ -17997,7 +17893,7 @@ function ConcurrencyGauge({
17997
17893
  }
17998
17894
 
17999
17895
  // src/components/ui/event-timeline.tsx
18000
- import { jsx as jsx76, jsxs as jsxs70 } from "react/jsx-runtime";
17896
+ import { jsx as jsx75, jsxs as jsxs69 } from "react/jsx-runtime";
18001
17897
  function relTime(ts) {
18002
17898
  const delta = Date.now() - ts;
18003
17899
  if (delta < 5e3) return "just now";
@@ -18018,18 +17914,18 @@ var KIND_ICONS = {
18018
17914
  function EventTimeline({ events, max = 20, className }) {
18019
17915
  const visible = events.slice(0, max);
18020
17916
  if (visible.length === 0) {
18021
- return /* @__PURE__ */ jsx76("div", { className: `py-4 text-center text-xs text-muted-foreground ${className ?? ""}`, children: "No events yet." });
17917
+ return /* @__PURE__ */ jsx75("div", { className: `py-4 text-center text-xs text-muted-foreground ${className ?? ""}`, children: "No events yet." });
18022
17918
  }
18023
- return /* @__PURE__ */ jsx76("div", { className: `space-y-0.5 overflow-y-auto max-h-48 ${className ?? ""}`, children: visible.map((ev) => /* @__PURE__ */ jsxs70(
17919
+ return /* @__PURE__ */ jsx75("div", { className: `space-y-0.5 overflow-y-auto max-h-48 ${className ?? ""}`, children: visible.map((ev) => /* @__PURE__ */ jsxs69(
18024
17920
  "div",
18025
17921
  {
18026
17922
  className: "flex items-start gap-2 text-[10px] leading-tight py-0.5 px-1 rounded hover:bg-accent/50 transition-colors",
18027
17923
  children: [
18028
- /* @__PURE__ */ jsx76("span", { className: "shrink-0 w-5 text-center", "aria-hidden": "true", children: KIND_ICONS[ev.kind] ?? "\xB7" }),
18029
- /* @__PURE__ */ jsx76("span", { className: "shrink-0 w-12 text-right text-muted-foreground font-mono tabular-nums", children: relTime(ev.timestamp) }),
18030
- /* @__PURE__ */ jsx76("span", { className: "truncate text-foreground/90", children: ev.message }),
18031
- ev.value !== void 0 && ev.kind === "tool_executed" && /* @__PURE__ */ jsx76("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground font-mono", children: ev.value >= 1e3 ? `${(ev.value / 1e3).toFixed(1)}s` : `${ev.value}ms` }),
18032
- ev.value !== void 0 && ev.kind === "ctx_pct" && /* @__PURE__ */ jsxs70("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground font-mono", children: [
17924
+ /* @__PURE__ */ jsx75("span", { className: "shrink-0 w-5 text-center", "aria-hidden": "true", children: KIND_ICONS[ev.kind] ?? "\xB7" }),
17925
+ /* @__PURE__ */ jsx75("span", { className: "shrink-0 w-12 text-right text-muted-foreground font-mono tabular-nums", children: relTime(ev.timestamp) }),
17926
+ /* @__PURE__ */ jsx75("span", { className: "truncate text-foreground/90", children: ev.message }),
17927
+ ev.value !== void 0 && ev.kind === "tool_executed" && /* @__PURE__ */ jsx75("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground font-mono", children: ev.value >= 1e3 ? `${(ev.value / 1e3).toFixed(1)}s` : `${ev.value}ms` }),
17928
+ ev.value !== void 0 && ev.kind === "ctx_pct" && /* @__PURE__ */ jsxs69("span", { className: "ml-auto shrink-0 tabular-nums text-muted-foreground font-mono", children: [
18033
17929
  ev.value,
18034
17930
  "%"
18035
17931
  ] })
@@ -18040,8 +17936,8 @@ function EventTimeline({ events, max = 20, className }) {
18040
17936
  }
18041
17937
 
18042
17938
  // src/components/FleetMonitor.tsx
18043
- import { Fragment as Fragment16, jsx as jsx77, jsxs as jsxs71 } from "react/jsx-runtime";
18044
- function fmtCost6(v) {
17939
+ import { Fragment as Fragment16, jsx as jsx76, jsxs as jsxs70 } from "react/jsx-runtime";
17940
+ function fmtCost5(v) {
18045
17941
  if (v <= 0) return "$0";
18046
17942
  if (v >= 0.01) return `$${v.toFixed(3)}`;
18047
17943
  return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
@@ -18059,7 +17955,7 @@ function fmtElapsed3(ms) {
18059
17955
  if (m > 0) return `${m}m ${s % 60}s`;
18060
17956
  return `${s}s`;
18061
17957
  }
18062
- var STATUS_META6 = {
17958
+ var STATUS_META5 = {
18063
17959
  running: { led: "bg-emerald-500", label: "running", pulse: true, color: "text-emerald-500" },
18064
17960
  completed: { led: "bg-emerald-500", label: "done", pulse: false, color: "text-emerald-500" },
18065
17961
  failed: { led: "bg-destructive", label: "failed", pulse: false, color: "text-destructive" },
@@ -18072,9 +17968,9 @@ function FleetAgentDetailPanel({
18072
17968
  }) {
18073
17969
  const [copied, setCopied] = useState48(false);
18074
17970
  const [showFullToolLog, setShowFullToolLog] = useState48(false);
18075
- const meta2 = STATUS_META6[agent.status];
17971
+ const meta2 = STATUS_META5[agent.status];
18076
17972
  const active = agent.status === "running";
18077
- const handleCopy = useCallback28(async (text) => {
17973
+ const handleCopy = useCallback27(async (text) => {
18078
17974
  try {
18079
17975
  await navigator.clipboard.writeText(text);
18080
17976
  setCopied(true);
@@ -18084,110 +17980,110 @@ function FleetAgentDetailPanel({
18084
17980
  }, []);
18085
17981
  const totalToolDuration = agent.toolLog.reduce((sum, t) => sum + t.durationMs, 0);
18086
17982
  const avgToolDuration = agent.toolLog.length > 0 ? Math.round(totalToolDuration / agent.toolLog.length) : 0;
18087
- const uniqueTools = useMemo19(() => {
17983
+ const uniqueTools = useMemo17(() => {
18088
17984
  const tools = /* @__PURE__ */ new Set();
18089
17985
  agent.toolLog.forEach((t) => tools.add(t.name));
18090
17986
  return tools.size;
18091
17987
  }, [agent.toolLog]);
18092
17988
  const outputText = agent.partialText || agent.finalText || void 0;
18093
17989
  const isStream = !agent.finalText && !!agent.partialText;
18094
- return /* @__PURE__ */ jsxs71("div", { className: "h-full flex flex-col", children: [
18095
- /* @__PURE__ */ jsxs71("div", { className: "shrink-0 border-b bg-card p-4 space-y-3", children: [
18096
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center justify-between", children: [
18097
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-3", children: [
18098
- /* @__PURE__ */ jsx77("div", { className: "flex items-center justify-center w-10 h-10 rounded-lg bg-primary/10", children: /* @__PURE__ */ jsx77(Bot13, { className: "h-5 w-5 text-primary" }) }),
18099
- /* @__PURE__ */ jsxs71("div", { children: [
18100
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2", children: [
18101
- /* @__PURE__ */ jsx77("span", { className: "text-base font-semibold", children: agent.name }),
18102
- /* @__PURE__ */ jsx77("span", { className: cn(
17990
+ return /* @__PURE__ */ jsxs70("div", { className: "h-full flex flex-col", children: [
17991
+ /* @__PURE__ */ jsxs70("div", { className: "shrink-0 border-b bg-card p-4 space-y-3", children: [
17992
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-between", children: [
17993
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3", children: [
17994
+ /* @__PURE__ */ jsx76("div", { className: "flex items-center justify-center w-10 h-10 rounded-lg bg-primary/10", children: /* @__PURE__ */ jsx76(Bot12, { className: "h-5 w-5 text-primary" }) }),
17995
+ /* @__PURE__ */ jsxs70("div", { children: [
17996
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2", children: [
17997
+ /* @__PURE__ */ jsx76("span", { className: "text-base font-semibold", children: agent.name }),
17998
+ /* @__PURE__ */ jsx76("span", { className: cn(
18103
17999
  "px-2 py-0.5 rounded text-[10px] font-medium uppercase tracking-wider",
18104
18000
  agent.status === "running" ? "bg-emerald-500/15 text-emerald-600 dark:text-emerald-400" : agent.status === "failed" || agent.status === "timeout" ? "bg-destructive/15 text-destructive" : "bg-muted text-muted-foreground"
18105
18001
  ), children: meta2.label })
18106
18002
  ] }),
18107
- /* @__PURE__ */ jsxs71("span", { className: "text-[10px] text-muted-foreground font-mono", children: [
18003
+ /* @__PURE__ */ jsxs70("span", { className: "text-[10px] text-muted-foreground font-mono", children: [
18108
18004
  "session: ",
18109
18005
  agent.sessionId?.slice(0, 12),
18110
18006
  "\u2026"
18111
18007
  ] })
18112
18008
  ] })
18113
18009
  ] }),
18114
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-[11px] text-muted-foreground", children: [
18115
- active && /* @__PURE__ */ jsxs71("span", { className: "flex items-center gap-1.5", children: [
18116
- /* @__PURE__ */ jsx77(Timer2, { className: "h-3.5 w-3.5" }),
18117
- /* @__PURE__ */ jsx77("span", { className: "tabular-nums font-mono", children: fmtElapsed3(Math.max(0, now - agent.startedAt)) })
18010
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[11px] text-muted-foreground", children: [
18011
+ active && /* @__PURE__ */ jsxs70("span", { className: "flex items-center gap-1.5", children: [
18012
+ /* @__PURE__ */ jsx76(Timer3, { className: "h-3.5 w-3.5" }),
18013
+ /* @__PURE__ */ jsx76("span", { className: "tabular-nums font-mono", children: fmtElapsed3(Math.max(0, now - agent.startedAt)) })
18118
18014
  ] }),
18119
- /* @__PURE__ */ jsx77("span", { className: cn("led", meta2.led, active && "led-pulse") })
18015
+ /* @__PURE__ */ jsx76("span", { className: cn("led", meta2.led, active && "led-pulse") })
18120
18016
  ] })
18121
18017
  ] }),
18122
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-3 px-3 py-2 rounded-lg bg-muted/30", children: [
18123
- /* @__PURE__ */ jsx77("span", { className: "text-[10px] text-muted-foreground uppercase tracking-wider", children: "Activity" }),
18124
- /* @__PURE__ */ jsx77(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" }),
18125
- agent.budgetWarning && /* @__PURE__ */ jsxs71("span", { className: "ml-auto flex items-center gap-1 text-[10px] text-amber-500", children: [
18126
- /* @__PURE__ */ jsx77(Zap11, { className: "h-3 w-3" }),
18018
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3 px-3 py-2 rounded-lg bg-muted/30", children: [
18019
+ /* @__PURE__ */ jsx76("span", { className: "text-[10px] text-muted-foreground uppercase tracking-wider", children: "Activity" }),
18020
+ /* @__PURE__ */ jsx76(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" }),
18021
+ agent.budgetWarning && /* @__PURE__ */ jsxs70("span", { className: "ml-auto flex items-center gap-1 text-[10px] text-amber-500", children: [
18022
+ /* @__PURE__ */ jsx76(Zap10, { className: "h-3 w-3" }),
18127
18023
  "budget warning"
18128
18024
  ] })
18129
18025
  ] }),
18130
- agent.description && /* @__PURE__ */ jsxs71("div", { className: "px-3 py-2 rounded-lg bg-muted/20 border border-border/50", children: [
18131
- /* @__PURE__ */ jsx77("span", { className: "text-[9px] text-muted-foreground uppercase tracking-wider", children: "Current Task" }),
18132
- /* @__PURE__ */ jsx77("p", { className: "text-xs mt-1 text-foreground/80", children: agent.description })
18026
+ agent.description && /* @__PURE__ */ jsxs70("div", { className: "px-3 py-2 rounded-lg bg-muted/20 border border-border/50", children: [
18027
+ /* @__PURE__ */ jsx76("span", { className: "text-[9px] text-muted-foreground uppercase tracking-wider", children: "Current Task" }),
18028
+ /* @__PURE__ */ jsx76("p", { className: "text-xs mt-1 text-foreground/80", children: agent.description })
18133
18029
  ] })
18134
18030
  ] }),
18135
- /* @__PURE__ */ jsxs71("div", { className: "flex-1 overflow-y-auto p-4 space-y-4", children: [
18136
- /* @__PURE__ */ jsxs71("div", { className: "grid grid-cols-2 gap-3", children: [
18137
- /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-card p-3", children: [
18138
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18139
- /* @__PURE__ */ jsx77(Cpu15, { className: "h-3 w-3" }),
18031
+ /* @__PURE__ */ jsxs70("div", { className: "flex-1 overflow-y-auto p-4 space-y-4", children: [
18032
+ /* @__PURE__ */ jsxs70("div", { className: "grid grid-cols-2 gap-3", children: [
18033
+ /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
18034
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18035
+ /* @__PURE__ */ jsx76(Cpu14, { className: "h-3 w-3" }),
18140
18036
  " Provider / Model"
18141
18037
  ] }),
18142
- /* @__PURE__ */ jsxs71("div", { className: "text-sm font-mono font-medium", children: [
18038
+ /* @__PURE__ */ jsxs70("div", { className: "text-sm font-mono font-medium", children: [
18143
18039
  agent.provider ?? "?",
18144
18040
  "/",
18145
18041
  agent.model ?? "?"
18146
18042
  ] })
18147
18043
  ] }),
18148
- /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-card p-3", children: [
18149
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18150
- /* @__PURE__ */ jsx77(Activity5, { className: "h-3 w-3" }),
18044
+ /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
18045
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18046
+ /* @__PURE__ */ jsx76(Activity5, { className: "h-3 w-3" }),
18151
18047
  " Performance"
18152
18048
  ] }),
18153
- /* @__PURE__ */ jsxs71("div", { className: "space-y-1", children: [
18154
- /* @__PURE__ */ jsxs71("div", { className: "flex justify-between text-[11px]", children: [
18155
- /* @__PURE__ */ jsx77("span", { className: "text-muted-foreground", children: "Iterations" }),
18156
- /* @__PURE__ */ jsx77("span", { className: "font-mono font-medium", children: agent.iteration })
18049
+ /* @__PURE__ */ jsxs70("div", { className: "space-y-1", children: [
18050
+ /* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
18051
+ /* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Iterations" }),
18052
+ /* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: agent.iteration })
18157
18053
  ] }),
18158
- /* @__PURE__ */ jsxs71("div", { className: "flex justify-between text-[11px]", children: [
18159
- /* @__PURE__ */ jsx77("span", { className: "text-muted-foreground", children: "Tool Calls" }),
18160
- /* @__PURE__ */ jsx77("span", { className: "font-mono font-medium", children: agent.toolCalls })
18054
+ /* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
18055
+ /* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Tool Calls" }),
18056
+ /* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: agent.toolCalls })
18161
18057
  ] }),
18162
- /* @__PURE__ */ jsxs71("div", { className: "flex justify-between text-[11px]", children: [
18163
- /* @__PURE__ */ jsx77("span", { className: "text-muted-foreground", children: "Unique Tools" }),
18164
- /* @__PURE__ */ jsx77("span", { className: "font-mono font-medium", children: uniqueTools })
18058
+ /* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
18059
+ /* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Unique Tools" }),
18060
+ /* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: uniqueTools })
18165
18061
  ] })
18166
18062
  ] })
18167
18063
  ] }),
18168
- /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-card p-3", children: [
18169
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18170
- /* @__PURE__ */ jsx77(DollarSign3, { className: "h-3 w-3" }),
18064
+ /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
18065
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18066
+ /* @__PURE__ */ jsx76(DollarSign2, { className: "h-3 w-3" }),
18171
18067
  " Cost"
18172
18068
  ] }),
18173
- /* @__PURE__ */ jsx77("div", { className: "text-lg font-mono font-bold text-emerald-500", children: fmtCost6(agent.costUsd) }),
18174
- /* @__PURE__ */ jsxs71("div", { className: "text-[10px] text-muted-foreground mt-1", children: [
18069
+ /* @__PURE__ */ jsx76("div", { className: "text-lg font-mono font-bold text-emerald-500", children: fmtCost5(agent.costUsd) }),
18070
+ /* @__PURE__ */ jsxs70("div", { className: "text-[10px] text-muted-foreground mt-1", children: [
18175
18071
  "avg ",
18176
18072
  avgToolDuration,
18177
18073
  "ms per tool"
18178
18074
  ] })
18179
18075
  ] }),
18180
- /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-card p-3", children: [
18181
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18182
- /* @__PURE__ */ jsx77(Database4, { className: "h-3 w-3" }),
18076
+ /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card p-3", children: [
18077
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-[9px] text-muted-foreground uppercase tracking-wider mb-2", children: [
18078
+ /* @__PURE__ */ jsx76(Database4, { className: "h-3 w-3" }),
18183
18079
  " Context"
18184
18080
  ] }),
18185
- /* @__PURE__ */ jsxs71("div", { className: "space-y-2", children: [
18186
- /* @__PURE__ */ jsxs71("div", { className: "flex justify-between text-[11px]", children: [
18187
- /* @__PURE__ */ jsx77("span", { className: "text-muted-foreground", children: "Tokens" }),
18188
- /* @__PURE__ */ jsx77("span", { className: "font-mono font-medium", children: fmtTok3(agent.ctxTokens) })
18081
+ /* @__PURE__ */ jsxs70("div", { className: "space-y-2", children: [
18082
+ /* @__PURE__ */ jsxs70("div", { className: "flex justify-between text-[11px]", children: [
18083
+ /* @__PURE__ */ jsx76("span", { className: "text-muted-foreground", children: "Tokens" }),
18084
+ /* @__PURE__ */ jsx76("span", { className: "font-mono font-medium", children: fmtTok3(agent.ctxTokens) })
18189
18085
  ] }),
18190
- /* @__PURE__ */ jsx77("div", { className: "h-2 w-full rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ jsx77(
18086
+ /* @__PURE__ */ jsx76("div", { className: "h-2 w-full rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ jsx76(
18191
18087
  "div",
18192
18088
  {
18193
18089
  className: cn(
@@ -18197,34 +18093,34 @@ function FleetAgentDetailPanel({
18197
18093
  style: { width: `${Math.min(200, agent.ctxPct)}%` }
18198
18094
  }
18199
18095
  ) }),
18200
- /* @__PURE__ */ jsxs71("span", { className: "text-[10px] text-muted-foreground tabular-nums font-mono", children: [
18096
+ /* @__PURE__ */ jsxs70("span", { className: "text-[10px] text-muted-foreground tabular-nums font-mono", children: [
18201
18097
  agent.ctxPct,
18202
18098
  "% used"
18203
18099
  ] })
18204
18100
  ] })
18205
18101
  ] })
18206
18102
  ] }),
18207
- agent.currentTool && /* @__PURE__ */ jsxs71("div", { className: cn(
18103
+ agent.currentTool && /* @__PURE__ */ jsxs70("div", { className: cn(
18208
18104
  "rounded-lg border px-4 py-3 flex items-center gap-3",
18209
18105
  active ? "border-primary/30 bg-primary/[0.04]" : "border-border bg-muted/30"
18210
18106
  ), children: [
18211
- /* @__PURE__ */ jsx77(Wrench10, { className: cn("h-4 w-4", active ? "text-primary animate-pulse" : "text-muted-foreground") }),
18212
- /* @__PURE__ */ jsx77("span", { className: "text-sm font-mono font-medium", children: agent.currentTool }),
18213
- active ? /* @__PURE__ */ jsxs71("span", { className: "ml-auto flex items-center gap-1.5 text-[10px] text-primary", children: [
18214
- /* @__PURE__ */ jsx77(Loader212, { className: "h-3 w-3 animate-spin" }),
18107
+ /* @__PURE__ */ jsx76(Wrench9, { className: cn("h-4 w-4", active ? "text-primary animate-pulse" : "text-muted-foreground") }),
18108
+ /* @__PURE__ */ jsx76("span", { className: "text-sm font-mono font-medium", children: agent.currentTool }),
18109
+ active ? /* @__PURE__ */ jsxs70("span", { className: "ml-auto flex items-center gap-1.5 text-[10px] text-primary", children: [
18110
+ /* @__PURE__ */ jsx76(Loader211, { className: "h-3 w-3 animate-spin" }),
18215
18111
  " running\u2026"
18216
- ] }) : /* @__PURE__ */ jsx77("span", { className: "ml-auto text-[10px] text-muted-foreground", children: "completed" })
18112
+ ] }) : /* @__PURE__ */ jsx76("span", { className: "ml-auto text-[10px] text-muted-foreground", children: "completed" })
18217
18113
  ] }),
18218
- outputText ? /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-card", children: [
18219
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center justify-between px-4 py-2 border-b bg-muted/30", children: [
18220
- /* @__PURE__ */ jsx77("span", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider flex items-center gap-2", children: isStream ? /* @__PURE__ */ jsxs71(Fragment16, { children: [
18221
- /* @__PURE__ */ jsx77("span", { className: "w-2 h-2 rounded-full bg-blue-500 animate-pulse" }),
18114
+ outputText ? /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card", children: [
18115
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-between px-4 py-2 border-b bg-muted/30", children: [
18116
+ /* @__PURE__ */ jsx76("span", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider flex items-center gap-2", children: isStream ? /* @__PURE__ */ jsxs70(Fragment16, { children: [
18117
+ /* @__PURE__ */ jsx76("span", { className: "w-2 h-2 rounded-full bg-blue-500 animate-pulse" }),
18222
18118
  "Live Output"
18223
- ] }) : /* @__PURE__ */ jsxs71(Fragment16, { children: [
18224
- /* @__PURE__ */ jsx77(FolderOpen5, { className: "h-3 w-3" }),
18119
+ ] }) : /* @__PURE__ */ jsxs70(Fragment16, { children: [
18120
+ /* @__PURE__ */ jsx76(FolderOpen5, { className: "h-3 w-3" }),
18225
18121
  "Final Output"
18226
18122
  ] }) }),
18227
- /* @__PURE__ */ jsx77(
18123
+ /* @__PURE__ */ jsx76(
18228
18124
  "button",
18229
18125
  {
18230
18126
  type: "button",
@@ -18234,16 +18130,16 @@ function FleetAgentDetailPanel({
18234
18130
  }
18235
18131
  )
18236
18132
  ] }),
18237
- /* @__PURE__ */ jsx77("pre", { className: "p-4 text-xs whitespace-pre-wrap font-mono text-foreground/80 leading-relaxed max-h-64 overflow-y-auto", children: outputText })
18238
- ] }) : active ? /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border border-dashed border-border p-6 text-center", children: [
18239
- /* @__PURE__ */ jsx77(Loader212, { className: "h-6 w-6 mx-auto mb-2 text-muted-foreground/50 animate-spin" }),
18240
- /* @__PURE__ */ jsx77("span", { className: "text-xs text-muted-foreground", children: "Waiting for output\u2026" })
18133
+ /* @__PURE__ */ jsx76("pre", { className: "p-4 text-xs whitespace-pre-wrap font-mono text-foreground/80 leading-relaxed max-h-64 overflow-y-auto", children: outputText })
18134
+ ] }) : active ? /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border border-dashed border-border p-6 text-center", children: [
18135
+ /* @__PURE__ */ jsx76(Loader211, { className: "h-6 w-6 mx-auto mb-2 text-muted-foreground/50 animate-spin" }),
18136
+ /* @__PURE__ */ jsx76("span", { className: "text-xs text-muted-foreground", children: "Waiting for output\u2026" })
18241
18137
  ] }) : null,
18242
- agent.budgetWarning && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg bg-amber-500/10 border border-amber-500/20", children: [
18243
- /* @__PURE__ */ jsx77(Zap11, { className: "h-5 w-5 text-amber-500 shrink-0" }),
18244
- /* @__PURE__ */ jsxs71("div", { children: [
18245
- /* @__PURE__ */ jsx77("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: "\u26A1 Budget Warning" }),
18246
- /* @__PURE__ */ jsxs71("p", { className: "text-[11px] text-amber-600/80 dark:text-amber-400/80 mt-0.5", children: [
18138
+ agent.budgetWarning && /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg bg-amber-500/10 border border-amber-500/20", children: [
18139
+ /* @__PURE__ */ jsx76(Zap10, { className: "h-5 w-5 text-amber-500 shrink-0" }),
18140
+ /* @__PURE__ */ jsxs70("div", { children: [
18141
+ /* @__PURE__ */ jsx76("span", { className: "text-sm font-medium text-amber-600 dark:text-amber-400", children: "\u26A1 Budget Warning" }),
18142
+ /* @__PURE__ */ jsxs70("p", { className: "text-[11px] text-amber-600/80 dark:text-amber-400/80 mt-0.5", children: [
18247
18143
  "Hitting ",
18248
18144
  agent.budgetWarning.kind,
18249
18145
  " limit (",
@@ -18254,15 +18150,15 @@ function FleetAgentDetailPanel({
18254
18150
  ] })
18255
18151
  ] })
18256
18152
  ] }),
18257
- agent.extensions > 0 && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg bg-amber-500/10 border border-amber-500/20", children: [
18258
- /* @__PURE__ */ jsx77(Zap11, { className: "h-5 w-5 text-amber-500 shrink-0" }),
18259
- /* @__PURE__ */ jsxs71("div", { children: [
18260
- /* @__PURE__ */ jsxs71("span", { className: "text-sm font-medium", children: [
18153
+ agent.extensions > 0 && /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3 px-4 py-3 rounded-lg bg-amber-500/10 border border-amber-500/20", children: [
18154
+ /* @__PURE__ */ jsx76(Zap10, { className: "h-5 w-5 text-amber-500 shrink-0" }),
18155
+ /* @__PURE__ */ jsxs70("div", { children: [
18156
+ /* @__PURE__ */ jsxs70("span", { className: "text-sm font-medium", children: [
18261
18157
  agent.extensions,
18262
18158
  " Budget Extension",
18263
18159
  agent.extensions === 1 ? "" : "s"
18264
18160
  ] }),
18265
- /* @__PURE__ */ jsxs71("p", { className: "text-[11px] text-muted-foreground mt-0.5", children: [
18161
+ /* @__PURE__ */ jsxs70("p", { className: "text-[11px] text-muted-foreground mt-0.5", children: [
18266
18162
  "Agent extended its budget ",
18267
18163
  agent.extensions,
18268
18164
  " time",
@@ -18271,39 +18167,39 @@ function FleetAgentDetailPanel({
18271
18167
  ] })
18272
18168
  ] })
18273
18169
  ] }),
18274
- agent.error && /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border border-destructive/30 bg-destructive/5 p-4", children: [
18275
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 mb-2", children: [
18276
- /* @__PURE__ */ jsx77(XCircle9, { className: "h-4 w-4 text-destructive" }),
18277
- /* @__PURE__ */ jsx77("span", { className: "text-[10px] font-semibold text-destructive uppercase tracking-wider", children: "Error" })
18170
+ agent.error && /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border border-destructive/30 bg-destructive/5 p-4", children: [
18171
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 mb-2", children: [
18172
+ /* @__PURE__ */ jsx76(XCircle9, { className: "h-4 w-4 text-destructive" }),
18173
+ /* @__PURE__ */ jsx76("span", { className: "text-[10px] font-semibold text-destructive uppercase tracking-wider", children: "Error" })
18278
18174
  ] }),
18279
- /* @__PURE__ */ jsx77("p", { className: "text-sm text-destructive/90", children: agent.error.message })
18175
+ /* @__PURE__ */ jsx76("p", { className: "text-sm text-destructive/90", children: agent.error.message })
18280
18176
  ] }),
18281
- agent.failureReason && /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border border-destructive/30 bg-destructive/5 p-4", children: [
18282
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 mb-2", children: [
18283
- /* @__PURE__ */ jsx77(XCircle9, { className: "h-4 w-4 text-destructive" }),
18284
- /* @__PURE__ */ jsx77("span", { className: "text-[10px] font-semibold text-destructive uppercase tracking-wider", children: "Failure Reason" })
18177
+ agent.failureReason && /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border border-destructive/30 bg-destructive/5 p-4", children: [
18178
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 mb-2", children: [
18179
+ /* @__PURE__ */ jsx76(XCircle9, { className: "h-4 w-4 text-destructive" }),
18180
+ /* @__PURE__ */ jsx76("span", { className: "text-[10px] font-semibold text-destructive uppercase tracking-wider", children: "Failure Reason" })
18285
18181
  ] }),
18286
- /* @__PURE__ */ jsx77("p", { className: "text-sm text-destructive/90", children: agent.failureReason })
18182
+ /* @__PURE__ */ jsx76("p", { className: "text-sm text-destructive/90", children: agent.failureReason })
18287
18183
  ] }),
18288
- agent.toolLog.length > 0 && /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-card", children: [
18289
- /* @__PURE__ */ jsxs71(
18184
+ agent.toolLog.length > 0 && /* @__PURE__ */ jsxs70("div", { className: "rounded-lg border bg-card", children: [
18185
+ /* @__PURE__ */ jsxs70(
18290
18186
  "button",
18291
18187
  {
18292
18188
  type: "button",
18293
18189
  onClick: () => setShowFullToolLog(!showFullToolLog),
18294
18190
  className: "w-full flex items-center justify-between px-4 py-2 border-b bg-muted/30 hover:bg-muted/50 transition-colors",
18295
18191
  children: [
18296
- /* @__PURE__ */ jsxs71("span", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider flex items-center gap-2", children: [
18297
- /* @__PURE__ */ jsx77(Wrench10, { className: "h-3 w-3" }),
18192
+ /* @__PURE__ */ jsxs70("span", { className: "text-[10px] font-semibold text-muted-foreground uppercase tracking-wider flex items-center gap-2", children: [
18193
+ /* @__PURE__ */ jsx76(Wrench9, { className: "h-3 w-3" }),
18298
18194
  "Tool Log (",
18299
18195
  agent.toolLog.length,
18300
18196
  " calls)"
18301
18197
  ] }),
18302
- /* @__PURE__ */ jsx77(ChevronRight12, { className: cn("h-4 w-4 text-muted-foreground transition-transform", showFullToolLog && "rotate-90") })
18198
+ /* @__PURE__ */ jsx76(ChevronRight11, { className: cn("h-4 w-4 text-muted-foreground transition-transform", showFullToolLog && "rotate-90") })
18303
18199
  ]
18304
18200
  }
18305
18201
  ),
18306
- /* @__PURE__ */ jsx77("div", { className: cn("overflow-hidden transition-all", showFullToolLog ? "max-h-[500px]" : "max-h-48"), children: /* @__PURE__ */ jsx77("div", { className: "p-2 space-y-0.5", children: agent.toolLog.map((tl, i) => /* @__PURE__ */ jsxs71(
18202
+ /* @__PURE__ */ jsx76("div", { className: cn("overflow-hidden transition-all", showFullToolLog ? "max-h-[500px]" : "max-h-48"), children: /* @__PURE__ */ jsx76("div", { className: "p-2 space-y-0.5", children: agent.toolLog.map((tl, i) => /* @__PURE__ */ jsxs70(
18307
18203
  "div",
18308
18204
  {
18309
18205
  className: cn(
@@ -18311,11 +18207,11 @@ function FleetAgentDetailPanel({
18311
18207
  tl.ok ? "bg-muted/30 hover:bg-muted/50" : "bg-destructive/5 border border-destructive/20"
18312
18208
  ),
18313
18209
  children: [
18314
- /* @__PURE__ */ jsx77("span", { className: cn("led shrink-0", tl.ok ? "bg-emerald-500" : "bg-destructive") }),
18315
- /* @__PURE__ */ jsx77("span", { className: cn("font-mono font-medium w-20 shrink-0", tl.ok ? "text-foreground" : "text-destructive"), children: tl.name }),
18316
- /* @__PURE__ */ jsx77("span", { className: "text-muted-foreground tabular-nums text-[10px]", children: tl.durationMs >= 1e3 ? `${(tl.durationMs / 1e3).toFixed(2)}s` : `${tl.durationMs}ms` }),
18317
- !tl.ok && /* @__PURE__ */ jsx77("span", { className: "ml-auto text-[10px] text-destructive font-medium", children: "Failed" }),
18318
- /* @__PURE__ */ jsx77("span", { className: "ml-auto text-[9px] text-muted-foreground tabular-nums", children: new Date(tl.at).toLocaleTimeString() })
18210
+ /* @__PURE__ */ jsx76("span", { className: cn("led shrink-0", tl.ok ? "bg-emerald-500" : "bg-destructive") }),
18211
+ /* @__PURE__ */ jsx76("span", { className: cn("font-mono font-medium w-20 shrink-0", tl.ok ? "text-foreground" : "text-destructive"), children: tl.name }),
18212
+ /* @__PURE__ */ jsx76("span", { className: "text-muted-foreground tabular-nums text-[10px]", children: tl.durationMs >= 1e3 ? `${(tl.durationMs / 1e3).toFixed(2)}s` : `${tl.durationMs}ms` }),
18213
+ !tl.ok && /* @__PURE__ */ jsx76("span", { className: "ml-auto text-[10px] text-destructive font-medium", children: "Failed" }),
18214
+ /* @__PURE__ */ jsx76("span", { className: "ml-auto text-[9px] text-muted-foreground tabular-nums", children: new Date(tl.at).toLocaleTimeString() })
18319
18215
  ]
18320
18216
  },
18321
18217
  `${tl.name}-${tl.at}-${i}`
@@ -18330,9 +18226,9 @@ function FleetAgentRow({
18330
18226
  isLeader,
18331
18227
  onClick
18332
18228
  }) {
18333
- const meta2 = STATUS_META6[agent.status];
18229
+ const meta2 = STATUS_META5[agent.status];
18334
18230
  const active = agent.status === "running";
18335
- return /* @__PURE__ */ jsxs71(
18231
+ return /* @__PURE__ */ jsxs70(
18336
18232
  "button",
18337
18233
  {
18338
18234
  type: "button",
@@ -18343,27 +18239,27 @@ function FleetAgentRow({
18343
18239
  active && !isSelected && "bg-muted/30"
18344
18240
  ),
18345
18241
  children: [
18346
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1 min-w-0", children: [
18347
- /* @__PURE__ */ jsx77("span", { className: cn("led shrink-0", meta2.led, meta2.pulse && "led-pulse") }),
18348
- /* @__PURE__ */ jsx77("span", { className: "truncate font-medium", children: agent.name }),
18349
- isLeader && /* @__PURE__ */ jsx77(Crown3, { className: "h-3 w-3 shrink-0 text-amber-500", "aria-label": "leader" })
18242
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1 min-w-0", children: [
18243
+ /* @__PURE__ */ jsx76("span", { className: cn("led shrink-0", meta2.led, meta2.pulse && "led-pulse") }),
18244
+ /* @__PURE__ */ jsx76("span", { className: "truncate font-medium", children: agent.name }),
18245
+ isLeader && /* @__PURE__ */ jsx76(Crown2, { className: "h-3 w-3 shrink-0 text-amber-500", "aria-label": "leader" })
18350
18246
  ] }),
18351
- /* @__PURE__ */ jsx77("span", { className: cn("text-[10px] tabular-nums", active ? "text-emerald-500" : "text-muted-foreground"), children: meta2.label }),
18352
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1 min-w-0", children: [
18353
- /* @__PURE__ */ jsx77(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" }),
18354
- agent.budgetWarning && /* @__PURE__ */ jsx77("span", { title: `\u26A1 hitting ${agent.budgetWarning.kind} limit (${agent.budgetWarning.used}/${agent.budgetWarning.limit})`, children: /* @__PURE__ */ jsx77(Zap11, { className: "h-3 w-3 shrink-0 text-amber-500", "aria-label": "budget warning" }) })
18247
+ /* @__PURE__ */ jsx76("span", { className: cn("text-[10px] tabular-nums", active ? "text-emerald-500" : "text-muted-foreground"), children: meta2.label }),
18248
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1 min-w-0", children: [
18249
+ /* @__PURE__ */ jsx76(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" }),
18250
+ agent.budgetWarning && /* @__PURE__ */ jsx76("span", { title: `\u26A1 hitting ${agent.budgetWarning.kind} limit (${agent.budgetWarning.used}/${agent.budgetWarning.limit})`, children: /* @__PURE__ */ jsx76(Zap10, { className: "h-3 w-3 shrink-0 text-amber-500", "aria-label": "budget warning" }) })
18355
18251
  ] }),
18356
- /* @__PURE__ */ jsxs71("span", { className: "tabular-nums text-muted-foreground text-[10px]", children: [
18252
+ /* @__PURE__ */ jsxs70("span", { className: "tabular-nums text-muted-foreground text-[10px]", children: [
18357
18253
  agent.iteration,
18358
18254
  "it"
18359
18255
  ] }),
18360
- /* @__PURE__ */ jsxs71("span", { className: "tabular-nums text-muted-foreground text-[10px]", children: [
18256
+ /* @__PURE__ */ jsxs70("span", { className: "tabular-nums text-muted-foreground text-[10px]", children: [
18361
18257
  agent.toolCalls,
18362
18258
  "tc"
18363
18259
  ] }),
18364
- /* @__PURE__ */ jsx77("span", { className: "tabular-nums font-mono text-[10px]", children: fmtCost6(agent.costUsd) }),
18365
- /* @__PURE__ */ jsxs71("div", { className: "flex flex-col gap-0.5 min-w-0", children: [
18366
- /* @__PURE__ */ jsx77("div", { className: "h-1.5 w-full rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ jsx77(
18260
+ /* @__PURE__ */ jsx76("span", { className: "tabular-nums font-mono text-[10px]", children: fmtCost5(agent.costUsd) }),
18261
+ /* @__PURE__ */ jsxs70("div", { className: "flex flex-col gap-0.5 min-w-0", children: [
18262
+ /* @__PURE__ */ jsx76("div", { className: "h-1.5 w-full rounded-full bg-muted overflow-hidden", children: /* @__PURE__ */ jsx76(
18367
18263
  "div",
18368
18264
  {
18369
18265
  className: cn(
@@ -18373,10 +18269,10 @@ function FleetAgentRow({
18373
18269
  style: { width: `${Math.min(200, agent.ctxPct)}%` }
18374
18270
  }
18375
18271
  ) }),
18376
- /* @__PURE__ */ jsx77("span", { className: "text-[9px] tabular-nums text-muted-foreground font-mono leading-none", children: agent.maxContext > 0 ? `${agent.ctxPct}%` : "\u2014" })
18272
+ /* @__PURE__ */ jsx76("span", { className: "text-[9px] tabular-nums text-muted-foreground font-mono leading-none", children: agent.maxContext > 0 ? `${agent.ctxPct}%` : "\u2014" })
18377
18273
  ] }),
18378
- /* @__PURE__ */ jsx77("span", { className: "tabular-nums text-[10px] text-muted-foreground", children: agent.extensions > 0 ? `\u26A1\xD7${agent.extensions}` : "\u2014" }),
18379
- /* @__PURE__ */ jsx77("span", { className: "text-[9px] text-destructive truncate", title: agent.failureReason, children: agent.failureReason ?? "" })
18274
+ /* @__PURE__ */ jsx76("span", { className: "tabular-nums text-[10px] text-muted-foreground", children: agent.extensions > 0 ? `\u26A1\xD7${agent.extensions}` : "\u2014" }),
18275
+ /* @__PURE__ */ jsx76("span", { className: "text-[9px] text-destructive truncate", title: agent.failureReason, children: agent.failureReason ?? "" })
18380
18276
  ]
18381
18277
  }
18382
18278
  );
@@ -18399,7 +18295,7 @@ function FleetMonitor({
18399
18295
  const t = setInterval(() => setNowTick(Date.now()), 1e3);
18400
18296
  return () => clearInterval(t);
18401
18297
  }, []);
18402
- const fleetList = useMemo19(() => {
18298
+ const fleetList = useMemo17(() => {
18403
18299
  const arr = Array.from(fleetAgents.values());
18404
18300
  arr.sort((x, y) => {
18405
18301
  if (x.id === leaderId) return -1;
@@ -18411,13 +18307,13 @@ function FleetMonitor({
18411
18307
  });
18412
18308
  return arr;
18413
18309
  }, [fleetAgents, leaderId]);
18414
- const totalCost = useMemo19(
18310
+ const totalCost = useMemo17(
18415
18311
  () => Array.from(fleetAgents.values()).reduce((sum, a) => sum + a.costUsd, 0),
18416
18312
  [fleetAgents]
18417
18313
  );
18418
18314
  const runningCount = fleetList.filter((a) => a.status === "running").length;
18419
18315
  const selectedAgent = selectedIdx !== null ? fleetList[selectedIdx] : null;
18420
- const handleKeyDown = useCallback28(
18316
+ const handleKeyDown = useCallback27(
18421
18317
  (e) => {
18422
18318
  if (e.key === "Escape") {
18423
18319
  if (selectedIdx !== null) {
@@ -18451,30 +18347,30 @@ function FleetMonitor({
18451
18347
  return () => window.removeEventListener("keydown", handleGlobal);
18452
18348
  }, [onClose]);
18453
18349
  const containerClass = isOverlay ? "fixed inset-0 z-50 flex flex-col bg-background/95 backdrop-blur-md" : "flex flex-col h-full";
18454
- return /* @__PURE__ */ jsxs71(
18350
+ return /* @__PURE__ */ jsxs70(
18455
18351
  "div",
18456
18352
  {
18457
18353
  className: containerClass,
18458
18354
  onKeyDown: handleKeyDown,
18459
18355
  tabIndex: -1,
18460
18356
  children: [
18461
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center justify-between px-4 py-3 border-b bg-card/80 backdrop-blur shrink-0", children: [
18462
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-3", children: [
18463
- /* @__PURE__ */ jsx77(Bot13, { className: "h-5 w-5 text-primary" }),
18464
- /* @__PURE__ */ jsxs71("h2", { className: "text-sm font-semibold flex items-center gap-2", children: [
18357
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-between px-4 py-3 border-b bg-card/80 backdrop-blur shrink-0", children: [
18358
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3", children: [
18359
+ /* @__PURE__ */ jsx76(Bot12, { className: "h-5 w-5 text-primary" }),
18360
+ /* @__PURE__ */ jsxs70("h2", { className: "text-sm font-semibold flex items-center gap-2", children: [
18465
18361
  "FLEET MONITOR",
18466
- runningCount > 0 && /* @__PURE__ */ jsxs71("span", { className: "flex items-center gap-1 text-[11px] text-emerald-500 font-normal", children: [
18467
- /* @__PURE__ */ jsx77("span", { className: "led led-pulse bg-emerald-500" }),
18362
+ runningCount > 0 && /* @__PURE__ */ jsxs70("span", { className: "flex items-center gap-1 text-[11px] text-emerald-500 font-normal", children: [
18363
+ /* @__PURE__ */ jsx76("span", { className: "led led-pulse bg-emerald-500" }),
18468
18364
  runningCount,
18469
18365
  " running"
18470
18366
  ] })
18471
18367
  ] }),
18472
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
18473
- /* @__PURE__ */ jsxs71("span", { children: [
18368
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
18369
+ /* @__PURE__ */ jsxs70("span", { children: [
18474
18370
  fleetList.length,
18475
18371
  " total agents"
18476
18372
  ] }),
18477
- /* @__PURE__ */ jsx77(
18373
+ /* @__PURE__ */ jsx76(
18478
18374
  ConcurrencyGauge,
18479
18375
  {
18480
18376
  current: fleetConcurrency,
@@ -18484,49 +18380,49 @@ function FleetMonitor({
18484
18380
  )
18485
18381
  ] })
18486
18382
  ] }),
18487
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-3", children: [
18488
- /* @__PURE__ */ jsxs71("span", { className: "text-xs text-muted-foreground tabular-nums font-mono", children: [
18383
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-3", children: [
18384
+ /* @__PURE__ */ jsxs70("span", { className: "text-xs text-muted-foreground tabular-nums font-mono", children: [
18489
18385
  "\u2193",
18490
18386
  fmtTok3(fleetTokensIn),
18491
18387
  " \u2191",
18492
18388
  fmtTok3(fleetTokensOut),
18493
18389
  " \xB7 ",
18494
- fmtCost6(totalCost)
18390
+ fmtCost5(totalCost)
18495
18391
  ] }),
18496
- /* @__PURE__ */ jsx77("span", { className: "text-xs text-muted-foreground tabular-nums font-mono", children: leaderId ? `\u{1F451} ${fleetAgents.get(leaderId)?.name ?? leaderId}` : "no leader" }),
18497
- isOverlay && onClose && /* @__PURE__ */ jsx77(
18392
+ /* @__PURE__ */ jsx76("span", { className: "text-xs text-muted-foreground tabular-nums font-mono", children: leaderId ? `\u{1F451} ${fleetAgents.get(leaderId)?.name ?? leaderId}` : "no leader" }),
18393
+ isOverlay && onClose && /* @__PURE__ */ jsx76(
18498
18394
  "button",
18499
18395
  {
18500
18396
  type: "button",
18501
18397
  onClick: onClose,
18502
18398
  className: "p-1.5 rounded-md hover:bg-muted transition-colors",
18503
18399
  "aria-label": "Close fleet monitor",
18504
- children: /* @__PURE__ */ jsx77(XCircle9, { className: "h-4 w-4" })
18400
+ children: /* @__PURE__ */ jsx76(XCircle9, { className: "h-4 w-4" })
18505
18401
  }
18506
18402
  )
18507
18403
  ] })
18508
18404
  ] }),
18509
- /* @__PURE__ */ jsxs71("div", { className: "flex-1 flex overflow-hidden", children: [
18510
- /* @__PURE__ */ jsxs71("div", { className: cn(
18405
+ /* @__PURE__ */ jsxs70("div", { className: "flex-1 flex overflow-hidden", children: [
18406
+ /* @__PURE__ */ jsxs70("div", { className: cn(
18511
18407
  "flex flex-col border-r transition-all duration-200",
18512
18408
  selectedAgent ? "w-[500px] shrink-0" : "w-full"
18513
18409
  ), children: [
18514
- /* @__PURE__ */ jsx77("div", { className: "border-b bg-card/80 px-3 py-2", children: /* @__PURE__ */ jsxs71("div", { className: "grid grid-cols-[140px_60px_1fr_60px_60px_60px_60px_50px_50px] gap-x-2 text-[9px] uppercase tracking-wider text-muted-foreground font-medium", children: [
18515
- /* @__PURE__ */ jsx77("span", { children: "Name" }),
18516
- /* @__PURE__ */ jsx77("span", { children: "Status" }),
18517
- /* @__PURE__ */ jsx77("span", { children: "Activity" }),
18518
- /* @__PURE__ */ jsx77("span", { children: "Iters" }),
18519
- /* @__PURE__ */ jsx77("span", { children: "Tools" }),
18520
- /* @__PURE__ */ jsx77("span", { children: "Cost" }),
18521
- /* @__PURE__ */ jsx77("span", { children: "CTX" }),
18522
- /* @__PURE__ */ jsx77("span", { children: "Ext" }),
18523
- /* @__PURE__ */ jsx77("span", { children: "Reason" })
18410
+ /* @__PURE__ */ jsx76("div", { className: "border-b bg-card/80 px-3 py-2", children: /* @__PURE__ */ jsxs70("div", { className: "grid grid-cols-[140px_60px_1fr_60px_60px_60px_60px_50px_50px] gap-x-2 text-[9px] uppercase tracking-wider text-muted-foreground font-medium", children: [
18411
+ /* @__PURE__ */ jsx76("span", { children: "Name" }),
18412
+ /* @__PURE__ */ jsx76("span", { children: "Status" }),
18413
+ /* @__PURE__ */ jsx76("span", { children: "Activity" }),
18414
+ /* @__PURE__ */ jsx76("span", { children: "Iters" }),
18415
+ /* @__PURE__ */ jsx76("span", { children: "Tools" }),
18416
+ /* @__PURE__ */ jsx76("span", { children: "Cost" }),
18417
+ /* @__PURE__ */ jsx76("span", { children: "CTX" }),
18418
+ /* @__PURE__ */ jsx76("span", { children: "Ext" }),
18419
+ /* @__PURE__ */ jsx76("span", { children: "Reason" })
18524
18420
  ] }) }),
18525
- /* @__PURE__ */ jsx77("div", { className: "flex-1 overflow-y-auto", children: fleetList.length === 0 ? /* @__PURE__ */ jsxs71("div", { className: "flex flex-col items-center justify-center h-full text-muted-foreground", children: [
18526
- /* @__PURE__ */ jsx77(Users4, { className: "h-12 w-12 mb-3 opacity-20" }),
18527
- /* @__PURE__ */ jsx77("p", { className: "text-sm font-medium", children: "No agents active" }),
18528
- /* @__PURE__ */ jsx77("p", { className: "text-xs mt-1", children: "Agents appear here when the fleet is active." })
18529
- ] }) : /* @__PURE__ */ jsx77("div", { className: "p-2 space-y-0.5", children: fleetList.map((agent, i) => /* @__PURE__ */ jsx77(
18421
+ /* @__PURE__ */ jsx76("div", { className: "flex-1 overflow-y-auto", children: fleetList.length === 0 ? /* @__PURE__ */ jsxs70("div", { className: "flex flex-col items-center justify-center h-full text-muted-foreground", children: [
18422
+ /* @__PURE__ */ jsx76(Users4, { className: "h-12 w-12 mb-3 opacity-20" }),
18423
+ /* @__PURE__ */ jsx76("p", { className: "text-sm font-medium", children: "No agents active" }),
18424
+ /* @__PURE__ */ jsx76("p", { className: "text-xs mt-1", children: "Agents appear here when the fleet is active." })
18425
+ ] }) : /* @__PURE__ */ jsx76("div", { className: "p-2 space-y-0.5", children: fleetList.map((agent, i) => /* @__PURE__ */ jsx76(
18530
18426
  FleetAgentRow,
18531
18427
  {
18532
18428
  agent,
@@ -18536,25 +18432,25 @@ function FleetMonitor({
18536
18432
  },
18537
18433
  agent.id
18538
18434
  )) }) }),
18539
- /* @__PURE__ */ jsxs71("div", { className: "border-t bg-card/80 shrink-0", children: [
18540
- /* @__PURE__ */ jsx77("div", { className: "px-4 py-2 border-b", children: /* @__PURE__ */ jsxs71("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground font-medium flex items-center gap-2", children: [
18541
- /* @__PURE__ */ jsx77(Clock17, { className: "h-3 w-3" }),
18435
+ /* @__PURE__ */ jsxs70("div", { className: "border-t bg-card/80 shrink-0", children: [
18436
+ /* @__PURE__ */ jsx76("div", { className: "px-4 py-2 border-b", children: /* @__PURE__ */ jsxs70("span", { className: "text-[10px] uppercase tracking-wider text-muted-foreground font-medium flex items-center gap-2", children: [
18437
+ /* @__PURE__ */ jsx76(Clock16, { className: "h-3 w-3" }),
18542
18438
  "Event Timeline"
18543
18439
  ] }) }),
18544
- /* @__PURE__ */ jsx77("div", { className: "px-4 py-2 max-h-32 overflow-y-auto", children: /* @__PURE__ */ jsx77(EventTimeline, { events: eventTimeline, max: 10 }) }),
18545
- /* @__PURE__ */ jsxs71("div", { className: "px-4 py-1.5 border-t text-[10px] text-muted-foreground flex items-center gap-4", children: [
18546
- /* @__PURE__ */ jsx77("span", { children: "\u2191\u2193 navigate" }),
18547
- /* @__PURE__ */ jsx77("span", { children: "\u21B5 select detail" }),
18548
- /* @__PURE__ */ jsx77("span", { children: "Esc deselect / close" })
18440
+ /* @__PURE__ */ jsx76("div", { className: "px-4 py-2 max-h-32 overflow-y-auto", children: /* @__PURE__ */ jsx76(EventTimeline, { events: eventTimeline, max: 10 }) }),
18441
+ /* @__PURE__ */ jsxs70("div", { className: "px-4 py-1.5 border-t text-[10px] text-muted-foreground flex items-center gap-4", children: [
18442
+ /* @__PURE__ */ jsx76("span", { children: "\u2191\u2193 navigate" }),
18443
+ /* @__PURE__ */ jsx76("span", { children: "\u21B5 select detail" }),
18444
+ /* @__PURE__ */ jsx76("span", { children: "Esc deselect / close" })
18549
18445
  ] })
18550
18446
  ] })
18551
18447
  ] }),
18552
- selectedAgent && /* @__PURE__ */ jsx77("div", { className: "flex-1 overflow-hidden bg-card/50", children: /* @__PURE__ */ jsxs71("div", { className: "h-full flex flex-col", children: [
18553
- /* @__PURE__ */ jsxs71("div", { className: "shrink-0 px-4 py-2 border-b bg-card/80 flex items-center gap-2", children: [
18554
- /* @__PURE__ */ jsx77(ArrowRight6, { className: "h-4 w-4 text-primary" }),
18555
- /* @__PURE__ */ jsx77("span", { className: "text-xs font-semibold text-primary", children: selectedAgent.name }),
18556
- /* @__PURE__ */ jsx77("span", { className: "text-[10px] text-muted-foreground", children: "detailed view" }),
18557
- /* @__PURE__ */ jsx77(
18448
+ selectedAgent && /* @__PURE__ */ jsx76("div", { className: "flex-1 overflow-hidden bg-card/50", children: /* @__PURE__ */ jsxs70("div", { className: "h-full flex flex-col", children: [
18449
+ /* @__PURE__ */ jsxs70("div", { className: "shrink-0 px-4 py-2 border-b bg-card/80 flex items-center gap-2", children: [
18450
+ /* @__PURE__ */ jsx76(ArrowRight6, { className: "h-4 w-4 text-primary" }),
18451
+ /* @__PURE__ */ jsx76("span", { className: "text-xs font-semibold text-primary", children: selectedAgent.name }),
18452
+ /* @__PURE__ */ jsx76("span", { className: "text-[10px] text-muted-foreground", children: "detailed view" }),
18453
+ /* @__PURE__ */ jsx76(
18558
18454
  "button",
18559
18455
  {
18560
18456
  type: "button",
@@ -18564,25 +18460,25 @@ function FleetMonitor({
18564
18460
  }
18565
18461
  )
18566
18462
  ] }),
18567
- /* @__PURE__ */ jsx77("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx77(FleetAgentDetailPanel, { agent: selectedAgent, now: nowTick }) })
18463
+ /* @__PURE__ */ jsx76("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx76(FleetAgentDetailPanel, { agent: selectedAgent, now: nowTick }) })
18568
18464
  ] }) }),
18569
- !selectedAgent && fleetList.length > 0 && /* @__PURE__ */ jsx77("div", { className: "flex-1 flex items-center justify-center bg-muted/20", children: /* @__PURE__ */ jsxs71("div", { className: "text-center space-y-3 max-w-sm", children: [
18570
- /* @__PURE__ */ jsx77(Users4, { className: "h-12 w-12 text-muted-foreground/30 mx-auto" }),
18571
- /* @__PURE__ */ jsx77("p", { className: "text-sm text-muted-foreground", children: "Select an agent to view detailed information" }),
18572
- /* @__PURE__ */ jsx77("p", { className: "text-xs text-muted-foreground/60", children: "Click on any agent in the list to see detailed metrics, tool logs, streaming output, and more \u2014 similar to the chat history detailed view." }),
18573
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center justify-center gap-4 pt-2", children: [
18574
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18575
- /* @__PURE__ */ jsx77("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "\u2191" }),
18576
- /* @__PURE__ */ jsx77("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "\u2193" }),
18577
- /* @__PURE__ */ jsx77("span", { children: "navigate" })
18465
+ !selectedAgent && fleetList.length > 0 && /* @__PURE__ */ jsx76("div", { className: "flex-1 flex items-center justify-center bg-muted/20", children: /* @__PURE__ */ jsxs70("div", { className: "text-center space-y-3 max-w-sm", children: [
18466
+ /* @__PURE__ */ jsx76(Users4, { className: "h-12 w-12 text-muted-foreground/30 mx-auto" }),
18467
+ /* @__PURE__ */ jsx76("p", { className: "text-sm text-muted-foreground", children: "Select an agent to view detailed information" }),
18468
+ /* @__PURE__ */ jsx76("p", { className: "text-xs text-muted-foreground/60", children: "Click on any agent in the list to see detailed metrics, tool logs, streaming output, and more \u2014 similar to the chat history detailed view." }),
18469
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center justify-center gap-4 pt-2", children: [
18470
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18471
+ /* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "\u2191" }),
18472
+ /* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "\u2193" }),
18473
+ /* @__PURE__ */ jsx76("span", { children: "navigate" })
18578
18474
  ] }),
18579
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18580
- /* @__PURE__ */ jsx77("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "Enter" }),
18581
- /* @__PURE__ */ jsx77("span", { children: "select" })
18475
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18476
+ /* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "Enter" }),
18477
+ /* @__PURE__ */ jsx76("span", { children: "select" })
18582
18478
  ] }),
18583
- /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18584
- /* @__PURE__ */ jsx77("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "Esc" }),
18585
- /* @__PURE__ */ jsx77("span", { children: "deselect" })
18479
+ /* @__PURE__ */ jsxs70("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18480
+ /* @__PURE__ */ jsx76("kbd", { className: "px-1.5 py-0.5 rounded bg-muted border text-[9px]", children: "Esc" }),
18481
+ /* @__PURE__ */ jsx76("span", { children: "deselect" })
18586
18482
  ] })
18587
18483
  ] })
18588
18484
  ] }) })
@@ -18592,18 +18488,468 @@ function FleetMonitor({
18592
18488
  );
18593
18489
  }
18594
18490
 
18595
- // src/App.tsx
18491
+ // src/components/InspectorPanel.tsx
18492
+ import { Bot as Bot14, ChevronDown as ChevronDown11, ChevronUp, Users as Users5 } from "lucide-react";
18493
+ import { useMemo as useMemo19, useState as useState50 } from "react";
18494
+
18495
+ // src/components/AgentsMonitor.tsx
18496
+ import { Bot as Bot13, ChevronLeft, ChevronRight as ChevronRight12, Cpu as Cpu15, Crown as Crown3, Loader2 as Loader212, Wrench as Wrench10, X as X16, Zap as Zap11 } from "lucide-react";
18497
+ import { useCallback as useCallback28, useEffect as useEffect44, useMemo as useMemo18, useState as useState49 } from "react";
18498
+ import { jsx as jsx77, jsxs as jsxs71 } from "react/jsx-runtime";
18499
+ function fmtCost6(v) {
18500
+ if (v <= 0) return "$0";
18501
+ if (v >= 0.01) return `$${v.toFixed(3)}`;
18502
+ return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
18503
+ }
18504
+ function fmtDuration3(ms) {
18505
+ const sec = Math.floor(ms / 1e3);
18506
+ if (sec < 60) return `${sec}s`;
18507
+ const min = Math.floor(sec / 60);
18508
+ return `${min}m ${sec % 60}s`;
18509
+ }
18510
+ var STATUS_META6 = {
18511
+ running: { led: "bg-[hsl(var(--success))]", label: "running", pulse: true, badge: "bg-[hsl(var(--success))]/15 text-[hsl(var(--success))]" },
18512
+ completed: { led: "bg-[hsl(var(--success))]", label: "done", pulse: false, badge: "bg-muted text-muted-foreground" },
18513
+ failed: { led: "bg-destructive", label: "failed", pulse: false, badge: "bg-destructive/15 text-destructive" },
18514
+ timeout: { led: "bg-[hsl(var(--warning))]", label: "timeout", pulse: false, badge: "bg-amber-500/15 text-amber-500" },
18515
+ stopped: { led: "bg-muted-foreground", label: "stopped", pulse: false, badge: "bg-muted text-muted-foreground" }
18516
+ };
18517
+ function AgentCard2({ agent, isLeader }) {
18518
+ const meta2 = STATUS_META6[agent.status];
18519
+ const active = agent.status === "running";
18520
+ const elapsed = Date.now() - agent.startedAt;
18521
+ const toolLogSlice = agent.toolLog.slice(0, 8);
18522
+ const last8Tools = [...toolLogSlice].reverse();
18523
+ return /* @__PURE__ */ jsxs71("div", { className: cn(
18524
+ "rounded-xl border p-4 space-y-3",
18525
+ active ? "border-primary/20 bg-primary/[0.02]" : "border-border bg-card",
18526
+ isLeader && "ring-2 ring-amber-500/30"
18527
+ ), children: [
18528
+ /* @__PURE__ */ jsxs71("div", { className: "flex items-start justify-between", children: [
18529
+ /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2", children: [
18530
+ /* @__PURE__ */ jsx77("span", { className: cn("led", meta2.led, meta2.pulse && "led-pulse", "mt-0.5") }),
18531
+ /* @__PURE__ */ jsxs71("div", { children: [
18532
+ /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5", children: [
18533
+ /* @__PURE__ */ jsx77("span", { className: "text-sm font-semibold", children: agent.name }),
18534
+ isLeader && /* @__PURE__ */ jsx77(Crown3, { className: "h-3.5 w-3.5 text-amber-500", "aria-label": "leader" }),
18535
+ agent.extensions > 0 && /* @__PURE__ */ jsxs71("span", { className: "inline-flex items-center gap-0.5 px-1.5 py-0.5 rounded-full bg-amber-500/15 text-[10px] text-amber-600 dark:text-amber-400 font-medium", children: [
18536
+ /* @__PURE__ */ jsx77(Zap11, { className: "h-2.5 w-2.5" }),
18537
+ "\xD7",
18538
+ agent.extensions
18539
+ ] })
18540
+ ] }),
18541
+ /* @__PURE__ */ jsx77("span", { className: cn("inline-block mt-0.5 px-1.5 py-0.5 rounded text-[10px] font-medium", meta2.badge), children: meta2.label })
18542
+ ] })
18543
+ ] }),
18544
+ /* @__PURE__ */ jsx77("div", { className: "flex items-center gap-1 text-[10px] text-muted-foreground", children: isLeader && /* @__PURE__ */ jsx77("span", { className: "text-[9px] bg-amber-500/15 text-amber-600 dark:text-amber-400 px-1.5 py-0.5 rounded", children: "LEADER" }) })
18545
+ ] }),
18546
+ agent.description && /* @__PURE__ */ jsx77("p", { className: "text-xs text-muted-foreground leading-relaxed line-clamp-2", children: agent.description }),
18547
+ agent.budgetWarning && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-amber-500/10 border border-amber-500/20 text-xs", children: [
18548
+ /* @__PURE__ */ jsx77(Zap11, { className: "h-3.5 w-3.5 text-amber-500 shrink-0" }),
18549
+ /* @__PURE__ */ jsxs71("span", { className: "text-amber-600 dark:text-amber-400", children: [
18550
+ "\u26A1 hitting ",
18551
+ /* @__PURE__ */ jsx77("strong", { children: agent.budgetWarning.kind }),
18552
+ " limit (",
18553
+ agent.budgetWarning.used,
18554
+ "/",
18555
+ agent.budgetWarning.limit,
18556
+ ") \u2014 extending"
18557
+ ] })
18558
+ ] }),
18559
+ agent.failureReason && /* @__PURE__ */ jsx77("div", { className: "flex items-center gap-2 px-3 py-2 rounded-lg bg-destructive/10 border border-destructive/20 text-xs", children: /* @__PURE__ */ jsxs71("span", { className: "text-destructive font-medium", children: [
18560
+ "\u2717 ",
18561
+ agent.failureReason
18562
+ ] }) }),
18563
+ /* @__PURE__ */ jsxs71("div", { className: "grid grid-cols-4 gap-2", children: [
18564
+ /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
18565
+ /* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Iters" }),
18566
+ /* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.iteration })
18567
+ ] }),
18568
+ /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
18569
+ /* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Tools" }),
18570
+ /* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: agent.toolCalls })
18571
+ ] }),
18572
+ /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
18573
+ /* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Cost" }),
18574
+ /* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtCost6(agent.costUsd) })
18575
+ ] }),
18576
+ /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 px-2 py-1.5 text-center", children: [
18577
+ /* @__PURE__ */ jsx77("div", { className: "text-[10px] text-muted-foreground", children: "Elapsed" }),
18578
+ /* @__PURE__ */ jsx77("div", { className: "text-xs font-mono font-semibold tabular-nums", children: fmtDuration3(elapsed) })
18579
+ ] })
18580
+ ] }),
18581
+ /* @__PURE__ */ jsxs71("div", { className: "space-y-1.5", children: [
18582
+ /* @__PURE__ */ jsxs71("div", { className: "flex items-center justify-between", children: [
18583
+ /* @__PURE__ */ jsx77("span", { className: "text-[10px] text-muted-foreground", children: "Activity (12 bins)" }),
18584
+ /* @__PURE__ */ jsx77(SparklineChart, { bins: agent.sparklineBins, className: "font-mono text-[9px]" })
18585
+ ] }),
18586
+ /* @__PURE__ */ jsx77(ContextBar, { pct: agent.ctxPct, tokens: agent.ctxTokens, maxTokens: agent.maxContext })
18587
+ ] }),
18588
+ (agent.provider || agent.model) && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18589
+ /* @__PURE__ */ jsx77(Cpu15, { className: "h-3 w-3" }),
18590
+ /* @__PURE__ */ jsxs71("span", { className: "font-mono", children: [
18591
+ agent.provider ?? "?",
18592
+ "/",
18593
+ agent.model ?? "?"
18594
+ ] })
18595
+ ] }),
18596
+ (agent.currentTool || agent.lastTool) && /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-1.5 text-[10px] text-muted-foreground", children: [
18597
+ /* @__PURE__ */ jsx77(Wrench10, { className: cn("h-3 w-3", active && "animate-pulse text-primary") }),
18598
+ /* @__PURE__ */ jsx77("span", { className: "font-mono", children: agent.currentTool ?? agent.lastTool }),
18599
+ active && /* @__PURE__ */ jsx77(Loader212, { className: "h-3 w-3 animate-spin" })
18600
+ ] }),
18601
+ agent.partialText && active && /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
18602
+ /* @__PURE__ */ jsx77("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Streaming output" }),
18603
+ /* @__PURE__ */ jsx77("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-3 leading-relaxed", children: agent.partialText })
18604
+ ] }),
18605
+ last8Tools.length > 0 && /* @__PURE__ */ jsxs71("div", { className: "space-y-1", children: [
18606
+ /* @__PURE__ */ jsx77("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider", children: "Recent tools" }),
18607
+ /* @__PURE__ */ jsx77("div", { className: "space-y-0.5", children: last8Tools.map((tool, i) => /* @__PURE__ */ jsxs71("div", { className: "flex items-center gap-2 text-[10px] font-mono", children: [
18608
+ /* @__PURE__ */ jsx77("span", { className: cn("shrink-0", tool.ok ? "text-[hsl(var(--success))]" : "text-destructive"), children: tool.ok ? "\u2713" : "\u2717" }),
18609
+ /* @__PURE__ */ jsx77("span", { className: "text-muted-foreground truncate", children: tool.name }),
18610
+ /* @__PURE__ */ jsx77("span", { className: "ml-auto tabular-nums text-muted-foreground shrink-0", children: tool.durationMs >= 1e3 ? `${(tool.durationMs / 1e3).toFixed(1)}s` : `${tool.durationMs}ms` })
18611
+ ] }, i)) })
18612
+ ] }),
18613
+ agent.finalText && !active && /* @__PURE__ */ jsxs71("div", { className: "rounded-lg border bg-muted/30 p-2", children: [
18614
+ /* @__PURE__ */ jsx77("div", { className: "text-[9px] text-muted-foreground uppercase tracking-wider mb-1", children: "Final output" }),
18615
+ /* @__PURE__ */ jsx77("pre", { className: "text-[10px] font-mono text-foreground/80 whitespace-pre-wrap line-clamp-4 leading-relaxed", children: agent.finalText })
18616
+ ] })
18617
+ ] });
18618
+ }
18619
+
18620
+ // src/components/InspectorPanel.tsx
18596
18621
  import { Fragment as Fragment17, jsx as jsx78, jsxs as jsxs72 } from "react/jsx-runtime";
18622
+ var PANEL_HEIGHT = 320;
18623
+ function fmtCost7(v) {
18624
+ if (v <= 0) return "$0";
18625
+ if (v >= 0.01) return `$${v.toFixed(3)}`;
18626
+ return `$${v.toFixed(5)}`.replace(/0+$/, "").replace(/\.$/, "");
18627
+ }
18628
+ function fmtTok4(n) {
18629
+ if (n >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
18630
+ if (n >= 1e3) return `${(n / 1e3).toFixed(1)}K`;
18631
+ return String(n);
18632
+ }
18633
+ function sortFleet(agents, leaderId) {
18634
+ const arr = Array.from(agents.values());
18635
+ arr.sort((x, y) => {
18636
+ if (x.id === leaderId) return -1;
18637
+ if (y.id === leaderId) return 1;
18638
+ const xa = x.status === "running" ? 0 : 1;
18639
+ const ya = y.status === "running" ? 0 : 1;
18640
+ if (xa !== ya) return xa - ya;
18641
+ return x.startedAt - y.startedAt;
18642
+ });
18643
+ return arr;
18644
+ }
18645
+ function InspectorPanel() {
18646
+ const inspectorOpen = useUIStore((s) => s.inspectorOpen);
18647
+ const inspectorTab = useUIStore((s) => s.inspectorTab);
18648
+ const toggleInspector = useUIStore((s) => s.toggleInspector);
18649
+ const setInspectorOpen = useUIStore((s) => s.setInspectorOpen);
18650
+ const setInspectorTab = useUIStore((s) => s.setInspectorTab);
18651
+ const fleetAgents = useFleetStore((s) => s.agents);
18652
+ const leaderId = useFleetStore((s) => s.leaderId);
18653
+ const fleetTokensIn = useFleetStore((s) => s.fleetTokensIn);
18654
+ const fleetTokensOut = useFleetStore((s) => s.fleetTokensOut);
18655
+ const fleetConcurrency = useFleetStore((s) => s.fleetConcurrency);
18656
+ const fleetConcurrencyMax = useFleetStore((s) => s.fleetConcurrencyMax);
18657
+ const eventTimeline = useFleetStore((s) => s.eventTimeline);
18658
+ const fleetList = useMemo19(
18659
+ () => sortFleet(fleetAgents, leaderId),
18660
+ [fleetAgents, leaderId]
18661
+ );
18662
+ const runningCount = fleetList.filter((a) => a.status === "running").length;
18663
+ const totalCost = fleetList.reduce((sum, a) => sum + a.costUsd, 0);
18664
+ const fleetTotal = fleetList.length;
18665
+ const [selectedAgentId, setSelectedAgentId] = useState50(null);
18666
+ const selectedAgent = useMemo19(() => {
18667
+ if (!selectedAgentId) return fleetList[0] ?? null;
18668
+ return fleetAgents.get(selectedAgentId) ?? fleetList[0] ?? null;
18669
+ }, [selectedAgentId, fleetList, fleetAgents]);
18670
+ const openFleetTab = () => setInspectorTab("fleet");
18671
+ const openAgentsTab = () => setInspectorTab("agents");
18672
+ const handleSelectAgent = (agent) => {
18673
+ setSelectedAgentId(agent.id);
18674
+ openAgentsTab();
18675
+ };
18676
+ return /* @__PURE__ */ jsxs72("div", { className: "shrink-0 border-t bg-card flex flex-col", children: [
18677
+ /* @__PURE__ */ jsxs72(
18678
+ "button",
18679
+ {
18680
+ type: "button",
18681
+ onClick: toggleInspector,
18682
+ className: cn(
18683
+ "group w-full flex items-center justify-between gap-2 px-3 h-7 text-[11px]",
18684
+ "text-muted-foreground hover:text-foreground hover:bg-accent/40 transition-colors"
18685
+ ),
18686
+ title: inspectorOpen ? "Hide inspector panel" : "Show inspector panel (Fleet / Agents)",
18687
+ children: [
18688
+ /* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-2 min-w-0", children: [
18689
+ inspectorOpen ? /* @__PURE__ */ jsx78(ChevronDown11, { className: "h-3.5 w-3.5 shrink-0" }) : /* @__PURE__ */ jsx78(ChevronUp, { className: "h-3.5 w-3.5 shrink-0" }),
18690
+ /* @__PURE__ */ jsx78("span", { className: "font-medium uppercase tracking-wider", children: "Inspector" }),
18691
+ fleetTotal > 0 && /* @__PURE__ */ jsxs72(Fragment17, { children: [
18692
+ /* @__PURE__ */ jsx78("span", { className: "opacity-40", children: "\xB7" }),
18693
+ /* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-1", children: [
18694
+ /* @__PURE__ */ jsx78(
18695
+ "span",
18696
+ {
18697
+ className: cn(
18698
+ "h-1.5 w-1.5 rounded-full",
18699
+ runningCount > 0 ? "bg-emerald-500 animate-pulse" : "bg-muted-foreground/50"
18700
+ )
18701
+ }
18702
+ ),
18703
+ /* @__PURE__ */ jsxs72("span", { className: "tabular-nums", children: [
18704
+ runningCount,
18705
+ "/",
18706
+ fleetTotal
18707
+ ] })
18708
+ ] }),
18709
+ /* @__PURE__ */ jsx78("span", { className: "opacity-40 hidden sm:inline", children: "\xB7" }),
18710
+ /* @__PURE__ */ jsxs72("span", { className: "tabular-nums font-mono hidden sm:inline", children: [
18711
+ "\u2193",
18712
+ fmtTok4(fleetTokensIn),
18713
+ " \u2191",
18714
+ fmtTok4(fleetTokensOut),
18715
+ " \xB7 ",
18716
+ fmtCost7(totalCost)
18717
+ ] })
18718
+ ] })
18719
+ ] }),
18720
+ /* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-1 shrink-0 opacity-70 group-hover:opacity-100", children: [
18721
+ /* @__PURE__ */ jsx78(Bot14, { className: "h-3 w-3" }),
18722
+ /* @__PURE__ */ jsx78(Users5, { className: "h-3 w-3" })
18723
+ ] })
18724
+ ]
18725
+ }
18726
+ ),
18727
+ /* @__PURE__ */ jsx78(
18728
+ "div",
18729
+ {
18730
+ className: "overflow-hidden transition-[height] duration-300 ease-[cubic-bezier(0.16,1,0.3,1)]",
18731
+ style: { height: inspectorOpen ? PANEL_HEIGHT : 0 },
18732
+ children: /* @__PURE__ */ jsxs72("div", { className: "flex flex-col", style: { height: PANEL_HEIGHT }, children: [
18733
+ /* @__PURE__ */ jsxs72("div", { className: "flex items-center gap-1 px-2 h-8 border-b bg-muted/30 shrink-0", children: [
18734
+ /* @__PURE__ */ jsx78(
18735
+ TabButton,
18736
+ {
18737
+ active: inspectorTab === "fleet",
18738
+ onClick: openFleetTab,
18739
+ icon: /* @__PURE__ */ jsx78(Bot14, { className: "h-3.5 w-3.5" }),
18740
+ label: "Fleet",
18741
+ count: fleetTotal,
18742
+ running: runningCount
18743
+ }
18744
+ ),
18745
+ /* @__PURE__ */ jsx78(
18746
+ TabButton,
18747
+ {
18748
+ active: inspectorTab === "agents",
18749
+ onClick: openAgentsTab,
18750
+ icon: /* @__PURE__ */ jsx78(Users5, { className: "h-3.5 w-3.5" }),
18751
+ label: "Agents",
18752
+ count: fleetTotal
18753
+ }
18754
+ ),
18755
+ /* @__PURE__ */ jsx78("div", { className: "flex-1" }),
18756
+ /* @__PURE__ */ jsx78(
18757
+ "button",
18758
+ {
18759
+ type: "button",
18760
+ onClick: () => setInspectorOpen(false),
18761
+ className: "p-1 rounded hover:bg-muted transition-colors text-muted-foreground hover:text-foreground",
18762
+ "aria-label": "Collapse inspector panel",
18763
+ title: "Collapse (Esc)",
18764
+ children: /* @__PURE__ */ jsx78(ChevronDown11, { className: "h-4 w-4" })
18765
+ }
18766
+ )
18767
+ ] }),
18768
+ /* @__PURE__ */ jsx78("div", { className: "flex-1 min-h-0 overflow-y-auto", children: inspectorTab === "fleet" ? /* @__PURE__ */ jsx78(
18769
+ FleetTabContent,
18770
+ {
18771
+ fleetList,
18772
+ leaderId,
18773
+ selectedAgentId,
18774
+ runningCount,
18775
+ fleetConcurrency,
18776
+ fleetConcurrencyMax,
18777
+ fleetTokensIn,
18778
+ fleetTokensOut,
18779
+ totalCost,
18780
+ eventTimeline,
18781
+ onSelectAgent: handleSelectAgent
18782
+ }
18783
+ ) : /* @__PURE__ */ jsx78(
18784
+ AgentsTabContent,
18785
+ {
18786
+ fleetList,
18787
+ selectedAgent,
18788
+ leaderId,
18789
+ selectedAgentId: selectedAgent?.id ?? null,
18790
+ onSelectAgent: setSelectedAgentId
18791
+ }
18792
+ ) })
18793
+ ] })
18794
+ }
18795
+ )
18796
+ ] });
18797
+ }
18798
+ function TabButton({
18799
+ active,
18800
+ onClick,
18801
+ icon,
18802
+ label,
18803
+ count,
18804
+ running
18805
+ }) {
18806
+ return /* @__PURE__ */ jsxs72(
18807
+ "button",
18808
+ {
18809
+ type: "button",
18810
+ onClick,
18811
+ className: cn(
18812
+ "flex items-center gap-1.5 px-2.5 h-6 rounded-md text-[11px] font-medium transition-colors",
18813
+ active ? "bg-background text-foreground shadow-sm ring-1 ring-border" : "text-muted-foreground hover:text-foreground hover:bg-background/60"
18814
+ ),
18815
+ children: [
18816
+ icon,
18817
+ label,
18818
+ count > 0 && /* @__PURE__ */ jsx78(
18819
+ "span",
18820
+ {
18821
+ className: cn(
18822
+ "tabular-nums text-[10px] px-1 rounded-full",
18823
+ running && running > 0 ? "bg-emerald-500/15 text-emerald-600 dark:text-emerald-400" : "bg-muted text-muted-foreground"
18824
+ ),
18825
+ children: running !== void 0 ? `${running}/${count}` : count
18826
+ }
18827
+ )
18828
+ ]
18829
+ }
18830
+ );
18831
+ }
18832
+ function FleetTabContent({
18833
+ fleetList,
18834
+ leaderId,
18835
+ selectedAgentId,
18836
+ runningCount,
18837
+ fleetConcurrency,
18838
+ fleetConcurrencyMax,
18839
+ fleetTokensIn,
18840
+ fleetTokensOut,
18841
+ totalCost,
18842
+ eventTimeline,
18843
+ onSelectAgent
18844
+ }) {
18845
+ return /* @__PURE__ */ jsxs72("div", { className: "flex flex-col h-full", children: [
18846
+ /* @__PURE__ */ jsxs72("div", { className: "flex items-center gap-3 px-3 py-1.5 border-b text-[11px] text-muted-foreground shrink-0", children: [
18847
+ /* @__PURE__ */ jsxs72("span", { className: "flex items-center gap-1", children: [
18848
+ runningCount > 0 && /* @__PURE__ */ jsx78("span", { className: "h-1.5 w-1.5 rounded-full bg-emerald-500 animate-pulse" }),
18849
+ /* @__PURE__ */ jsxs72("span", { className: "tabular-nums", children: [
18850
+ runningCount,
18851
+ " running \xB7 ",
18852
+ fleetList.length,
18853
+ " total"
18854
+ ] })
18855
+ ] }),
18856
+ /* @__PURE__ */ jsx78(ConcurrencyGauge, { current: fleetConcurrency, max: fleetConcurrencyMax, showLabel: true }),
18857
+ /* @__PURE__ */ jsx78("div", { className: "flex-1" }),
18858
+ /* @__PURE__ */ jsxs72("span", { className: "tabular-nums font-mono", children: [
18859
+ "\u2193",
18860
+ fmtTok4(fleetTokensIn),
18861
+ " \u2191",
18862
+ fmtTok4(fleetTokensOut),
18863
+ " \xB7 ",
18864
+ fmtCost7(totalCost)
18865
+ ] })
18866
+ ] }),
18867
+ fleetList.length === 0 ? /* @__PURE__ */ jsxs72("div", { className: "flex flex-col items-center justify-center py-8 text-muted-foreground", children: [
18868
+ /* @__PURE__ */ jsx78(Users5, { className: "h-8 w-8 mb-2 opacity-20" }),
18869
+ /* @__PURE__ */ jsx78("p", { className: "text-xs font-medium", children: "No agents active" }),
18870
+ /* @__PURE__ */ jsx78("p", { className: "text-[11px] mt-0.5", children: "Agents appear here when the fleet is active." })
18871
+ ] }) : /* @__PURE__ */ jsx78("div", { className: "flex-1 min-h-0 overflow-y-auto p-1.5", children: fleetList.map((agent) => /* @__PURE__ */ jsx78(
18872
+ FleetAgentRow,
18873
+ {
18874
+ agent,
18875
+ isSelected: selectedAgentId === agent.id,
18876
+ isLeader: agent.id === leaderId,
18877
+ onClick: () => onSelectAgent(agent)
18878
+ },
18879
+ agent.id
18880
+ )) }),
18881
+ eventTimeline.length > 0 && /* @__PURE__ */ jsx78("div", { className: "border-t px-3 py-1.5 shrink-0", children: /* @__PURE__ */ jsx78(EventTimeline, { events: eventTimeline, max: 4 }) })
18882
+ ] });
18883
+ }
18884
+ function AgentsTabContent({
18885
+ fleetList,
18886
+ selectedAgent,
18887
+ leaderId,
18888
+ selectedAgentId,
18889
+ onSelectAgent
18890
+ }) {
18891
+ if (fleetList.length === 0) {
18892
+ return /* @__PURE__ */ jsxs72("div", { className: "flex flex-col items-center justify-center py-8 text-muted-foreground", children: [
18893
+ /* @__PURE__ */ jsx78(Bot14, { className: "h-8 w-8 mb-2 opacity-20" }),
18894
+ /* @__PURE__ */ jsx78("p", { className: "text-xs font-medium", children: "No agents active" })
18895
+ ] });
18896
+ }
18897
+ if (!selectedAgent) return null;
18898
+ const selectedIdx = Math.max(
18899
+ 0,
18900
+ fleetList.findIndex((a) => a.id === selectedAgentId)
18901
+ );
18902
+ return /* @__PURE__ */ jsxs72("div", { className: "flex flex-col h-full", children: [
18903
+ /* @__PURE__ */ jsx78("div", { className: "flex-1 min-h-0 overflow-y-auto p-3", children: /* @__PURE__ */ jsx78("div", { className: "max-w-2xl mx-auto", children: /* @__PURE__ */ jsx78(AgentCard2, { agent: selectedAgent, isLeader: selectedAgent.id === leaderId }) }) }),
18904
+ /* @__PURE__ */ jsx78("div", { className: "border-t px-2 py-1.5 shrink-0", children: /* @__PURE__ */ jsx78("div", { className: "flex items-center gap-1 overflow-x-auto pb-0.5", children: fleetList.map((agent, i) => /* @__PURE__ */ jsxs72(
18905
+ "button",
18906
+ {
18907
+ type: "button",
18908
+ onClick: () => onSelectAgent(agent.id),
18909
+ className: cn(
18910
+ "shrink-0 flex items-center gap-1.5 px-2 py-1 rounded-md text-[10px] transition-colors",
18911
+ agent.id === selectedAgent?.id ? "bg-primary/15 text-primary ring-1 ring-primary/40" : "hover:bg-accent text-muted-foreground"
18912
+ ),
18913
+ title: `${agent.name}${i === selectedIdx ? " (selected)" : ""}`,
18914
+ children: [
18915
+ /* @__PURE__ */ jsx78(
18916
+ "span",
18917
+ {
18918
+ className: cn(
18919
+ "h-1.5 w-1.5 rounded-full shrink-0",
18920
+ agent.status === "running" ? "bg-emerald-500 animate-pulse" : agent.status === "failed" ? "bg-destructive" : "bg-muted-foreground/50"
18921
+ )
18922
+ }
18923
+ ),
18924
+ /* @__PURE__ */ jsx78("span", { className: "truncate max-w-[8rem]", children: agent.name })
18925
+ ]
18926
+ },
18927
+ agent.id
18928
+ )) }) })
18929
+ ] });
18930
+ }
18931
+
18932
+ // src/App.tsx
18933
+ import { Fragment as Fragment18, jsx as jsx79, jsxs as jsxs73 } from "react/jsx-runtime";
18597
18934
  function AppInner() {
18598
18935
  const { theme } = useTheme();
18599
- const { currentView, sidebarOpen, toggleSidebar, setSearchOpen, setSidebarOpen, setCurrentView, fleetMonitorOpen, agentsMonitorOpen, setFleetMonitorOpen, setAgentsMonitorOpen } = useUIStore();
18936
+ const {
18937
+ currentView,
18938
+ sidebarOpen,
18939
+ toggleSidebar,
18940
+ setSearchOpen,
18941
+ setSidebarOpen,
18942
+ setCurrentView,
18943
+ setInspectorTab,
18944
+ toggleInspector
18945
+ } = useUIStore();
18600
18946
  const isLoading = useChatStore((s) => s.isLoading);
18601
18947
  const iteration = useSessionStore((s) => s.iteration);
18602
18948
  const projectName = useSessionStore((s) => s.projectName);
18603
18949
  const sessionTitle = useSessionStore((s) => s.session?.title);
18604
18950
  const sessionId = useSessionStore((s) => s.session?.id);
18605
18951
  const nickname = useUIStore((s) => sessionId ? s.sessionNicknames[sessionId] : void 0);
18606
- useEffect44(() => {
18952
+ useEffect45(() => {
18607
18953
  const onOpenFile = (e) => {
18608
18954
  const { filePath } = e.detail;
18609
18955
  const ws = getWSClient(useConfigStore.getState().wsUrl);
@@ -18614,7 +18960,7 @@ function AppInner() {
18614
18960
  window.addEventListener("wrongstack:open-file", onOpenFile);
18615
18961
  return () => window.removeEventListener("wrongstack:open-file", onOpenFile);
18616
18962
  }, []);
18617
- useEffect44(() => {
18963
+ useEffect45(() => {
18618
18964
  const onSaveFile = (e) => {
18619
18965
  const { filePath } = e.detail;
18620
18966
  const file = useFileStore.getState().openFiles.find((f) => f.path === filePath);
@@ -18630,7 +18976,7 @@ function AppInner() {
18630
18976
  window.addEventListener("wrongstack:save-file", onSaveFile);
18631
18977
  return () => window.removeEventListener("wrongstack:save-file", onSaveFile);
18632
18978
  }, []);
18633
- useEffect44(() => {
18979
+ useEffect45(() => {
18634
18980
  if (typeof window === "undefined") return;
18635
18981
  const mq = window.matchMedia("(max-width: 768px)");
18636
18982
  const apply = () => {
@@ -18643,7 +18989,7 @@ function AppInner() {
18643
18989
  return () => mq.removeEventListener("change", apply);
18644
18990
  }, [setSidebarOpen]);
18645
18991
  useWebSocketBootstrap();
18646
- useEffect44(() => {
18992
+ useEffect45(() => {
18647
18993
  const parts = [];
18648
18994
  if (isLoading) {
18649
18995
  const it = iteration ? ` iter ${iteration.index}${iteration.max ? `/${iteration.max}` : ""}` : "";
@@ -18660,7 +19006,7 @@ function AppInner() {
18660
19006
  document.title = projectName || "AI Agent";
18661
19007
  };
18662
19008
  }, [isLoading, iteration, projectName, sessionTitle, nickname]);
18663
- useEffect44(() => {
19009
+ useEffect45(() => {
18664
19010
  const onKey = (e) => {
18665
19011
  const t = e.target;
18666
19012
  const tag = t?.tagName?.toLowerCase();
@@ -18710,11 +19056,26 @@ function AppInner() {
18710
19056
  }
18711
19057
  if (mod && e.shiftKey && e.key.toLowerCase() === "m") {
18712
19058
  e.preventDefault();
18713
- useUIStore.getState().setFleetMonitorOpen(!useUIStore.getState().fleetMonitorOpen);
19059
+ const s = useUIStore.getState();
19060
+ if (s.inspectorOpen && s.inspectorTab === "fleet") {
19061
+ toggleInspector();
19062
+ } else {
19063
+ setInspectorTab("fleet");
19064
+ if (!s.inspectorOpen) toggleInspector();
19065
+ }
18714
19066
  }
18715
19067
  if (mod && e.shiftKey && e.key.toLowerCase() === "a") {
18716
19068
  e.preventDefault();
18717
- useUIStore.getState().setAgentsMonitorOpen(!useUIStore.getState().agentsMonitorOpen);
19069
+ const s = useUIStore.getState();
19070
+ if (s.inspectorOpen && s.inspectorTab === "agents") {
19071
+ toggleInspector();
19072
+ } else {
19073
+ setInspectorTab("agents");
19074
+ if (!s.inspectorOpen) toggleInspector();
19075
+ }
19076
+ }
19077
+ if (e.key === "Escape" && !mod && useUIStore.getState().inspectorOpen) {
19078
+ useUIStore.getState().setInspectorOpen(false);
18718
19079
  }
18719
19080
  if (!inField && !mod && !e.altKey) {
18720
19081
  const bubbles = Array.from(document.querySelectorAll("[data-message-id]"));
@@ -18773,52 +19134,41 @@ function AppInner() {
18773
19134
  window.addEventListener("keydown", onKey);
18774
19135
  return () => window.removeEventListener("keydown", onKey);
18775
19136
  }, [toggleSidebar, setSearchOpen]);
18776
- return /* @__PURE__ */ jsxs72("div", { className: cn("flex h-screen", theme), children: [
18777
- currentView !== "setup" && /* @__PURE__ */ jsx78(ActivityBar, {}),
18778
- sidebarOpen && currentView !== "setup" && /* @__PURE__ */ jsx78(SidePanel, {}),
18779
- /* @__PURE__ */ jsxs72("main", { className: "flex-1 flex flex-col overflow-hidden", children: [
18780
- currentView !== "setup" && /* @__PURE__ */ jsx78(ConnectionBanner, {}),
18781
- currentView === "chat" && /* @__PURE__ */ jsxs72(Fragment17, { children: [
18782
- sessionId && /* @__PURE__ */ jsx78("div", { className: "px-4 pt-2", children: /* @__PURE__ */ jsx78(WorkspaceDock, { sessionId }) }),
18783
- /* @__PURE__ */ jsx78(ChatView, {})
19137
+ return /* @__PURE__ */ jsxs73("div", { className: cn("flex h-screen", theme), children: [
19138
+ currentView !== "setup" && /* @__PURE__ */ jsx79(ActivityBar, {}),
19139
+ sidebarOpen && currentView !== "setup" && /* @__PURE__ */ jsx79(SidePanel, {}),
19140
+ /* @__PURE__ */ jsxs73("main", { className: "flex-1 flex flex-col overflow-hidden", children: [
19141
+ currentView !== "setup" && /* @__PURE__ */ jsx79(ConnectionBanner, {}),
19142
+ currentView === "chat" && /* @__PURE__ */ jsxs73(Fragment18, { children: [
19143
+ sessionId && /* @__PURE__ */ jsx79("div", { className: "px-4 pt-2", children: /* @__PURE__ */ jsx79(WorkspaceDock, { sessionId }) }),
19144
+ /* @__PURE__ */ jsx79(ChatView, {}),
19145
+ /* @__PURE__ */ jsx79(InspectorPanel, {})
18784
19146
  ] }),
18785
- currentView === "settings" && /* @__PURE__ */ jsx78(SettingsPanel, {}),
18786
- currentView === "setup" && /* @__PURE__ */ jsx78(SetupScreen, {}),
18787
- currentView === "autophase" && /* @__PURE__ */ jsx78(AutoPhaseView, { onClose: () => setCurrentView("chat") }),
18788
- currentView === "agents" && /* @__PURE__ */ jsx78("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx78(AgentsPage, {}) }),
18789
- currentView === "agentflow" && /* @__PURE__ */ jsx78("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx78(AgentFlowCanvasWithProvider, {}) }),
18790
- currentView === "fleet" && /* @__PURE__ */ jsx78("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx78(FleetMonitor, { isOverlay: false }) }),
18791
- currentView === "sessions" && /* @__PURE__ */ jsx78("div", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx78(SessionsDashboard, {}) }),
18792
- currentView === "files" && /* @__PURE__ */ jsx78(CodeEditor, {})
19147
+ currentView === "settings" && /* @__PURE__ */ jsx79(SettingsPanel, {}),
19148
+ currentView === "setup" && /* @__PURE__ */ jsx79(SetupScreen, {}),
19149
+ currentView === "autophase" && /* @__PURE__ */ jsx79(AutoPhaseView, { onClose: () => setCurrentView("chat") }),
19150
+ currentView === "agents" && /* @__PURE__ */ jsx79("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx79(AgentsPage, {}) }),
19151
+ currentView === "agentflow" && /* @__PURE__ */ jsx79("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx79(AgentFlowCanvasWithProvider, {}) }),
19152
+ currentView === "fleet" && /* @__PURE__ */ jsx79("div", { className: "flex-1 flex flex-col overflow-hidden", children: /* @__PURE__ */ jsx79(FleetMonitor, { isOverlay: false }) }),
19153
+ currentView === "sessions" && /* @__PURE__ */ jsx79("div", { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsx79(SessionsDashboard, {}) }),
19154
+ currentView === "files" && /* @__PURE__ */ jsx79(CodeEditor, {})
18793
19155
  ] }),
18794
- fleetMonitorOpen && currentView !== "fleet" && /* @__PURE__ */ jsx78(
18795
- FleetMonitor,
18796
- {
18797
- isOverlay: true,
18798
- onClose: () => setFleetMonitorOpen(false),
18799
- onSelectAgent: (agent) => {
18800
- setFleetMonitorOpen(false);
18801
- setAgentsMonitorOpen(true);
18802
- }
18803
- }
18804
- ),
18805
- agentsMonitorOpen && /* @__PURE__ */ jsx78(AgentsMonitor, { onClose: () => setAgentsMonitorOpen(false) }),
18806
- /* @__PURE__ */ jsx78(ConfirmDialog, {}),
18807
- /* @__PURE__ */ jsx78(ConfirmModalHost, {}),
18808
- /* @__PURE__ */ jsx78(CommandPalette, {}),
18809
- /* @__PURE__ */ jsx78(ShortcutsOverlay, {}),
18810
- /* @__PURE__ */ jsx78(QuickModelSwitcher, {}),
18811
- /* @__PURE__ */ jsx78(Toaster, {})
19156
+ /* @__PURE__ */ jsx79(ConfirmDialog, {}),
19157
+ /* @__PURE__ */ jsx79(ConfirmModalHost, {}),
19158
+ /* @__PURE__ */ jsx79(CommandPalette, {}),
19159
+ /* @__PURE__ */ jsx79(ShortcutsOverlay, {}),
19160
+ /* @__PURE__ */ jsx79(QuickModelSwitcher, {}),
19161
+ /* @__PURE__ */ jsx79(Toaster, {})
18812
19162
  ] });
18813
19163
  }
18814
19164
  function App() {
18815
- return /* @__PURE__ */ jsx78(ErrorBoundary, { children: /* @__PURE__ */ jsx78(ThemeProvider, { defaultTheme: "system", children: /* @__PURE__ */ jsx78(AppInner, {}) }) });
19165
+ return /* @__PURE__ */ jsx79(ErrorBoundary, { children: /* @__PURE__ */ jsx79(ThemeProvider, { defaultTheme: "system", children: /* @__PURE__ */ jsx79(AppInner, {}) }) });
18816
19166
  }
18817
19167
 
18818
19168
  // src/main.tsx
18819
19169
  import "./index.css";
18820
- import { jsx as jsx79 } from "react/jsx-runtime";
19170
+ import { jsx as jsx80 } from "react/jsx-runtime";
18821
19171
  ReactDOM.createRoot(expectDefined14(document.getElementById("root"))).render(
18822
- /* @__PURE__ */ jsx79(React7.StrictMode, { children: /* @__PURE__ */ jsx79(App, {}) })
19172
+ /* @__PURE__ */ jsx80(React7.StrictMode, { children: /* @__PURE__ */ jsx80(App, {}) })
18823
19173
  );
18824
19174
  //# sourceMappingURL=index.js.map