@recombine-ai/bosun 0.9.0 → 0.10.0

package/build/server/chunks/{_page.svelte-c2LBV2K4.js → _page.svelte-CY4SZM-i.js}

@@ -1,17 +1,17 @@
-import { B as Button } from './Button-qfXYs6Cv.js';
-import { D as Dropdown } from './Dropdown-DroDbZQ6.js';
-import { b as attr_class, s as stringify, e as ensure_array_like, a as attr, f as clsx, c as attr_style } from './index2-BpEbpEAf.js';
-import { I as Icon } from './Icon-SOvOgynh.js';
-import { X as escape_html } from './context-B0vutJuA.js';
+import { B as Button } from './Button-Dsy3QY7B.js';
+import { D as Dropdown } from './Dropdown-7dp1qEYv.js';
+import { o as attr_class, j as escape_html, n as ensure_array_like, k as attr, az as clsx, m as stringify, l as derived, q as attr_style } from './index-CSpGrMM2.js';
+import { I as Icon } from './Icon-CXFHkSIr.js';
 import { t as trpc } from './trpc-client-Bucti7HD.js';
-import { g as getEditWorkspaceContext, P as Panel } from './edit-workspace-context-BQXwYkgE.js';
-import { C as ChatApiCallTrace, a as ChatConversationalTrace, b as ChatStepTrace } from './ChatStepTrace-Bvxmgz7y.js';
-import { b as chatContent, i as isApiCallTrace, d as isStepTrace, e as isConversationalTrace, l as logContent } from './log-content.svelte-B3ZvaoLs.js';
-import { I as Input } from './Input-D-7S8dEO.js';
+import { g as getEditWorkspaceContext, P as Panel } from './edit-workspace-context-B1nYQ5hD.js';
+import { C as ChatApiCallTrace, a as ChatConversationalTrace, b as ChatStepTrace } from './ChatStepTrace-ZynTuQTL.js';
+import { i as isApiCallTrace, b as isConversationalTrace, d as isStepTrace, e as chatContent, l as logContent, c as clearChatContent, a as clearLogs } from './log-content.svelte-CfQzj-v_.js';
+import { I as Input } from './Input-CHFlfduw.js';
 import '@trpc/client';
