@getcatalystiq/agent-plane-ui 0.1.30 → 0.1.31

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.cjs CHANGED
@@ -2,13 +2,15 @@
2
2
 
3
3
  var chunkVZ43ATC5_cjs = require('./chunk-VZ43ATC5.cjs');
4
4
  var chunkXXF4U7WL_cjs = require('./chunk-XXF4U7WL.cjs');
5
+ var React4 = require('react');
5
6
  var jsxRuntime = require('react/jsx-runtime');
6
- var React = require('react');
7
7
  var swr = require('swr');
8
8
  var ReactMarkdown = require('react-markdown');
9
9
  var cmdk = require('cmdk');
10
10
  var Popover = require('@radix-ui/react-popover');
11
11
  var remarkGfm = require('remark-gfm');
12
+ var ToastPrimitives = require('@radix-ui/react-toast');
13
+ var classVarianceAuthority = require('class-variance-authority');
12
14
 
13
15
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
14
16
 
@@ -30,11 +32,70 @@ function _interopNamespace(e) {
30
32
  return Object.freeze(n);
31
33
  }
32
34
 
33
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
35
+ var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
34
36
  var ReactMarkdown__default = /*#__PURE__*/_interopDefault(ReactMarkdown);
35
37
  var Popover__namespace = /*#__PURE__*/_interopNamespace(Popover);
36
38
  var remarkGfm__default = /*#__PURE__*/_interopDefault(remarkGfm);
39
+ var ToastPrimitives__namespace = /*#__PURE__*/_interopNamespace(ToastPrimitives);
37
40
 
41
+ var ACTIVE_STATUSES = /* @__PURE__ */ new Set(["running", "pending"]);
42
+ function useRunStream(runId, status) {
43
+ const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
44
+ const [events, setEvents] = React4.useState([]);
45
+ const [isStreaming, setIsStreaming] = React4.useState(false);
46
+ const [terminalEvent, setTerminalEvent] = React4.useState(null);
47
+ const [streamingText, setStreamingText] = React4.useState("");
48
+ const [error, setError] = React4.useState(null);
49
+ const abortRef = React4.useRef(null);
50
+ const startStream = React4.useCallback(async (id, signal) => {
51
+ setIsStreaming(true);
52
+ setError(null);
53
+ try {
54
+ const stream = await client.runs.stream(id, { signal });
55
+ for await (const event of stream) {
56
+ if (signal.aborted) break;
57
+ if (event.type === "text_delta") {
58
+ const text = event.text ?? "";
59
+ setStreamingText((prev) => prev + text);
60
+ continue;
61
+ }
62
+ if (event.type === "assistant") {
63
+ setStreamingText("");
64
+ }
65
+ if (event.type === "stream_detached") {
66
+ continue;
67
+ }
68
+ setEvents((prev) => [...prev, event]);
69
+ if (event.type === "result" || event.type === "error") {
70
+ setTerminalEvent(event);
71
+ setIsStreaming(false);
72
+ setStreamingText("");
73
+ return;
74
+ }
75
+ }
76
+ setIsStreaming(false);
77
+ } catch (err) {
78
+ if (signal.aborted) return;
79
+ setError(err instanceof Error ? err : new Error(String(err)));
80
+ setIsStreaming(false);
81
+ }
82
+ }, [client]);
83
+ React4.useEffect(() => {
84
+ if (!runId || !ACTIVE_STATUSES.has(status)) {
85
+ setIsStreaming(false);
86
+ return;
87
+ }
88
+ if (terminalEvent) return;
89
+ const controller = new AbortController();
90
+ abortRef.current = controller;
91
+ startStream(runId, controller.signal);
92
+ return () => {
93
+ controller.abort();
94
+ abortRef.current = null;
95
+ };
96
+ }, [runId, status, startStream, terminalEvent]);
97
+ return { events, isStreaming, terminalEvent, streamingText, error };
98
+ }
38
99
  function Select({ className = "", ...props }) {
39
100
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-full", children: [
40
101
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -51,7 +112,7 @@ function Select({ className = "", ...props }) {
51
112
  ] }) })
52
113
  ] });
53
114
  }
54
- var Textarea = React__namespace.forwardRef(
115
+ var Textarea = React4__namespace.forwardRef(
55
116
  ({ className, ...props }, ref) => {
56
117
  return /* @__PURE__ */ jsxRuntime.jsx(
57
118
  "textarea",
@@ -157,7 +218,7 @@ function PaginationBar({
157
218
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between px-3 py-2 border-t border-border bg-muted/20 text-sm", children: [
158
219
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 text-muted-foreground", children: [
159
220
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Rows per page:" }),
160
- PAGE_SIZE_OPTIONS.map((ps) => /* @__PURE__ */ jsxRuntime.jsx(React__namespace.default.Fragment, { children: renderLink(
221
+ PAGE_SIZE_OPTIONS.map((ps) => /* @__PURE__ */ jsxRuntime.jsx(React4__namespace.default.Fragment, { children: renderLink(
161
222
  buildHref(1, ps),
162
223
  ps,
163
224
  `px-2 py-0.5 rounded text-xs ${pageSize === ps ? "bg-primary text-primary-foreground font-medium" : "hover:bg-muted"}`
@@ -188,7 +249,7 @@ function parsePaginationParams(pageParam, pageSizeParam, defaultPageSize = 20) {
188
249
  return { page, pageSize, offset };
189
250
  }
190
251
  function Tabs({ tabs, defaultTab = 0 }) {
191
- const [active, setActive] = React.useState(defaultTab);
252
+ const [active, setActive] = React4.useState(defaultTab);
192
253
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
193
254
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: tabs.map((tab, i) => /* @__PURE__ */ jsxRuntime.jsxs(
194
255
  "button",
@@ -230,7 +291,7 @@ function ConfirmDialog({
230
291
  ] }) });
231
292
  }
232
293
  function CopyButton({ text, className = "" }) {
233
- const [copied, setCopied] = React.useState(false);
294
+ const [copied, setCopied] = React4.useState(false);
234
295
  async function handleCopy() {
235
296
  await navigator.clipboard.writeText(text);
236
297
  setCopied(true);
@@ -323,6 +384,102 @@ function DashboardPage({ initialData, chartComponent: ChartComponent }) {
323
384
  ChartComponent && /* @__PURE__ */ jsxRuntime.jsx(ChartComponent, { stats: daily_stats })
324
385
  ] });
325
386
  }
387
+ var TOAST_LIMIT = 5;
388
+ var TOAST_REMOVE_DELAY = 1e6;
389
+ var count = 0;
390
+ function genId() {
391
+ count = (count + 1) % Number.MAX_SAFE_INTEGER;
392
+ return count.toString();
393
+ }
394
+ var toastTimeouts = /* @__PURE__ */ new Map();
395
+ function addToRemoveQueue(toastId) {
396
+ if (toastTimeouts.has(toastId)) return;
397
+ const timeout = setTimeout(() => {
398
+ toastTimeouts.delete(toastId);
399
+ dispatch({ type: "REMOVE_TOAST", toastId });
400
+ }, TOAST_REMOVE_DELAY);
401
+ toastTimeouts.set(toastId, timeout);
402
+ }
403
+ function reducer(state, action) {
404
+ switch (action.type) {
405
+ case "ADD_TOAST":
406
+ return {
407
+ ...state,
408
+ toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT)
409
+ };
410
+ case "UPDATE_TOAST":
411
+ return {
412
+ ...state,
413
+ toasts: state.toasts.map(
414
+ (t) => t.id === action.toast.id ? { ...t, ...action.toast } : t
415
+ )
416
+ };
417
+ case "DISMISS_TOAST": {
418
+ const { toastId } = action;
419
+ if (toastId) {
420
+ addToRemoveQueue(toastId);
421
+ } else {
422
+ state.toasts.forEach((t) => addToRemoveQueue(t.id));
423
+ }
424
+ return {
425
+ ...state,
426
+ toasts: state.toasts.map(
427
+ (t) => t.id === toastId || toastId === void 0 ? { ...t, open: false } : t
428
+ )
429
+ };
430
+ }
431
+ case "REMOVE_TOAST":
432
+ if (action.toastId === void 0) {
433
+ return { ...state, toasts: [] };
434
+ }
435
+ return {
436
+ ...state,
437
+ toasts: state.toasts.filter((t) => t.id !== action.toastId)
438
+ };
439
+ }
440
+ }
441
+ var listeners = [];
442
+ var memoryState = { toasts: [] };
443
+ function dispatch(action) {
444
+ memoryState = reducer(memoryState, action);
445
+ listeners.forEach((listener) => listener(memoryState));
446
+ }
447
+ function toast(props) {
448
+ const id = genId();
449
+ const update = (updateProps) => dispatch({ type: "UPDATE_TOAST", toast: { ...updateProps, id } });
450
+ const dismiss2 = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
451
+ dispatch({
452
+ type: "ADD_TOAST",
453
+ toast: {
454
+ ...props,
455
+ id,
456
+ open: true,
457
+ onOpenChange: (open) => {
458
+ if (!open) dismiss2();
459
+ }
460
+ }
461
+ });
462
+ return { id, dismiss: dismiss2, update };
463
+ }
464
+ function dismiss(toastId) {
465
+ const action = toastId !== void 0 ? { type: "DISMISS_TOAST", toastId } : { type: "DISMISS_TOAST" };
466
+ dispatch(action);
467
+ }
468
+ function useToast() {
469
+ const [state, setState] = React4__namespace.useState(memoryState);
470
+ React4__namespace.useEffect(() => {
471
+ listeners.push(setState);
472
+ return () => {
473
+ const index = listeners.indexOf(setState);
474
+ if (index > -1) listeners.splice(index, 1);
475
+ };
476
+ }, [state]);
477
+ return {
478
+ ...state,
479
+ toast,
480
+ dismiss
481
+ };
482
+ }
326
483
  var SOURCES = [
327
484
  { value: "", label: "All Sources" },
328
485
  { value: "api", label: "API" },
@@ -332,11 +489,18 @@ var SOURCES = [
332
489
  { value: "a2a", label: "A2A" }
333
490
  ];
334
491
  var VALID_SOURCES = SOURCES.filter((s) => s.value).map((s) => s.value);
492
+ var ACTIVE_STATUSES2 = /* @__PURE__ */ new Set(["running", "pending"]);
493
+ var TERMINAL_STATUSES = /* @__PURE__ */ new Set(["completed", "failed", "cancelled", "timed_out"]);
335
494
  function RunListPage({ initialData }) {
336
495
  const { LinkComponent, basePath } = chunkXXF4U7WL_cjs.useNavigation();
337
- const [page, setPage] = React.useState(1);
338
- const [pageSize, setPageSize] = React.useState(20);
339
- const [sourceFilter, setSourceFilter] = React.useState(null);
496
+ const { toast: toast2 } = useToast();
497
+ const [page, setPage] = React4.useState(1);
498
+ const [pageSize, setPageSize] = React4.useState(20);
499
+ const [sourceFilter, setSourceFilter] = React4.useState(null);
500
+ const prevStatusesRef = React4.useRef(/* @__PURE__ */ new Map());
501
+ const [activeRunsExist, setActiveRunsExist] = React4.useState(
502
+ () => initialData?.data?.some((r) => ACTIVE_STATUSES2.has(r.status)) ?? false
503
+ );
340
504
  const cacheKey = `runs-${page}-${pageSize}-${sourceFilter || "all"}`;
341
505
  const { data, error, isLoading } = chunkVZ43ATC5_cjs.useApi(
342
506
  cacheKey,
@@ -347,14 +511,35 @@ function RunListPage({ initialData }) {
347
511
  ...sourceFilter ? { triggered_by: sourceFilter } : {}
348
512
  });
349
513
  },
350
- initialData ? { fallbackData: initialData } : void 0
514
+ {
515
+ ...initialData ? { fallbackData: initialData } : {},
516
+ refreshInterval: activeRunsExist ? 5e3 : 0
517
+ }
351
518
  );
352
- const handleSourceChange = React.useCallback((e) => {
519
+ React4.useEffect(() => {
520
+ if (!data?.data) return;
521
+ const prev = prevStatusesRef.current;
522
+ const next = /* @__PURE__ */ new Map();
523
+ for (const run of data.data) {
524
+ next.set(run.id, run.status);
525
+ const oldStatus = prev.get(run.id);
526
+ if (oldStatus && ACTIVE_STATUSES2.has(oldStatus) && TERMINAL_STATUSES.has(run.status)) {
527
+ toast2({
528
+ title: `Run ${run.status}`,
529
+ description: run.agent_name,
530
+ variant: run.status === "completed" ? "success" : "destructive"
531
+ });
532
+ }
533
+ }
534
+ prevStatusesRef.current = next;
535
+ setActiveRunsExist(data.data.some((r) => ACTIVE_STATUSES2.has(r.status)));
536
+ }, [data, toast2]);
537
+ const handleSourceChange = React4.useCallback((e) => {
353
538
  const value = e.target.value;
354
539
  setSourceFilter(VALID_SOURCES.includes(value) ? value : null);
355
540
  setPage(1);
356
541
  }, []);
357
- const handlePaginationNavigate = React.useCallback((href) => {
542
+ const handlePaginationNavigate = React4.useCallback((href) => {
358
543
  const url = new URL(href, "http://localhost");
359
544
  const p = parseInt(url.searchParams.get("page") || "1", 10);
360
545
  const ps = parseInt(url.searchParams.get("pageSize") || "20", 10);
@@ -529,17 +714,51 @@ function buildConversation(events) {
529
714
  }
530
715
  return items;
531
716
  }
532
- function TranscriptViewer({ transcript, prompt }) {
533
- const conversation = React.useMemo(() => buildConversation(transcript), [transcript]);
717
+ function TranscriptViewer({ transcript, prompt, isStreaming = false }) {
718
+ const conversation = React4.useMemo(() => buildConversation(transcript), [transcript]);
719
+ const scrollContainerRef = React4.useRef(null);
720
+ const sentinelRef = React4.useRef(null);
721
+ const userHasScrolledUpRef = React4.useRef(false);
722
+ const [userHasScrolledUp, setUserHasScrolledUp] = React4.useState(false);
723
+ const handleScroll = React4.useCallback(() => {
724
+ const el = scrollContainerRef.current;
725
+ if (!el) return;
726
+ const atBottom = el.scrollHeight - el.scrollTop - el.clientHeight < 50;
727
+ if (atBottom) {
728
+ userHasScrolledUpRef.current = false;
729
+ setUserHasScrolledUp(false);
730
+ } else {
731
+ userHasScrolledUpRef.current = true;
732
+ setUserHasScrolledUp(true);
733
+ }
734
+ }, []);
735
+ React4.useEffect(() => {
736
+ if (isStreaming && !userHasScrolledUpRef.current) {
737
+ sentinelRef.current?.scrollIntoView({ behavior: "smooth" });
738
+ }
739
+ }, [transcript.length, isStreaming]);
534
740
  return /* @__PURE__ */ jsxRuntime.jsxs(chunkVZ43ATC5_cjs.Card, { children: [
535
741
  /* @__PURE__ */ jsxRuntime.jsx(chunkVZ43ATC5_cjs.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(chunkVZ43ATC5_cjs.CardTitle, { className: "text-base", children: "Transcript" }) }),
536
- /* @__PURE__ */ jsxRuntime.jsxs(chunkVZ43ATC5_cjs.CardContent, { className: "space-y-3", children: [
537
- prompt && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border bg-muted/20 px-4 py-3", children: [
538
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Prompt" }),
539
- /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "text-xs font-mono whitespace-pre-wrap", children: prompt })
540
- ] }),
541
- transcript.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No transcript available" }) : /* @__PURE__ */ jsxRuntime.jsx(ConversationView, { items: conversation })
542
- ] })
742
+ /* @__PURE__ */ jsxRuntime.jsx(chunkVZ43ATC5_cjs.CardContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
743
+ "div",
744
+ {
745
+ ref: scrollContainerRef,
746
+ onScroll: isStreaming ? handleScroll : void 0,
747
+ className: "space-y-3 overflow-y-auto px-6 pb-6",
748
+ children: [
749
+ prompt && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border bg-muted/20 px-4 py-3", children: [
750
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs font-medium text-muted-foreground mb-1", children: "Prompt" }),
751
+ /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "text-xs font-mono whitespace-pre-wrap", children: prompt })
752
+ ] }),
753
+ transcript.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No transcript available" }) : /* @__PURE__ */ jsxRuntime.jsx(ConversationView, { items: conversation }),
754
+ isStreaming && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-4 py-2 text-xs text-muted-foreground", children: [
755
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "h-2 w-2 rounded-full bg-blue-400 animate-pulse" }),
756
+ "Streaming..."
757
+ ] }),
758
+ /* @__PURE__ */ jsxRuntime.jsx("div", { ref: sentinelRef })
759
+ ]
760
+ }
761
+ ) })
543
762
  ] });
