@runtypelabs/persona 1.45.0 → 1.46.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@runtypelabs/persona",
-  "version": "1.45.0",
+  "version": "1.46.0",
   "description": "Themeable, pluggable streaming agent widget for websites, in plain JS with support for voice input and reasoning / tool output.",
   "type": "module",
   "main": "dist/index.cjs",

package/src/components/event-stream-view.test.ts

@@ -555,6 +555,32 @@ describe("createEventStreamView", () => {
       // Should call getFullHistory
       expect(getFullHistory).toHaveBeenCalled();
     });
+
+    it("should fall back to buffer when getFullHistory returns empty", async () => {
+      const { createEventStreamView } = await loadModule();
+      const events = [
+        makeEvent("step_chunk", 1),
+        makeEvent("flow_complete", 2),
+      ];
+      const buffer = createMockBuffer(events);
+      const getFullHistory = vi.fn().mockResolvedValue([]);
+      const { element } = createEventStreamView({
+        buffer: buffer as any,
+        getFullHistory,
+      });
+
+      const copyAllBtn = getCopyAllBtn(element);
+
+      // Click copy all with no filters (All events)
+      await copyAllBtn.__listeners.click[0]();
+
+      expect(getFullHistory).toHaveBeenCalled();
+      const writeCall = (globalThis.navigator.clipboard.writeText as any).mock.calls[0][0];
+      const parsed = JSON.parse(writeCall);
+      expect(parsed).toHaveLength(2);
+      expect(parsed[0].index).toBe(1);
+      expect(parsed[1].index).toBe(2);
+    });
   });
 
   describe("keyboard shortcuts", () => {

package/src/components/event-stream-view.ts

@@ -1010,9 +1010,12 @@ export function createEventStreamView(
         if (hasActiveFilters()) {
           events = filteredEvents;
         } else {
-          events = getFullHistory
-            ? await getFullHistory()
-            : buffer.getAll();
+          if (getFullHistory) {
+            events = await getFullHistory();
+            if (events.length === 0) events = buffer.getAll();
+          } else {
+            events = buffer.getAll();
+          }
         }
         const parsed = events.map((e) => {
           try {

package/src/types.ts

@@ -1814,6 +1814,13 @@ export type AgentWidgetConfig = {
    */
   colorScheme?: 'auto' | 'light' | 'dark';
   features?: AgentWidgetFeatureFlags;
+  /**
+   * When true, focus the chat input after the panel opens and the open animation completes.
+   * Applies to launcher mode (user click, controller.open(), autoExpand) and inline mode (on init).
+   * Skip when voice is active to avoid stealing focus from voice UI.
+   * @default false
+   */
+  autoFocusInput?: boolean;
   launcher?: AgentWidgetLauncherConfig;
   initialMessages?: AgentWidgetMessage[];
   suggestionChips?: string[];

package/src/ui.ts

@@ -37,7 +37,7 @@ import { MessageTransform, MessageActionCallbacks, LoadingIndicatorRenderer } fr
 import { createStandardBubble, createTypingIndicator } from "./components/message-bubble";
 import { createReasoningBubble, reasoningExpansionState, updateReasoningBubbleUI } from "./components/reasoning-bubble";
 import { createToolBubble, toolExpansionState, updateToolBubbleUI } from "./components/tool-bubble";
-import { createApprovalBubble, updateApprovalBubbleUI } from "./components/approval-bubble";
+import { createApprovalBubble } from "./components/approval-bubble";
 import { createSuggestions } from "./components/suggestions";
 import { EventStreamBuffer } from "./utils/event-stream-buffer";
 import { EventStreamStore } from "./utils/event-stream-store";
@@ -276,6 +276,11 @@ type Controller = {
   hideEventStream: () => void;
   /** Returns current visibility state of the event stream panel */
   isEventStreamVisible: () => boolean;
+  /**
+   * Focus the chat input. Returns true if focus succeeded, false if panel is closed
+   * (launcher mode) or textarea is unavailable.
+   */
+  focusInput: () => boolean;
   /**
    * Programmatically resolve a pending approval.
    * @param approvalId - The approval ID to resolve
@@ -457,6 +462,7 @@ export const createAgentExperience = (
 
   let launcherEnabled = config.launcher?.enabled ?? true;
   let autoExpand = config.launcher?.autoExpand ?? false;
+  const autoFocusInput = config.autoFocusInput ?? false;
   let prevAutoExpand = autoExpand;
   let prevLauncherEnabled = launcherEnabled;
   let prevHeaderLayout = config.layout?.header?.layout;
@@ -1698,8 +1704,10 @@ export const createAgentExperience = (
     
     // Also check if there's a recently completed assistant message (streaming just ended)
     // This prevents flicker when the message completes but isStreaming hasn't updated yet
+    // Approval-variant messages are UI controls, not content — exclude them so the typing
+    // indicator still shows while the agent resumes after approval
     const lastMessage = messages[messages.length - 1];
-    const hasRecentAssistantResponse = lastMessage?.role === "assistant" && !lastMessage.streaming;
+    const hasRecentAssistantResponse = lastMessage?.role === "assistant" && !lastMessage.streaming && lastMessage.variant !== "approval";
 
     if (isStreaming && messages.some((msg) => msg.role === "user") && !hasStreamingAssistantMessage && !hasRecentAssistantResponse) {
       // Get loading indicator using priority chain: plugin -> config -> default
@@ -1920,6 +1928,16 @@ export const createAgentExperience = (
     });
   };
 
+  const maybeFocusInput = () => {
+    if (voiceState.active) return;
+    if (!textarea) return;
+    textarea.focus();
+  };
+
+  eventBus.on("widget:opened", () => {
+    if (config.autoFocusInput) setTimeout(() => maybeFocusInput(), 200);
+  });
+
   const updateCopy = () => {
     introTitle.textContent = config.copy?.welcomeTitle ?? "Hello 👋";
     introSubtitle.textContent =
@@ -2502,6 +2520,14 @@ export const createAgentExperience = (
   scheduleAutoScroll(true);
   maybeRestoreVoiceFromMetadata();
 
+  if (autoFocusInput) {
+    if (!launcherEnabled) {
+      setTimeout(() => maybeFocusInput(), 0);
+    } else if (open) {
+      setTimeout(() => maybeFocusInput(), 200);
+    }
+  }
+
   const recalcPanelHeight = () => {
     const sidebarMode = config.launcher?.sidebarMode ?? false;
     const fullHeight = sidebarMode || (config.launcher?.fullHeight ?? false);
@@ -4055,6 +4081,12 @@ export const createAgentExperience = (
     isEventStreamVisible(): boolean {
       return eventStreamVisible;
     },
+    focusInput(): boolean {
+      if (launcherEnabled && !open) return false;
+      if (!textarea) return false;
+      textarea.focus();
+      return true;
+    },
     async resolveApproval(approvalId: string, decision: 'approved' | 'denied'): Promise<void> {
       const messages = session.getMessages();
       const approvalMessage = messages.find(
@@ -4200,26 +4232,40 @@ export const createAgentExperience = (
   // ============================================================================
   // INSTANCE-SCOPED WINDOW EVENTS FOR PROGRAMMATIC CONTROL
   // ============================================================================
-  if (showEventStreamToggle && typeof window !== "undefined") {
+  if (typeof window !== "undefined") {
     const instanceId = mount.getAttribute("data-persona-instance") || mount.id || "persona-" + Math.random().toString(36).slice(2, 8);
-    const handleShowEvent = (e: Event) => {
-      const detail = (e as CustomEvent).detail;
-      if (!detail?.instanceId || detail.instanceId === instanceId) {
-        controller.showEventStream();
-      }
-    };
-    const handleHideEvent = (e: Event) => {
+
+    const handleFocusInput = (e: Event) => {
       const detail = (e as CustomEvent).detail;
       if (!detail?.instanceId || detail.instanceId === instanceId) {
-        controller.hideEventStream();
+        controller.focusInput();
       }
     };
-    window.addEventListener("persona:showEventStream", handleShowEvent);
-    window.addEventListener("persona:hideEventStream", handleHideEvent);
+    window.addEventListener("persona:focusInput", handleFocusInput);
     destroyCallbacks.push(() => {
-      window.removeEventListener("persona:showEventStream", handleShowEvent);
-      window.removeEventListener("persona:hideEventStream", handleHideEvent);
+      window.removeEventListener("persona:focusInput", handleFocusInput);
     });
+
+    if (showEventStreamToggle) {
+      const handleShowEvent = (e: Event) => {
+        const detail = (e as CustomEvent).detail;
+        if (!detail?.instanceId || detail.instanceId === instanceId) {
+          controller.showEventStream();
+        }
+      };
+      const handleHideEvent = (e: Event) => {
+        const detail = (e as CustomEvent).detail;
+        if (!detail?.instanceId || detail.instanceId === instanceId) {
+          controller.hideEventStream();
+        }
+      };
+      window.addEventListener("persona:showEventStream", handleShowEvent);
+      window.addEventListener("persona:hideEventStream", handleHideEvent);
+      destroyCallbacks.push(() => {
+        window.removeEventListener("persona:showEventStream", handleShowEvent);
+        window.removeEventListener("persona:hideEventStream", handleHideEvent);
+      });
+    }
   }
 
   // ============================================================================