-import './index-server-BI-Ep7Rw.js';
-import './utils-KcIDVAAe.js';
-import './state.svelte-DbqYHGBV.js';
+import './index-server-DsYEXu5n.js';
+import './root-CDJwhpIB.js';
+import './events-BQ65tUJo.js';
+import './state.svelte-DT7cgvTK.js';
 
 function History($$renderer, $$props) {
   $$renderer.component(($$renderer2) => {
@@ -87,8 +87,8 @@ function History($$renderer, $$props) {
       if (!Number.isNaN(fromName.getTime())) return formatStateTime(fromName);
       return state.name || "History";
     }
-    let selectedState = agentStates.find((s) => s.id === currentState) ?? null;
-    let triggerTitle = selectedState ? formatStateLabel(selectedState) : "History";
+    let selectedState = derived(() => agentStates.find((s) => s.id === currentState) ?? null);
+    let triggerTitle = derived(() => selectedState() ? formatStateLabel(selectedState()) : "History");
     let $$settled = true;
     let $$inner_renderer;
     function $$render_inner($$renderer3) {
@@ -109,7 +109,7 @@ function History($$renderer, $$props) {
           $$settled = false;
         },
         children: ($$renderer4) => {
-          $$renderer4.push(`<span class="min-w-0 flex-1 truncate text-left">${escape_html(triggerTitle)}</span> `);
+          $$renderer4.push(`<span class="min-w-0 flex-1 truncate text-left">${escape_html(triggerTitle())}</span> `);
           Icon($$renderer4, {
             name: "chevron-down",
             class: "size-7 shrink-0 text-rc-gray-500 transition-transform duration-200 " + (isOpen ? "rotate-180" : "")
@@ -135,10 +135,10 @@ function History($$renderer, $$props) {
               children: ($$renderer5) => {
                 $$renderer5.push(`<div class="flex items-start gap-2"><div class="min-w-0"><div class="truncate p-1 text-sm text-rc-gray-300 group-hover:text-rc-gray-200">${escape_html(formatStateLabel(state))}</div> `);
                 if (state.id === currentState) {
-                  $$renderer5.push("<!--[-->");
+                  $$renderer5.push("<!--[0-->");
                   $$renderer5.push(`<div class="truncate p-1 text-base font-semibold text-rc-green-200">${escape_html(truncateMessage(getUserMessage(state)))}</div>`);
                 } else {
-                  $$renderer5.push("<!--[!-->");
+                  $$renderer5.push("<!--[-1-->");
                   $$renderer5.push(`<div class="truncate p-1 text-base font-semibold text-rc-gray-100">${escape_html(truncateMessage(getUserMessage(state)))}</div>`);
                 }
                 $$renderer5.push(`<!--]--></div></div>`);
@@ -179,7 +179,7 @@ function Dialog($$renderer, $$props) {
     children($$renderer2);
     $$renderer2.push(`<!----> `);
     if (showCloseButton) {
-      $$renderer2.push("<!--[-->");
+      $$renderer2.push("<!--[0-->");
       Button($$renderer2, {
         variant: "ghost",
         onclick: () => dialog.close(),
@@ -190,7 +190,7 @@ function Dialog($$renderer, $$props) {
         $$slots: { default: true }
       });
     } else {
-      $$renderer2.push("<!--[!-->");
+      $$renderer2.push("<!--[-1-->");
     }
     $$renderer2.push(`<!--]--></dialog>`);
   });
@@ -408,8 +408,10 @@ function PlaygroundChat($$renderer, $$props) {
   $$renderer.component(($$renderer2) => {
     let {
       class: className,
+      onmessage,
       context,
       agentId,
+      region,
       agentType,
       analyzeDisabled = false,
       onAnalyzeTrace,
@@ -422,8 +424,10 @@ function PlaygroundChat($$renderer, $$props) {
       variantLoading = false,
       variantApplyingId = null,
       variantError = null,
+      onCancelVariants,
       onRegenerateVariants,
-      onChooseOriginalVariant
+      onChooseOriginalVariant,
+      onChooseVariant
     } = $$props;
     let text = "";
     let imageUrlInputValue = "";
@@ -434,22 +438,22 @@ function PlaygroundChat($$renderer, $$props) {
     let inputFocused = false;
     let autocompleteDismissed = false;
     let selectedSuggestionIndex = null;
-    const suggestions = (() => computeSuggestions(text, userHistory))();
-    const selectedSuggestion = (() => {
+    const suggestions = derived(() => computeSuggestions(text, userHistory));
+    const selectedSuggestion = derived(() => {
       if (selectedSuggestionIndex == null) return null;
-      return suggestions[selectedSuggestionIndex] ?? null;
-    })();
-    const ghostSuffix = (() => {
-      if (!selectedSuggestion) return "";
-      return selectedSuggestion.text.slice(selectedSuggestion.prefixEndIndex);
-    })();
-    const showGenerateAction = (() => !variantSourceTrace && true && text.trim().length === 0)();
-    const dropdownOpen = (() => {
+      return suggestions()[selectedSuggestionIndex] ?? null;
+    });
+    const ghostSuffix = derived(() => {
+      if (!selectedSuggestion()) return "";
+      return selectedSuggestion().text.slice(selectedSuggestion().prefixEndIndex);
+    });
+    const showGenerateAction = derived(() => !variantSourceTrace && true && text.trim().length === 0);
+    const dropdownOpen = derived(() => {
       if (variantSourceTrace) return false;
       if (!inputFocused) return false;
       if (autocompleteDismissed) return false;
-      return suggestions.length > 0;
-    })();
+      return suggestions().length > 0;
+    });
     function applySuggestion(s) {
       text = s.text;
       selectedSuggestionIndex = null;
@@ -470,7 +474,7 @@ function PlaygroundChat($$renderer, $$props) {
     }
     function handleInputKeydown(event) {
       if (event.key === "Escape") {
-        if (dropdownOpen) {
+        if (dropdownOpen()) {
           event.preventDefault();
         }
         autocompleteDismissed = true;
@@ -478,10 +482,10 @@ function PlaygroundChat($$renderer, $$props) {
         return;
       }
       if (event.key === "ArrowUp" || event.key === "ArrowDown") {
-        if (!suggestions.length) return;
+        if (!suggestions().length) return;
         if (autocompleteDismissed) autocompleteDismissed = false;
         event.preventDefault();
-        const max = suggestions.length - 1;
+        const max = suggestions().length - 1;
         if (selectedSuggestionIndex === null) {
           selectedSuggestionIndex = event.key === "ArrowUp" ? max : 0;
         } else {
@@ -492,7 +496,7 @@ function PlaygroundChat($$renderer, $$props) {
       }
       if (event.key === "Enter" || event.key === "Tab" && !event.shiftKey) {
         if (selectedSuggestionIndex === null) return;
-        const s = suggestions[selectedSuggestionIndex];
+        const s = suggestions()[selectedSuggestionIndex];
         if (!s) return;
         event.preventDefault();
         applySuggestion(s);
@@ -580,27 +584,27 @@ function PlaygroundChat($$renderer, $$props) {
       const year = d.getFullYear();
       return `${day} ${month} ${year}`;
     }
-    const renderableEntries = (() => {
+    const renderableEntries = derived(() => {
       return chatContent.filter((entry) => {
         if (isApiCallTrace(entry) || isStepTrace(entry)) return true;
         if (isConversationalTrace(entry)) return isRenderableConversationalMessage(entry);
         return false;
       });
-    })();
-    const controlsDisabled = (() => {
+    });
+    const controlsDisabled = derived(() => {
       return chatContent.findLast((e) => isConversationalTrace(e))?.eventName === "hangup-requested";
-    })();
-    const lastVariantEligibleTrace = (() => {
-      for (let index = renderableEntries.length - 1; index >= 0; index--) {
-        const entry = renderableEntries[index];
+    });
+    const lastVariantEligibleTrace = derived(() => {
+      for (let index = renderableEntries().length - 1; index >= 0; index--) {
+        const entry = renderableEntries()[index];
         if (!isConversationalTrace(entry)) continue;
         if (!isVariantEligibleTrace(entry)) continue;
         return entry;
       }
       return null;
-    })();
-    const aiResponseContext = (() => {
-      const trace = lastVariantEligibleTrace;
+    });
+    const aiResponseContext = derived(() => {
+      const trace = lastVariantEligibleTrace();
       if (!trace) return null;
       try {
         const input = buildAnalyzeTraceInput(trace);
@@ -612,7 +616,7 @@ function PlaygroundChat($$renderer, $$props) {
       } catch {
         return null;
       }
-    })();
+    });
     function findMainStepTraceForConversationTrace(idx) {
       for (let i = idx - 1; i >= 0; i--) {
         const entry = chatContent[i];
@@ -681,7 +685,7 @@ function PlaygroundChat($$renderer, $$props) {
     }
     async function handleGenerateUserResponse() {
       if (aiGenerating) return;
-      const request = aiResponseContext;
+      const request = aiResponseContext();
       if (!request) return;
       autocompleteDismissed = true;
       selectedSuggestionIndex = null;
@@ -744,98 +748,90 @@ function PlaygroundChat($$renderer, $$props) {
         class: `relative flex min-h-0 flex-col p-2 pb-16 ${stringify(className)}`,
         children: ($$renderer4) => {
           $$renderer4.push(`<div class="rc-scroll min-h-0 flex-1 overflow-y-auto pr-1"><!--[-->`);
-          const each_array = ensure_array_like(renderableEntries);
+          const each_array = ensure_array_like(renderableEntries());
           for (let idx = 0, $$length = each_array.length; idx < $$length; idx++) {
             let entry = each_array[idx];
             const current = dateKey(entry.createdAt);
-            const previous = idx > 0 ? dateKey(renderableEntries[idx - 1].createdAt) : null;
+            const previous = idx > 0 ? dateKey(renderableEntries()[idx - 1].createdAt) : null;
             const label = formatDateLabel(entry.createdAt);
             if (current && label && current !== previous) {
-              $$renderer4.push("<!--[-->");
+              $$renderer4.push("<!--[0-->");
               $$renderer4.push(`<div class="my-2 flex w-full justify-center"><div class="rounded-full border border-rc-gray-650 bg-rc-gray-800/40 px-3 py-1 text-xs text-rc-gray-200">${escape_html(label)}</div></div>`);
             } else {
-              $$renderer4.push("<!--[!-->");
+              $$renderer4.push("<!--[-1-->");
             }
             $$renderer4.push(`<!--]--> <div class="log-element"><div>`);
             if (isApiCallTrace(entry)) {
-              $$renderer4.push("<!--[-->");
+              $$renderer4.push("<!--[0-->");
               ChatApiCallTrace($$renderer4, { trace: entry });
+            } else if (isConversationalTrace(entry)) {
+              $$renderer4.push("<!--[1-->");
+              ChatConversationalTrace($$renderer4, {
+                trace: entry,
+                context,
+                agentId,
+                analyzeDisabled,
+                onAnalyze: onAnalyzeTrace ? handleAnalyzeTrace : void 0,
+                onRegenerate: onRegenerateTrace,
+                onRevert: onRevertToState ? handleRevertTrace : void 0,
+                showSeeVariants: !!onSeeVariants && !variantSourceTrace && entry === lastVariantEligibleTrace(),
+                onSeeVariants,
+                variantSelectionState: variantSourceTrace && entry === variantSourceTrace ? "source" : "none",
+                onSelectInVariantMode: variantApplyingId === null && variantSourceTrace && entry === variantSourceTrace ? onChooseOriginalVariant : void 0,
+                suppressActionRow: !!variantSourceTrace && entry === variantSourceTrace
+              });
+            } else if (isStepTrace(entry)) {
+              $$renderer4.push("<!--[2-->");
+              ChatStepTrace($$renderer4, {
+                trace: entry,
+                compareTrace: entry.name === "main" ? findMainComparisonTrace(renderableEntries(), idx) : null
+              });
             } else {
-              $$renderer4.push("<!--[!-->");
-              if (isConversationalTrace(entry)) {
-                $$renderer4.push("<!--[-->");
-                ChatConversationalTrace($$renderer4, {
-                  trace: entry,
-                  context,
-                  agentId,
-                  analyzeDisabled,
-                  onAnalyze: onAnalyzeTrace ? handleAnalyzeTrace : void 0,
-                  onRegenerate: onRegenerateTrace,
-                  onRevert: onRevertToState ? handleRevertTrace : void 0,
-                  showSeeVariants: !!onSeeVariants && !variantSourceTrace && entry === lastVariantEligibleTrace,
-                  onSeeVariants,
-                  variantSelectionState: variantSourceTrace && entry === variantSourceTrace ? "source" : "none",
-                  onSelectInVariantMode: variantApplyingId === null && variantSourceTrace && entry === variantSourceTrace ? onChooseOriginalVariant : void 0,
-                  suppressActionRow: !!variantSourceTrace && entry === variantSourceTrace
-                });
-              } else {
-                $$renderer4.push("<!--[!-->");
-                if (isStepTrace(entry)) {
-                  $$renderer4.push("<!--[-->");
-                  ChatStepTrace($$renderer4, {
-                    trace: entry,
-                    compareTrace: entry.name === "main" ? findMainComparisonTrace(renderableEntries, idx) : null
-                  });
-                } else {
-                  $$renderer4.push("<!--[!-->");
-                }
-                $$renderer4.push(`<!--]-->`);
-              }
-              $$renderer4.push(`<!--]-->`);
+              $$renderer4.push("<!--[-1-->");
             }
             $$renderer4.push(`<!--]--></div> `);
             if (variantSourceTrace && entry === variantSourceTrace) {
-              $$renderer4.push("<!--[-->");
+              $$renderer4.push("<!--[0-->");
               $$renderer4.push(`<div class="ml-7 mt-2 flex flex-col gap-2">`);
               if (variantLoading) {
-                $$renderer4.push("<!--[-->");
+                $$renderer4.push("<!--[0-->");
                 $$renderer4.push(`<div class="rounded-lg border border-rc-green-450 bg-transparent px-3 py-2 text-sm text-rc-gray-300">Generating 9 more variants…</div>`);
               } else {
-                $$renderer4.push("<!--[!-->");
+                $$renderer4.push("<!--[-1-->");
               }
               $$renderer4.push(`<!--]--> `);
               if (variantError) {
-                $$renderer4.push("<!--[-->");
+                $$renderer4.push("<!--[0-->");
                 $$renderer4.push(`<div class="rounded-lg border border-red-500/70 bg-red-950/20 px-3 py-2 text-sm text-red-200">${escape_html(variantError)}</div>`);
               } else {
-                $$renderer4.push("<!--[!-->");
+                $$renderer4.push("<!--[-1-->");
               }
               $$renderer4.push(`<!--]--> <!--[-->`);
               const each_array_1 = ensure_array_like(variantChoices);
               for (let $$index = 0, $$length2 = each_array_1.length; $$index < $$length2; $$index++) {
                 let variant = each_array_1[$$index];
-                $$renderer4.push(`<button type="button"${attr("disabled", variantApplyingId !== null, true)}${attr_class(`w-full max-w-[83%] cursor-pointer rounded-lg border border-rc-green-450 bg-transparent p-2 pt-1 text-left text-rc-gray-100 backdrop-blur-md transition-colors hover:bg-rc-green-700 focus:outline-none focus-visible:outline-none disabled:cursor-wait disabled:opacity-70 ${stringify(variantApplyingId === variant.id ? "bg-rc-green-700" : "")}`)}><div class="whitespace-pre-line break-words">${escape_html(variant.text)}</div></button>`);
+                $$renderer4.push(`<button type="button"${attr("disabled", variantApplyingId !== null, true)}${attr_class(`w-full max-w-[83%] cursor-pointer rounded-lg border border-rc-green-450 bg-transparent p-2 pt-1 text-left text-rc-gray-100 backdrop-blur-md transition-colors hover:bg-rc-green-700 focus:outline-none focus-visible:outline-none disabled:cursor-wait disabled:opacity-70 ${variantApplyingId === variant.id ? "bg-rc-green-700" : ""}`)}><div class="whitespace-pre-line break-words">${escape_html(variant.text)}</div></button>`);
               }
               $$renderer4.push(`<!--]--></div>`);
             } else {
-              $$renderer4.push("<!--[!-->");
+              $$renderer4.push("<!--[-1-->");
             }
             $$renderer4.push(`<!--]--></div>`);
           }
           $$renderer4.push(`<!--]--></div> `);
           if (variantSourceTrace) {
-            $$renderer4.push("<!--[-->");
+            $$renderer4.push("<!--[0-->");
             $$renderer4.push(`<div class="absolute bottom-2 left-2 right-2 z-10 flex items-center gap-3 rounded-lg border border-rc-green-450 bg-rc-gray-930/90 px-3 py-3 font-semibold text-rc-gray-100 shadow-inner-white-soft backdrop-blur-3xl"><span>Choose a variant above to continue</span> <button type="button"${attr("disabled", !onRegenerateVariants || variantLoading || variantApplyingId !== null, true)} class="rounded border-0 bg-transparent px-1 py-0.5 text-rc-gray-300 transition-colors hover:bg-rc-gray-900 hover:text-rc-gray-100 focus:outline-none focus-visible:outline-none disabled:cursor-wait disabled:opacity-50">Regenerate</button> <button type="button" class="rounded border-0 bg-transparent px-1 py-0.5 text-rc-gray-300 transition-colors hover:bg-rc-gray-900 hover:text-rc-gray-100 focus:outline-none focus-visible:outline-none">Cancel</button></div>`);
           } else {
-            $$renderer4.push("<!--[!-->");
-            $$renderer4.push(`<form><fieldset${attr("disabled", controlsDisabled, true)} class="absolute bottom-2 left-2 right-2 z-10 flex gap-2 disabled:opacity-35"><div class="relative flex-1">`);
-            if (dropdownOpen) {
-              $$renderer4.push("<!--[-->");
+            $$renderer4.push("<!--[-1-->");
+            $$renderer4.push(`<form><fieldset${attr("disabled", controlsDisabled(), true)} class="absolute bottom-2 left-2 right-2 z-10 flex gap-2 disabled:opacity-35"><div class="relative flex-1">`);
+            if (dropdownOpen()) {
+              $$renderer4.push("<!--[0-->");
               $$renderer4.push(`<div class="absolute bottom-full left-0 right-0 mb-1 max-h-60 overflow-y-auto rounded-lg border border-rc-gray-110 bg-rc-gray-930 shadow-inner-white-soft backdrop-blur-2xl" role="listbox"><!--[-->`);
-              const each_array_2 = ensure_array_like(suggestions);
+              const each_array_2 = ensure_array_like(suggestions());
               for (let idx = 0, $$length = each_array_2.length; idx < $$length; idx++) {
                 let s = each_array_2[idx];
-                $$renderer4.push(`<button type="button" role="option"${attr("aria-selected", selectedSuggestionIndex === idx)} tabindex="-1"${attr_class(`w-full select-none border-b border-rc-gray-110 px-3 py-2 text-left font-semibold text-rc-gray-100 last:border-b-0 hover:bg-rc-gray-700/70 ${stringify(selectedSuggestionIndex === idx ? "bg-rc-gray-700/70" : "")}`)}><!--[-->`);
+                $$renderer4.push(`<button type="button" role="option"${attr("aria-selected", selectedSuggestionIndex === idx)} tabindex="-1"${attr_class(`w-full select-none border-b border-rc-gray-110 px-3 py-2 text-left font-semibold text-rc-gray-100 last:border-b-0 hover:bg-rc-gray-700/70 ${selectedSuggestionIndex === idx ? "bg-rc-gray-700/70" : ""}`)}><!--[-->`);
                 const each_array_3 = ensure_array_like(s.segments);
                 for (let $$index_2 = 0, $$length2 = each_array_3.length; $$index_2 < $$length2; $$index_2++) {
                   let seg = each_array_3[$$index_2];
@@ -845,7 +841,7 @@ function PlaygroundChat($$renderer, $$props) {
               }
               $$renderer4.push(`<!--]--></div>`);
             } else {
-              $$renderer4.push("<!--[!-->");
+              $$renderer4.push("<!--[-1-->");
             }
             $$renderer4.push(`<!--]--> `);
             Input($$renderer4, {
@@ -873,11 +869,11 @@ function PlaygroundChat($$renderer, $$props) {
               }
             });
             $$renderer4.push(`<!----> `);
-            if (selectedSuggestionIndex !== null && ghostSuffix) {
-              $$renderer4.push("<!--[-->");
-              $$renderer4.push(`<div class="pointer-events-none absolute inset-0 z-10 overflow-hidden rounded-lg" aria-hidden="true"><div class="whitespace-pre text-rc-gray-400/70"${attr_style(ghostTextStyle)}><span class="invisible">${escape_html(text)}</span><span>${escape_html(ghostSuffix)}</span></div></div>`);
+            if (selectedSuggestionIndex !== null && ghostSuffix()) {
+              $$renderer4.push("<!--[0-->");
+              $$renderer4.push(`<div class="pointer-events-none absolute inset-0 z-10 overflow-hidden rounded-lg" aria-hidden="true"><div class="whitespace-pre text-rc-gray-400/70"${attr_style(ghostTextStyle)}><span class="invisible">${escape_html(text)}</span><span>${escape_html(ghostSuffix())}</span></div></div>`);
             } else {
-              $$renderer4.push("<!--[!-->");
+              $$renderer4.push("<!--[-1-->");
             }
             $$renderer4.push(`<!--]--></div> `);
             Button($$renderer4, {
@@ -887,17 +883,13 @@ function PlaygroundChat($$renderer, $$props) {
               onclick: handleSecondaryChatButton,
               children: ($$renderer5) => {
                 if (agentType === "text") {
-                  $$renderer5.push("<!--[-->");
+                  $$renderer5.push("<!--[0-->");
                   Icon($$renderer5, { name: "paperclip" });
+                } else if (agentType === "voice") {
+                  $$renderer5.push("<!--[1-->");
+                  Icon($$renderer5, { name: "hangup" });
                 } else {
-                  $$renderer5.push("<!--[!-->");
-                  if (agentType === "voice") {
-                    $$renderer5.push("<!--[-->");
-                    Icon($$renderer5, { name: "hangup" });
-                  } else {
-                    $$renderer5.push("<!--[!-->");
-                  }
-                  $$renderer5.push(`<!--]-->`);
+                  $$renderer5.push("<!--[-1-->");
                 }
                 $$renderer5.push(`<!--]-->`);
               },
@@ -906,21 +898,21 @@ function PlaygroundChat($$renderer, $$props) {
             $$renderer4.push(`<!----> `);
             Button($$renderer4, {
               size: "small",
-              type: showGenerateAction ? "button" : "submit",
-              title: showGenerateAction ? "Generate response" : void 0,
-              "aria-label": showGenerateAction ? "Generate response" : "Send message",
-              disabled: aiGenerating || showGenerateAction && !aiResponseContext,
+              type: showGenerateAction() ? "button" : "submit",
+              title: showGenerateAction() ? "Generate response" : void 0,
+              "aria-label": showGenerateAction() ? "Generate response" : "Send message",
+              disabled: aiGenerating || showGenerateAction() && !aiResponseContext(),
               onclick: (event) => {
-                if (!showGenerateAction) return;
+                if (!showGenerateAction()) return;
                 event.preventDefault();
                 void handleGenerateUserResponse();
               },
               children: ($$renderer5) => {
-                if (showGenerateAction) {
-                  $$renderer5.push("<!--[-->");
+                if (showGenerateAction()) {
+                  $$renderer5.push("<!--[0-->");
                   Icon($$renderer5, { name: "sparkles" });
                 } else {
-                  $$renderer5.push("<!--[!-->");
+                  $$renderer5.push("<!--[-1-->");
                   Icon($$renderer5, { name: "send" });
                 }
                 $$renderer5.push(`<!--]-->`);
@@ -1159,6 +1151,32 @@ function _page($$renderer, $$props) {
       if (!sourceTrace) return;
       void requestVariants(sourceTrace);
     }
+    async function handleChooseVariant(id) {
+      if (!variantMode || !workspace.agentId) return;
+      const choice = variantMode.choices.find((variant) => variant.id === id);
+      if (!choice) return;
+      variantMode = { ...variantMode, applyingId: id, error: null };
+      try {
+        await trpc.agents.commitVariant.mutate({
+          agentId: workspace.agentId,
+          region: workspace.region,
+          targetStateId: variantMode.targetStateId,
+          state: choice.state
+        });
+        clearVariantMode();
+        clearChatContent();
+        clearLogs();
+        actions.sendAppEvent({ type: "reload-project" });
+      } catch (error) {
+        console.error("Failed to apply variant", error);
+        if (!variantMode) return;
+        variantMode = {
+          ...variantMode,
+          applyingId: null,
+          error: typeof error?.message === "string" ? error.message : "Failed to apply variant"
+        };
+      }
+    }
     function handleChooseOriginalVariant() {
       clearVariantMode();
     }
@@ -1167,7 +1185,7 @@ function _page($$renderer, $$props) {
     function $$render_inner($$renderer3) {
       $$renderer3.push(`<div class="relative flex h-full min-h-0 flex-col"><div class="flex flex-none flex-nowrap items-center gap-2 p-2">`);
       if (workspace.agentStates.length > 1) {
-        $$renderer3.push("<!--[-->");
+        $$renderer3.push("<!--[0-->");
         History($$renderer3, {
           agentStates: workspace.agentStates,
           currentState: workspace.currentState,
@@ -1175,7 +1193,7 @@ function _page($$renderer, $$props) {
           onSelectState: (id) => actions.selectState(id)
         });
       } else {
-        $$renderer3.push("<!--[!-->");
+        $$renderer3.push("<!--[-1-->");
       }
       $$renderer3.push(`<!--]--> <div class="ml-auto flex flex-none flex-nowrap items-center gap-2">`);
       Button($$renderer3, {
@@ -1211,25 +1229,17 @@ function _page($$renderer, $$props) {
         },
         children: ($$renderer4) => {
           if (copied === "logs") {
-            $$renderer4.push("<!--[-->");
+            $$renderer4.push("<!--[0-->");
             $$renderer4.push(`Copied logs`);
+          } else if (copied === "with-prompts") {
+            $$renderer4.push("<!--[1-->");
+            $$renderer4.push(`Copied traces (with prompts)`);
+          } else if (copied === "without-prompts") {
+            $$renderer4.push("<!--[2-->");
+            $$renderer4.push(`Copied traces (without prompts)`);
           } else {
-            $$renderer4.push("<!--[!-->");
-            if (copied === "with-prompts") {
-              $$renderer4.push("<!--[-->");
-              $$renderer4.push(`Copied traces (with prompts)`);
-            } else {
-              $$renderer4.push("<!--[!-->");
-              if (copied === "without-prompts") {
-                $$renderer4.push("<!--[-->");
-                $$renderer4.push(`Copied traces (without prompts)`);
-              } else {
-                $$renderer4.push("<!--[!-->");
-                $$renderer4.push(`Copy...`);
-              }
-              $$renderer4.push(`<!--]-->`);
-            }
-            $$renderer4.push(`<!--]-->`);
+            $$renderer4.push("<!--[-1-->");
+            $$renderer4.push(`Copy...`);
           }
           $$renderer4.push(`<!--]-->`);
         },
@@ -1312,38 +1322,38 @@ function _page($$renderer, $$props) {
       });
       $$renderer3.push(`<!----></div></div> <div class="min-h-0 flex-1">`);
       if (!workspace.wsLoaded || !workspace.chatReady) {
-        $$renderer3.push("<!--[-->");
+        $$renderer3.push("<!--[0-->");
         $$renderer3.push(`<div class="flex h-full items-center justify-center text-sm text-rc-gray-300">Connecting…</div>`);
+      } else if (!workspace.agentId) {
+        $$renderer3.push("<!--[1-->");
+        $$renderer3.push(`<div class="flex h-full items-center justify-center text-sm text-rc-gray-300">Select an agent to start chatting</div>`);
       } else {
-        $$renderer3.push("<!--[!-->");
-        if (!workspace.agentId) {
-          $$renderer3.push("<!--[-->");
-          $$renderer3.push(`<div class="flex h-full items-center justify-center text-sm text-rc-gray-300">Select an agent to start chatting</div>`);
-        } else {
-          $$renderer3.push("<!--[!-->");
-          $$renderer3.push(`<div class="h-full min-h-0 p-2">`);
-          PlaygroundChat($$renderer3, {
-            class: "h-full min-w-0",
-            context: workspace.context,
-            agentId: workspace.agentId,
-            agentType: workspace.agentType,
-            analyzeDisabled: analyzeRunning,
-            onAnalyzeTrace: handleAnalyzeTrace,
-            onRegenerateTrace: handleRegenerateTrace,
-            onRevertToState: (stateId) => actions.selectState(stateId),
-            onSeeVariants: handleSeeVariants,
-            onHangup: handleHangup,
-            variantSourceTrace: variantMode?.sourceTrace ?? null,
-            variantChoices: variantMode?.choices ?? [],
-            variantLoading: variantMode?.loading ?? false,
-            variantApplyingId: variantMode?.applyingId ?? null,
-            variantError: variantMode?.error ?? null,
-            onRegenerateVariants: handleRegenerateVariants,
-            onChooseOriginalVariant: handleChooseOriginalVariant
-          });
-          $$renderer3.push(`<!----></div>`);
-        }
-        $$renderer3.push(`<!--]-->`);
+        $$renderer3.push("<!--[-1-->");
+        $$renderer3.push(`<div class="h-full min-h-0 p-2">`);
+        PlaygroundChat($$renderer3, {
+          class: "h-full min-w-0",
+          context: workspace.context,
+          agentId: workspace.agentId,
+          region: workspace.region,
+          agentType: workspace.agentType,
+          onmessage: (message) => actions.sendChatMessage(message),
+          analyzeDisabled: analyzeRunning,
+          onAnalyzeTrace: handleAnalyzeTrace,
+          onRegenerateTrace: handleRegenerateTrace,
+          onRevertToState: (stateId) => actions.selectState(stateId),
+          onSeeVariants: handleSeeVariants,
+          onHangup: handleHangup,
+          variantSourceTrace: variantMode?.sourceTrace ?? null,
+          variantChoices: variantMode?.choices ?? [],
+          variantLoading: variantMode?.loading ?? false,
+          variantApplyingId: variantMode?.applyingId ?? null,
+          variantError: variantMode?.error ?? null,
+          onCancelVariants: clearVariantMode,
+          onRegenerateVariants: handleRegenerateVariants,
+          onChooseOriginalVariant: handleChooseOriginalVariant,
+          onChooseVariant: handleChooseVariant
+        });
+        $$renderer3.push(`<!----></div>`);
       }
       $$renderer3.push(`<!--]--></div></div>`);
     }
@@ -1357,4 +1367,4 @@ function _page($$renderer, $$props) {
 }
 
 export { _page as default };
-//# sourceMappingURL=_page.svelte-c2LBV2K4.js.map
+//# sourceMappingURL=_page.svelte-CY4SZM-i.js.map