544
763
  }
545
764
  function ConversationView({ items }) {
@@ -563,7 +782,7 @@ function ConversationView({ items }) {
563
782
  }) });
564
783
  }
565
784
  function A2AIncomingItem({ item }) {
566
- const [expanded, setExpanded] = React.useState(false);
785
+ const [expanded, setExpanded] = React4.useState(false);
567
786
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border bg-muted/30 overflow-hidden", children: [
568
787
  /* @__PURE__ */ jsxRuntime.jsxs(
569
788
  "button",
@@ -589,7 +808,7 @@ function A2AIncomingItem({ item }) {
589
808
  ] });
590
809
  }
591
810
  function SystemItem({ item }) {
592
- const [expanded, setExpanded] = React.useState(false);
811
+ const [expanded, setExpanded] = React4.useState(false);
593
812
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border bg-muted/30 overflow-hidden", children: [
594
813
  /* @__PURE__ */ jsxRuntime.jsxs("button", { onClick: () => setExpanded(!expanded), className: "w-full flex items-center gap-2 px-4 py-2 text-left hover:bg-muted/50 transition-colors", children: [
595
814
  /* @__PURE__ */ jsxRuntime.jsx(chunkXXF4U7WL_cjs.Badge, { variant: "outline", className: "text-[10px]", children: "system" }),
@@ -618,7 +837,7 @@ function SystemItem({ item }) {
618
837
  ] });
619
838
  }
620
839
  function AssistantItem({ item }) {
621
- const [expanded, setExpanded] = React.useState(false);
840
+ const [expanded, setExpanded] = React4.useState(false);
622
841
  const preview = item.text?.split("\n")[0]?.slice(0, 120) ?? "";
623
842
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border overflow-hidden", children: [
624
843
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -637,7 +856,7 @@ function AssistantItem({ item }) {
637
856
  ] });
638
857
  }
639
858
  function ToolItem({ item }) {
640
- const [expanded, setExpanded] = React.useState(false);
859
+ const [expanded, setExpanded] = React4.useState(false);
641
860
  const hasOutput = item.toolOutput && item.toolOutput.length > 0;
642
861
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-md border border-border overflow-hidden", children: [
643
862
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -693,6 +912,7 @@ function ErrorItem({ item }) {
693
912
  }
694
913
  function RunDetailPage({ runId, initialData, initialTranscript }) {
695
914
  const { mutate } = swr.useSWRConfig();
915
+ const { toast: toast2 } = useToast();
696
916
  const { data: run, error, isLoading } = chunkVZ43ATC5_cjs.useApi(
697
917
  `run-${runId}`,
698
918
  (client) => client.runs.get(runId),
@@ -703,6 +923,20 @@ function RunDetailPage({ runId, initialData, initialTranscript }) {
703
923
  (client) => client.runs.transcriptArray(runId),
704
924
  initialTranscript ? { fallbackData: initialTranscript } : void 0
705
925
  );
926
+ const isActive = run?.status === "running" || run?.status === "pending";
927
+ const { events, isStreaming, terminalEvent, streamingText } = useRunStream(
928
+ runId,
929
+ run?.status ?? ""
930
+ );
931
+ React4.useEffect(() => {
932
+ if (!terminalEvent) return;
933
+ toast2({
934
+ title: terminalEvent.type === "result" ? "Run completed" : "Run failed",
935
+ variant: terminalEvent.type === "result" ? "success" : "destructive"
936
+ });
937
+ mutate(`run-${runId}`);
938
+ mutate(`transcript-${runId}`);
939
+ }, [terminalEvent, toast2, mutate, runId]);
706
940
  if (error) {
707
941
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center min-h-[40vh]", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-destructive", children: [
708
942
  "Failed to load run: ",
@@ -735,16 +969,26 @@ function RunDetailPage({ runId, initialData, initialTranscript }) {
735
969
  ] }),
736
970
  /* @__PURE__ */ jsxRuntime.jsx(MetricCard, { label: "Cost", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-mono", children: [
737
971
  "$",
738
- run.cost_usd != null ? run.cost_usd.toFixed(4) : "\u2014"
972
+ (() => {
973
+ const cost = terminalEvent?.cost_usd ?? run.cost_usd;
974
+ return cost != null ? Number(cost).toFixed(4) : "\u2014";
975
+ })()
739
976
  ] }) }),
