@runtypelabs/persona 3.20.0 → 3.21.1

package/dist/theme-editor.js

@@ -3679,6 +3679,28 @@ var SequenceReorderBuffer = class {
 // src/client.ts
 var DEFAULT_ENDPOINT = "https://api.runtype.com/v1/dispatch";
 var DEFAULT_CLIENT_API_BASE = "https://api.runtype.com";
+function filenameFromMediaType(mediaType) {
+  var _a, _b;
+  const lower = mediaType.toLowerCase();
+  const knownExtensions = {
+    "application/pdf": "pdf",
+    "application/json": "json",
+    "application/zip": "zip",
+    "text/plain": "txt",
+    "text/csv": "csv",
+    "text/markdown": "md"
+  };
+  const ext = knownExtensions[lower];
+  if (ext) return `attachment.${ext}`;
+  const slash = lower.indexOf("/");
+  if (slash > 0) {
+    const subtype = (_b = (_a = lower.slice(slash + 1).split(";")[0]) == null ? void 0 : _a.trim()) != null ? _b : "";
+    if (subtype && subtype !== "octet-stream" && /^[a-z0-9.+-]+$/i.test(subtype)) {
+      return `attachment.${subtype}`;
+    }
+  }
+  return "attachment";
+}
 var hasValidContent = (message) => {
   if (message.contentParts && message.contentParts.length > 0) {
     return true;
@@ -5631,6 +5653,89 @@ var AgentWidgetClient = class {
               }
             }
           }
+        } else if (payloadType === "agent_media") {
+          const rawMedia = Array.isArray(payload.media) ? payload.media : [];
+          const mediaContentParts = [];
+          for (const part of rawMedia) {
+            if (!part || typeof part !== "object") continue;
+            const rec = part;
+            const partType = typeof rec.type === "string" ? rec.type : void 0;
+            const rawMediaType = typeof rec.mediaType === "string" ? rec.mediaType.toLowerCase() : "";
+            let src = null;
+            let mediaType = "";
+            if (partType === "media") {
+              const data = typeof rec.data === "string" ? rec.data : void 0;
+              if (!data) continue;
+              mediaType = rawMediaType.length > 0 ? rawMediaType : "application/octet-stream";
+              src = `data:${mediaType};base64,${data}`;
+            } else if (partType === "image-url") {
+              const url = typeof rec.url === "string" ? rec.url : void 0;
+              if (!url) continue;
+              mediaType = rawMediaType;
+              src = url;
+            } else if (partType === "file-url") {
+              const url = typeof rec.url === "string" ? rec.url : void 0;
+              if (!url) continue;
+              mediaType = rawMediaType;
+              src = url;
+            } else {
+              continue;
+            }
+            if (!src) continue;
+            if (partType === "image-url" || mediaType.startsWith("image/")) {
+              mediaContentParts.push({
+                type: "image",
+                image: src,
+                ...mediaType ? { mimeType: mediaType } : {}
+              });
+            } else if (mediaType.startsWith("audio/")) {
+              mediaContentParts.push({
+                type: "audio",
+                audio: src,
+                mimeType: mediaType
+              });
+            } else if (mediaType.startsWith("video/")) {
+              mediaContentParts.push({
+                type: "video",
+                video: src,
+                mimeType: mediaType
+              });
+            } else {
+              const resolvedMediaType = mediaType || "application/octet-stream";
+              mediaContentParts.push({
+                type: "file",
+                data: src,
+                mimeType: resolvedMediaType,
+                filename: filenameFromMediaType(resolvedMediaType)
+              });
+            }
+          }
+          if (mediaContentParts.length > 0) {
+            const seq = nextSequence();
+            const toolCallIdRaw = payload.toolCallId;
+            const mediaIdSuffix = typeof toolCallIdRaw === "string" && toolCallIdRaw.length > 0 ? `${toolCallIdRaw}-${seq}` : String(seq);
+            const mediaMessage = {
+              id: `agent-media-${mediaIdSuffix}`,
+              role: "assistant",
+              content: "",
+              contentParts: mediaContentParts,
+              createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+              streaming: false,
+              sequence: seq,
+              agentMetadata: {
+                executionId: payload.executionId,
+                iteration: payload.iteration
+              }
+            };
+            emitMessage(mediaMessage);
+            const prevAssistant = assistantMessage;
+            if (prevAssistant) {
+              prevAssistant.streaming = false;
+              emitMessage(prevAssistant);
+            }
+            assistantMessage = null;
+            assistantMessageRef.current = null;
+          }
         } else if (payloadType === "agent_iteration_complete") {
         } else if (payloadType === "agent_reflection" || payloadType === "agent_reflect") {
           const reflectionId = `agent-reflection-${payload.executionId}-${payload.iteration}`;
@@ -7655,8 +7760,10 @@ var AgentWidgetSession = class _AgentWidgetSession {
    */
   async connectStream(stream, options) {
     var _a, _b, _c;
-    if (this.streaming) return;
-    (_a = this.abortController) == null ? void 0 : _a.abort();
+    if (this.streaming && !(options == null ? void 0 : options.allowReentry)) return;
+    if (!(options == null ? void 0 : options.allowReentry)) {
+      (_a = this.abortController) == null ? void 0 : _a.abort();
+    }
     let hasStale = false;
     for (const msg of this.messages) {
       if (msg.streaming) {
@@ -7690,7 +7797,7 @@ var AgentWidgetSession = class _AgentWidgetSession {
    * and pipes the response stream through connectStream().
    */
   async resolveApproval(approval, decision) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const approvalMessageId = `approval-${approval.id}`;
     const updatedApproval = {
       ...approval,
@@ -7707,6 +7814,9 @@ var AgentWidgetSession = class _AgentWidgetSession {
       approval: updatedApproval
     };
     this.upsertMessage(updatedMessage);
+    (_a = this.abortController) == null ? void 0 : _a.abort();
+    this.abortController = new AbortController();
+    this.setStreaming(true);
     const approvalConfig = this.config.approval;
     const onDecision = approvalConfig && typeof approvalConfig === "object" ? approvalConfig.onDecision : void 0;
     try {
@@ -7737,7 +7847,7 @@ var AgentWidgetSession = class _AgentWidgetSession {
           if (!response.ok) {
             const errorData = await response.json().catch(() => null);
             throw new Error(
-              (_a = errorData == null ? void 0 : errorData.error) != null ? _a : `Approval request failed: ${response.status}`
+              (_b = errorData == null ? void 0 : errorData.error) != null ? _b : `Approval request failed: ${response.status}`
             );
           }
           stream = response.body;
@@ -7745,23 +7855,35 @@ var AgentWidgetSession = class _AgentWidgetSession {
           stream = response;
         }
         if (stream) {
-          await this.connectStream(stream);
-        } else if (decision === "denied") {
-          this.appendMessage({
-            id: `denial-${approval.id}`,
-            role: "assistant",
-            content: "Tool execution was denied by user.",
-            createdAt: (/* @__PURE__ */ new Date()).toISOString(),
-            streaming: false,
-            sequence: this.nextSequence()
-          });
+          await this.connectStream(stream, { allowReentry: true });
+        } else {
+          if (decision === "denied") {
+            this.appendMessage({
+              id: `denial-${approval.id}`,
+              role: "assistant",
+              content: "Tool execution was denied by user.",
+              createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+              streaming: false,
+              sequence: this.nextSequence()
+            });
+          }
+          this.setStreaming(false);
+          this.abortController = null;
         }
+      } else {
+        this.setStreaming(false);
+        this.abortController = null;
       }
     } catch (error) {
-      (_c = (_b = this.callbacks).onError) == null ? void 0 : _c.call(
-        _b,
-        error instanceof Error ? error : new Error(String(error))
-      );
+      const isAbortError = error instanceof Error && (error.name === "AbortError" || error.message.includes("aborted") || error.message.includes("abort"));
+      this.setStreaming(false);
+      this.abortController = null;
+      if (!isAbortError) {
+        (_d = (_c = this.callbacks).onError) == null ? void 0 : _d.call(
+          _c,
+          error instanceof Error ? error : new Error(String(error))
+        );
+      }
     }
   }
   /**
@@ -7815,7 +7937,7 @@ var AgentWidgetSession = class _AgentWidgetSession {
     });
   }
   async resolveAskUserQuestion(toolMessage, answer) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
     const live = this.messages.find((m) => m.id === toolMessage.id);
     if (((_a = live == null ? void 0 : live.agentMetadata) == null ? void 0 : _a.askUserQuestionAnswered) === true) return;
     const executionId = (_b = toolMessage.agentMetadata) == null ? void 0 : _b.executionId;
@@ -7839,8 +7961,11 @@ var AgentWidgetSession = class _AgentWidgetSession {
       }
     }
     this.markAskUserQuestionResolved(toolMessage, structuredAnswers);
+    (_h = this.abortController) == null ? void 0 : _h.abort();
+    this.abortController = new AbortController();
+    this.setStreaming(true);
     const toolCallId = toolMessage.toolCall.id;
-    const args = (_h = toolMessage.toolCall) == null ? void 0 : _h.args;
+    const args = (_i = toolMessage.toolCall) == null ? void 0 : _i.args;
     const questions = Array.isArray(args == null ? void 0 : args.questions) ? args.questions : [];
     if (questions.length === 0) {
       const fallback = typeof answer === "string" ? answer : Object.entries(answer).map(
@@ -7886,17 +8011,25 @@ var AgentWidgetSession = class _AgentWidgetSession {
       if (!response.ok) {
         const errorData = await response.json().catch(() => null);
         throw new Error(
-          (_i = errorData == null ? void 0 : errorData.error) != null ? _i : `Resume failed: ${response.status}`
+          (_j = errorData == null ? void 0 : errorData.error) != null ? _j : `Resume failed: ${response.status}`
         );
       }
       if (response.body) {
-        await this.connectStream(response.body);
+        await this.connectStream(response.body, { allowReentry: true });
+      } else {
+        this.setStreaming(false);
+        this.abortController = null;
       }
     } catch (error) {
-      (_k = (_j = this.callbacks).onError) == null ? void 0 : _k.call(
-        _j,
-        error instanceof Error ? error : new Error(String(error))
-      );
+      const isAbortError = error instanceof Error && (error.name === "AbortError" || error.message.includes("aborted") || error.message.includes("abort"));
+      this.setStreaming(false);
+      this.abortController = null;
+      if (!isAbortError) {
+        (_l = (_k = this.callbacks).onError) == null ? void 0 : _l.call(
+          _k,
+          error instanceof Error ? error : new Error(String(error))
+        );
+      }
     }
   }
   cancel() {
@@ -11125,6 +11258,19 @@ var isSafeImageSrc = (src) => {
   if (!src.includes(":")) return true;
   return false;
 };
+var isSafeMediaSrc = (src) => {
+  const lower = src.toLowerCase();
+  if (lower.startsWith("javascript:")) return false;
+  if (lower.startsWith("data:text/html")) return false;
+  if (lower.startsWith("data:text/javascript")) return false;
+  if (lower.startsWith("data:text/xml")) return false;
+  if (lower.startsWith("data:application/xhtml")) return false;
+  if (lower.startsWith("data:image/svg+xml")) return false;
+  if (/^(?:https?|blob):/i.test(src)) return true;
+  if (lower.startsWith("data:")) return true;
+  if (!src.includes(":")) return true;
+  return false;
+};
 var MESSAGE_IMAGE_PREVIEW_MAX_WIDTH_PX = 320;
 var MESSAGE_IMAGE_PREVIEW_MAX_HEIGHT_PX = 320;
 var getMessageImageParts = (message) => {
@@ -11135,6 +11281,24 @@ var getMessageImageParts = (message) => {
     (part) => part.type === "image" && typeof part.image === "string" && part.image.trim().length > 0
   );
 };
+var getMessageAudioParts = (message) => {
+  if (!message.contentParts || message.contentParts.length === 0) return [];
+  return message.contentParts.filter(
+    (part) => part.type === "audio" && typeof part.audio === "string" && part.audio.trim().length > 0
+  );
+};
+var getMessageVideoParts = (message) => {
+  if (!message.contentParts || message.contentParts.length === 0) return [];
+  return message.contentParts.filter(
+    (part) => part.type === "video" && typeof part.video === "string" && part.video.trim().length > 0
+  );
+};
+var getMessageFileParts = (message) => {
+  if (!message.contentParts || message.contentParts.length === 0) return [];
+  return message.contentParts.filter(
+    (part) => part.type === "file" && typeof part.data === "string" && part.data.trim().length > 0
+  );
+};
 var createMessageImagePreviews = (imageParts, hasVisibleText, onPreviewFailed) => {
   if (imageParts.length === 0) return null;
   try {
@@ -11203,6 +11367,109 @@ var createMessageImagePreviews = (imageParts, hasVisibleText, onPreviewFailed) =
     return null;
   }
 };
+var createMessageAudioPreviews = (audioParts) => {
+  if (audioParts.length === 0) return null;
+  try {
+    const container = createElement(
+      "div",
+      "persona-flex persona-flex-col persona-gap-2"
+    );
+    container.setAttribute("data-message-attachments", "audio");
+    let visible = 0;
+    audioParts.forEach((part) => {
+      if (!isSafeMediaSrc(part.audio)) return;
+      const audioElement = createElement("audio");
+      audioElement.controls = true;
+      audioElement.preload = "metadata";
+      audioElement.src = part.audio;
+      audioElement.style.display = "block";
+      audioElement.style.width = "100%";
+      audioElement.style.maxWidth = `${MESSAGE_IMAGE_PREVIEW_MAX_WIDTH_PX}px`;
+      container.appendChild(audioElement);
+      visible += 1;
+    });
+    if (visible === 0) {
+      container.remove();
+      return null;
+    }
+    return container;
+  } catch {
+    return null;
+  }
+};
+var createMessageVideoPreviews = (videoParts) => {
+  if (videoParts.length === 0) return null;
+  try {
+    const container = createElement(
+      "div",
+      "persona-flex persona-flex-col persona-gap-2"
+    );
+    container.setAttribute("data-message-attachments", "video");
+    let visible = 0;
+    videoParts.forEach((part) => {
+      if (!isSafeMediaSrc(part.video)) return;
+      const videoElement = createElement("video");
+      videoElement.controls = true;
+      videoElement.preload = "metadata";
+      videoElement.src = part.video;
+      videoElement.style.display = "block";
+      videoElement.style.width = "100%";
+      videoElement.style.maxWidth = `${MESSAGE_IMAGE_PREVIEW_MAX_WIDTH_PX}px`;
+      videoElement.style.maxHeight = `${MESSAGE_IMAGE_PREVIEW_MAX_HEIGHT_PX}px`;
+      videoElement.style.borderRadius = "10px";
+      videoElement.style.backgroundColor = "var(--persona-attachment-image-bg, var(--persona-container, #f3f4f6))";
+      container.appendChild(videoElement);
+      visible += 1;
+    });
+    if (visible === 0) {
+      container.remove();
+      return null;
+    }
+    return container;
+  } catch {
+    return null;
+  }
+};
+var createMessageFilePreviews = (fileParts) => {
+  if (fileParts.length === 0) return null;
+  try {
+    const container = createElement(
+      "div",
+      "persona-flex persona-flex-col persona-gap-2"
+    );
+    container.setAttribute("data-message-attachments", "files");
+    let visible = 0;
+    fileParts.forEach((part) => {
+      if (!isSafeMediaSrc(part.data)) return;
+      const link = createElement("a");
+      link.href = part.data;
+      link.download = part.filename;
+      link.target = "_blank";
+      link.rel = "noopener noreferrer";
+      link.textContent = part.filename;
+      link.className = "persona-message-file-attachment";
+      link.style.display = "inline-flex";
+      link.style.alignItems = "center";
+      link.style.gap = "6px";
+      link.style.padding = "6px 10px";
+      link.style.borderRadius = "8px";
+      link.style.fontSize = "0.875rem";
+      link.style.textDecoration = "underline";
+      link.style.backgroundColor = "var(--persona-attachment-file-bg, var(--persona-container, #f3f4f6))";
+      link.style.border = "1px solid var(--persona-attachment-file-border, var(--persona-border, #e5e7eb))";
+      link.style.color = "inherit";
+      container.appendChild(link);
+      visible += 1;
+    });
+    if (visible === 0) {
+      container.remove();
+      return null;
+    }
+    return container;
+  } catch {
+    return null;
+  }
+};
 var createTypingIndicator = () => {
   const container = document.createElement("div");
   container.className = "persona-flex persona-items-center persona-space-x-1 persona-h-5 persona-mt-2";
@@ -11533,6 +11800,27 @@ var createStandardBubble = (message, transform, layoutConfig, actionsConfig, act
       textContentDiv.style.display = "";
     }
   }
+  const audioParts = getMessageAudioParts(message);
+  if (audioParts.length > 0) {
+    const audioPreviews = createMessageAudioPreviews(audioParts);
+    if (audioPreviews) {
+      bubble.appendChild(audioPreviews);
+    }
+  }
+  const videoParts = getMessageVideoParts(message);
+  if (videoParts.length > 0) {
+    const videoPreviews = createMessageVideoPreviews(videoParts);
+    if (videoPreviews) {
+      bubble.appendChild(videoPreviews);
+    }
+  }
+  const fileParts = getMessageFileParts(message);
+  if (fileParts.length > 0) {
+    const filePreviews = createMessageFilePreviews(fileParts);
+    if (filePreviews) {
+      bubble.appendChild(filePreviews);
+    }
+  }
   bubble.appendChild(contentDiv);
   if (showTimestamp && timestampPosition === "below" && message.createdAt) {
     const timestamp = createTimestamp(message, timestampConfig);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@runtypelabs/persona",
-  "version": "3.20.0",
+  "version": "3.21.1",
   "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",