740
- /* @__PURE__ */ jsxRuntime.jsx(MetricCard, { label: "Turns", children: run.num_turns }),
741
- /* @__PURE__ */ jsxRuntime.jsx(MetricCard, { label: "Duration", children: run.duration_ms > 0 ? `${(run.duration_ms / 1e3).toFixed(1)}s` : "\u2014" }),
977
+ /* @__PURE__ */ jsxRuntime.jsx(MetricCard, { label: "Turns", children: terminalEvent?.num_turns ?? run.num_turns }),
978
+ /* @__PURE__ */ jsxRuntime.jsx(MetricCard, { label: "Duration", children: (() => {
979
+ const ms = terminalEvent?.duration_ms ?? run.duration_ms;
980
+ return ms > 0 ? `${(ms / 1e3).toFixed(1)}s` : "\u2014";
981
+ })() }),
742
982
  /* @__PURE__ */ jsxRuntime.jsxs(MetricCard, { label: "Tokens", children: [
743
- (run.total_input_tokens + run.total_output_tokens).toLocaleString(),
983
+ (() => {
984
+ const inTok = terminalEvent?.total_input_tokens ?? run.total_input_tokens;
985
+ const outTok = terminalEvent?.total_output_tokens ?? run.total_output_tokens;
986
+ return (inTok + outTok).toLocaleString();
987
+ })(),
744
988
  /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs text-muted-foreground mt-0.5 font-normal", children: [
745
- run.total_input_tokens.toLocaleString(),
989
+ (terminalEvent?.total_input_tokens ?? run.total_input_tokens).toLocaleString(),
746
990
  " in / ",
747
- run.total_output_tokens.toLocaleString(),
991
+ (terminalEvent?.total_output_tokens ?? run.total_output_tokens).toLocaleString(),
748
992
  " out"
749
993
  ] })
750
994
  ] })
@@ -756,7 +1000,18 @@ function RunDetailPage({ runId, initialData, initialTranscript }) {
756
1000
  run.error_messages.map((msg, i) => /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "whitespace-pre-wrap text-sm text-destructive font-mono bg-destructive/10 rounded-md p-3", children: msg }, i))
757
1001
  ] })
758
1002
  ] }),
759
- /* @__PURE__ */ jsxRuntime.jsx(TranscriptViewer, { transcript: transcript || [], prompt: run.prompt }),
1003
+ /* @__PURE__ */ jsxRuntime.jsx(
1004
+ TranscriptViewer,
1005
+ {
1006
+ transcript: isActive && isStreaming ? events : transcript || [],
1007
+ prompt: run.prompt,
1008
+ isStreaming: isActive && isStreaming
1009
+ }
1010
+ ),
1011
+ isActive && streamingText && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg border bg-muted/30 p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("pre", { className: "whitespace-pre-wrap text-sm font-mono", children: [
1012
+ streamingText,
1013
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block w-2 h-4 ml-0.5 bg-foreground/70 animate-pulse align-text-bottom" })
1014
+ ] }) }),
760
1015
  /* @__PURE__ */ jsxRuntime.jsx(chunkVZ43ATC5_cjs.Card, { children: /* @__PURE__ */ jsxRuntime.jsxs("details", { children: [
761
1016
  /* @__PURE__ */ jsxRuntime.jsxs("summary", { className: "flex items-center justify-between px-6 py-4 cursor-pointer list-none hover:bg-muted/30 transition-colors rounded-xl", children: [
762
1017
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-base font-semibold", children: "Metadata" }),
@@ -782,8 +1037,8 @@ function RunDetailPage({ runId, initialData, initialTranscript }) {
782
1037
  ] });
783
1038
  }
784
1039
  function CancelRunButton({ runId, onCancelled }) {
785
- const [open, setOpen] = React.useState(false);
786
- const [cancelling, setCancelling] = React.useState(false);
1040
+ const [open, setOpen] = React4.useState(false);
1041
+ const [cancelling, setCancelling] = React4.useState(false);
787
1042
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
788
1043
  async function handleConfirm() {
789
1044
  setCancelling(true);
@@ -836,17 +1091,17 @@ function McpServerListPage({ initialData }) {
836
1091
  (c) => c.customConnectors.listServers(),
837
1092
  initialData ? { fallbackData: initialData } : void 0
838
1093
  );
839
- const [showCreate, setShowCreate] = React.useState(false);
840
- const [creating, setCreating] = React.useState(false);
841
- const [createForm, setCreateForm] = React.useState(emptyForm);
842
- const [createError, setCreateError] = React.useState("");
843
- const [editTarget, setEditTarget] = React.useState(null);
844
- const [editing, setEditing] = React.useState(false);
845
- const [editForm, setEditForm] = React.useState({ name: "", description: "" });
846
- const [editError, setEditError] = React.useState("");
847
- const [deleteTarget, setDeleteTarget] = React.useState(null);
848
- const [deleting, setDeleting] = React.useState(false);
849
- const [deleteError, setDeleteError] = React.useState("");
1094
+ const [showCreate, setShowCreate] = React4.useState(false);
1095
+ const [creating, setCreating] = React4.useState(false);
1096
+ const [createForm, setCreateForm] = React4.useState(emptyForm);
1097
+ const [createError, setCreateError] = React4.useState("");
1098
+ const [editTarget, setEditTarget] = React4.useState(null);
1099
+ const [editing, setEditing] = React4.useState(false);
1100
+ const [editForm, setEditForm] = React4.useState({ name: "", description: "" });
1101
+ const [editError, setEditError] = React4.useState("");
1102
+ const [deleteTarget, setDeleteTarget] = React4.useState(null);
1103
+ const [deleting, setDeleting] = React4.useState(false);
1104
+ const [deleteError, setDeleteError] = React4.useState("");
850
1105
  async function handleCreate() {
851
1106
  setCreating(true);
852
1107
  setCreateError("");
@@ -1029,13 +1284,13 @@ function PluginMarketplaceListPage({ initialData }) {
1029
1284
  (c) => c.pluginMarketplaces.list(),
1030
1285
  initialData ? { fallbackData: initialData } : void 0
1031
1286
  );
1032
- const [showAdd, setShowAdd] = React.useState(false);
1033
- const [adding, setAdding] = React.useState(false);
1034
- const [addError, setAddError] = React.useState("");
1035
- const [newMarketplace, setNewMarketplace] = React.useState({ name: "", github_repo: "" });
1036
- const [deleteTarget, setDeleteTarget] = React.useState(null);
1037
- const [deleting, setDeleting] = React.useState(false);
1038
- const [deleteError, setDeleteError] = React.useState("");
1287
+ const [showAdd, setShowAdd] = React4.useState(false);
1288
+ const [adding, setAdding] = React4.useState(false);
1289
+ const [addError, setAddError] = React4.useState("");
1290
+ const [newMarketplace, setNewMarketplace] = React4.useState({ name: "", github_repo: "" });
1291
+ const [deleteTarget, setDeleteTarget] = React4.useState(null);
1292
+ const [deleting, setDeleting] = React4.useState(false);
1293
+ const [deleteError, setDeleteError] = React4.useState("");
1039
1294
  function resetAddForm() {
1040
1295
  setNewMarketplace({ name: "", github_repo: "" });
1041
1296
  setAddError("");
@@ -1197,8 +1452,8 @@ function PluginMarketplaceDetailPage({ marketplaceId, initialData, initialPlugin
1197
1452
  (c) => c.pluginMarketplaces.listPlugins(marketplaceId),
1198
1453
  initialPlugins ? { fallbackData: initialPlugins } : void 0
1199
1454
  );
1200
- const [tokenInput, setTokenInput] = React.useState("");
1201
- const [savingToken, setSavingToken] = React.useState(false);
1455
+ const [tokenInput, setTokenInput] = React4.useState("");
1456
+ const [savingToken, setSavingToken] = React4.useState(false);
1202
1457
  async function handleSaveToken() {
1203
1458
  setSavingToken(true);
1204
1459
  try {
@@ -1395,15 +1650,15 @@ function PluginDetailPage({ marketplaceId, pluginName }) {
1395
1650
  `marketplace-${marketplaceId}-plugin-${pluginName}`,
1396
1651
  (c) => c.pluginMarketplaces.getPlugin(marketplaceId, pluginName)
1397
1652
  );
1398
- const [editorState, setEditorState] = React.useState(null);
1399
- const [pluginFiles, setPluginFiles] = React.useState(null);
1400
- const [filesLoading, setFilesLoading] = React.useState(false);
1401
- const [filesError, setFilesError] = React.useState("");
1402
- const [editedContent, setEditedContent] = React.useState(/* @__PURE__ */ new Map());
1403
- const [saving, setSaving] = React.useState(false);
1404
- const [saveError, setSaveError] = React.useState("");
1405
- const [saveSuccess, setSaveSuccess] = React.useState("");
1406
- const fetchFiles = React.useCallback(async () => {
1653
+ const [editorState, setEditorState] = React4.useState(null);
1654
+ const [pluginFiles, setPluginFiles] = React4.useState(null);
1655
+ const [filesLoading, setFilesLoading] = React4.useState(false);
1656
+ const [filesError, setFilesError] = React4.useState("");
1657
+ const [editedContent, setEditedContent] = React4.useState(/* @__PURE__ */ new Map());
1658
+ const [saving, setSaving] = React4.useState(false);
1659
+ const [saveError, setSaveError] = React4.useState("");
1660
+ const [saveSuccess, setSaveSuccess] = React4.useState("");
1661
+ const fetchFiles = React4.useCallback(async () => {
1407
1662
  if (pluginFiles) return pluginFiles;
1408
1663
  setFilesLoading(true);
1409
1664
  setFilesError("");
@@ -1418,7 +1673,7 @@ function PluginDetailPage({ marketplaceId, pluginName }) {
1418
1673
  setFilesLoading(false);
1419
1674
  }
1420
1675
  }, [client, marketplaceId, pluginName, pluginFiles]);
1421
- const handleSelectAgent = React.useCallback(async (filename) => {
1676
+ const handleSelectAgent = React4.useCallback(async (filename) => {
1422
1677
  if (editorState?.type === "agent" && editorState.identifier === filename) {
1423
1678
  setEditorState(null);
1424
1679
  return;
@@ -1430,7 +1685,7 @@ function PluginDetailPage({ marketplaceId, pluginName }) {
1430
1685
  setEditorState({ type: "agent", identifier: filename });
1431
1686
  }
1432
1687
  }, [editorState, fetchFiles]);
1433
- const handleSelectSkill = React.useCallback(async (skill) => {
1688
+ const handleSelectSkill = React4.useCallback(async (skill) => {
1434
1689
  if (editorState?.type === "skill" && editorState.identifier === skill) {
1435
1690
  setEditorState(null);
1436
1691
  return;
@@ -1442,7 +1697,7 @@ function PluginDetailPage({ marketplaceId, pluginName }) {
1442
1697
  setEditorState({ type: "skill", identifier: skill });
1443
1698
  }
1444
1699
  }, [editorState, fetchFiles]);
1445
- const handleSelectConnector = React.useCallback(async () => {
1700
+ const handleSelectConnector = React4.useCallback(async () => {
1446
1701
  if (editorState?.type === "connector") {
1447
1702
  setEditorState(null);
1448
1703
  return;
@@ -1683,12 +1938,12 @@ function SettingsPage({ initialData, hideDangerZone }) {
1683
1938
  }
1684
1939
  function CompanyForm({ tenant, onSaved }) {
1685
1940
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
1686
- const fileInputRef = React.useRef(null);
1687
- const [name, setName] = React.useState(tenant.name);
1688
- const [budget, setBudget] = React.useState(tenant.monthly_budget_usd.toString());
1689
- const [timezone, setTimezone] = React.useState(tenant.timezone);
1690
- const [logoUrl, setLogoUrl] = React.useState(tenant.logo_url ?? "");
1691
- const [saving, setSaving] = React.useState(false);
1941
+ const fileInputRef = React4.useRef(null);
1942
+ const [name, setName] = React4.useState(tenant.name);
1943
+ const [budget, setBudget] = React4.useState(tenant.monthly_budget_usd.toString());
1944
+ const [timezone, setTimezone] = React4.useState(tenant.timezone);
1945
+ const [logoUrl, setLogoUrl] = React4.useState(tenant.logo_url ?? "");
1946
+ const [saving, setSaving] = React4.useState(false);
1692
1947
  const isDirty = name !== tenant.name || budget !== tenant.monthly_budget_usd.toString() || timezone !== tenant.timezone || (logoUrl || "") !== (tenant.logo_url ?? "");
1693
1948
  async function handleSave() {
1694
1949
  setSaving(true);
@@ -1762,13 +2017,13 @@ function CompanyForm({ tenant, onSaved }) {
1762
2017
  }
1763
2018
  function ApiKeysSection({ initialKeys, onChanged }) {
1764
2019
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
1765
- const [creating, setCreating] = React.useState(false);
1766
- const [newKeyName, setNewKeyName] = React.useState("default");
1767
- const [showCreate, setShowCreate] = React.useState(false);
1768
- const [rawKey, setRawKey] = React.useState(null);
1769
- const [revokeTarget, setRevokeTarget] = React.useState(null);
1770
- const [revoking, setRevoking] = React.useState(false);
1771
- const [revokeError, setRevokeError] = React.useState("");
2020
+ const [creating, setCreating] = React4.useState(false);
2021
+ const [newKeyName, setNewKeyName] = React4.useState("default");
2022
+ const [showCreate, setShowCreate] = React4.useState(false);
2023
+ const [rawKey, setRawKey] = React4.useState(null);
2024
+ const [revokeTarget, setRevokeTarget] = React4.useState(null);
2025
+ const [revoking, setRevoking] = React4.useState(false);
2026
+ const [revokeError, setRevokeError] = React4.useState("");
1772
2027
  async function handleCreate() {
1773
2028
  setCreating(true);
1774
2029
  try {
@@ -1889,9 +2144,9 @@ function ApiKeysSection({ initialKeys, onChanged }) {
1889
2144
  function DangerZone({ tenantId, tenantName }) {
1890
2145
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
1891
2146
  const { onNavigate, basePath } = chunkXXF4U7WL_cjs.useNavigation();
1892
- const [open, setOpen] = React.useState(false);
1893
- const [deleting, setDeleting] = React.useState(false);
1894
- const [error, setError] = React.useState("");
2147
+ const [open, setOpen] = React4.useState(false);
2148
+ const [deleting, setDeleting] = React4.useState(false);
2149
+ const [error, setError] = React4.useState("");
1895
2150
  async function handleDelete() {
1896
2151
  setDeleting(true);
1897
2152
  setError("");
@@ -1972,14 +2227,14 @@ var TAG_TITLES = {
1972
2227
  };
1973
2228
  function ModelSelector({ value, onChange, disabled }) {
1974
2229
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
1975
- const [open, setOpen] = React.useState(false);
1976
- const [models, setModels] = React.useState(null);
1977
- const [loading, setLoading] = React.useState(false);
1978
- const [error, setError] = React.useState(false);
1979
- const [search, setSearch] = React.useState("");
1980
- const [providerFilter, setProviderFilter] = React.useState("all");
1981
- const hasFetchedRef = React.useRef(false);
1982
- React.useEffect(() => {
2230
+ const [open, setOpen] = React4.useState(false);
2231
+ const [models, setModels] = React4.useState(null);
2232
+ const [loading, setLoading] = React4.useState(false);
2233
+ const [error, setError] = React4.useState(false);
2234
+ const [search, setSearch] = React4.useState("");
2235
+ const [providerFilter, setProviderFilter] = React4.useState("all");
2236
+ const hasFetchedRef = React4.useRef(false);
2237
+ React4.useEffect(() => {
1983
2238
  if (!open || hasFetchedRef.current) return;
1984
2239
  hasFetchedRef.current = true;
1985
2240
  let cancelled = false;
@@ -2000,12 +2255,12 @@ function ModelSelector({ value, onChange, disabled }) {
2000
2255
  cancelled = true;
2001
2256
  };
2002
2257
  }, [open, client]);
2003
- const providers = React.useMemo(() => {
2258
+ const providers = React4.useMemo(() => {
2004
2259
  if (!models) return [];
2005
2260
  const set = new Set(models.map((m) => m.provider));
2006
2261
  return Array.from(set).sort();
2007
2262
  }, [models]);
2008
- const grouped = React.useMemo(() => {
2263
+ const grouped = React4.useMemo(() => {
2009
2264
  if (!models) return {};
2010
2265
  let filtered = models;
2011
2266
  if (providerFilter !== "all") {
@@ -2021,7 +2276,7 @@ function ModelSelector({ value, onChange, disabled }) {
2021
2276
  }, [models, providerFilter]);
2022
2277
  const selectedModel = models?.find((m) => m.id === value);
2023
2278
  const displayName = selectedModel?.name || value || "Select model...";
2024
- const searchMatchesAny = React.useMemo(() => {
2279
+ const searchMatchesAny = React4.useMemo(() => {
2025
2280
  if (!search || !models) return true;
2026
2281
  const lower = search.toLowerCase();
2027
2282
  return models.some(
@@ -2176,10 +2431,10 @@ function ModelSelector({ value, onChange, disabled }) {
2176
2431
  }
2177
2432
  function AddAgentDialog({ onCreated }) {
2178
2433
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
2179
- const [open, setOpen] = React.useState(false);
2180
- const [saving, setSaving] = React.useState(false);
2181
- const [error, setError] = React.useState("");
2182
- const [form, setForm] = React.useState({
2434
+ const [open, setOpen] = React4.useState(false);
2435
+ const [saving, setSaving] = React4.useState(false);
2436
+ const [error, setError] = React4.useState("");
2437
+ const [form, setForm] = React4.useState({
2183
2438
  name: "",
2184
2439
  description: "",
2185
2440
  model: "claude-sonnet-4-6",
@@ -2348,9 +2603,9 @@ function AddAgentDialog({ onCreated }) {
2348
2603
  }
2349
2604
  function DeleteAgentButton({ agentId, agentName, onDeleted }) {
2350
2605
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
2351
- const [open, setOpen] = React.useState(false);
2352
- const [deleting, setDeleting] = React.useState(false);
2353
- const [error, setError] = React.useState("");
2606
+ const [open, setOpen] = React4.useState(false);
2607
+ const [deleting, setDeleting] = React4.useState(false);
2608
+ const [error, setError] = React4.useState("");
2354
2609
  async function handleDelete() {
2355
2610
  setDeleting(true);
2356
2611
  setError("");
@@ -2403,7 +2658,7 @@ function AgentListPage() {
2403
2658
  (client) => client.agents.list()
2404
2659
  );
2405
2660
  const agents = data?.data ?? [];
2406
- const invalidate = React.useCallback(() => {
2661
+ const invalidate = React4.useCallback(() => {
2407
2662
  mutate("agents");
2408
2663
  }, [mutate]);
2409
2664
  if (isLoading) {
@@ -2450,17 +2705,17 @@ function AgentListPage() {
2450
2705
  }
2451
2706
  function AgentEditForm({ agent, onSaved }) {
2452
2707
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
2453
- const [name, setName] = React.useState(agent.name);
2454
- const [description, setDescription] = React.useState(agent.description ?? "");
2455
- const [model, setModel] = React.useState(agent.model);
2456
- const [runner, setRunner] = React.useState(agent.runner ?? "");
2457
- const [permissionMode, setPermissionMode] = React.useState(agent.permission_mode);
2458
- const [maxTurns, setMaxTurns] = React.useState(agent.max_turns.toString());
2459
- const [maxBudget, setMaxBudget] = React.useState(agent.max_budget_usd.toString());
2460
- const [maxRuntime, setMaxRuntime] = React.useState(Math.floor(agent.max_runtime_seconds / 60).toString());
2461
- const [saving, setSaving] = React.useState(false);
2708
+ const [name, setName] = React4.useState(agent.name);
2709
+ const [description, setDescription] = React4.useState(agent.description ?? "");
2710
+ const [model, setModel] = React4.useState(agent.model);
2711
+ const [runner, setRunner] = React4.useState(agent.runner ?? "");
2712
+ const [permissionMode, setPermissionMode] = React4.useState(agent.permission_mode);
2713
+ const [maxTurns, setMaxTurns] = React4.useState(agent.max_turns.toString());
2714
+ const [maxBudget, setMaxBudget] = React4.useState(agent.max_budget_usd.toString());
2715
+ const [maxRuntime, setMaxRuntime] = React4.useState(Math.floor(agent.max_runtime_seconds / 60).toString());
2716
+ const [saving, setSaving] = React4.useState(false);
2462
2717
  const isDirty = name !== agent.name || description !== (agent.description ?? "") || model !== agent.model || runner !== (agent.runner ?? "") || permissionMode !== agent.permission_mode || maxTurns !== agent.max_turns.toString() || maxBudget !== agent.max_budget_usd.toString() || maxRuntime !== Math.floor(agent.max_runtime_seconds / 60).toString();
2463
- const [error, setError] = React.useState("");
2718
+ const [error, setError] = React4.useState("");
2464
2719
  async function handleSave() {
2465
2720
  setSaving(true);
2466
2721
  setError("");
@@ -2540,17 +2795,17 @@ function AgentEditForm({ agent, onSaved }) {
2540
2795
  }
2541
2796
  function ToolkitMultiselect({ value, onChange }) {
2542
2797
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
2543
- const [open, setOpen] = React.useState(false);
2544
- const [search, setSearch] = React.useState("");
2545
- const [toolkits, setToolkits] = React.useState([]);
2546
- const [loading, setLoading] = React.useState(true);
2547
- const containerRef = React.useRef(null);
2548
- const searchRef = React.useRef(null);
2549
- React.useEffect(() => {
2798
+ const [open, setOpen] = React4.useState(false);
2799
+ const [search, setSearch] = React4.useState("");
2800
+ const [toolkits, setToolkits] = React4.useState([]);
2801
+ const [loading, setLoading] = React4.useState(true);
2802
+ const containerRef = React4.useRef(null);
2803
+ const searchRef = React4.useRef(null);
2804
+ React4.useEffect(() => {
2550
2805
  client.composio.toolkits().then((data) => setToolkits(data)).catch(() => {
2551
2806
  }).finally(() => setLoading(false));
2552
2807
  }, [client]);
2553
- React.useEffect(() => {
2808
+ React4.useEffect(() => {
2554
2809
  function handleClick(e) {
2555
2810
  if (containerRef.current && !containerRef.current.contains(e.target)) {
2556
2811
  setOpen(false);
@@ -2560,7 +2815,7 @@ function ToolkitMultiselect({ value, onChange }) {
2560
2815
  document.addEventListener("mousedown", handleClick);
2561
2816
  return () => document.removeEventListener("mousedown", handleClick);
2562
2817
  }, []);
2563
- React.useEffect(() => {
2818
+ React4.useEffect(() => {
2564
2819
  searchRef.current?.focus();
2565
2820
  }, []);
2566
2821
  const filtered = toolkits.filter((t) => {
@@ -2666,12 +2921,12 @@ function ToolsModal({
2666
2921
  onSave
2667
2922
  }) {
2668
2923
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
2669
- const [tools, setTools] = React.useState([]);
2670
- const [loading, setLoading] = React.useState(false);
2671
- const [search, setSearch] = React.useState("");
2672
- const [selected, setSelected] = React.useState(/* @__PURE__ */ new Set());
2673
- const [saving, setSaving] = React.useState(false);
2674
- const fetchTools = React.useCallback(async () => {
2924
+ const [tools, setTools] = React4.useState([]);
2925
+ const [loading, setLoading] = React4.useState(false);
2926
+ const [search, setSearch] = React4.useState("");
2927
+ const [selected, setSelected] = React4.useState(/* @__PURE__ */ new Set());
2928
+ const [saving, setSaving] = React4.useState(false);
2929
+ const fetchTools = React4.useCallback(async () => {
2675
2930
  setLoading(true);
2676
2931
  try {
2677
2932
  const data = await client.composio.tools(toolkit);
@@ -2680,7 +2935,7 @@ function ToolsModal({
2680
2935
  setLoading(false);
2681
2936
  }
2682
2937
  }, [toolkit, client]);
2683
- React.useEffect(() => {
2938
+ React4.useEffect(() => {
2684
2939
  if (open) {
2685
2940
  fetchTools();
2686
2941
  setSearch("");
@@ -2771,13 +3026,13 @@ function McpToolsModal({
2771
3026
  onSave
2772
3027
  }) {
2773
3028
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
2774
- const [tools, setTools] = React.useState([]);
2775
- const [loading, setLoading] = React.useState(false);
2776
- const [search, setSearch] = React.useState("");
2777
- const [selected, setSelected] = React.useState(/* @__PURE__ */ new Set());
2778
- const [saving, setSaving] = React.useState(false);
2779
- const [error, setError] = React.useState("");
2780
- const fetchTools = React.useCallback(async () => {
3029
+ const [tools, setTools] = React4.useState([]);
3030
+ const [loading, setLoading] = React4.useState(false);
3031
+ const [search, setSearch] = React4.useState("");
3032
+ const [selected, setSelected] = React4.useState(/* @__PURE__ */ new Set());
3033
+ const [saving, setSaving] = React4.useState(false);
3034
+ const [error, setError] = React4.useState("");
3035
+ const fetchTools = React4.useCallback(async () => {
2781
3036
  setLoading(true);
2782
3037
  setError("");
2783
3038
  try {
@@ -2789,7 +3044,7 @@ function McpToolsModal({
2789
3044
  setLoading(false);
2790
3045
  }
2791
3046
  }, [agentId, mcpServerId, client]);
2792
- React.useEffect(() => {
3047
+ React4.useEffect(() => {
2793
3048
  if (open) {
2794
3049
  fetchTools();
2795
3050
  setSearch("");
@@ -2869,30 +3124,30 @@ function McpToolsModal({
2869
3124
  }
2870
3125
  function AgentConnectorsManager({ agentId, toolkits: initialToolkits, composioAllowedTools: initialAllowedTools, onChanged }) {
2871
3126
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
2872
- const [localToolkits, setLocalToolkits] = React.useState(initialToolkits);
2873
- const [connectors, setConnectors] = React.useState([]);
2874
- const [loading, setLoading] = React.useState(true);
2875
- const [showAdd, setShowAdd] = React.useState(false);
2876
- const [pendingToolkits, setPendingToolkits] = React.useState(initialToolkits);
2877
- const [applyingToolkits, setApplyingToolkits] = React.useState(false);
2878
- const [confirmDelete, setConfirmDelete] = React.useState(null);
2879
- const [deleting, setDeleting] = React.useState(false);
2880
- const [apiKeys, setApiKeys] = React.useState({});
2881
- const [saving, setSaving] = React.useState({});
2882
- const [errors, setErrors] = React.useState({});
2883
- const [allowedTools, setAllowedTools] = React.useState(initialAllowedTools);
2884
- const [toolCounts, setToolCounts] = React.useState({});
2885
- const [toolsModalToolkit, setToolsModalToolkit] = React.useState(null);
2886
- const mcpOauthHandlerRef = React.useRef(null);
2887
- const composioOauthHandlerRef = React.useRef(null);
2888
- const [mcpConnections, setMcpConnections] = React.useState([]);
2889
- const [mcpServers, setMcpServers] = React.useState([]);
2890
- const [mcpLoading, setMcpLoading] = React.useState(true);
2891
- const [mcpConnecting, setMcpConnecting] = React.useState(null);
2892
- const [confirmMcpDisconnect, setConfirmMcpDisconnect] = React.useState(null);
2893
- const [mcpDisconnecting, setMcpDisconnecting] = React.useState(false);
2894
- const [mcpToolsModal, setMcpToolsModal] = React.useState(null);
2895
- const loadComposio = React.useCallback(async () => {
3127
+ const [localToolkits, setLocalToolkits] = React4.useState(initialToolkits);
3128
+ const [connectors, setConnectors] = React4.useState([]);
3129
+ const [loading, setLoading] = React4.useState(true);
3130
+ const [showAdd, setShowAdd] = React4.useState(false);
3131
+ const [pendingToolkits, setPendingToolkits] = React4.useState(initialToolkits);
3132
+ const [applyingToolkits, setApplyingToolkits] = React4.useState(false);
3133
+ const [confirmDelete, setConfirmDelete] = React4.useState(null);
3134
+ const [deleting, setDeleting] = React4.useState(false);
3135
+ const [apiKeys, setApiKeys] = React4.useState({});
3136
+ const [saving, setSaving] = React4.useState({});
3137
+ const [errors, setErrors] = React4.useState({});
3138
+ const [allowedTools, setAllowedTools] = React4.useState(initialAllowedTools);
3139
+ const [toolCounts, setToolCounts] = React4.useState({});
3140
+ const [toolsModalToolkit, setToolsModalToolkit] = React4.useState(null);
3141
+ const mcpOauthHandlerRef = React4.useRef(null);
3142
+ const composioOauthHandlerRef = React4.useRef(null);
3143
+ const [mcpConnections, setMcpConnections] = React4.useState([]);
3144
+ const [mcpServers, setMcpServers] = React4.useState([]);
3145
+ const [mcpLoading, setMcpLoading] = React4.useState(true);
3146
+ const [mcpConnecting, setMcpConnecting] = React4.useState(null);
3147
+ const [confirmMcpDisconnect, setConfirmMcpDisconnect] = React4.useState(null);
3148
+ const [mcpDisconnecting, setMcpDisconnecting] = React4.useState(false);
3149
+ const [mcpToolsModal, setMcpToolsModal] = React4.useState(null);
3150
+ const loadComposio = React4.useCallback(async () => {
2896
3151
  setLoading(true);
2897
3152
  try {
2898
3153
  const data = await client.connectors.list(agentId);
@@ -2901,7 +3156,7 @@ function AgentConnectorsManager({ agentId, toolkits: initialToolkits, composioAl
2901
3156
  setLoading(false);
2902
3157
  }
2903
3158
  }, [agentId, client]);
2904
- const loadMcp = React.useCallback(async () => {
3159
+ const loadMcp = React4.useCallback(async () => {
2905
3160
  setMcpLoading(true);
2906
3161
  try {
2907
3162
  const data = await client.customConnectors.list(agentId);
@@ -2911,13 +3166,13 @@ function AgentConnectorsManager({ agentId, toolkits: initialToolkits, composioAl
2911
3166
  }
2912
3167
  }, [agentId, client]);
2913
3168
  const toolkitsKey = localToolkits.join(",");
2914
- React.useEffect(() => {
3169
+ React4.useEffect(() => {
2915
3170
  loadComposio();
2916
3171
  }, [loadComposio, toolkitsKey]);
2917
- React.useEffect(() => {
3172
+ React4.useEffect(() => {
2918
3173
  loadMcp();
2919
3174
  }, [loadMcp]);
2920
- React.useEffect(() => {
3175
+ React4.useEffect(() => {
2921
3176
  return () => {
2922
3177
  if (mcpOauthHandlerRef.current) {
2923
3178
  window.removeEventListener("message", mcpOauthHandlerRef.current);
@@ -2929,7 +3184,7 @@ function AgentConnectorsManager({ agentId, toolkits: initialToolkits, composioAl
2929
3184
  }
2930
3185
  };
2931
3186
  }, []);
2932
- React.useEffect(() => {
3187
+ React4.useEffect(() => {
2933
3188
  if (localToolkits.length === 0) return;
2934
3189
  let cancelled = false;
2935
3190
  for (const slug of localToolkits) {
@@ -3292,7 +3547,7 @@ function AgentConnectorsManager({ agentId, toolkits: initialToolkits, composioAl
3292
3547
  )
3293
3548
  ] });
3294
3549
  }
3295
- var CodeEditor = React.lazy(() => import('./code-editor-ZYP54YUT.cjs'));
3550
+ var CodeEditor = React4.lazy(() => import('./code-editor-ZYP54YUT.cjs'));
3296
3551
  function buildTree(files) {
3297
3552
  const rootFiles = [];
3298
3553
  const dirMap = /* @__PURE__ */ new Map();
@@ -3365,49 +3620,49 @@ function FileTreeEditor2({
3365
3620
  fixedStructure = false,
3366
3621
  headerActions
3367
3622
  }) {
3368
- const [files, setFiles] = React.useState(initialFiles);
3369
- const [selectedPath, setSelectedPath] = React.useState(
3623
+ const [files, setFiles] = React4.useState(initialFiles);
3624
+ const [selectedPath, setSelectedPath] = React4.useState(
3370
3625
  initialFiles.length > 0 ? initialFiles[0].path : null
3371
3626
  );
3372
- const [saving, setSaving] = React.useState(false);
3373
- const [expanded, setExpanded] = React.useState(() => {
3627
+ const [saving, setSaving] = React4.useState(false);
3628
+ const [expanded, setExpanded] = React4.useState(() => {
3374
3629
  const { rootDirs } = buildTree(initialFiles);
3375
3630
  return collectAllDirPaths(rootDirs);
3376
3631
  });
3377
- const [showAddFolder, setShowAddFolder] = React.useState(false);
3378
- const [newFolderName, setNewFolderName] = React.useState("");
3379
- const [addingFileInDir, setAddingFileInDir] = React.useState(null);
3380
- const [newFileName, setNewFileName] = React.useState("");
3381
- const [savedSnapshot, setSavedSnapshot] = React.useState(() => JSON.stringify(initialFiles));
3382
- React.useEffect(() => {
3632
+ const [showAddFolder, setShowAddFolder] = React4.useState(false);
3633
+ const [newFolderName, setNewFolderName] = React4.useState("");
3634
+ const [addingFileInDir, setAddingFileInDir] = React4.useState(null);
3635
+ const [newFileName, setNewFileName] = React4.useState("");
3636
+ const [savedSnapshot, setSavedSnapshot] = React4.useState(() => JSON.stringify(initialFiles));
3637
+ React4.useEffect(() => {
3383
3638
  const snap = JSON.stringify(initialFiles);
3384
3639
  setSavedSnapshot(snap);
3385
3640
  setFiles(initialFiles);
3386
3641
  const { rootDirs } = buildTree(initialFiles);
3387
3642
  setExpanded(collectAllDirPaths(rootDirs));
3388
3643
  }, [initialFiles]);
3389
- React.useEffect(() => {
3644
+ React4.useEffect(() => {
3390
3645
  if (savedVersion !== void 0 && savedVersion > 0) {
3391
3646
  setSavedSnapshot(JSON.stringify(files));
3392
3647
  }
3393
3648
  }, [savedVersion]);
3394
- const onChangeRef = React.useRef(onChange);
3649
+ const onChangeRef = React4.useRef(onChange);
3395
3650
  onChangeRef.current = onChange;
3396
- React.useEffect(() => {
3651
+ React4.useEffect(() => {
3397
3652
  if (onChangeRef.current && JSON.stringify(files) !== savedSnapshot) {
3398
3653
  onChangeRef.current(files);
3399
3654
  }
3400
3655
  }, [files, savedSnapshot]);
3401
- const isDirty = React.useMemo(
3656
+ const isDirty = React4.useMemo(
3402
3657
  () => JSON.stringify(files) !== savedSnapshot,
3403
3658
  [files, savedSnapshot]
3404
3659
  );
3405
- const tree = React.useMemo(() => buildTree(files), [files]);
3406
- const activeFile = React.useMemo(
3660
+ const tree = React4.useMemo(() => buildTree(files), [files]);
3661
+ const activeFile = React4.useMemo(
3407
3662
  () => selectedPath ? files.find((f) => f.path === selectedPath) ?? null : null,
3408
3663
  [files, selectedPath]
3409
3664
  );
3410
- const handleEditorChange = React.useCallback((value) => {
3665
+ const handleEditorChange = React4.useCallback((value) => {
3411
3666
  if (readOnly || !selectedPath) return;
3412
3667
  setFiles((prev) => prev.map((f) => f.path === selectedPath ? { ...f, content: value } : f));
3413
3668
  }, [readOnly, selectedPath]);
@@ -3619,7 +3874,7 @@ function FileTreeEditor2({
3619
3874
  ] }),
3620
3875
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 border border-border rounded-md overflow-hidden", children: activeFile ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "h-full flex flex-col", children: [
3621
3876
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-3 py-1.5 bg-muted/50 border-b border-border text-xs text-muted-foreground", children: activeFile.path }),
3622
- /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 animate-pulse bg-muted/50" }), children: /* @__PURE__ */ jsxRuntime.jsx(
3877
+ /* @__PURE__ */ jsxRuntime.jsx(React4.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 animate-pulse bg-muted/50" }), children: /* @__PURE__ */ jsxRuntime.jsx(
3623
3878
  CodeEditor,
3624
3879
  {
3625
3880
  value: activeFile.content,
@@ -3649,19 +3904,19 @@ function TabButton({ label, active, onClick }) {
3649
3904
  }
3650
3905
  function ImportSkillDialog({ open, onOpenChange, onImported, existingFolders }) {
3651
3906
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
3652
- const [tab, setTab] = React.useState("all");
3653
- const [entries, setEntries] = React.useState([]);
3654
- const [loading, setLoading] = React.useState(false);
3655
- const [error, setError] = React.useState("");
3656
- const [search, setSearch] = React.useState("");
3657
- const [selected, setSelected] = React.useState(null);
3658
- const [preview, setPreview] = React.useState("");
3659
- const [previewLoading, setPreviewLoading] = React.useState(false);
3660
- const [importing, setImporting] = React.useState(false);
3661
- const [importError, setImportError] = React.useState("");
3662
- const [url, setUrl] = React.useState("");
3663
- const [urlImporting, setUrlImporting] = React.useState(false);
3664
- React.useEffect(() => {
3907
+ const [tab, setTab] = React4.useState("all");
3908
+ const [entries, setEntries] = React4.useState([]);
3909
+ const [loading, setLoading] = React4.useState(false);
3910
+ const [error, setError] = React4.useState("");
3911
+ const [search, setSearch] = React4.useState("");
3912
+ const [selected, setSelected] = React4.useState(null);
3913
+ const [preview, setPreview] = React4.useState("");
3914
+ const [previewLoading, setPreviewLoading] = React4.useState(false);
3915
+ const [importing, setImporting] = React4.useState(false);
3916
+ const [importError, setImportError] = React4.useState("");
3917
+ const [url, setUrl] = React4.useState("");
3918
+ const [urlImporting, setUrlImporting] = React4.useState(false);
3919
+ React4.useEffect(() => {
3665
3920
  if (!open) return;
3666
3921
  setLoading(true);
3667
3922
  setError("");
@@ -3669,7 +3924,7 @@ function ImportSkillDialog({ open, onOpenChange, onImported, existingFolders })
3669
3924
  setPreview("");
3670
3925
  client.skillsDirectory.list(tab).then((data) => setEntries(data)).catch((err) => setError(err instanceof Error ? err.message : "Failed to load skills")).finally(() => setLoading(false));
3671
3926
  }, [tab, open, client]);
3672
- const filtered = React.useMemo(() => {
3927
+ const filtered = React4.useMemo(() => {
3673
3928
  if (!search.trim()) return entries;
3674
3929
  const q = search.toLowerCase();
3675
3930
  return entries.filter(
@@ -3805,10 +4060,10 @@ function ImportSkillDialog({ open, onOpenChange, onImported, existingFolders })
3805
4060
  }
3806
4061
  function AgentSkillManager({ agentId, initialSkills, onSaved }) {
3807
4062
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
3808
- const [importOpen, setImportOpen] = React.useState(false);
3809
- const [extraSkills, setExtraSkills] = React.useState([]);
3810
- const allSkills = React.useMemo(() => [...initialSkills, ...extraSkills], [initialSkills, extraSkills]);
3811
- const initialFiles = React.useMemo(
4063
+ const [importOpen, setImportOpen] = React4.useState(false);
4064
+ const [extraSkills, setExtraSkills] = React4.useState([]);
4065
+ const allSkills = React4.useMemo(() => [...initialSkills, ...extraSkills], [initialSkills, extraSkills]);
4066
+ const initialFiles = React4.useMemo(
3812
4067
  () => allSkills.flatMap(
3813
4068
  (s) => s.files.map((f) => ({
3814
4069
  path: s.folder === "(root)" ? f.path : `${s.folder}/${f.path}`,
@@ -3817,11 +4072,11 @@ function AgentSkillManager({ agentId, initialSkills, onSaved }) {
3817
4072
  ),
3818
4073
  [allSkills]
3819
4074
  );
3820
- const existingFolders = React.useMemo(() => allSkills.map((s) => s.folder), [allSkills]);
3821
- const handleImported = React.useCallback((skill) => {
4075
+ const existingFolders = React4.useMemo(() => allSkills.map((s) => s.folder), [allSkills]);
4076
+ const handleImported = React4.useCallback((skill) => {
3822
4077
  setExtraSkills((prev) => [...prev, skill]);
3823
4078
  }, []);
3824
- const handleSave = React.useCallback(async (files) => {
4079
+ const handleSave = React4.useCallback(async (files) => {
3825
4080
  const folderMap = /* @__PURE__ */ new Map();
3826
4081
  for (const file of files) {
3827
4082
  const slashIdx = file.path.lastIndexOf("/");
@@ -3871,24 +4126,24 @@ function AgentSkillManager({ agentId, initialSkills, onSaved }) {
3871
4126
  }
3872
4127
  function AgentPluginManager({ agentId, initialPlugins, onSaved }) {
3873
4128
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
3874
- const [plugins, setPlugins] = React.useState(initialPlugins);
3875
- const [saving, setSaving] = React.useState(false);
3876
- const [dialogOpen, setDialogOpen] = React.useState(false);
3877
- const [marketplaces, setMarketplaces] = React.useState([]);
3878
- const [selectedMarketplace, setSelectedMarketplace] = React.useState(null);
3879
- const [availablePlugins, setAvailablePlugins] = React.useState([]);
3880
- const [loadingPlugins, setLoadingPlugins] = React.useState(false);
3881
- const [marketplaceNames, setMarketplaceNames] = React.useState({});
3882
- const savedSnapshot = React.useRef(JSON.stringify(initialPlugins));
3883
- React.useEffect(() => {
4129
+ const [plugins, setPlugins] = React4.useState(initialPlugins);
4130
+ const [saving, setSaving] = React4.useState(false);
4131
+ const [dialogOpen, setDialogOpen] = React4.useState(false);
4132
+ const [marketplaces, setMarketplaces] = React4.useState([]);
4133
+ const [selectedMarketplace, setSelectedMarketplace] = React4.useState(null);
4134
+ const [availablePlugins, setAvailablePlugins] = React4.useState([]);
4135
+ const [loadingPlugins, setLoadingPlugins] = React4.useState(false);
4136
+ const [marketplaceNames, setMarketplaceNames] = React4.useState({});
4137
+ const savedSnapshot = React4.useRef(JSON.stringify(initialPlugins));
4138
+ React4.useEffect(() => {
3884
4139
  savedSnapshot.current = JSON.stringify(initialPlugins);
3885
4140
  setPlugins(initialPlugins);
3886
4141
  }, [initialPlugins]);
3887
- const isDirty = React.useMemo(
4142
+ const isDirty = React4.useMemo(
3888
4143
  () => JSON.stringify(plugins) !== savedSnapshot.current,
3889
4144
  [plugins]
3890
4145
  );
3891
- React.useEffect(() => {
4146
+ React4.useEffect(() => {
3892
4147
  client.pluginMarketplaces.list().then((data) => {
3893
4148
  setMarketplaces(data);
3894
4149
  const names = {};
@@ -3897,7 +4152,7 @@ function AgentPluginManager({ agentId, initialPlugins, onSaved }) {
3897
4152
  }).catch(() => {
3898
4153
  });
3899
4154
  }, [client]);
3900
- const loadPluginsForMarketplace = React.useCallback(async (marketplaceId) => {
4155
+ const loadPluginsForMarketplace = React4.useCallback(async (marketplaceId) => {
3901
4156
  setSelectedMarketplace(marketplaceId);
3902
4157
  setLoadingPlugins(true);
3903
4158
  setAvailablePlugins([]);
@@ -4085,15 +4340,15 @@ function AgentA2aInfo({
4085
4340
  onChanged
4086
4341
  }) {
4087
4342
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
4088
- const [enabled, setEnabled] = React.useState(initialEnabled);
4089
- const [toggling, setToggling] = React.useState(false);
4090
- const [detailsOpen, setDetailsOpen] = React.useState(false);
4091
- const [cardPreview, setCardPreview] = React.useState(null);
4092
- const [loading, setLoading] = React.useState(false);
4093
- const [tags, setTags] = React.useState(initialTags);
4094
- const [tagInput, setTagInput] = React.useState("");
4095
- const [savingTags, setSavingTags] = React.useState(false);
4096
- const inputRef = React.useRef(null);
4343
+ const [enabled, setEnabled] = React4.useState(initialEnabled);
4344
+ const [toggling, setToggling] = React4.useState(false);
4345
+ const [detailsOpen, setDetailsOpen] = React4.useState(false);
4346
+ const [cardPreview, setCardPreview] = React4.useState(null);
4347
+ const [loading, setLoading] = React4.useState(false);
4348
+ const [tags, setTags] = React4.useState(initialTags);
4349
+ const [tagInput, setTagInput] = React4.useState("");
4350
+ const [savingTags, setSavingTags] = React4.useState(false);
4351
+ const inputRef = React4.useRef(null);
4097
4352
  const endpointUrl = `${baseUrl}/api/a2a/${tenantSlug}/${agentSlug}`;
4098
4353
  const jsonRpcUrl = `${baseUrl}/api/a2a/${tenantSlug}/${agentSlug}/jsonrpc`;
4099
4354
  const agentCardUrl = `${baseUrl}/api/a2a/${tenantSlug}/${agentSlug}/.well-known/agent-card.json`;
@@ -4263,7 +4518,7 @@ function AgentA2aInfo({
4263
4518
  ] })
4264
4519
  ] });
4265
4520
  }
4266
- var AgentIdentityTab = React.lazy(() => import('./agent-identity-tab-YGMVWOWT.cjs').then((m) => ({ default: m.AgentIdentityTab })));
4521
+ var AgentIdentityTab = React4.lazy(() => import('./agent-identity-tab-YGMVWOWT.cjs').then((m) => ({ default: m.AgentIdentityTab })));
4267
4522
  function AgentDetailPage({ agentId, a2aBaseUrl, tenantSlug, adminApiBaseUrl, adminApiKey }) {
4268
4523
  const { LinkComponent, basePath } = chunkXXF4U7WL_cjs.useNavigation();
4269
4524
  const { mutate } = swr.useSWRConfig();
@@ -4272,10 +4527,10 @@ function AgentDetailPage({ agentId, a2aBaseUrl, tenantSlug, adminApiBaseUrl, adm
4272
4527
  cacheKey,
4273
4528
  (client) => client.agents.get(agentId)
4274
4529
  );
4275
- const invalidate = React.useCallback(() => {
4530
+ const invalidate = React4.useCallback(() => {
4276
4531
  mutate(cacheKey);
4277
4532
  }, [mutate, cacheKey]);
4278
- const adminFetch = React.useCallback(async (path, options) => {
4533
+ const adminFetch = React4.useCallback(async (path, options) => {
4279
4534
  if (!adminApiBaseUrl) throw new Error("Admin API not configured");
4280
4535
  const res = await fetch(`${adminApiBaseUrl}${path}`, {
4281
4536
  ...options,
@@ -4291,7 +4546,7 @@ function AgentDetailPage({ agentId, a2aBaseUrl, tenantSlug, adminApiBaseUrl, adm
4291
4546
  }
4292
4547
  return res.json();
4293
4548
  }, [adminApiBaseUrl, adminApiKey]);
4294
- const soulCallbacks = React.useMemo(() => {
4549
+ const soulCallbacks = React4.useMemo(() => {
4295
4550
  if (!adminApiBaseUrl) return {};
4296
4551
  return {
4297
4552
  onGenerateSoul: async () => {
@@ -4378,7 +4633,7 @@ function AgentDetailPage({ agentId, a2aBaseUrl, tenantSlug, adminApiBaseUrl, adm
4378
4633
  },
4379
4634
  {
4380
4635
  label: "Identity",
4381
- content: /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(chunkVZ43ATC5_cjs.Skeleton, { className: "h-64 w-full" }), children: /* @__PURE__ */ jsxRuntime.jsx(AgentIdentityTab, { agent, FileTreeEditor: chunkVZ43ATC5_cjs.FileTreeEditor, onSaved: invalidate, ...soulCallbacks }) })
4636
+ content: /* @__PURE__ */ jsxRuntime.jsx(React4.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(chunkVZ43ATC5_cjs.Skeleton, { className: "h-64 w-full" }), children: /* @__PURE__ */ jsxRuntime.jsx(AgentIdentityTab, { agent, FileTreeEditor: chunkVZ43ATC5_cjs.FileTreeEditor, onSaved: invalidate, ...soulCallbacks }) })
4382
4637
  },
4383
4638
  {
4384
4639
  label: "Connectors",
@@ -4463,12 +4718,12 @@ function ScheduleCard({
4463
4718
  schedule,
4464
4719
  timezone
4465
4720
  }) {
4466
- const [frequency, setFrequency] = React.useState(schedule.frequency);
4467
- const [time, setTime] = React.useState(formatTimeForInput(schedule.time));
4468
- const [dayOfWeek, setDayOfWeek] = React.useState(schedule.day_of_week ?? 1);
4469
- const [prompt, setPrompt] = React.useState(schedule.prompt ?? "");
4470
- const [enabled, setEnabled] = React.useState(schedule.enabled);
4471
- const [name, setName] = React.useState(schedule.name ?? "");
4721
+ const [frequency, setFrequency] = React4.useState(schedule.frequency);
4722
+ const [time, setTime] = React4.useState(formatTimeForInput(schedule.time));
4723
+ const [dayOfWeek, setDayOfWeek] = React4.useState(schedule.day_of_week ?? 1);
4724
+ const [prompt, setPrompt] = React4.useState(schedule.prompt ?? "");
4725
+ const [enabled, setEnabled] = React4.useState(schedule.enabled);
4726
+ const [name, setName] = React4.useState(schedule.name ?? "");
4472
4727
  const showTimePicker = ["daily", "weekdays", "weekly"].includes(frequency);
4473
4728
  const showDayPicker = frequency === "weekly";
4474
4729
  const canEnable = frequency !== "manual";
@@ -4571,7 +4826,7 @@ function MarkdownContent({ children }) {
4571
4826
  ) });
4572
4827
  }
4573
4828
  function CollapsibleJson({ data, maxHeight = "12rem" }) {
4574
- const [expanded, setExpanded] = React.useState(false);
4829
+ const [expanded, setExpanded] = React4.useState(false);
4575
4830
  const json = typeof data === "string" ? data : JSON.stringify(data, null, 2);
4576
4831
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
4577
4832
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -4717,7 +4972,7 @@ function renderEvent(event, idx) {
4717
4972
  /* @__PURE__ */ jsxRuntime.jsx(CollapsibleJson, { data: event, maxHeight: "8rem" })
4718
4973
  ] }, idx);
4719
4974
  }
4720
- var TERMINAL_STATUSES = /* @__PURE__ */ new Set(["completed", "failed", "cancelled", "timed_out"]);
4975
+ var TERMINAL_STATUSES2 = /* @__PURE__ */ new Set(["completed", "failed", "cancelled", "timed_out"]);
4721
4976
  function PlaygroundPage({ agentId }) {
4722
4977
  const client = chunkXXF4U7WL_cjs.useAgentPlaneClient();
4723
4978
  const { LinkComponent, basePath } = chunkXXF4U7WL_cjs.useNavigation();
@@ -4725,30 +4980,30 @@ function PlaygroundPage({ agentId }) {
4725
4980
  `agent-${agentId}`,
4726
4981
  (c) => c.agents.get(agentId)
4727
4982
  );
4728
- const [prompt, setPrompt] = React.useState("");
4729
- const [events, setEvents] = React.useState([]);
4730
- const [streamingText, setStreamingText] = React.useState("");
4731
- const [running, setRunning] = React.useState(false);
4732
- const [polling, setPolling] = React.useState(false);
4733
- const [error, setError] = React.useState(null);
4734
- const [sessionId, setSessionId] = React.useState(null);
4735
- const sessionIdRef = React.useRef(null);
4736
- const abortRef = React.useRef(null);
4737
- const runIdRef = React.useRef(null);
4738
- const streamRef = React.useRef(null);
4739
- const scrollRef = React.useRef(null);
4740
- const textareaRef = React.useRef(null);
4741
- React.useEffect(() => {
4983
+ const [prompt, setPrompt] = React4.useState("");
4984
+ const [events, setEvents] = React4.useState([]);
4985
+ const [streamingText, setStreamingText] = React4.useState("");
4986
+ const [running, setRunning] = React4.useState(false);
4987
+ const [polling, setPolling] = React4.useState(false);
4988
+ const [error, setError] = React4.useState(null);
4989
+ const [sessionId, setSessionId] = React4.useState(null);
4990
+ const sessionIdRef = React4.useRef(null);
4991
+ const abortRef = React4.useRef(null);
4992
+ const runIdRef = React4.useRef(null);
4993
+ const streamRef = React4.useRef(null);
4994
+ const scrollRef = React4.useRef(null);
4995
+ const textareaRef = React4.useRef(null);
4996
+ React4.useEffect(() => {
4742
4997
  const el = scrollRef.current;
4743
4998
  if (el) el.scrollTop = el.scrollHeight;
4744
4999
  }, [events, streamingText]);
4745
- React.useEffect(() => {
5000
+ React4.useEffect(() => {
4746
5001
  return () => {
4747
5002
  abortRef.current?.abort();
4748
5003
  streamRef.current?.abort();
4749
5004
  };
4750
5005
  }, []);
4751
- const pollForFinalResult = React.useCallback(async (runId) => {
5006
+ const pollForFinalResult = React4.useCallback(async (runId) => {
4752
5007
  setPolling(true);
4753
5008
  let delay = 3e3;
4754
5009
  const maxDelay = 1e4;
@@ -4759,7 +5014,7 @@ function PlaygroundPage({ agentId }) {
4759
5014
  if (abortRef.current?.signal.aborted) break;
4760
5015
  try {
4761
5016
  const run = await client.runs.get(runId);
4762
- if (TERMINAL_STATUSES.has(run.status)) {
5017
+ if (TERMINAL_STATUSES2.has(run.status)) {
4763
5018
  try {
4764
5019
  const transcriptEvents = await client.runs.transcriptArray(runId);
4765
5020
  if (transcriptEvents.length > 0) {
@@ -4804,7 +5059,7 @@ function PlaygroundPage({ agentId }) {
4804
5059
  streamRef.current = null;
4805
5060
  }
4806
5061
  }, [client]);
4807
- const consumeStream = React.useCallback(async (stream) => {
5062
+ const consumeStream = React4.useCallback(async (stream) => {
4808
5063
  streamRef.current = stream;
4809
5064
  let handedOffToPoll = false;
4810
5065
  try {
@@ -4842,7 +5097,7 @@ function PlaygroundPage({ agentId }) {
4842
5097
  }
4843
5098
  }
4844
5099
  }, [pollForFinalResult]);
4845
- const handleSend = React.useCallback(async () => {
5100
+ const handleSend = React4.useCallback(async () => {
4846
5101
  if (!prompt.trim() || running) return;
4847
5102
  const messageText = prompt.trim();
4848
5103
  setPrompt("");
@@ -4995,6 +5250,122 @@ function PlaygroundPage({ agentId }) {
4995
5250
  ] })
4996
5251
  ] });
4997
5252
  }
5253
+ var ToastProvider = ToastPrimitives__namespace.Provider;
5254
+ var ToastViewport = React4__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
5255
+ ToastPrimitives__namespace.Viewport,
5256
+ {
5257
+ ref,
5258
+ className: chunkXXF4U7WL_cjs.cn(
5259
+ "fixed top-0 right-0 z-[100] flex max-h-screen w-full flex-col-reverse gap-2 p-4 sm:flex-col sm:max-w-[420px]",
5260
+ className
5261
+ ),
5262
+ ...props
5263
+ }
5264
+ ));
5265
+ ToastViewport.displayName = ToastPrimitives__namespace.Viewport.displayName;
5266
+ var toastVariants = classVarianceAuthority.cva(
5267
+ "group pointer-events-auto relative flex w-full items-center justify-between gap-4 overflow-hidden rounded-lg border p-4 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-right-full",
5268
+ {
5269
+ variants: {
5270
+ variant: {
5271
+ default: "bg-zinc-800 border-zinc-700 text-zinc-100",
5272
+ success: "bg-green-950 border-green-900 text-green-400",
5273
+ destructive: "bg-red-950 border-red-900 text-red-400"
5274
+ }
5275
+ },
5276
+ defaultVariants: {
5277
+ variant: "default"
5278
+ }
5279
+ }
5280
+ );
5281
+ var Toast = React4__namespace.forwardRef(({ className, variant, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
5282
+ ToastPrimitives__namespace.Root,
5283
+ {
5284
+ ref,
5285
+ className: chunkXXF4U7WL_cjs.cn(toastVariants({ variant }), className),
5286
+ ...props
5287
+ }
5288
+ ));
5289
+ Toast.displayName = ToastPrimitives__namespace.Root.displayName;
5290
+ var ToastAction = React4__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
5291
+ ToastPrimitives__namespace.Action,
5292
+ {
5293
+ ref,
5294
+ className: chunkXXF4U7WL_cjs.cn(
5295
+ "inline-flex h-8 shrink-0 items-center justify-center rounded-md border border-zinc-600 bg-transparent px-3 text-sm font-medium transition-colors hover:bg-zinc-700 focus:outline-none focus:ring-1 focus:ring-zinc-500 disabled:pointer-events-none disabled:opacity-50",
5296
+ "group-[.destructive]:border-red-800 group-[.destructive]:hover:border-red-700 group-[.destructive]:hover:bg-red-900 group-[.destructive]:focus:ring-red-800",
5297
+ "group-[.success]:border-green-800 group-[.success]:hover:border-green-700 group-[.success]:hover:bg-green-900 group-[.success]:focus:ring-green-800",
5298
+ className
5299
+ ),
5300
+ ...props
5301
+ }
5302
+ ));
5303
+ ToastAction.displayName = ToastPrimitives__namespace.Action.displayName;
5304
+ var ToastClose = React4__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
5305
+ ToastPrimitives__namespace.Close,
5306
+ {
5307
+ ref,
5308
+ className: chunkXXF4U7WL_cjs.cn(
5309
+ "absolute right-1 top-1 rounded-md p-1 text-zinc-400 opacity-0 transition-opacity hover:text-zinc-100 focus:opacity-100 focus:outline-none group-hover:opacity-100",
5310
+ "group-[.destructive]:text-red-400 group-[.destructive]:hover:text-red-300",
5311
+ "group-[.success]:text-green-400 group-[.success]:hover:text-green-300",
5312
+ className
5313
+ ),
5314
+ "toast-close": "",
5315
+ ...props,
5316
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
5317
+ "svg",
5318
+ {
5319
+ xmlns: "http://www.w3.org/2000/svg",
5320
+ width: "16",
5321
+ height: "16",
5322
+ viewBox: "0 0 24 24",
5323
+ fill: "none",
5324
+ stroke: "currentColor",
5325
+ strokeWidth: "2",
5326
+ strokeLinecap: "round",
5327
+ strokeLinejoin: "round",
5328
+ children: [
5329
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6 6 18" }),
5330
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m6 6 12 12" })
5331
+ ]
5332
+ }
5333
+ )
5334
+ }
5335
+ ));
5336
+ ToastClose.displayName = ToastPrimitives__namespace.Close.displayName;
5337
+ var ToastTitle = React4__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
5338
+ ToastPrimitives__namespace.Title,
5339
+ {
5340
+ ref,
5341
+ className: chunkXXF4U7WL_cjs.cn("text-sm font-semibold [&+div]:text-xs", className),
5342
+ ...props
5343
+ }
5344
+ ));
5345
+ ToastTitle.displayName = ToastPrimitives__namespace.Title.displayName;
5346
+ var ToastDescription = React4__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
5347
+ ToastPrimitives__namespace.Description,
5348
+ {
5349
+ ref,
5350
+ className: chunkXXF4U7WL_cjs.cn("text-sm opacity-90", className),
5351
+ ...props
5352
+ }
5353
+ ));
5354
+ ToastDescription.displayName = ToastPrimitives__namespace.Description.displayName;
5355
+ function Toaster() {
5356
+ const { toasts } = useToast();
5357
+ return /* @__PURE__ */ jsxRuntime.jsxs(ToastProvider, { children: [
5358
+ toasts.map(({ id, title, description, action, ...props }) => /* @__PURE__ */ jsxRuntime.jsxs(Toast, { ...props, children: [
5359
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-1", children: [
5360
+ title && /* @__PURE__ */ jsxRuntime.jsx(ToastTitle, { children: title }),
5361
+ description && /* @__PURE__ */ jsxRuntime.jsx(ToastDescription, { children: description })
5362
+ ] }),
5363
+ action,
5364
+ /* @__PURE__ */ jsxRuntime.jsx(ToastClose, {})
5365
+ ] }, id)),
5366
+ /* @__PURE__ */ jsxRuntime.jsx(ToastViewport, {})
5367
+ ] });
5368
+ }
4998
5369
 
4999
5370
  Object.defineProperty(exports, "Card", {
5000
5371
  enumerable: true,
@@ -5133,6 +5504,18 @@ exports.SettingsPage = SettingsPage;
5133
5504
  exports.Tabs = Tabs;
5134
5505
  exports.Textarea = Textarea;
5135
5506
  exports.Th = Th;
5507
+ exports.Toast = Toast;
5508
+ exports.ToastAction = ToastAction;
5509
+ exports.ToastClose = ToastClose;
5510
+ exports.ToastDescription = ToastDescription;
5511
+ exports.ToastProvider = ToastProvider;
5512
+ exports.ToastTitle = ToastTitle;
5513
+ exports.ToastViewport = ToastViewport;
5514
+ exports.Toaster = Toaster;
5136
5515
  exports.ToolkitMultiselect = ToolkitMultiselect;
5137
5516
  exports.TranscriptViewer = TranscriptViewer;
5138
5517
  exports.parsePaginationParams = parsePaginationParams;
5518
+ exports.toast = toast;
5519
+ exports.toastVariants = toastVariants;
5520
+ exports.useRunStream = useRunStream;
5521
+ exports.useToast = useToast;