@runtypelabs/persona 3.9.2 → 3.10.1

package/dist/theme-editor.cjs

@@ -73,20 +73,24 @@ __export(theme_editor_exports, {
   ThemeEditorState: () => ThemeEditorState,
   ZOOM_MAX: () => ZOOM_MAX,
   ZOOM_MIN: () => ZOOM_MIN,
+  appendPreviewTranscriptEntry: () => appendPreviewTranscriptEntry,
   applySceneConfig: () => applySceneConfig,
   applyShellTheme: () => applyShellTheme,
   buildPreviewConfig: () => buildPreviewConfig,
+  buildPreviewConfigWithMessages: () => buildPreviewConfigWithMessages,
   buildShellCss: () => buildShellCss,
   buildSrcdoc: () => buildSrcdoc,
   convertFromPx: () => convertFromPx,
   convertToPx: () => convertToPx,
   createPreviewMessages: () => createPreviewMessages,
+  createPreviewTranscriptEntry: () => createPreviewTranscriptEntry,
   createThemePreview: () => createThemePreview,
   detectRoleAssignment: () => detectRoleAssignment,
   escapeHtml: () => escapeHtml2,
   findSection: () => findSection,
   formatCssValue: () => formatCssValue,
   generateColorScale: () => generateColorScale,
+  getPreviewTranscriptPresetLabel: () => getPreviewTranscriptPresetLabel,
   getShellPalette: () => getShellPalette,
   getThemeEditorPreset: () => getThemeEditorPreset,
   hexToHsl: () => hexToHsl,
@@ -223,6 +227,18 @@ var DEFAULT_WIDGET_CONFIG = {
       enabled: true,
       iconName: "arrow-down",
       label: ""
+    },
+    toolCallDisplay: {
+      collapsedMode: "tool-call",
+      activePreview: false,
+      grouped: false,
+      previewMaxLines: 3,
+      expandable: true
+    },
+    reasoningDisplay: {
+      activePreview: false,
+      previewMaxLines: 3,
+      expandable: true
     }
   },
   suggestionChips: [
@@ -2702,6 +2718,16 @@ var debugSectionDef = {
   fields: [
     { id: "dev-reasoning", label: "Show Reasoning", description: "Display AI reasoning steps", type: "toggle", path: "features.showReasoning", defaultValue: false },
     { id: "dev-tool-calls", label: "Show Tool Calls", description: "Display tool call details", type: "toggle", path: "features.showToolCalls", defaultValue: false },
+    { id: "dev-tool-collapsed-mode", label: "Tool Call Summary", description: "Choose what collapsed tool rows show by default", type: "select", path: "features.toolCallDisplay.collapsedMode", defaultValue: "tool-call", options: [{ value: "tool-call", label: "Tool Call" }, { value: "tool-name", label: "Tool Name" }, { value: "tool-preview", label: "Tool Preview" }] },
+    { id: "dev-tool-active-preview", label: "Tool Preview While Active", description: "Show a lightweight preview in collapsed active tool rows", type: "toggle", path: "features.toolCallDisplay.activePreview", defaultValue: false },
+    { id: "dev-tool-preview-lines", label: "Tool Preview Lines", type: "select", path: "features.toolCallDisplay.previewMaxLines", defaultValue: 3, options: [{ value: "1", label: "1" }, { value: "2", label: "2" }, { value: "3", label: "3" }, { value: "4", label: "4" }, { value: "5", label: "5" }], formatValue: (v) => String(v != null ? v : 3), parseValue: (v) => Number(v) },
+    { id: "dev-tool-active-min-height", label: "Tool Active Min Height", description: "CSS min-height for collapsed active tool rows (e.g. 5rem)", type: "text", path: "features.toolCallDisplay.activeMinHeight", defaultValue: "" },
+    { id: "dev-tool-expandable", label: "Tool Calls Expandable", description: "Allow expanding tool call rows to see full details", type: "toggle", path: "features.toolCallDisplay.expandable", defaultValue: true },
+    { id: "dev-tool-grouped", label: "Group Sequential Tool Calls", description: "Render consecutive tool rows inside a grouped container", type: "toggle", path: "features.toolCallDisplay.grouped", defaultValue: false },
+    { id: "dev-reasoning-expandable", label: "Reasoning Expandable", description: "Allow expanding reasoning rows to see full details", type: "toggle", path: "features.reasoningDisplay.expandable", defaultValue: true },
+    { id: "dev-reasoning-active-preview", label: "Reasoning Preview While Active", description: "Show a lightweight preview in collapsed active reasoning rows", type: "toggle", path: "features.reasoningDisplay.activePreview", defaultValue: false },
+    { id: "dev-reasoning-preview-lines", label: "Reasoning Preview Lines", type: "select", path: "features.reasoningDisplay.previewMaxLines", defaultValue: 3, options: [{ value: "1", label: "1" }, { value: "2", label: "2" }, { value: "3", label: "3" }, { value: "4", label: "4" }, { value: "5", label: "5" }], formatValue: (v) => String(v != null ? v : 3), parseValue: (v) => Number(v) },
+    { id: "dev-reasoning-active-min-height", label: "Reasoning Active Min Height", description: "CSS min-height for collapsed active reasoning rows (e.g. 5rem)", type: "text", path: "features.reasoningDisplay.activeMinHeight", defaultValue: "" },
     { id: "dev-debug", label: "Debug Mode", description: "Show debug information", type: "toggle", path: "debug", defaultValue: false }
   ]
 };
@@ -3501,6 +3527,24 @@ function getParserFromType(parserType) {
       return createPlainTextParser;
   }
 }
+var looksStructured = (value) => value.startsWith("{") || value.startsWith("[") || value.startsWith("<");
+function preferFinalStructuredContent(rawBuffer, finalString) {
+  if (!rawBuffer) return finalString;
+  const rawTrimmed = rawBuffer.trim();
+  const finalTrimmed = finalString.trim();
+  if (rawTrimmed.length === 0) return finalString;
+  if (finalTrimmed.length === 0) return rawBuffer;
+  const rawLooksStructured = looksStructured(rawTrimmed);
+  const finalLooksStructured = looksStructured(finalTrimmed);
+  if (!finalLooksStructured) return rawBuffer;
+  if (!rawLooksStructured) return finalString;
+  if (finalTrimmed === rawTrimmed) return finalString;
+  if (finalTrimmed.startsWith(rawTrimmed)) return finalString;
+  const rawJsonText = extractTextFromJson(rawBuffer);
+  const finalJsonText = extractTextFromJson(finalString);
+  if (finalJsonText !== null && rawJsonText === null) return finalString;
+  return rawBuffer;
+}
 var AgentWidgetClient = class {
   constructor(config = {}) {
     this.config = config;
@@ -4219,7 +4263,7 @@ var AgentWidgetClient = class {
     }
   }
   async streamResponse(body, onEvent, assistantMessageId) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga, _Ha, _Ia, _Ja, _Ka, _La, _Ma, _Na, _Oa, _Pa, _Qa, _Ra, _Sa, _Ta, _Ua, _Va, _Wa, _Xa, _Ya, _Za, __a, _$a, _ab, _bb, _cb, _db, _eb, _fb, _gb, _hb, _ib, _jb, _kb;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga, _Ha, _Ia, _Ja, _Ka, _La, _Ma, _Na, _Oa, _Pa, _Qa, _Ra, _Sa, _Ta, _Ua, _Va, _Wa, _Xa, _Ya, _Za, __a, _$a, _ab, _bb, _cb, _db, _eb, _fb, _gb, _hb, _ib, _jb, _kb, _lb;
     const reader = body.getReader();
     const decoder = new TextDecoder();
     let buffer = "";
@@ -4459,6 +4503,92 @@ var AgentWidgetClient = class {
     };
     const streamParsers = /* @__PURE__ */ new Map();
     const rawContentBuffers = /* @__PURE__ */ new Map();
+    const seqChunkBuffers = /* @__PURE__ */ new Map();
+    const reasonSeqBuffers = /* @__PURE__ */ new Map();
+    function insertSeqChunk(bufferMap, key, seq, text) {
+      let buf = bufferMap.get(key);
+      if (!buf) {
+        buf = [];
+        bufferMap.set(key, buf);
+      }
+      let lo = 0, hi = buf.length;
+      while (lo < hi) {
+        const mid = lo + hi >>> 1;
+        if (buf[mid].seq < seq) lo = mid + 1;
+        else hi = mid;
+      }
+      buf.splice(lo, 0, { seq, text });
+      let result = "";
+      for (let i = 0; i < buf.length; i++) result += buf[i].text;
+      return result;
+    }
+    let lastSealedTextSegment = null;
+    const reconcileSealedAssistantWithFinalResponse = (msg, finalContent) => {
+      const finalString = ensureStringContent(finalContent);
+      const rawBuffer = rawContentBuffers.get(msg.id);
+      const contentToProcess = preferFinalStructuredContent(rawBuffer, finalString);
+      msg.rawContent = contentToProcess;
+      const parser = streamParsers.get(msg.id);
+      const mergeIfBetter = (mergedDisplay) => {
+        var _a2;
+        const cur = (_a2 = msg.content) != null ? _a2 : "";
+        if (mergedDisplay.trim() === "") return;
+        if (cur.trim().length === 0 || mergedDisplay.startsWith(cur) || mergedDisplay.trimStart().startsWith(cur.trim())) {
+          msg.content = mergedDisplay;
+        }
+      };
+      const finalizeCleanup = () => {
+        var _a2;
+        if (parser) {
+          const closeResult = (_a2 = parser.close) == null ? void 0 : _a2.call(parser);
+          if (closeResult instanceof Promise) closeResult.catch(() => {
+          });
+        }
+        streamParsers.delete(msg.id);
+        rawContentBuffers.delete(msg.id);
+        msg.streaming = false;
+        emitMessage(msg);
+      };
+      if (!parser) {
+        mergeIfBetter(finalString);
+        finalizeCleanup();
+        return;
+      }
+      const extractedFromJson = extractTextFromJson(contentToProcess);
+      if (extractedFromJson !== null && extractedFromJson.trim() !== "") {
+        mergeIfBetter(extractedFromJson);
+        finalizeCleanup();
+        return;
+      }
+      const bestDisplayText = (result) => {
+        var _a2;
+        const text = typeof result === "string" ? result : (_a2 = result == null ? void 0 : result.text) != null ? _a2 : null;
+        if (text !== null && text.trim() !== "") return text;
+        const extracted = parser.getExtractedText();
+        if (extracted !== null && extracted.trim() !== "") return extracted;
+        return finalString;
+      };
+      let parsedResult;
+      try {
+        parsedResult = parser.processChunk(contentToProcess);
+      } catch {
+        mergeIfBetter(finalString);
+        finalizeCleanup();
+        return;
+      }
+      if (parsedResult instanceof Promise) {
+        parsedResult.then((result) => {
+          mergeIfBetter(bestDisplayText(result));
+          finalizeCleanup();
+        }).catch(() => {
+          mergeIfBetter(finalString);
+          finalizeCleanup();
+        });
+        return;
+      }
+      mergeIfBetter(bestDisplayText(parsedResult));
+      finalizeCleanup();
+    };
     let agentExecution = null;
     const agentIterationMessages = /* @__PURE__ */ new Map();
     const iterationDisplay = (_a = this.config.iterationDisplay) != null ? _a : "separate";
@@ -4532,7 +4662,13 @@ var AgentWidgetClient = class {
           reasoningMessage.reasoning.startedAt = (_m = reasoningMessage.reasoning.startedAt) != null ? _m : resolveTimestamp((_l = payload.startedAt) != null ? _l : payload.timestamp);
           const chunk = (_p = (_o = (_n = payload.reasoningText) != null ? _n : payload.text) != null ? _o : payload.delta) != null ? _p : "";
           if (chunk && payload.hidden !== true) {
-            reasoningMessage.reasoning.chunks.push(String(chunk));
+            const reasonSeq = typeof payload.sequenceIndex === "number" ? payload.sequenceIndex : void 0;
+            if (reasonSeq !== void 0) {
+              const ordered = insertSeqChunk(reasonSeqBuffers, reasoningId, reasonSeq, String(chunk));
+              reasoningMessage.reasoning.chunks = [ordered];
+            } else {
+              reasoningMessage.reasoning.chunks.push(String(chunk));
+            }
           }
           reasoningMessage.reasoning.status = payload.done ? "complete" : "streaming";
           if (payload.done) {
@@ -4544,6 +4680,7 @@ var AgentWidgetClient = class {
               0,
               ((_s = reasoningMessage.reasoning.completedAt) != null ? _s : Date.now()) - start
             );
+            reasonSeqBuffers.delete(reasoningId);
           }
           reasoningMessage.streaming = reasoningMessage.reasoning.status !== "complete";
           emitMessage(reasoningMessage);
@@ -4561,6 +4698,7 @@ var AgentWidgetClient = class {
               ((_x = reasoningMessage.reasoning.completedAt) != null ? _x : Date.now()) - start
             );
             reasoningMessage.streaming = false;
+            reasonSeqBuffers.delete(reasoningId);
             emitMessage(reasoningMessage);
           }
           const stepKey = getStepKey(payload);
@@ -4676,6 +4814,7 @@ var AgentWidgetClient = class {
             if (prev) {
               prev.streaming = false;
               emitMessage(prev);
+              lastSealedTextSegment = prev;
               assistantMessage = null;
               didSplitByPartId = true;
             }
@@ -4688,6 +4827,7 @@ var AgentWidgetClient = class {
           if (prev) {
             prev.streaming = false;
             emitMessage(prev);
+            lastSealedTextSegment = prev;
             assistantMessage = null;
             didSplitByPartId = true;
           }
@@ -4703,6 +4843,7 @@ var AgentWidgetClient = class {
             if (prev) {
               prev.streaming = false;
               emitMessage(prev);
+              lastSealedTextSegment = prev;
               assistantMessage = null;
               didSplitByPartId = true;
             }
@@ -4716,8 +4857,14 @@ var AgentWidgetClient = class {
           }
           const chunk = (_ca = (_ba = (_aa = (_$ = payload.text) != null ? _$ : payload.delta) != null ? _aa : payload.content) != null ? _ba : payload.chunk) != null ? _ca : "";
           if (chunk) {
-            const rawBuffer = (_da = rawContentBuffers.get(assistant.id)) != null ? _da : "";
-            const accumulatedRaw = rawBuffer + chunk;
+            const chunkSeq = typeof payload.seq === "number" ? payload.seq : void 0;
+            let accumulatedRaw;
+            if (chunkSeq !== void 0) {
+              accumulatedRaw = insertSeqChunk(seqChunkBuffers, assistant.id, chunkSeq, chunk);
+            } else {
+              const rawBuffer = (_da = rawContentBuffers.get(assistant.id)) != null ? _da : "";
+              accumulatedRaw = rawBuffer + chunk;
+            }
             assistant.rawContent = accumulatedRaw;
             if (!streamParsers.has(assistant.id)) {
               streamParsers.set(assistant.id, this.createStreamParser());
@@ -4729,7 +4876,11 @@ var AgentWidgetClient = class {
             }
             const isPlainTextParser = parser.__isPlainTextParser === true;
             if (isPlainTextParser) {
-              assistant.content += chunk;
+              if (chunkSeq !== void 0) {
+                assistant.content = accumulatedRaw;
+              } else {
+                assistant.content += chunk;
+              }
               rawContentBuffers.delete(assistant.id);
               streamParsers.delete(assistant.id);
               assistant.rawContent = void 0;
@@ -4742,15 +4893,16 @@ var AgentWidgetClient = class {
                 var _a2;
                 const text = typeof result === "string" ? result : (_a2 = result == null ? void 0 : result.text) != null ? _a2 : null;
                 if (text !== null && text.trim() !== "") {
-                  const currentAssistant = assistantMessage;
-                  if (currentAssistant && currentAssistant.id === assistant.id) {
-                    currentAssistant.content = text;
-                    emitMessage(currentAssistant);
-                  }
+                  assistant.content = text;
+                  emitMessage(assistant);
                 } else if (!looksLikeJson && !accumulatedRaw.trim().startsWith("<")) {
                   const currentAssistant = assistantMessage;
                   if (currentAssistant && currentAssistant.id === assistant.id) {
-                    currentAssistant.content += chunk;
+                    if (chunkSeq !== void 0) {
+                      currentAssistant.content = accumulatedRaw;
+                    } else {
+                      currentAssistant.content += chunk;
+                    }
                     rawContentBuffers.delete(currentAssistant.id);
                     streamParsers.delete(currentAssistant.id);
                     currentAssistant.rawContent = void 0;
@@ -4758,7 +4910,11 @@ var AgentWidgetClient = class {
                   }
                 }
               }).catch(() => {
-                assistant.content += chunk;
+                if (chunkSeq !== void 0) {
+                  assistant.content = accumulatedRaw;
+                } else {
+                  assistant.content += chunk;
+                }
                 rawContentBuffers.delete(assistant.id);
                 streamParsers.delete(assistant.id);
                 assistant.rawContent = void 0;
@@ -4770,7 +4926,11 @@ var AgentWidgetClient = class {
                 assistant.content = text;
                 emitMessage(assistant);
               } else if (!looksLikeJson && !accumulatedRaw.trim().startsWith("<")) {
-                assistant.content += chunk;
+                if (chunkSeq !== void 0) {
+                  assistant.content = accumulatedRaw;
+                } else {
+                  assistant.content += chunk;
+                }
                 rawContentBuffers.delete(assistant.id);
                 streamParsers.delete(assistant.id);
                 assistant.rawContent = void 0;
@@ -4806,6 +4966,7 @@ var AgentWidgetClient = class {
                           currentAssistant.streaming = false;
                           streamParsers.delete(currentAssistant.id);
                           rawContentBuffers.delete(currentAssistant.id);
+                          seqChunkBuffers.delete(currentAssistant.id);
                           emitMessage(currentAssistant);
                         }
                       }
@@ -4831,6 +4992,7 @@ var AgentWidgetClient = class {
                   streamParsers.delete(assistant.id);
                 }
                 rawContentBuffers.delete(assistant.id);
+                seqChunkBuffers.delete(assistant.id);
                 assistant.streaming = false;
                 emitMessage(assistant);
               }
@@ -4847,14 +5009,26 @@ var AgentWidgetClient = class {
               const msg = assistantMessage;
               streamParsers.delete(msg.id);
               rawContentBuffers.delete(msg.id);
+              seqChunkBuffers.delete(msg.id);
               if (msg.streaming !== false) {
                 msg.streaming = false;
                 emitMessage(msg);
               }
             }
+            const splitFinalContent = (_ja = payload.result) == null ? void 0 : _ja.response;
+            const sealedForReconcile = lastSealedTextSegment;
+            if (sealedForReconcile) {
+              if (splitFinalContent !== void 0 && splitFinalContent !== null) {
+                reconcileSealedAssistantWithFinalResponse(sealedForReconcile, splitFinalContent);
+              } else {
+                streamParsers.delete(sealedForReconcile.id);
+                rawContentBuffers.delete(sealedForReconcile.id);
+              }
+            }
+            lastSealedTextSegment = null;
             continue;
           }
-          const finalContent = (_ja = payload.result) == null ? void 0 : _ja.response;
+          const finalContent = (_ka = payload.result) == null ? void 0 : _ka.response;
           const assistant = ensureAssistantMessage();
           if (finalContent !== void 0 && finalContent !== null) {
             const parser = streamParsers.get(assistant.id);
@@ -4887,6 +5061,7 @@ var AgentWidgetClient = class {
                           currentAssistant.streaming = false;
                           streamParsers.delete(currentAssistant.id);
                           rawContentBuffers.delete(currentAssistant.id);
+                          seqChunkBuffers.delete(currentAssistant.id);
                           emitMessage(currentAssistant);
                         }
                       } else {
@@ -4901,12 +5076,13 @@ var AgentWidgetClient = class {
                           currentAssistant.streaming = false;
                           streamParsers.delete(currentAssistant.id);
                           rawContentBuffers.delete(currentAssistant.id);
+                          seqChunkBuffers.delete(currentAssistant.id);
                           emitMessage(currentAssistant);
                         }
                       }
                     });
                   } else {
-                    const text = typeof parsedResult === "string" ? parsedResult : (_ka = parsedResult == null ? void 0 : parsedResult.text) != null ? _ka : null;
+                    const text = typeof parsedResult === "string" ? parsedResult : (_la = parsedResult == null ? void 0 : parsedResult.text) != null ? _la : null;
                     if (text !== null && text.trim() !== "") {
                       assistant.content = text;
                       hasExtractedText = true;
@@ -4930,7 +5106,7 @@ var AgentWidgetClient = class {
                 assistant.content = ensureStringContent(finalContent);
               }
               if (parser) {
-                const closeResult = (_la = parser.close) == null ? void 0 : _la.call(parser);
+                const closeResult = (_ma = parser.close) == null ? void 0 : _ma.call(parser);
                 if (closeResult instanceof Promise) {
                   closeResult.catch(() => {
                   });
@@ -4938,22 +5114,25 @@ var AgentWidgetClient = class {
               }
               streamParsers.delete(assistant.id);
               rawContentBuffers.delete(assistant.id);
+              seqChunkBuffers.delete(assistant.id);
               assistant.streaming = false;
               emitMessage(assistant);
             }
           } else {
             streamParsers.delete(assistant.id);
             rawContentBuffers.delete(assistant.id);
+            seqChunkBuffers.delete(assistant.id);
             assistant.streaming = false;
             emitMessage(assistant);
           }
         } else if (payloadType === "flow_complete") {
-          const finalContent = (_ma = payload.result) == null ? void 0 : _ma.response;
+          const finalContent = (_na = payload.result) == null ? void 0 : _na.response;
           if (didSplitByPartId) {
             if (assistantMessage !== null) {
               const msg = assistantMessage;
               streamParsers.delete(msg.id);
               rawContentBuffers.delete(msg.id);
+              seqChunkBuffers.delete(msg.id);
               if (msg.streaming !== false) {
                 msg.streaming = false;
                 emitMessage(msg);
@@ -4977,12 +5156,9 @@ var AgentWidgetClient = class {
                     var _a2;
                     const text = typeof result === "string" ? result : (_a2 = result == null ? void 0 : result.text) != null ? _a2 : null;
                     if (text !== null) {
-                      const currentAssistant = assistantMessage;
-                      if (currentAssistant && currentAssistant.id === assistant.id) {
-                        currentAssistant.content = text;
-                        currentAssistant.streaming = false;
-                        emitMessage(currentAssistant);
-                      }
+                      assistant.content = text;
+                      assistant.streaming = false;
+                      emitMessage(assistant);
                     }
                   });
                 }
@@ -4994,6 +5170,7 @@ var AgentWidgetClient = class {
             }
             streamParsers.delete(assistant.id);
             rawContentBuffers.delete(assistant.id);
+            seqChunkBuffers.delete(assistant.id);
             const contentChanged = displayContent !== assistant.content;
             const streamingChanged = assistant.streaming !== false;
             if (contentChanged) {
@@ -5008,6 +5185,7 @@ var AgentWidgetClient = class {
               const msg = assistantMessage;
               streamParsers.delete(msg.id);
               rawContentBuffers.delete(msg.id);
+              seqChunkBuffers.delete(msg.id);
               if (msg.streaming !== false) {
                 msg.streaming = false;
                 emitMessage(msg);
@@ -5018,11 +5196,11 @@ var AgentWidgetClient = class {
         } else if (payloadType === "agent_start") {
           agentExecution = {
             executionId: payload.executionId,
-            agentId: (_na = payload.agentId) != null ? _na : "virtual",
-            agentName: (_oa = payload.agentName) != null ? _oa : "",
+            agentId: (_oa = payload.agentId) != null ? _oa : "virtual",
+            agentName: (_pa = payload.agentName) != null ? _pa : "",
             status: "running",
             currentIteration: 0,
-            maxTurns: (_pa = payload.maxTurns) != null ? _pa : 1,
+            maxTurns: (_qa = payload.maxTurns) != null ? _qa : 1,
             startedAt: resolveTimestamp(payload.startedAt)
           };
         } else if (payloadType === "agent_iteration_start") {
@@ -5042,7 +5220,7 @@ var AgentWidgetClient = class {
         } else if (payloadType === "agent_turn_delta") {
           if (payload.contentType === "text") {
             const assistant = ensureAssistantMessage();
-            assistant.content += (_qa = payload.delta) != null ? _qa : "";
+            assistant.content += (_ra = payload.delta) != null ? _ra : "";
             assistant.agentMetadata = {
               executionId: payload.executionId,
               iteration: payload.iteration,
@@ -5051,14 +5229,14 @@ var AgentWidgetClient = class {
             };
             emitMessage(assistant);
           } else if (payload.contentType === "thinking") {
-            const reasoningId = (_ra = payload.turnId) != null ? _ra : `agent-think-${payload.iteration}`;
+            const reasoningId = (_sa = payload.turnId) != null ? _sa : `agent-think-${payload.iteration}`;
             const reasoningMessage = ensureReasoningMessage(reasoningId);
-            reasoningMessage.reasoning = (_sa = reasoningMessage.reasoning) != null ? _sa : {
+            reasoningMessage.reasoning = (_ta = reasoningMessage.reasoning) != null ? _ta : {
               id: reasoningId,
               status: "streaming",
               chunks: []
             };
-            reasoningMessage.reasoning.chunks.push((_ta = payload.delta) != null ? _ta : "");
+            reasoningMessage.reasoning.chunks.push((_ua = payload.delta) != null ? _ua : "");
             reasoningMessage.agentMetadata = {
               executionId: payload.executionId,
               iteration: payload.iteration,
@@ -5066,12 +5244,12 @@ var AgentWidgetClient = class {
             };
             emitMessage(reasoningMessage);
           } else if (payload.contentType === "tool_input") {
-            const toolId = (_ua = payload.toolCallId) != null ? _ua : toolContext.lastId;
+            const toolId = (_va = payload.toolCallId) != null ? _va : toolContext.lastId;
             if (toolId) {
               const toolMessage = toolMessages.get(toolId);
               if (toolMessage == null ? void 0 : toolMessage.toolCall) {
-                toolMessage.toolCall.chunks = (_va = toolMessage.toolCall.chunks) != null ? _va : [];
-                toolMessage.toolCall.chunks.push((_wa = payload.delta) != null ? _wa : "");
+                toolMessage.toolCall.chunks = (_wa = toolMessage.toolCall.chunks) != null ? _wa : [];
+                toolMessage.toolCall.chunks.push((_xa = payload.delta) != null ? _xa : "");
                 emitMessage(toolMessage);
               }
             }
@@ -5083,20 +5261,20 @@ var AgentWidgetClient = class {
             if (reasoningMessage == null ? void 0 : reasoningMessage.reasoning) {
               reasoningMessage.reasoning.status = "complete";
               reasoningMessage.reasoning.completedAt = resolveTimestamp(payload.completedAt);
-              const start = (_xa = reasoningMessage.reasoning.startedAt) != null ? _xa : Date.now();
+              const start = (_ya = reasoningMessage.reasoning.startedAt) != null ? _ya : Date.now();
               reasoningMessage.reasoning.durationMs = Math.max(
                 0,
-                ((_ya = reasoningMessage.reasoning.completedAt) != null ? _ya : Date.now()) - start
+                ((_za = reasoningMessage.reasoning.completedAt) != null ? _za : Date.now()) - start
               );
               reasoningMessage.streaming = false;
               emitMessage(reasoningMessage);
             }
           }
         } else if (payloadType === "agent_tool_start") {
-          const toolId = (_za = payload.toolCallId) != null ? _za : `agent-tool-${nextSequence()}`;
+          const toolId = (_Aa = payload.toolCallId) != null ? _Aa : `agent-tool-${nextSequence()}`;
           trackToolId(getToolCallKey(payload), toolId);
           const toolMessage = ensureToolMessage(toolId);
-          const tool = (_Aa = toolMessage.toolCall) != null ? _Aa : {
+          const tool = (_Ba = toolMessage.toolCall) != null ? _Ba : {
             id: toolId,
             status: "pending",
             name: void 0,
@@ -5108,12 +5286,12 @@ var AgentWidgetClient = class {
             completedAt: void 0,
             durationMs: void 0
           };
-          tool.name = (_Ca = (_Ba = payload.toolName) != null ? _Ba : payload.name) != null ? _Ca : tool.name;
+          tool.name = (_Da = (_Ca = payload.toolName) != null ? _Ca : payload.name) != null ? _Da : tool.name;
           tool.status = "running";
           if (payload.parameters !== void 0) {
             tool.args = payload.parameters;
           }
-          tool.startedAt = resolveTimestamp((_Da = payload.startedAt) != null ? _Da : payload.timestamp);
+          tool.startedAt = resolveTimestamp((_Ea = payload.startedAt) != null ? _Ea : payload.timestamp);
           toolMessage.toolCall = tool;
           toolMessage.streaming = true;
           toolMessage.agentMetadata = {
@@ -5122,21 +5300,21 @@ var AgentWidgetClient = class {
           };
           emitMessage(toolMessage);
         } else if (payloadType === "agent_tool_delta") {
-          const toolId = (_Ea = payload.toolCallId) != null ? _Ea : toolContext.lastId;
+          const toolId = (_Fa = payload.toolCallId) != null ? _Fa : toolContext.lastId;
           if (toolId) {
-            const toolMessage = (_Fa = toolMessages.get(toolId)) != null ? _Fa : ensureToolMessage(toolId);
+            const toolMessage = (_Ga = toolMessages.get(toolId)) != null ? _Ga : ensureToolMessage(toolId);
             if (toolMessage.toolCall) {
-              toolMessage.toolCall.chunks = (_Ga = toolMessage.toolCall.chunks) != null ? _Ga : [];
-              toolMessage.toolCall.chunks.push((_Ha = payload.delta) != null ? _Ha : "");
+              toolMessage.toolCall.chunks = (_Ha = toolMessage.toolCall.chunks) != null ? _Ha : [];
+              toolMessage.toolCall.chunks.push((_Ia = payload.delta) != null ? _Ia : "");
               toolMessage.toolCall.status = "running";
               toolMessage.streaming = true;
               emitMessage(toolMessage);
             }
           }
         } else if (payloadType === "agent_tool_complete") {
-          const toolId = (_Ia = payload.toolCallId) != null ? _Ia : toolContext.lastId;
+          const toolId = (_Ja = payload.toolCallId) != null ? _Ja : toolContext.lastId;
           if (toolId) {
-            const toolMessage = (_Ja = toolMessages.get(toolId)) != null ? _Ja : ensureToolMessage(toolId);
+            const toolMessage = (_Ka = toolMessages.get(toolId)) != null ? _Ka : ensureToolMessage(toolId);
             if (toolMessage.toolCall) {
               toolMessage.toolCall.status = "complete";
               if (payload.result !== void 0) {
@@ -5145,7 +5323,7 @@ var AgentWidgetClient = class {
               if (typeof payload.executionTime === "number") {
                 toolMessage.toolCall.durationMs = payload.executionTime;
               }
-              toolMessage.toolCall.completedAt = resolveTimestamp((_Ka = payload.completedAt) != null ? _Ka : payload.timestamp);
+              toolMessage.toolCall.completedAt = resolveTimestamp((_La = payload.completedAt) != null ? _La : payload.timestamp);
               toolMessage.streaming = false;
               emitMessage(toolMessage);
               const callKey = getToolCallKey(payload);
@@ -5160,7 +5338,7 @@ var AgentWidgetClient = class {
           const reflectionMessage = {
             id: reflectionId,
             role: "assistant",
-            content: (_La = payload.reflection) != null ? _La : "",
+            content: (_Ma = payload.reflection) != null ? _Ma : "",
             createdAt: (/* @__PURE__ */ new Date()).toISOString(),
             streaming: false,
             variant: "reasoning",
@@ -5168,7 +5346,7 @@ var AgentWidgetClient = class {
             reasoning: {
               id: reflectionId,
               status: "complete",
-              chunks: [(_Ma = payload.reflection) != null ? _Ma : ""]
+              chunks: [(_Na = payload.reflection) != null ? _Na : ""]
             },
             agentMetadata: {
               executionId: payload.executionId,
@@ -5189,7 +5367,7 @@ var AgentWidgetClient = class {
           }
           onEvent({ type: "status", status: "idle" });
         } else if (payloadType === "agent_error") {
-          const errorMessage = typeof payload.error === "string" ? payload.error : (_Oa = (_Na = payload.error) == null ? void 0 : _Na.message) != null ? _Oa : "Agent execution error";
+          const errorMessage = typeof payload.error === "string" ? payload.error : (_Pa = (_Oa = payload.error) == null ? void 0 : _Oa.message) != null ? _Pa : "Agent execution error";
           if (payload.recoverable) {
             if (typeof console !== "undefined") {
               console.warn("[AgentWidget] Recoverable agent error:", errorMessage);
@@ -5202,7 +5380,7 @@ var AgentWidgetClient = class {
           }
         } else if (payloadType === "agent_ping") {
         } else if (payloadType === "agent_approval_start") {
-          const approvalId = (_Pa = payload.approvalId) != null ? _Pa : `approval-${nextSequence()}`;
+          const approvalId = (_Qa = payload.approvalId) != null ? _Qa : `approval-${nextSequence()}`;
           const approvalMessage = {
             id: `approval-${approvalId}`,
             role: "assistant",
@@ -5214,17 +5392,17 @@ var AgentWidgetClient = class {
             approval: {
               id: approvalId,
               status: "pending",
-              agentId: (_Qa = agentExecution == null ? void 0 : agentExecution.agentId) != null ? _Qa : "virtual",
-              executionId: (_Sa = (_Ra = payload.executionId) != null ? _Ra : agentExecution == null ? void 0 : agentExecution.executionId) != null ? _Sa : "",
-              toolName: (_Ta = payload.toolName) != null ? _Ta : "",
+              agentId: (_Ra = agentExecution == null ? void 0 : agentExecution.agentId) != null ? _Ra : "virtual",
+              executionId: (_Ta = (_Sa = payload.executionId) != null ? _Sa : agentExecution == null ? void 0 : agentExecution.executionId) != null ? _Ta : "",
+              toolName: (_Ua = payload.toolName) != null ? _Ua : "",
               toolType: payload.toolType,
-              description: (_Va = payload.description) != null ? _Va : `Execute ${(_Ua = payload.toolName) != null ? _Ua : "tool"}`,
+              description: (_Wa = payload.description) != null ? _Wa : `Execute ${(_Va = payload.toolName) != null ? _Va : "tool"}`,
               parameters: payload.parameters
             }
           };
           emitMessage(approvalMessage);
         } else if (payloadType === "step_await" && payload.awaitReason === "approval_required") {
-          const approvalId = (_Wa = payload.approvalId) != null ? _Wa : `approval-${nextSequence()}`;
+          const approvalId = (_Xa = payload.approvalId) != null ? _Xa : `approval-${nextSequence()}`;
           const approvalMessage = {
             id: `approval-${approvalId}`,
             role: "assistant",
@@ -5236,11 +5414,11 @@ var AgentWidgetClient = class {
             approval: {
               id: approvalId,
               status: "pending",
-              agentId: (_Xa = agentExecution == null ? void 0 : agentExecution.agentId) != null ? _Xa : "virtual",
-              executionId: (_Za = (_Ya = payload.executionId) != null ? _Ya : agentExecution == null ? void 0 : agentExecution.executionId) != null ? _Za : "",
-              toolName: (__a = payload.toolName) != null ? __a : "",
+              agentId: (_Ya = agentExecution == null ? void 0 : agentExecution.agentId) != null ? _Ya : "virtual",
+              executionId: (__a = (_Za = payload.executionId) != null ? _Za : agentExecution == null ? void 0 : agentExecution.executionId) != null ? __a : "",
+              toolName: (_$a = payload.toolName) != null ? _$a : "",
               toolType: payload.toolType,
-              description: (_ab = payload.description) != null ? _ab : `Execute ${(_$a = payload.toolName) != null ? _$a : "tool"}`,
+              description: (_bb = payload.description) != null ? _bb : `Execute ${(_ab = payload.toolName) != null ? _ab : "tool"}`,
               parameters: payload.parameters
             }
           };
@@ -5259,11 +5437,11 @@ var AgentWidgetClient = class {
               sequence: nextSequence(),
               approval: {
                 id: approvalId,
-                status: (_bb = payload.decision) != null ? _bb : "approved",
-                agentId: (_cb = agentExecution == null ? void 0 : agentExecution.agentId) != null ? _cb : "virtual",
-                executionId: (_eb = (_db = payload.executionId) != null ? _db : agentExecution == null ? void 0 : agentExecution.executionId) != null ? _eb : "",
-                toolName: (_fb = payload.toolName) != null ? _fb : "",
-                description: (_gb = payload.description) != null ? _gb : "",
+                status: (_cb = payload.decision) != null ? _cb : "approved",
+                agentId: (_db = agentExecution == null ? void 0 : agentExecution.agentId) != null ? _db : "virtual",
+                executionId: (_fb = (_eb = payload.executionId) != null ? _eb : agentExecution == null ? void 0 : agentExecution.executionId) != null ? _fb : "",
+                toolName: (_gb = payload.toolName) != null ? _gb : "",
+                description: (_hb = payload.description) != null ? _hb : "",
                 resolvedAt: Date.now()
               }
             };
@@ -5301,7 +5479,7 @@ var AgentWidgetClient = class {
             }
           } else if (payloadType === "artifact_delta") {
             const deltaId = String(payload.id);
-            const deltaText = typeof payload.delta === "string" ? payload.delta : String((_hb = payload.delta) != null ? _hb : "");
+            const deltaText = typeof payload.delta === "string" ? payload.delta : String((_ib = payload.delta) != null ? _ib : "");
             onEvent({
               type: "artifact_delta",
               id: deltaId,
@@ -5324,7 +5502,7 @@ var AgentWidgetClient = class {
             if (refMsg) {
               refMsg.streaming = false;
               try {
-                const parsed = JSON.parse((_ib = refMsg.rawContent) != null ? _ib : "{}");
+                const parsed = JSON.parse((_jb = refMsg.rawContent) != null ? _jb : "{}");
                 if (parsed.props) {
                   parsed.props.status = "complete";
                   const acc = artifactContent.get(artCompleteId);
@@ -5345,7 +5523,7 @@ var AgentWidgetClient = class {
           if (!m || typeof m !== "object") {
             continue;
           }
-          const id = String((_jb = m.id) != null ? _jb : `msg-${nextSequence()}`);
+          const id = String((_kb = m.id) != null ? _kb : `msg-${nextSequence()}`);
           const roleRaw = m.role;
           const role = roleRaw === "user" ? "user" : roleRaw === "system" ? "system" : "assistant";
           const msg = {
@@ -5364,7 +5542,7 @@ var AgentWidgetClient = class {
           if (msg.rawContent) {
             try {
               const parsed = JSON.parse(msg.rawContent);
-              const refArtId = (_kb = parsed == null ? void 0 : parsed.props) == null ? void 0 : _kb.artifactId;
+              const refArtId = (_lb = parsed == null ? void 0 : parsed.props) == null ? void 0 : _lb.artifactId;
               if (typeof refArtId === "string") {
                 artifactIdsWithCards.add(refArtId);
               }
@@ -5375,6 +5553,7 @@ var AgentWidgetClient = class {
           assistantMessageRef.current = null;
           streamParsers.delete(id);
           rawContentBuffers.delete(id);
+          seqChunkBuffers.delete(id);
         } else if (payloadType === "error" && payload.error) {
           onEvent({
             type: "error",
@@ -7797,7 +7976,7 @@ var morphMessages = (container, newContent, options = {}) => {
 
 // src/utils/message-fingerprint.ts
 function computeMessageFingerprint(message, configVersion) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A;
   return [
     message.id,
     message.role,
@@ -7809,8 +7988,11 @@ function computeMessageFingerprint(message, configVersion) {
     (_i = (_h = message.llmContent) == null ? void 0 : _h.length) != null ? _i : 0,
     (_k = (_j = message.approval) == null ? void 0 : _j.status) != null ? _k : "",
     (_m = (_l = message.toolCall) == null ? void 0 : _l.status) != null ? _m : "",
-    (_p = (_o = (_n = message.reasoning) == null ? void 0 : _n.chunks) == null ? void 0 : _o.length) != null ? _p : 0,
-    (_r = (_q = message.contentParts) == null ? void 0 : _q.length) != null ? _r : 0,
+    (_p = (_o = (_n = message.toolCall) == null ? void 0 : _n.chunks) == null ? void 0 : _o.length) != null ? _p : 0,
+    (_t = (_s = (_r = (_q = message.toolCall) == null ? void 0 : _q.chunks) == null ? void 0 : _r[message.toolCall.chunks.length - 1]) == null ? void 0 : _s.slice(-32)) != null ? _t : "",
+    typeof ((_u = message.toolCall) == null ? void 0 : _u.args) === "string" ? message.toolCall.args.length : ((_v = message.toolCall) == null ? void 0 : _v.args) ? JSON.stringify(message.toolCall.args).length : 0,
+    (_y = (_x = (_w = message.reasoning) == null ? void 0 : _w.chunks) == null ? void 0 : _x.length) != null ? _y : 0,
+    (_A = (_z = message.contentParts) == null ? void 0 : _z.length) != null ? _A : 0,
     configVersion
   ].join("\0");
 }
@@ -9892,10 +10074,26 @@ var createStandardBubble = (message, transform, layoutConfig, actionsConfig, act
 
 // src/components/reasoning-bubble.ts
 var reasoningExpansionState = /* @__PURE__ */ new Set();
+var appendRenderedValue = (container, value) => {
+  if (value == null) return false;
+  if (typeof value === "string") {
+    container.textContent = value;
+    return true;
+  }
+  container.appendChild(value);
+  return true;
+};
+var getReasoningPreviewText = (message, maxLines) => {
+  var _a, _b;
+  const text = (_b = (_a = message.reasoning) == null ? void 0 : _a.chunks.join("").trim()) != null ? _b : "";
+  if (!text) return "";
+  return text.split(/\r?\n/).map((line) => line.trim()).filter(Boolean).slice(0, maxLines).join("\n");
+};
 var updateReasoningBubbleUI = (messageId, bubble) => {
   const expanded = reasoningExpansionState.has(messageId);
   const header = bubble.querySelector('button[data-expand-header="true"]');
   const content = bubble.querySelector(".persona-border-t");
+  const preview = bubble.querySelector('[data-persona-collapsed-preview="reasoning"]');
   if (!header || !content) return;
   header.setAttribute("aria-expanded", expanded ? "true" : "false");
   const headerMeta = header.querySelector(".persona-ml-auto");
@@ -9911,8 +10109,12 @@ var updateReasoningBubbleUI = (messageId, bubble) => {
     }
   }
   content.style.display = expanded ? "" : "none";
+  if (preview) {
+    preview.style.display = expanded ? "none" : preview.textContent || preview.childNodes.length ? "" : "none";
+  }
 };
-var createReasoningBubble = (message) => {
+var createReasoningBubble = (message, config) => {
+  var _a, _b, _c, _d, _e, _f, _g;
   const reasoning = message.reasoning;
   const bubble = createElement(
     "div",
@@ -9937,19 +10139,41 @@ var createReasoningBubble = (message) => {
   if (!reasoning) {
     return bubble;
   }
-  let expanded = reasoningExpansionState.has(message.id);
+  const reasoningDisplayConfig = (_b = (_a = config == null ? void 0 : config.features) == null ? void 0 : _a.reasoningDisplay) != null ? _b : {};
+  const expandable = reasoningDisplayConfig.expandable !== false;
+  let expanded = expandable && reasoningExpansionState.has(message.id);
+  const isActive = reasoning.status !== "complete";
+  const previewText = getReasoningPreviewText(message, (_c = reasoningDisplayConfig.previewMaxLines) != null ? _c : 3);
   const header = createElement(
     "button",
-    "persona-flex persona-w-full persona-items-center persona-justify-between persona-gap-3 persona-bg-transparent persona-px-4 persona-py-3 persona-text-left persona-cursor-pointer persona-border-none"
+    expandable ? "persona-flex persona-w-full persona-items-center persona-justify-between persona-gap-3 persona-bg-transparent persona-px-4 persona-py-3 persona-text-left persona-cursor-pointer persona-border-none" : "persona-flex persona-w-full persona-items-center persona-justify-between persona-gap-3 persona-bg-transparent persona-px-4 persona-py-3 persona-text-left persona-cursor-default persona-border-none"
   );
   header.type = "button";
-  header.setAttribute("aria-expanded", expanded ? "true" : "false");
-  header.setAttribute("data-expand-header", "true");
+  if (expandable) {
+    header.setAttribute("aria-expanded", expanded ? "true" : "false");
+    header.setAttribute("data-expand-header", "true");
+  }
   header.setAttribute("data-bubble-type", "reasoning");
   const headerContent = createElement("div", "persona-flex persona-flex-col persona-text-left");
   const title = createElement("span", "persona-text-xs persona-text-persona-primary");
-  title.textContent = "Thinking...";
-  headerContent.appendChild(title);
+  const defaultSummary = "Thinking...";
+  const customSummary = (_e = (_d = config == null ? void 0 : config.reasoning) == null ? void 0 : _d.renderCollapsedSummary) == null ? void 0 : _e.call(_d, {
+    message,
+    reasoning,
+    defaultSummary,
+    previewText,
+    isActive,
+    config: config != null ? config : {}
+  });
+  if (typeof customSummary === "string" && customSummary.trim()) {
+    title.textContent = customSummary;
+    headerContent.appendChild(title);
+  } else if (customSummary instanceof HTMLElement) {
+    headerContent.appendChild(customSummary);
+  } else {
+    title.textContent = defaultSummary;
+    headerContent.appendChild(title);
+  }
   const status = createElement("span", "persona-text-xs persona-text-persona-primary");
   status.textContent = describeReasonStatus(reasoning);
   headerContent.appendChild(status);
@@ -9958,17 +10182,49 @@ var createReasoningBubble = (message) => {
   } else {
     title.style.display = "";
   }
-  const toggleIcon = createElement("div", "persona-flex persona-items-center");
-  const iconColor = "currentColor";
-  const chevronIcon = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor, 2);
-  if (chevronIcon) {
-    toggleIcon.appendChild(chevronIcon);
+  let toggleIcon = null;
+  if (expandable) {
+    toggleIcon = createElement("div", "persona-flex persona-items-center");
+    const iconColor = "currentColor";
+    const chevronIcon = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor, 2);
+    if (chevronIcon) {
+      toggleIcon.appendChild(chevronIcon);
+    } else {
+      toggleIcon.textContent = expanded ? "Hide" : "Show";
+    }
+    const headerMeta = createElement("div", "persona-flex persona-items-center persona-ml-auto");
+    headerMeta.append(toggleIcon);
+    header.append(headerContent, headerMeta);
   } else {
-    toggleIcon.textContent = expanded ? "Hide" : "Show";
+    header.append(headerContent);
+  }
+  const collapsedPreview = createElement(
+    "div",
+    "persona-px-4 persona-py-3 persona-text-xs persona-leading-snug persona-text-persona-muted"
+  );
+  collapsedPreview.setAttribute("data-persona-collapsed-preview", "reasoning");
+  collapsedPreview.style.display = "none";
+  collapsedPreview.style.whiteSpace = "pre-wrap";
+  if (!expanded && isActive && reasoningDisplayConfig.activePreview && previewText) {
+    const renderedPreview = (_g = (_f = config == null ? void 0 : config.reasoning) == null ? void 0 : _f.renderCollapsedPreview) == null ? void 0 : _g.call(_f, {
+      message,
+      reasoning,
+      defaultPreview: previewText,
+      isActive,
+      config: config != null ? config : {}
+    });
+    if (!appendRenderedValue(collapsedPreview, renderedPreview)) {
+      collapsedPreview.textContent = previewText;
+    }
+    collapsedPreview.style.display = "";
+  }
+  if (!expanded && isActive && reasoningDisplayConfig.activeMinHeight) {
+    bubble.style.minHeight = reasoningDisplayConfig.activeMinHeight;
+  }
+  if (!expandable) {
+    bubble.append(header, collapsedPreview);
+    return bubble;
   }
-  const headerMeta = createElement("div", "persona-flex persona-items-center persona-ml-auto");
-  headerMeta.append(toggleIcon);
-  header.append(headerContent, headerMeta);
   const content = createElement(
     "div",
     "persona-border-t persona-border-gray-200 persona-bg-gray-50 persona-px-4 persona-py-3"
@@ -9983,29 +10239,74 @@ var createReasoningBubble = (message) => {
   content.appendChild(body);
   const applyExpansionState = () => {
     header.setAttribute("aria-expanded", expanded ? "true" : "false");
-    toggleIcon.innerHTML = "";
-    const iconColor2 = "currentColor";
-    const chevronIcon2 = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor2, 2);
-    if (chevronIcon2) {
-      toggleIcon.appendChild(chevronIcon2);
-    } else {
-      toggleIcon.textContent = expanded ? "Hide" : "Show";
+    if (toggleIcon) {
+      toggleIcon.innerHTML = "";
+      const iconColor = "currentColor";
+      const chevronIcon = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor, 2);
+      if (chevronIcon) {
+        toggleIcon.appendChild(chevronIcon);
+      } else {
+        toggleIcon.textContent = expanded ? "Hide" : "Show";
+      }
     }
     content.style.display = expanded ? "" : "none";
+    collapsedPreview.style.display = expanded ? "none" : collapsedPreview.textContent || collapsedPreview.childNodes.length ? "" : "none";
   };
   applyExpansionState();
-  bubble.append(header, content);
+  bubble.append(header, collapsedPreview, content);
   return bubble;
 };
 
 // src/components/tool-bubble.ts
 var toolExpansionState = /* @__PURE__ */ new Set();
+var appendRenderedValue2 = (container, value) => {
+  if (value == null) return false;
+  if (typeof value === "string") {
+    container.textContent = value;
+    return true;
+  }
+  container.appendChild(value);
+  return true;
+};
+var getToolPreviewText = (message, maxLines) => {
+  var _a;
+  const tool = message.toolCall;
+  if (!tool) return "";
+  const chunkText = ((_a = tool.chunks) != null ? _a : []).join("").trim();
+  if (chunkText) {
+    const lines = chunkText.split(/\r?\n/).map((line) => line.trim()).filter(Boolean).slice(-maxLines);
+    return lines.join("\n");
+  }
+  const argsText = formatUnknownValue(tool.args).trim();
+  if (!argsText) return "";
+  return argsText.split(/\r?\n/).map((line) => line.trim()).filter(Boolean).slice(0, maxLines).join("\n");
+};
+var getToolSummaryText = (message, config) => {
+  var _a, _b, _c, _d;
+  const tool = message.toolCall;
+  const toolDisplayConfig = (_a = config == null ? void 0 : config.features) == null ? void 0 : _a.toolCallDisplay;
+  const collapsedMode = (_b = toolDisplayConfig == null ? void 0 : toolDisplayConfig.collapsedMode) != null ? _b : "tool-call";
+  const previewText = getToolPreviewText(message, (_c = toolDisplayConfig == null ? void 0 : toolDisplayConfig.previewMaxLines) != null ? _c : 3);
+  const defaultSummary = tool ? describeToolTitle(tool) : "";
+  if (!tool) {
+    return { summary: defaultSummary, previewText, isActive: false };
+  }
+  const isActive = tool.status !== "complete";
+  let summary = defaultSummary;
+  if (collapsedMode === "tool-name") {
+    summary = ((_d = tool.name) == null ? void 0 : _d.trim()) || defaultSummary;
+  } else if (collapsedMode === "tool-preview" && previewText) {
+    summary = previewText;
+  }
+  return { summary, previewText, isActive };
+};
 var updateToolBubbleUI = (messageId, bubble, config) => {
   var _a;
   const expanded = toolExpansionState.has(messageId);
   const toolCallConfig = (_a = config == null ? void 0 : config.toolCall) != null ? _a : {};
   const header = bubble.querySelector('button[data-expand-header="true"]');
   const content = bubble.querySelector(".persona-border-t");
+  const preview = bubble.querySelector('[data-persona-collapsed-preview="tool"]');
   if (!header || !content) return;
   header.setAttribute("aria-expanded", expanded ? "true" : "false");
   const headerMeta = header.querySelector(".persona-ml-auto");
@@ -10021,9 +10322,12 @@ var updateToolBubbleUI = (messageId, bubble, config) => {
     }
   }
   content.style.display = expanded ? "" : "none";
+  if (preview) {
+    preview.style.display = expanded ? "none" : preview.textContent || preview.childNodes.length ? "" : "none";
+  }
 };
 var createToolBubble = (message, config) => {
-  var _a;
+  var _a, _b, _c, _d, _e, _f;
   const tool = message.toolCall;
   const toolCallConfig = (_a = config == null ? void 0 : config.toolCall) != null ? _a : {};
   const bubble = createElement(
@@ -10061,14 +10365,19 @@ var createToolBubble = (message, config) => {
   if (!tool) {
     return bubble;
   }
-  let expanded = toolExpansionState.has(message.id);
+  const toolDisplayConfig = (_c = (_b = config == null ? void 0 : config.features) == null ? void 0 : _b.toolCallDisplay) != null ? _c : {};
+  const expandable = toolDisplayConfig.expandable !== false;
+  let expanded = expandable && toolExpansionState.has(message.id);
+  const { summary, previewText, isActive } = getToolSummaryText(message, config);
   const header = createElement(
     "button",
-    "persona-flex persona-w-full persona-items-center persona-justify-between persona-gap-3 persona-bg-transparent persona-px-4 persona-py-3 persona-text-left persona-cursor-pointer persona-border-none"
+    expandable ? "persona-flex persona-w-full persona-items-center persona-justify-between persona-gap-3 persona-bg-transparent persona-px-4 persona-py-3 persona-text-left persona-cursor-pointer persona-border-none" : "persona-flex persona-w-full persona-items-center persona-justify-between persona-gap-3 persona-bg-transparent persona-px-4 persona-py-3 persona-text-left persona-cursor-default persona-border-none"
   );
   header.type = "button";
-  header.setAttribute("aria-expanded", expanded ? "true" : "false");
-  header.setAttribute("data-expand-header", "true");
+  if (expandable) {
+    header.setAttribute("aria-expanded", expanded ? "true" : "false");
+    header.setAttribute("data-expand-header", "true");
+  }
   header.setAttribute("data-bubble-type", "tool");
   if (toolCallConfig.headerBackgroundColor) {
     header.style.backgroundColor = toolCallConfig.headerBackgroundColor;
@@ -10086,19 +10395,67 @@ var createToolBubble = (message, config) => {
   if (toolCallConfig.headerTextColor) {
     title.style.color = toolCallConfig.headerTextColor;
   }
-  title.textContent = describeToolTitle(tool);
-  headerContent.appendChild(title);
-  const toggleIcon = createElement("div", "persona-flex persona-items-center");
-  const iconColor = toolCallConfig.toggleTextColor || toolCallConfig.headerTextColor || "currentColor";
-  const chevronIcon = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor, 2);
-  if (chevronIcon) {
-    toggleIcon.appendChild(chevronIcon);
+  const customSummary = (_e = toolCallConfig.renderCollapsedSummary) == null ? void 0 : _e.call(toolCallConfig, {
+    message,
+    toolCall: tool,
+    defaultSummary: summary,
+    previewText,
+    collapsedMode: (_d = toolDisplayConfig.collapsedMode) != null ? _d : "tool-call",
+    isActive,
+    config: config != null ? config : {}
+  });
+  if (typeof customSummary === "string" && customSummary.trim()) {
+    title.textContent = customSummary;
+    headerContent.appendChild(title);
+  } else if (customSummary instanceof HTMLElement) {
+    headerContent.appendChild(customSummary);
+  } else {
+    title.textContent = summary;
+    headerContent.appendChild(title);
+  }
+  let toggleIcon = null;
+  if (expandable) {
+    toggleIcon = createElement("div", "persona-flex persona-items-center");
+    const iconColor = toolCallConfig.toggleTextColor || toolCallConfig.headerTextColor || "currentColor";
+    const chevronIcon = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor, 2);
+    if (chevronIcon) {
+      toggleIcon.appendChild(chevronIcon);
+    } else {
+      toggleIcon.textContent = expanded ? "Hide" : "Show";
+    }
+    const headerMeta = createElement("div", "persona-flex persona-items-center persona-gap-2 persona-ml-auto");
+    headerMeta.append(toggleIcon);
+    header.append(headerContent, headerMeta);
   } else {
-    toggleIcon.textContent = expanded ? "Hide" : "Show";
+    header.append(headerContent);
+  }
+  const collapsedPreview = createElement(
+    "div",
+    "persona-px-4 persona-py-3 persona-text-xs persona-leading-snug persona-text-persona-muted"
+  );
+  collapsedPreview.setAttribute("data-persona-collapsed-preview", "tool");
+  collapsedPreview.style.display = "none";
+  collapsedPreview.style.whiteSpace = "pre-wrap";
+  if (!expanded && isActive && toolDisplayConfig.activePreview && previewText) {
+    const renderedPreview = (_f = toolCallConfig.renderCollapsedPreview) == null ? void 0 : _f.call(toolCallConfig, {
+      message,
+      toolCall: tool,
+      defaultPreview: previewText,
+      isActive,
+      config: config != null ? config : {}
+    });
+    if (!appendRenderedValue2(collapsedPreview, renderedPreview)) {
+      collapsedPreview.textContent = previewText;
+    }
+    collapsedPreview.style.display = "";
+  }
+  if (!expanded && isActive && toolDisplayConfig.activeMinHeight) {
+    bubble.style.minHeight = toolDisplayConfig.activeMinHeight;
+  }
+  if (!expandable) {
+    bubble.append(header, collapsedPreview);
+    return bubble;
   }
-  const headerMeta = createElement("div", "persona-flex persona-items-center persona-gap-2 persona-ml-auto");
-  headerMeta.append(toggleIcon);
-  header.append(headerContent, headerMeta);
   const content = createElement(
     "div",
     "persona-border-t persona-border-gray-200 persona-bg-gray-50 persona-space-y-3 persona-px-4 persona-py-3"
@@ -10228,18 +10585,21 @@ var createToolBubble = (message, config) => {
   }
   const applyToolExpansion = () => {
     header.setAttribute("aria-expanded", expanded ? "true" : "false");
-    toggleIcon.innerHTML = "";
-    const iconColor2 = toolCallConfig.toggleTextColor || toolCallConfig.headerTextColor || "currentColor";
-    const chevronIcon2 = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor2, 2);
-    if (chevronIcon2) {
-      toggleIcon.appendChild(chevronIcon2);
-    } else {
-      toggleIcon.textContent = expanded ? "Hide" : "Show";
+    if (toggleIcon) {
+      toggleIcon.innerHTML = "";
+      const iconColor = toolCallConfig.toggleTextColor || toolCallConfig.headerTextColor || "currentColor";
+      const chevronIcon = renderLucideIcon(expanded ? "chevron-up" : "chevron-down", 16, iconColor, 2);
+      if (chevronIcon) {
+        toggleIcon.appendChild(chevronIcon);
+      } else {
+        toggleIcon.textContent = expanded ? "Hide" : "Show";
+      }
     }
     content.style.display = expanded ? "" : "none";
+    collapsedPreview.style.display = expanded ? "none" : collapsedPreview.textContent || collapsedPreview.childNodes.length ? "" : "none";
   };
   applyToolExpansion();
-  bubble.append(header, content);
+  bubble.append(header, collapsedPreview, content);
   return bubble;
 };
 
@@ -13046,6 +13406,15 @@ function getClipboardImageFiles(clipboardData) {
   }
   return imageFiles;
 }
+function dataTransferHasFiles(dataTransfer) {
+  if (!dataTransfer) return false;
+  const types = dataTransfer.types;
+  if (!types) return false;
+  if (typeof types.contains === "function") {
+    return types.contains("Files");
+  }
+  return Array.from(types).includes("Files");
+}
 function normalizePersistStateConfig(config) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i;
   if (!config) return null;
@@ -13137,8 +13506,36 @@ var buildPostprocessor = (cfg, actionManager, onResubmitRequested) => {
     return sanitize ? sanitize(html) : html;
   };
 };
+function buildDropOverlay(dropCfg) {
+  var _a, _b, _c, _d;
+  const overlay = createElement("div", "persona-attachment-drop-overlay");
+  if (dropCfg == null ? void 0 : dropCfg.background) overlay.style.setProperty("--persona-drop-overlay-bg", dropCfg.background);
+  if ((dropCfg == null ? void 0 : dropCfg.backdropBlur) !== void 0) overlay.style.setProperty("--persona-drop-overlay-blur", dropCfg.backdropBlur);
+  if (dropCfg == null ? void 0 : dropCfg.border) overlay.style.setProperty("--persona-drop-overlay-border", dropCfg.border);
+  if (dropCfg == null ? void 0 : dropCfg.borderRadius) overlay.style.setProperty("--persona-drop-overlay-radius", dropCfg.borderRadius);
+  if (dropCfg == null ? void 0 : dropCfg.inset) overlay.style.setProperty("--persona-drop-overlay-inset", dropCfg.inset);
+  if (dropCfg == null ? void 0 : dropCfg.labelSize) overlay.style.setProperty("--persona-drop-overlay-label-size", dropCfg.labelSize);
+  if (dropCfg == null ? void 0 : dropCfg.labelColor) overlay.style.setProperty("--persona-drop-overlay-label-color", dropCfg.labelColor);
+  const iconName = (_a = dropCfg == null ? void 0 : dropCfg.iconName) != null ? _a : "upload";
+  const iconSize = (_b = dropCfg == null ? void 0 : dropCfg.iconSize) != null ? _b : "48px";
+  const iconColor = (_c = dropCfg == null ? void 0 : dropCfg.iconColor) != null ? _c : "rgba(59, 130, 246, 0.6)";
+  const iconStrokeWidth = (_d = dropCfg == null ? void 0 : dropCfg.iconStrokeWidth) != null ? _d : 0.5;
+  const iconSvg = renderLucideIcon(iconName, iconSize, iconColor, iconStrokeWidth);
+  if (iconSvg) overlay.appendChild(iconSvg);
+  if (dropCfg == null ? void 0 : dropCfg.label) {
+    const labelEl = createElement("span", "persona-drop-overlay-label");
+    labelEl.textContent = dropCfg.label;
+    overlay.appendChild(labelEl);
+  }
+  return overlay;
+}
 var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N;
+  if (mount == null) {
+    throw new Error(
+      'createAgentExperience: mount must be a non-null HTMLElement (e.g. pass document.getElementById("my-root") after the node exists).'
+    );
+  }
   if (mount.id && !mount.getAttribute("data-persona-instance")) {
     mount.setAttribute("data-persona-instance", mount.id);
   }
@@ -13542,8 +13939,22 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
         return composerElements.footer;
       },
       onSubmit: (text) => {
-        if (session && !session.isStreaming()) {
-          session.sendMessage(text);
+        var _a2;
+        if (!session || session.isStreaming()) return;
+        const value = text.trim();
+        const hasAttachments = (_a2 = attachmentManager == null ? void 0 : attachmentManager.hasAttachments()) != null ? _a2 : false;
+        if (!value && !hasAttachments) return;
+        let contentParts;
+        if (hasAttachments) {
+          contentParts = [];
+          contentParts.push(...attachmentManager.getContentParts());
+          if (value) {
+            contentParts.push(createTextPart(value));
+          }
+        }
+        session.sendMessage(value, { contentParts });
+        if (hasAttachments) {
+          attachmentManager.clearAttachments();
         }
       },
       streaming: false,
@@ -13622,6 +14033,9 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       attachmentManager == null ? void 0 : attachmentManager.handleFileSelect(target.files);
       target.value = "";
     });
+    const dropCfg = config.attachments.dropOverlay;
+    const overlay = buildDropOverlay(dropCfg);
+    container.appendChild(overlay);
   }
   const renderSlots = () => {
     var _a2, _b2;
@@ -14415,6 +14829,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
   let lastScrollTop = 0;
   let scrollRAF = null;
   let isAutoScrolling = false;
+  let hasPendingAutoScroll = false;
   const USER_SCROLL_THRESHOLD = 1;
   const BOTTOM_THRESHOLD = 8;
   const messageState = /* @__PURE__ */ new Map();
@@ -14507,6 +14922,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       cancelAnimationFrame(scrollRAF);
       scrollRAF = null;
     }
+    hasPendingAutoScroll = false;
     cancelSmoothScroll();
   };
   const syncScrollToBottomButton = () => {
@@ -14536,9 +14952,14 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
   const scheduleAutoScroll = (force = false) => {
     if (!autoFollow.isFollowing()) return;
     if (!force && !isStreaming) return;
-    cancelAutoScroll();
+    if (scrollRAF !== null) {
+      cancelAnimationFrame(scrollRAF);
+      scrollRAF = null;
+    }
+    hasPendingAutoScroll = true;
     scrollRAF = requestAnimationFrame(() => {
       scrollRAF = null;
+      hasPendingAutoScroll = false;
       if (!autoFollow.isFollowing()) return;
       smoothScrollToBottom(getScrollableContainer(), force ? 220 : 140);
     });
@@ -14612,7 +15033,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
     });
   };
   const renderMessagesWithPluginsImpl = (container2, messages, transform) => {
-    var _a2, _b2, _c2, _d2;
+    var _a2, _b2, _c2, _d2, _e2, _f2;
     const tempContainer = document.createElement("div");
     const getInlineLoadingIndicatorRenderer = () => {
       var _a3;
@@ -14626,6 +15047,15 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       return void 0;
     };
     const inlineLoadingRenderer = getInlineLoadingIndicatorRenderer();
+    const appendRenderedValue3 = (containerEl, value) => {
+      if (value == null) return false;
+      if (typeof value === "string") {
+        containerEl.textContent = value;
+        return true;
+      }
+      containerEl.appendChild(value);
+      return true;
+    };
     const activeMessageIds = /* @__PURE__ */ new Set();
     messages.forEach((message) => {
       var _a3, _b3;
@@ -14658,7 +15088,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           if (!showReasoning) return;
           bubble = matchingPlugin.renderReasoning({
             message,
-            defaultRenderer: () => createReasoningBubble(message),
+            defaultRenderer: () => createReasoningBubble(message, config),
             config
           });
         } else if (message.variant === "tool" && message.toolCall && matchingPlugin.renderToolCall) {
@@ -14764,7 +15194,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       if (!bubble) {
         if (message.variant === "reasoning" && message.reasoning) {
           if (!showReasoning) return;
-          bubble = createReasoningBubble(message);
+          bubble = createReasoningBubble(message, config);
         } else if (message.variant === "tool" && message.toolCall) {
           if (!showToolCalls) return;
           bubble = createToolBubble(message, config);
@@ -14817,6 +15247,68 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       setCachedWrapper(messageCache, message.id, fingerprint, wrapper2);
       tempContainer.appendChild(wrapper2);
     });
+    if ((_b2 = (_a2 = config.features) == null ? void 0 : _a2.toolCallDisplay) == null ? void 0 : _b2.grouped) {
+      const toolGroups = [];
+      let currentGroup = [];
+      messages.forEach((message) => {
+        if (message.variant === "tool" && message.toolCall && showToolCalls) {
+          currentGroup.push(message);
+          return;
+        }
+        if (currentGroup.length > 1) {
+          toolGroups.push(currentGroup);
+        }
+        currentGroup = [];
+      });
+      if (currentGroup.length > 1) {
+        toolGroups.push(currentGroup);
+      }
+      toolGroups.forEach((group, groupIndex) => {
+        var _a3, _b3;
+        const wrappers = group.map(
+          (groupMessage) => Array.from(tempContainer.children).find(
+            (child) => child instanceof HTMLElement && child.getAttribute("data-wrapper-id") === groupMessage.id
+          )
+        ).filter((wrapper2) => Boolean(wrapper2));
+        if (wrappers.length < 2) {
+          return;
+        }
+        const groupWrapper = document.createElement("div");
+        groupWrapper.className = "persona-flex";
+        groupWrapper.id = `wrapper-tool-group-${groupIndex}-${group[0].id}`;
+        groupWrapper.setAttribute("data-wrapper-id", `tool-group-${groupIndex}-${group[0].id}`);
+        const groupContainer = document.createElement("div");
+        groupContainer.className = "persona-tool-group persona-flex persona-w-full persona-flex-col persona-gap-2";
+        groupContainer.setAttribute("data-persona-tool-group", "true");
+        const summary = document.createElement("div");
+        summary.className = "persona-tool-group-summary persona-text-xs persona-text-persona-muted";
+        const defaultSummary = `Called ${group.length} tools`;
+        const renderedSummary = (_b3 = (_a3 = config.toolCall) == null ? void 0 : _a3.renderGroupedSummary) == null ? void 0 : _b3.call(_a3, {
+          messages: group,
+          toolCalls: group.map((groupMessage) => groupMessage.toolCall).filter((toolCall) => Boolean(toolCall)),
+          defaultSummary,
+          config
+        });
+        if (!appendRenderedValue3(summary, renderedSummary)) {
+          summary.textContent = defaultSummary;
+        }
+        const stack = document.createElement("div");
+        stack.className = "persona-tool-group-stack persona-flex persona-flex-col";
+        groupContainer.append(summary, stack);
+        groupWrapper.appendChild(groupContainer);
+        wrappers[0].before(groupWrapper);
+        wrappers.forEach((wrapper2, wrapperIndex) => {
+          const item = document.createElement("div");
+          item.className = "persona-tool-group-item persona-relative";
+          item.setAttribute("data-persona-tool-group-item", "true");
+          if (wrapperIndex < wrappers.length - 1) {
+            item.setAttribute("data-persona-tool-group-connector", "true");
+          }
+          item.appendChild(wrapper2);
+          stack.appendChild(item);
+        });
+      });
+    }
     pruneCache(messageCache, activeMessageIds);
     const hasStreamingAssistantMessage = messages.some(
       (msg) => msg.role === "assistant" && msg.streaming
@@ -14835,7 +15327,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       if (loadingPlugin == null ? void 0 : loadingPlugin.renderLoadingIndicator) {
         typingIndicator = loadingPlugin.renderLoadingIndicator(loadingIndicatorContext);
       }
-      if (typingIndicator === null && ((_a2 = config.loadingIndicator) == null ? void 0 : _a2.render)) {
+      if (typingIndicator === null && ((_c2 = config.loadingIndicator) == null ? void 0 : _c2.render)) {
         typingIndicator = config.loadingIndicator.render(loadingIndicatorContext);
       }
       if (typingIndicator === null) {
@@ -14843,7 +15335,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       }
       if (typingIndicator) {
         const typingBubble = document.createElement("div");
-        const showBubble = ((_b2 = config.loadingIndicator) == null ? void 0 : _b2.showBubble) !== false;
+        const showBubble = ((_d2 = config.loadingIndicator) == null ? void 0 : _d2.showBubble) !== false;
         typingBubble.className = showBubble ? [
           "persona-max-w-[85%]",
           "persona-rounded-2xl",
@@ -14884,12 +15376,12 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       if (idlePlugin == null ? void 0 : idlePlugin.renderIdleIndicator) {
         idleIndicator = idlePlugin.renderIdleIndicator(idleIndicatorContext);
       }
-      if (idleIndicator === null && ((_c2 = config.loadingIndicator) == null ? void 0 : _c2.renderIdle)) {
+      if (idleIndicator === null && ((_e2 = config.loadingIndicator) == null ? void 0 : _e2.renderIdle)) {
         idleIndicator = config.loadingIndicator.renderIdle(idleIndicatorContext);
       }
       if (idleIndicator) {
         const idleBubble = document.createElement("div");
-        const showBubble = ((_d2 = config.loadingIndicator) == null ? void 0 : _d2.showBubble) !== false;
+        const showBubble = ((_f2 = config.loadingIndicator) == null ? void 0 : _f2.showBubble) !== false;
         idleBubble.className = showBubble ? [
           "persona-max-w-[85%]",
           "persona-rounded-2xl",
@@ -15786,7 +16278,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       lastScrollTop,
       nearBottom: isElementNearBottom(body, BOTTOM_THRESHOLD),
       userScrollThreshold: USER_SCROLL_THRESHOLD,
-      isAutoScrolling,
+      isAutoScrolling: isAutoScrolling || hasPendingAutoScroll,
       pauseOnUpwardScroll: true,
       pauseWhenAwayFromBottom: false,
       resumeRequiresDownwardScroll: true
@@ -15901,6 +16393,61 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
   }
   textarea == null ? void 0 : textarea.addEventListener("keydown", handleInputEnter);
   textarea == null ? void 0 : textarea.addEventListener("paste", handleInputPaste);
+  const ATTACHMENT_DROP_ACTIVE_CLASS = "persona-attachment-drop-active";
+  let attachmentFileDragDepth = 0;
+  const clearAttachmentDropVisual = () => {
+    attachmentFileDragDepth = 0;
+    container.classList.remove(ATTACHMENT_DROP_ACTIVE_CLASS);
+  };
+  const attachmentDropHandlingActive = () => {
+    var _a2;
+    return ((_a2 = config.attachments) == null ? void 0 : _a2.enabled) === true && attachmentManager !== null;
+  };
+  const handleAttachmentDragEnterCapture = (e) => {
+    if (!dataTransferHasFiles(e.dataTransfer) || !attachmentDropHandlingActive()) return;
+    attachmentFileDragDepth++;
+    if (attachmentFileDragDepth === 1) {
+      container.classList.add(ATTACHMENT_DROP_ACTIVE_CLASS);
+    }
+  };
+  const handleAttachmentDragLeaveCapture = (e) => {
+    if (!dataTransferHasFiles(e.dataTransfer) || !attachmentDropHandlingActive()) return;
+    attachmentFileDragDepth--;
+    if (attachmentFileDragDepth <= 0) {
+      clearAttachmentDropVisual();
+    }
+  };
+  const handleAttachmentDragOverCapture = (e) => {
+    if (!dataTransferHasFiles(e.dataTransfer) || !attachmentDropHandlingActive()) return;
+    e.preventDefault();
+    e.dataTransfer.dropEffect = "copy";
+  };
+  const handleAttachmentDropCapture = (e) => {
+    var _a2;
+    if (!dataTransferHasFiles(e.dataTransfer) || !attachmentDropHandlingActive()) return;
+    e.preventDefault();
+    e.stopPropagation();
+    clearAttachmentDropVisual();
+    const files = Array.from((_a2 = e.dataTransfer.files) != null ? _a2 : []);
+    if (files.length === 0) return;
+    void attachmentManager.handleFiles(files);
+  };
+  const attachmentDropCapture = true;
+  container.addEventListener("dragenter", handleAttachmentDragEnterCapture, attachmentDropCapture);
+  container.addEventListener("dragleave", handleAttachmentDragLeaveCapture, attachmentDropCapture);
+  mount.addEventListener("dragover", handleAttachmentDragOverCapture, attachmentDropCapture);
+  mount.addEventListener("drop", handleAttachmentDropCapture, attachmentDropCapture);
+  const ownerDoc = mount.ownerDocument;
+  const handleDocDragOver = (e) => {
+    if (!attachmentDropHandlingActive()) return;
+    e.preventDefault();
+  };
+  const handleDocDrop = (e) => {
+    if (!attachmentDropHandlingActive()) return;
+    e.preventDefault();
+  };
+  ownerDoc.addEventListener("dragover", handleDocDragOver);
+  ownerDoc.addEventListener("drop", handleDocDrop);
   destroyCallbacks.push(() => {
     if (composerForm) {
       composerForm.removeEventListener("submit", handleSubmit);
@@ -15908,6 +16455,15 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
     textarea == null ? void 0 : textarea.removeEventListener("keydown", handleInputEnter);
     textarea == null ? void 0 : textarea.removeEventListener("paste", handleInputPaste);
   });
+  destroyCallbacks.push(() => {
+    container.removeEventListener("dragenter", handleAttachmentDragEnterCapture, attachmentDropCapture);
+    container.removeEventListener("dragleave", handleAttachmentDragLeaveCapture, attachmentDropCapture);
+    mount.removeEventListener("dragover", handleAttachmentDragOverCapture, attachmentDropCapture);
+    mount.removeEventListener("drop", handleAttachmentDropCapture, attachmentDropCapture);
+    ownerDoc.removeEventListener("dragover", handleDocDragOver);
+    ownerDoc.removeEventListener("drop", handleDocDrop);
+    clearAttachmentDropVisual();
+  });
   destroyCallbacks.push(() => {
     session.cancel();
   });
@@ -15922,13 +16478,17 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
   }
   const controller = {
     update(nextConfig) {
-      var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t2, _u2, _v2, _w2, _x2, _y2, _z2, _A2, _B2, _C2, _D2, _E2, _F2, _G2, _H2, _I2, _J2, _K2, _L2, _M2, _N2, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga, _Ha, _Ia, _Ja, _Ka, _La, _Ma, _Na, _Oa, _Pa, _Qa, _Ra;
+      var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t2, _u2, _v2, _w2, _x2, _y2, _z2, _A2, _B2, _C2, _D2, _E2, _F2, _G2, _H2, _I2, _J2, _K2, _L2, _M2, _N2, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga, _Ha, _Ia, _Ja, _Ka, _La, _Ma, _Na, _Oa, _Pa, _Qa, _Ra, _Sa, _Ta, _Ua, _Va, _Wa, _Xa, _Ya, _Za, __a, _$a, _ab;
       const previousToolCallConfig = config.toolCall;
       const previousMessageActions = config.messageActions;
       const previousLayoutMessages = (_a2 = config.layout) == null ? void 0 : _a2.messages;
       const previousColorScheme = config.colorScheme;
       const previousLoadingIndicator = config.loadingIndicator;
       const previousIterationDisplay = config.iterationDisplay;
+      const previousShowReasoning = (_b2 = config.features) == null ? void 0 : _b2.showReasoning;
+      const previousShowToolCalls = (_c2 = config.features) == null ? void 0 : _c2.showToolCalls;
+      const previousToolCallDisplay = (_d2 = config.features) == null ? void 0 : _d2.toolCallDisplay;
+      const previousReasoningDisplay = (_e2 = config.features) == null ? void 0 : _e2.reasoningDisplay;
       config = { ...config, ...nextConfig };
       applyFullHeightStyles();
       applyThemeVariables(mount, config);
@@ -15941,15 +16501,15 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       const newPlugins = pluginRegistry.getForInstance(config.plugins);
       plugins.length = 0;
       plugins.push(...newPlugins);
-      launcherEnabled = (_c2 = (_b2 = config.launcher) == null ? void 0 : _b2.enabled) != null ? _c2 : true;
-      autoExpand = (_e2 = (_d2 = config.launcher) == null ? void 0 : _d2.autoExpand) != null ? _e2 : false;
-      showReasoning = (_g2 = (_f2 = config.features) == null ? void 0 : _f2.showReasoning) != null ? _g2 : true;
-      showToolCalls = (_i2 = (_h2 = config.features) == null ? void 0 : _h2.showToolCalls) != null ? _i2 : true;
-      scrollToBottomFeature = (_k2 = (_j2 = config.features) == null ? void 0 : _j2.scrollToBottom) != null ? _k2 : {};
+      launcherEnabled = (_g2 = (_f2 = config.launcher) == null ? void 0 : _f2.enabled) != null ? _g2 : true;
+      autoExpand = (_i2 = (_h2 = config.launcher) == null ? void 0 : _h2.autoExpand) != null ? _i2 : false;
+      showReasoning = (_k2 = (_j2 = config.features) == null ? void 0 : _j2.showReasoning) != null ? _k2 : true;
+      showToolCalls = (_m2 = (_l2 = config.features) == null ? void 0 : _l2.showToolCalls) != null ? _m2 : true;
+      scrollToBottomFeature = (_o2 = (_n2 = config.features) == null ? void 0 : _n2.scrollToBottom) != null ? _o2 : {};
       renderScrollToBottomButton();
       syncScrollToBottomButton();
       const prevShowEventStreamToggle = showEventStreamToggle;
-      showEventStreamToggle = (_m2 = (_l2 = config.features) == null ? void 0 : _l2.showEventStreamToggle) != null ? _m2 : false;
+      showEventStreamToggle = (_q2 = (_p2 = config.features) == null ? void 0 : _p2.showEventStreamToggle) != null ? _q2 : false;
       if (showEventStreamToggle && !prevShowEventStreamToggle) {
         if (!eventStreamBuffer) {
           eventStreamStore = new EventStreamStore(eventStreamDbName);
@@ -15966,7 +16526,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           });
         }
         if (!eventStreamToggleBtn && header) {
-          const dynEsClassNames = (_o2 = (_n2 = config.features) == null ? void 0 : _n2.eventStream) == null ? void 0 : _o2.classNames;
+          const dynEsClassNames = (_s2 = (_r2 = config.features) == null ? void 0 : _r2.eventStream) == null ? void 0 : _s2.classNames;
           const dynToggleBtnClasses = "persona-inline-flex persona-items-center persona-justify-center persona-rounded-full hover:persona-opacity-80 persona-cursor-pointer persona-border-none persona-bg-transparent persona-p-1" + ((dynEsClassNames == null ? void 0 : dynEsClassNames.toggleButton) ? " " + dynEsClassNames.toggleButton : "");
           eventStreamToggleBtn = createElement("button", dynToggleBtnClasses);
           eventStreamToggleBtn.style.width = "28px";
@@ -16004,15 +16564,15 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
         eventStreamBuffer = null;
         eventStreamStore = null;
       }
-      if (((_p2 = config.launcher) == null ? void 0 : _p2.enabled) === false && launcherButtonInstance) {
+      if (((_t2 = config.launcher) == null ? void 0 : _t2.enabled) === false && launcherButtonInstance) {
         launcherButtonInstance.destroy();
         launcherButtonInstance = null;
       }
-      if (((_q2 = config.launcher) == null ? void 0 : _q2.enabled) === false && customLauncherElement) {
+      if (((_u2 = config.launcher) == null ? void 0 : _u2.enabled) === false && customLauncherElement) {
         customLauncherElement.remove();
         customLauncherElement = null;
       }
-      if (((_r2 = config.launcher) == null ? void 0 : _r2.enabled) !== false && !launcherButtonInstance && !customLauncherElement) {
+      if (((_v2 = config.launcher) == null ? void 0 : _v2.enabled) !== false && !launcherButtonInstance && !customLauncherElement) {
         const launcherPlugin = plugins.find((p) => p.renderLauncher);
         if (launcherPlugin == null ? void 0 : launcherPlugin.renderLauncher) {
           const customLauncher = launcherPlugin.renderLauncher({
@@ -16036,13 +16596,13 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       if (launcherButtonInstance) {
         launcherButtonInstance.update(config);
       }
-      if (headerTitle && ((_s2 = config.launcher) == null ? void 0 : _s2.title) !== void 0) {
+      if (headerTitle && ((_w2 = config.launcher) == null ? void 0 : _w2.title) !== void 0) {
         headerTitle.textContent = config.launcher.title;
       }
-      if (headerSubtitle && ((_t2 = config.launcher) == null ? void 0 : _t2.subtitle) !== void 0) {
+      if (headerSubtitle && ((_x2 = config.launcher) == null ? void 0 : _x2.subtitle) !== void 0) {
         headerSubtitle.textContent = config.launcher.subtitle;
       }
-      const headerLayoutConfig = (_u2 = config.layout) == null ? void 0 : _u2.header;
+      const headerLayoutConfig = (_y2 = config.layout) == null ? void 0 : _y2.header;
       const headerLayoutChanged = (headerLayoutConfig == null ? void 0 : headerLayoutConfig.layout) !== prevHeaderLayout;
       if (headerLayoutChanged && header) {
         const newHeaderElements = headerLayoutConfig ? buildHeaderWithLayout(config, headerLayoutConfig, {
@@ -16088,11 +16648,11 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           }
         }
       }
-      const showHeader = ((_v2 = config.layout) == null ? void 0 : _v2.showHeader) !== false;
+      const showHeader = ((_z2 = config.layout) == null ? void 0 : _z2.showHeader) !== false;
       if (header) {
         header.style.display = showHeader ? "" : "none";
       }
-      const showFooter = ((_w2 = config.layout) == null ? void 0 : _w2.showFooter) !== false;
+      const showFooter = ((_A2 = config.layout) == null ? void 0 : _A2.showFooter) !== false;
       if (footer) {
         footer.style.display = showFooter ? "" : "none";
       }
@@ -16116,20 +16676,21 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       refreshCloseButton();
       const toolCallConfigChanged = JSON.stringify(nextConfig.toolCall) !== JSON.stringify(previousToolCallConfig);
       const messageActionsChanged = JSON.stringify(config.messageActions) !== JSON.stringify(previousMessageActions);
-      const layoutMessagesChanged = JSON.stringify((_x2 = config.layout) == null ? void 0 : _x2.messages) !== JSON.stringify(previousLayoutMessages);
-      const loadingIndicatorChanged = ((_y2 = config.loadingIndicator) == null ? void 0 : _y2.render) !== (previousLoadingIndicator == null ? void 0 : previousLoadingIndicator.render) || ((_z2 = config.loadingIndicator) == null ? void 0 : _z2.renderIdle) !== (previousLoadingIndicator == null ? void 0 : previousLoadingIndicator.renderIdle) || ((_A2 = config.loadingIndicator) == null ? void 0 : _A2.showBubble) !== (previousLoadingIndicator == null ? void 0 : previousLoadingIndicator.showBubble);
+      const layoutMessagesChanged = JSON.stringify((_B2 = config.layout) == null ? void 0 : _B2.messages) !== JSON.stringify(previousLayoutMessages);
+      const loadingIndicatorChanged = ((_C2 = config.loadingIndicator) == null ? void 0 : _C2.render) !== (previousLoadingIndicator == null ? void 0 : previousLoadingIndicator.render) || ((_D2 = config.loadingIndicator) == null ? void 0 : _D2.renderIdle) !== (previousLoadingIndicator == null ? void 0 : previousLoadingIndicator.renderIdle) || ((_E2 = config.loadingIndicator) == null ? void 0 : _E2.showBubble) !== (previousLoadingIndicator == null ? void 0 : previousLoadingIndicator.showBubble);
       const iterationDisplayChanged = config.iterationDisplay !== previousIterationDisplay;
-      const messagesConfigChanged = toolCallConfigChanged || messageActionsChanged || layoutMessagesChanged || loadingIndicatorChanged || iterationDisplayChanged;
+      const featuresChanged = ((_G2 = (_F2 = config.features) == null ? void 0 : _F2.showReasoning) != null ? _G2 : true) !== (previousShowReasoning != null ? previousShowReasoning : true) || ((_I2 = (_H2 = config.features) == null ? void 0 : _H2.showToolCalls) != null ? _I2 : true) !== (previousShowToolCalls != null ? previousShowToolCalls : true) || JSON.stringify((_J2 = config.features) == null ? void 0 : _J2.toolCallDisplay) !== JSON.stringify(previousToolCallDisplay) || JSON.stringify((_K2 = config.features) == null ? void 0 : _K2.reasoningDisplay) !== JSON.stringify(previousReasoningDisplay);
+      const messagesConfigChanged = toolCallConfigChanged || messageActionsChanged || layoutMessagesChanged || loadingIndicatorChanged || iterationDisplayChanged || featuresChanged;
       if (messagesConfigChanged && session) {
         configVersion++;
         renderMessagesWithPlugins(messagesWrapper, session.getMessages(), postprocess);
       }
-      const launcher = (_B2 = config.launcher) != null ? _B2 : {};
-      const headerIconHidden = (_C2 = launcher.headerIconHidden) != null ? _C2 : false;
-      const layoutShowIcon = (_E2 = (_D2 = config.layout) == null ? void 0 : _D2.header) == null ? void 0 : _E2.showIcon;
+      const launcher = (_L2 = config.launcher) != null ? _L2 : {};
+      const headerIconHidden = (_M2 = launcher.headerIconHidden) != null ? _M2 : false;
+      const layoutShowIcon = (_O = (_N2 = config.layout) == null ? void 0 : _N2.header) == null ? void 0 : _O.showIcon;
       const shouldHideIcon = headerIconHidden || layoutShowIcon === false;
       const headerIconName = launcher.headerIconName;
-      const headerIconSize = (_F2 = launcher.headerIconSize) != null ? _F2 : "48px";
+      const headerIconSize = (_P = launcher.headerIconSize) != null ? _P : "48px";
       if (iconHolder) {
         const headerEl = container.querySelector(".persona-border-b-persona-divider");
         const headerCopy = headerEl == null ? void 0 : headerEl.querySelector(".persona-flex-col");
@@ -16156,7 +16717,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             if (iconSvg) {
               iconHolder.replaceChildren(iconSvg);
             } else {
-              iconHolder.textContent = (_G2 = launcher.agentIconText) != null ? _G2 : "\u{1F4AC}";
+              iconHolder.textContent = (_Q = launcher.agentIconText) != null ? _Q : "\u{1F4AC}";
             }
           } else if (launcher.iconUrl) {
             const img2 = iconHolder.querySelector("img");
@@ -16179,7 +16740,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             if (existingSvg || existingImg) {
               iconHolder.replaceChildren();
             }
-            iconHolder.textContent = (_H2 = launcher.agentIconText) != null ? _H2 : "\u{1F4AC}";
+            iconHolder.textContent = (_R = launcher.agentIconText) != null ? _R : "\u{1F4AC}";
           }
           const img = iconHolder.querySelector("img");
           if (img) {
@@ -16188,8 +16749,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           }
         }
       }
-      const layoutShowTitle = (_J2 = (_I2 = config.layout) == null ? void 0 : _I2.header) == null ? void 0 : _J2.showTitle;
-      const layoutShowSubtitle = (_L2 = (_K2 = config.layout) == null ? void 0 : _K2.header) == null ? void 0 : _L2.showSubtitle;
+      const layoutShowTitle = (_T = (_S = config.layout) == null ? void 0 : _S.header) == null ? void 0 : _T.showTitle;
+      const layoutShowSubtitle = (_V = (_U = config.layout) == null ? void 0 : _U.header) == null ? void 0 : _V.showSubtitle;
       if (headerTitle) {
         headerTitle.style.display = layoutShowTitle === false ? "none" : "";
       }
@@ -16197,14 +16758,14 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
         headerSubtitle.style.display = layoutShowSubtitle === false ? "none" : "";
       }
       if (closeButton) {
-        const layoutShowCloseButton = (_N2 = (_M2 = config.layout) == null ? void 0 : _M2.header) == null ? void 0 : _N2.showCloseButton;
+        const layoutShowCloseButton = (_X = (_W = config.layout) == null ? void 0 : _W.header) == null ? void 0 : _X.showCloseButton;
         if (layoutShowCloseButton === false) {
           closeButton.style.display = "none";
         } else {
           closeButton.style.display = "";
         }
-        const closeButtonSize = (_O = launcher.closeButtonSize) != null ? _O : "32px";
-        const closeButtonPlacement = (_P = launcher.closeButtonPlacement) != null ? _P : "inline";
+        const closeButtonSize = (_Y = launcher.closeButtonSize) != null ? _Y : "32px";
+        const closeButtonPlacement = (_Z = launcher.closeButtonPlacement) != null ? _Z : "inline";
         closeButton.style.height = closeButtonSize;
         closeButton.style.width = closeButtonSize;
         const { closeButtonWrapper } = panelElements;
@@ -16217,8 +16778,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             container.style.position = "relative";
             container.appendChild(closeButtonWrapper);
           } else {
-            const clearChatPlacement = (_R = (_Q = launcher.clearChat) == null ? void 0 : _Q.placement) != null ? _R : "inline";
-            const clearChatEnabled = (_T = (_S = launcher.clearChat) == null ? void 0 : _S.enabled) != null ? _T : true;
+            const clearChatPlacement = (_$ = (__ = launcher.clearChat) == null ? void 0 : __.placement) != null ? _$ : "inline";
+            const clearChatEnabled = (_ba = (_aa = launcher.clearChat) == null ? void 0 : _aa.enabled) != null ? _ba : true;
             closeButtonWrapper.className = clearChatEnabled && clearChatPlacement === "inline" ? "" : "persona-ml-auto";
             const header2 = container.querySelector(".persona-border-b-persona-divider");
             if (header2) {
@@ -16264,8 +16825,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           closeButton.style.paddingTop = "";
           closeButton.style.paddingBottom = "";
         }
-        const closeButtonIconName = (_U = launcher.closeButtonIconName) != null ? _U : "x";
-        const closeButtonIconText = (_V = launcher.closeButtonIconText) != null ? _V : "\xD7";
+        const closeButtonIconName = (_ca = launcher.closeButtonIconName) != null ? _ca : "x";
+        const closeButtonIconText = (_da = launcher.closeButtonIconText) != null ? _da : "\xD7";
         closeButton.innerHTML = "";
         const iconSvg = renderLucideIcon(closeButtonIconName, "20px", "currentColor", 2);
         if (iconSvg) {
@@ -16273,8 +16834,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
         } else {
           closeButton.textContent = closeButtonIconText;
         }
-        const closeButtonTooltipText = (_W = launcher.closeButtonTooltipText) != null ? _W : "Close chat";
-        const closeButtonShowTooltip = (_X = launcher.closeButtonShowTooltip) != null ? _X : true;
+        const closeButtonTooltipText = (_ea = launcher.closeButtonTooltipText) != null ? _ea : "Close chat";
+        const closeButtonShowTooltip = (_fa = launcher.closeButtonShowTooltip) != null ? _fa : true;
         closeButton.setAttribute("aria-label", closeButtonTooltipText);
         if (closeButtonWrapper) {
           if (closeButtonWrapper._cleanupTooltip) {
@@ -16331,11 +16892,11 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       }
       const { clearChatButton, clearChatButtonWrapper } = panelElements;
       if (clearChatButton) {
-        const clearChatConfig = (_Y = launcher.clearChat) != null ? _Y : {};
-        const clearChatEnabled = (_Z = clearChatConfig.enabled) != null ? _Z : true;
-        const layoutShowClearChat = (_$ = (__ = config.layout) == null ? void 0 : __.header) == null ? void 0 : _$.showClearChat;
+        const clearChatConfig = (_ga = launcher.clearChat) != null ? _ga : {};
+        const clearChatEnabled = (_ha = clearChatConfig.enabled) != null ? _ha : true;
+        const layoutShowClearChat = (_ja = (_ia = config.layout) == null ? void 0 : _ia.header) == null ? void 0 : _ja.showClearChat;
         const shouldShowClearChat = layoutShowClearChat !== void 0 ? layoutShowClearChat : clearChatEnabled;
-        const clearChatPlacement = (_aa = clearChatConfig.placement) != null ? _aa : "inline";
+        const clearChatPlacement = (_ka = clearChatConfig.placement) != null ? _ka : "inline";
         if (clearChatButtonWrapper) {
           clearChatButtonWrapper.style.display = shouldShowClearChat ? "" : "none";
           const { closeButtonWrapper } = panelElements;
@@ -16377,11 +16938,11 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           }
         }
         if (shouldShowClearChat) {
-          const clearChatSize = (_ba = clearChatConfig.size) != null ? _ba : "32px";
+          const clearChatSize = (_la = clearChatConfig.size) != null ? _la : "32px";
           clearChatButton.style.height = clearChatSize;
           clearChatButton.style.width = clearChatSize;
-          const clearChatIconName = (_ca = clearChatConfig.iconName) != null ? _ca : "refresh-cw";
-          const clearChatIconColor = (_da = clearChatConfig.iconColor) != null ? _da : "";
+          const clearChatIconName = (_ma = clearChatConfig.iconName) != null ? _ma : "refresh-cw";
+          const clearChatIconColor = (_na = clearChatConfig.iconColor) != null ? _na : "";
           clearChatButton.style.color = clearChatIconColor || HEADER_THEME_CSS.actionIconColor;
           clearChatButton.innerHTML = "";
           const iconSvg = renderLucideIcon(clearChatIconName, "20px", "currentColor", 2);
@@ -16425,8 +16986,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             clearChatButton.style.paddingTop = "";
             clearChatButton.style.paddingBottom = "";
           }
-          const clearChatTooltipText = (_ea = clearChatConfig.tooltipText) != null ? _ea : "Clear chat";
-          const clearChatShowTooltip = (_fa = clearChatConfig.showTooltip) != null ? _fa : true;
+          const clearChatTooltipText = (_oa = clearChatConfig.tooltipText) != null ? _oa : "Clear chat";
+          const clearChatShowTooltip = (_pa = clearChatConfig.showTooltip) != null ? _pa : true;
           clearChatButton.setAttribute("aria-label", clearChatTooltipText);
           if (clearChatButtonWrapper) {
             if (clearChatButtonWrapper._cleanupTooltip) {
@@ -16502,9 +17063,9 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       suggestionsManager.render(config.suggestionChips, session, textarea, void 0, config.suggestionChipsConfig);
       updateCopy();
       setComposerDisabled(session.isStreaming());
-      const voiceRecognitionEnabled = ((_ga = config.voiceRecognition) == null ? void 0 : _ga.enabled) === true;
+      const voiceRecognitionEnabled = ((_qa = config.voiceRecognition) == null ? void 0 : _qa.enabled) === true;
       const hasSpeechRecognition = typeof window !== "undefined" && (typeof window.webkitSpeechRecognition !== "undefined" || typeof window.SpeechRecognition !== "undefined");
-      const hasRuntypeProvider = ((_ia = (_ha = config.voiceRecognition) == null ? void 0 : _ha.provider) == null ? void 0 : _ia.type) === "runtype";
+      const hasRuntypeProvider = ((_sa = (_ra = config.voiceRecognition) == null ? void 0 : _ra.provider) == null ? void 0 : _sa.type) === "runtype";
       const hasVoiceInput = hasSpeechRecognition || hasRuntypeProvider;
       if (voiceRecognitionEnabled && hasVoiceInput) {
         if (!micButton || !micButtonWrapper) {
@@ -16517,17 +17078,17 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             micButton.disabled = session.isStreaming();
           }
         } else {
-          const voiceConfig = (_ja = config.voiceRecognition) != null ? _ja : {};
-          const sendButtonConfig2 = (_ka = config.sendButton) != null ? _ka : {};
-          const micIconName = (_la = voiceConfig.iconName) != null ? _la : "mic";
-          const buttonSize2 = (_ma = sendButtonConfig2.size) != null ? _ma : "40px";
-          const micIconSize = (_na = voiceConfig.iconSize) != null ? _na : buttonSize2;
+          const voiceConfig = (_ta = config.voiceRecognition) != null ? _ta : {};
+          const sendButtonConfig2 = (_ua = config.sendButton) != null ? _ua : {};
+          const micIconName = (_va = voiceConfig.iconName) != null ? _va : "mic";
+          const buttonSize2 = (_wa = sendButtonConfig2.size) != null ? _wa : "40px";
+          const micIconSize = (_xa = voiceConfig.iconSize) != null ? _xa : buttonSize2;
           const micIconSizeNum = parseFloat(micIconSize) || 24;
           micButton.style.width = micIconSize;
           micButton.style.height = micIconSize;
           micButton.style.minWidth = micIconSize;
           micButton.style.minHeight = micIconSize;
-          const iconColor = (_pa = (_oa = voiceConfig.iconColor) != null ? _oa : sendButtonConfig2.textColor) != null ? _pa : "currentColor";
+          const iconColor = (_za = (_ya = voiceConfig.iconColor) != null ? _ya : sendButtonConfig2.textColor) != null ? _za : "currentColor";
           micButton.innerHTML = "";
           const micIconSvg = renderLucideIcon(micIconName, micIconSizeNum, iconColor, 2);
           if (micIconSvg) {
@@ -16535,7 +17096,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           } else {
             micButton.textContent = "\u{1F3A4}";
           }
-          const backgroundColor2 = (_qa = voiceConfig.backgroundColor) != null ? _qa : sendButtonConfig2.backgroundColor;
+          const backgroundColor2 = (_Aa = voiceConfig.backgroundColor) != null ? _Aa : sendButtonConfig2.backgroundColor;
           if (backgroundColor2) {
             micButton.style.backgroundColor = backgroundColor2;
           } else {
@@ -16573,8 +17134,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             micButton.style.paddingBottom = "";
           }
           const tooltip2 = micButtonWrapper == null ? void 0 : micButtonWrapper.querySelector(".persona-send-button-tooltip");
-          const tooltipText2 = (_ra = voiceConfig.tooltipText) != null ? _ra : "Start voice recognition";
-          const showTooltip2 = (_sa = voiceConfig.showTooltip) != null ? _sa : false;
+          const tooltipText2 = (_Ba = voiceConfig.tooltipText) != null ? _Ba : "Start voice recognition";
+          const showTooltip2 = (_Ca = voiceConfig.showTooltip) != null ? _Ca : false;
           if (showTooltip2 && tooltipText2) {
             if (!tooltip2) {
               const newTooltip = document.createElement("div");
@@ -16594,19 +17155,19 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       } else {
         if (micButton && micButtonWrapper) {
           micButtonWrapper.style.display = "none";
-          if (((_ua = (_ta = config.voiceRecognition) == null ? void 0 : _ta.provider) == null ? void 0 : _ua.type) === "runtype") {
+          if (((_Ea = (_Da = config.voiceRecognition) == null ? void 0 : _Da.provider) == null ? void 0 : _Ea.type) === "runtype") {
             if (session.isVoiceActive()) session.toggleVoice();
           } else if (isRecording) {
             stopVoiceRecognition();
           }
         }
       }
-      const attachmentsEnabled = ((_va = config.attachments) == null ? void 0 : _va.enabled) === true;
+      const attachmentsEnabled = ((_Fa = config.attachments) == null ? void 0 : _Fa.enabled) === true;
       if (attachmentsEnabled) {
         if (!attachmentButtonWrapper || !attachmentButton) {
-          const attachmentsConfig = (_wa = config.attachments) != null ? _wa : {};
-          const sendButtonConfig2 = (_xa = config.sendButton) != null ? _xa : {};
-          const buttonSize2 = (_ya = sendButtonConfig2.size) != null ? _ya : "40px";
+          const attachmentsConfig = (_Ga = config.attachments) != null ? _Ga : {};
+          const sendButtonConfig2 = (_Ha = config.sendButton) != null ? _Ha : {};
+          const buttonSize2 = (_Ia = sendButtonConfig2.size) != null ? _Ia : "40px";
           if (!attachmentPreviewsContainer) {
             attachmentPreviewsContainer = createElement("div", "persona-attachment-previews persona-flex persona-flex-wrap persona-gap-2 persona-mb-2");
             attachmentPreviewsContainer.style.display = "none";
@@ -16615,8 +17176,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           if (!attachmentInput) {
             attachmentInput = document.createElement("input");
             attachmentInput.type = "file";
-            attachmentInput.accept = ((_za = attachmentsConfig.allowedTypes) != null ? _za : ALL_SUPPORTED_MIME_TYPES).join(",");
-            attachmentInput.multiple = ((_Aa = attachmentsConfig.maxFiles) != null ? _Aa : 4) > 1;
+            attachmentInput.accept = ((_Ja = attachmentsConfig.allowedTypes) != null ? _Ja : ALL_SUPPORTED_MIME_TYPES).join(",");
+            attachmentInput.multiple = ((_Ka = attachmentsConfig.maxFiles) != null ? _Ka : 4) > 1;
             attachmentInput.style.display = "none";
             attachmentInput.setAttribute("aria-label", "Attach files");
             composerForm.insertBefore(attachmentInput, textarea);
@@ -16627,8 +17188,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             "persona-rounded-button persona-flex persona-items-center persona-justify-center disabled:persona-opacity-50 persona-cursor-pointer persona-attachment-button"
           );
           attachmentButton.type = "button";
-          attachmentButton.setAttribute("aria-label", (_Ba = attachmentsConfig.buttonTooltipText) != null ? _Ba : "Attach file");
-          const attachIconName = (_Ca = attachmentsConfig.buttonIconName) != null ? _Ca : "paperclip";
+          attachmentButton.setAttribute("aria-label", (_La = attachmentsConfig.buttonTooltipText) != null ? _La : "Attach file");
+          const attachIconName = (_Ma = attachmentsConfig.buttonIconName) != null ? _Ma : "paperclip";
           const attachIconSize = buttonSize2;
           const buttonSizeNum = parseFloat(attachIconSize) || 40;
           const attachIconSizeNum = Math.round(buttonSizeNum * 0.6);
@@ -16660,7 +17221,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
             attachmentInput == null ? void 0 : attachmentInput.click();
           });
           attachmentButtonWrapper.appendChild(attachmentButton);
-          const attachTooltipText = (_Da = attachmentsConfig.buttonTooltipText) != null ? _Da : "Attach file";
+          const attachTooltipText = (_Na = attachmentsConfig.buttonTooltipText) != null ? _Na : "Attach file";
           const tooltip2 = createElement("div", "persona-send-button-tooltip");
           tooltip2.textContent = attachTooltipText;
           attachmentButtonWrapper.appendChild(tooltip2);
@@ -16675,12 +17236,15 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
               }
             });
           }
+          if (!container.querySelector(".persona-attachment-drop-overlay")) {
+            container.appendChild(buildDropOverlay(attachmentsConfig.dropOverlay));
+          }
         } else {
           attachmentButtonWrapper.style.display = "";
-          const attachmentsConfig = (_Ea = config.attachments) != null ? _Ea : {};
+          const attachmentsConfig = (_Oa = config.attachments) != null ? _Oa : {};
           if (attachmentInput) {
-            attachmentInput.accept = ((_Fa = attachmentsConfig.allowedTypes) != null ? _Fa : ALL_SUPPORTED_MIME_TYPES).join(",");
-            attachmentInput.multiple = ((_Ga = attachmentsConfig.maxFiles) != null ? _Ga : 4) > 1;
+            attachmentInput.accept = ((_Pa = attachmentsConfig.allowedTypes) != null ? _Pa : ALL_SUPPORTED_MIME_TYPES).join(",");
+            attachmentInput.multiple = ((_Qa = attachmentsConfig.maxFiles) != null ? _Qa : 4) > 1;
           }
           if (attachmentManager) {
             attachmentManager.updateConfig({
@@ -16697,14 +17261,15 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
         if (attachmentManager) {
           attachmentManager.clearAttachments();
         }
+        (_Ra = container.querySelector(".persona-attachment-drop-overlay")) == null ? void 0 : _Ra.remove();
       }
-      const sendButtonConfig = (_Ha = config.sendButton) != null ? _Ha : {};
-      const useIcon = (_Ia = sendButtonConfig.useIcon) != null ? _Ia : false;
-      const iconText = (_Ja = sendButtonConfig.iconText) != null ? _Ja : "\u2191";
+      const sendButtonConfig = (_Sa = config.sendButton) != null ? _Sa : {};
+      const useIcon = (_Ta = sendButtonConfig.useIcon) != null ? _Ta : false;
+      const iconText = (_Ua = sendButtonConfig.iconText) != null ? _Ua : "\u2191";
       const iconName = sendButtonConfig.iconName;
-      const tooltipText = (_Ka = sendButtonConfig.tooltipText) != null ? _Ka : "Send message";
-      const showTooltip = (_La = sendButtonConfig.showTooltip) != null ? _La : false;
-      const buttonSize = (_Ma = sendButtonConfig.size) != null ? _Ma : "40px";
+      const tooltipText = (_Va = sendButtonConfig.tooltipText) != null ? _Va : "Send message";
+      const showTooltip = (_Wa = sendButtonConfig.showTooltip) != null ? _Wa : false;
+      const buttonSize = (_Xa = sendButtonConfig.size) != null ? _Xa : "40px";
       const backgroundColor = sendButtonConfig.backgroundColor;
       const textColor = sendButtonConfig.textColor;
       if (useIcon) {
@@ -16741,7 +17306,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           sendButton.classList.add("persona-bg-persona-primary");
         }
       } else {
-        sendButton.textContent = (_Oa = (_Na = config.copy) == null ? void 0 : _Na.sendButtonLabel) != null ? _Oa : "Send";
+        sendButton.textContent = (_Za = (_Ya = config.copy) == null ? void 0 : _Ya.sendButtonLabel) != null ? _Za : "Send";
         sendButton.style.width = "";
         sendButton.style.height = "";
         sendButton.style.minWidth = "";
@@ -16801,7 +17366,7 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       } else if (tooltip) {
         tooltip.style.display = "none";
       }
-      const updatedContentMaxWidth = (_Pa = config.layout) == null ? void 0 : _Pa.contentMaxWidth;
+      const updatedContentMaxWidth = (__a = config.layout) == null ? void 0 : __a.contentMaxWidth;
       if (updatedContentMaxWidth) {
         messagesWrapper.style.maxWidth = updatedContentMaxWidth;
         messagesWrapper.style.marginLeft = "auto";
@@ -16833,8 +17398,8 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
           suggestions.style.marginRight = "";
         }
       }
-      const statusIndicatorConfig = (_Qa = config.statusIndicator) != null ? _Qa : {};
-      const isVisible = (_Ra = statusIndicatorConfig.visible) != null ? _Ra : true;
+      const statusIndicatorConfig = (_$a = config.statusIndicator) != null ? _$a : {};
+      const isVisible = (_ab = statusIndicatorConfig.visible) != null ? _ab : true;
       statusText.style.display = isVisible ? "" : "none";
       if (session) {
         const currentStatus = session.getStatus();
@@ -17890,7 +18455,166 @@ function buildSrcdoc(mountId, shellMode, docked, widgetCssPath) {
 </body>
 </html>`;
 }
-function createPreviewMessages(scene) {
+var PREVIEW_TRANSCRIPT_PRESET_LABELS = {
+  "user-message": "User message",
+  "assistant-message": "Assistant message",
+  "reasoning-streaming": "Reasoning (streaming)",
+  "reasoning-complete": "Reasoning (complete)",
+  "tool-running": "Tool call (running)",
+  "tool-complete": "Tool call (complete)"
+};
+function getPreviewTranscriptPresetLabel(preset) {
+  return PREVIEW_TRANSCRIPT_PRESET_LABELS[preset];
+}
+function createPreviewTranscriptEntry(preset, index = 0) {
+  const createdAt = new Date(Date.now() - Math.max(0, 60 - index) * 1e3).toISOString();
+  const suffix = `${preset}-${index}`;
+  switch (preset) {
+    case "user-message":
+      return {
+        id: `preview-seq-user-${suffix}`,
+        role: "user",
+        content: "Can you continue with the next step?",
+        createdAt
+      };
+    case "assistant-message":
+      return {
+        id: `preview-seq-assistant-${suffix}`,
+        role: "assistant",
+        content: "Absolutely. I can keep going and explain what happens next.",
+        createdAt
+      };
+    case "reasoning-streaming":
+      return {
+        id: `preview-seq-reasoning-stream-${suffix}`,
+        role: "assistant",
+        content: "",
+        createdAt,
+        streaming: true,
+        variant: "reasoning",
+        reasoning: {
+          id: `preview-reasoning-stream-${suffix}`,
+          status: "streaming",
+          chunks: ["Thinking through the next step in the workflow..."]
+        }
+      };
+    case "reasoning-complete":
+      return {
+        id: `preview-seq-reasoning-complete-${suffix}`,
+        role: "assistant",
+        content: "",
+        createdAt,
+        streaming: false,
+        variant: "reasoning",
+        reasoning: {
+          id: `preview-reasoning-complete-${suffix}`,
+          status: "complete",
+          chunks: ["Reviewed the requirements and finalized the reasoning output."],
+          durationMs: 1200
+        }
+      };
+    case "tool-complete":
+      return {
+        id: `preview-seq-tool-complete-${suffix}`,
+        role: "assistant",
+        content: "",
+        createdAt,
+        streaming: false,
+        variant: "tool",
+        toolCall: {
+          id: `preview-tool-complete-${suffix}`,
+          name: "Create build instructions",
+          status: "complete",
+          chunks: ["Prepared the build instructions and validated the inputs."],
+          result: { ok: true },
+          duration: 420
+        }
+      };
+    case "tool-running":
+    default:
+      return {
+        id: `preview-seq-tool-running-${suffix}`,
+        role: "assistant",
+        content: "",
+        createdAt,
+        streaming: true,
+        variant: "tool",
+        toolCall: {
+          id: `preview-tool-running-${suffix}`,
+          name: "Get platform documentation",
+          status: "running",
+          chunks: ["Fetching the relevant platform documentation..."]
+        }
+      };
+  }
+}
+function appendPreviewTranscriptEntry(messages, preset) {
+  return [...messages, createPreviewTranscriptEntry(preset, messages.length)];
+}
+var createAdvancedTranscriptPreviewMessages = () => [
+  {
+    id: "preview-adv-1",
+    role: "user",
+    content: "Can you create the product and gather the docs?",
+    createdAt: new Date(Date.now() - 18e4).toISOString()
+  },
+  {
+    id: "preview-adv-2",
+    role: "assistant",
+    content: "",
+    createdAt: new Date(Date.now() - 15e4).toISOString(),
+    streaming: true,
+    variant: "reasoning",
+    reasoning: {
+      id: "preview-reasoning",
+      status: "streaming",
+      chunks: [
+        "Now let me get the Persona embed documentation and builtin tools catalog."
+      ]
+    }
+  },
+  {
+    id: "preview-adv-3",
+    role: "assistant",
+    content: "",
+    createdAt: new Date(Date.now() - 12e4).toISOString(),
+    streaming: true,
+    variant: "tool",
+    toolCall: {
+      id: "preview-tool-1",
+      name: "Load tools",
+      status: "running",
+      chunks: ["Loaded tools, used Runtype integration"]
+    }
+  },
+  {
+    id: "preview-adv-4",
+    role: "assistant",
+    content: "",
+    createdAt: new Date(Date.now() - 9e4).toISOString(),
+    streaming: true,
+    variant: "tool",
+    toolCall: {
+      id: "preview-tool-2",
+      name: "Get platform documentation",
+      status: "running",
+      chunks: ["Get platform documentation"]
+    }
+  },
+  {
+    id: "preview-adv-5",
+    role: "assistant",
+    content: "I loaded the tools and fetched the docs. Next I can assemble the product details.",
+    createdAt: new Date(Date.now() - 3e4).toISOString()
+  }
+];
+var shouldSeedAdvancedTranscriptPreview = (config) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  return Boolean(
+    ((_b = (_a = config == null ? void 0 : config.features) == null ? void 0 : _a.toolCallDisplay) == null ? void 0 : _b.activePreview) || ((_d = (_c = config == null ? void 0 : config.features) == null ? void 0 : _c.toolCallDisplay) == null ? void 0 : _d.grouped) || ((_f = (_e = config == null ? void 0 : config.features) == null ? void 0 : _e.toolCallDisplay) == null ? void 0 : _f.collapsedMode) && config.features.toolCallDisplay.collapsedMode !== "tool-call" || ((_h = (_g = config == null ? void 0 : config.features) == null ? void 0 : _g.reasoningDisplay) == null ? void 0 : _h.activePreview)
+  );
+};
+function createPreviewMessages(scene, config, appendedMessages = []) {
   if (scene === "home") {
     return [{ id: "preview-home-1", role: "assistant", content: "Hi there! How can we help today?", createdAt: (/* @__PURE__ */ new Date()).toISOString() }];
   }
@@ -17903,20 +18627,24 @@ function createPreviewMessages(scene) {
       { id: "preview-art-2", role: "assistant", content: "Here\u2019s a project overview document for you.", createdAt: new Date(Date.now() - 6e4).toISOString() }
     ];
   }
+  if (scene === "conversation" && shouldSeedAdvancedTranscriptPreview(config)) {
+    return [...createAdvancedTranscriptPreviewMessages(), ...appendedMessages];
+  }
   return [
     { id: "preview-conv-1", role: "assistant", content: "Hello! How can I help you today?", createdAt: new Date(Date.now() - 18e4).toISOString() },
     { id: "preview-conv-2", role: "user", content: "I want to customize the theme editor preview.", createdAt: new Date(Date.now() - 12e4).toISOString() },
-    { id: "preview-conv-3", role: "assistant", content: "Absolutely. Check out the [getting started guide](https://example.com) to see what\u2019s possible, then adjust colors and tokens to match your brand.", createdAt: new Date(Date.now() - 6e4).toISOString() }
+    { id: "preview-conv-3", role: "assistant", content: "Absolutely. Check out the [getting started guide](https://example.com) to see what\u2019s possible, then adjust colors and tokens to match your brand.", createdAt: new Date(Date.now() - 6e4).toISOString() },
+    ...appendedMessages
   ];
 }
-function applySceneConfig(base, scene) {
+function applySceneConfig(base, scene, appendedMessages = []) {
   var _a, _b;
   const launcher = { ...base.launcher, enabled: true, autoExpand: scene !== "minimized" };
   const config = {
     ...base,
     launcher,
     suggestionChips: scene === "home" ? ((_a = base.suggestionChips) == null ? void 0 : _a.length) ? base.suggestionChips : HOME_SUGGESTION_CHIPS : base.suggestionChips,
-    initialMessages: createPreviewMessages(scene),
+    initialMessages: createPreviewMessages(scene, base, appendedMessages),
     storageAdapter: PREVIEW_STORAGE_ADAPTER
   };
   if (scene === "artifact") {
@@ -17925,6 +18653,19 @@ function applySceneConfig(base, scene) {
   return config;
 }
 function buildPreviewConfig(options, shellModeOverride) {
+  var _a, _b, _c, _d;
+  const theme = options.theme ? createTheme(options.theme, { validate: false }) : createTheme();
+  const scene = (_a = options.scene) != null ? _a : "conversation";
+  const base = {
+    ...DEFAULT_WIDGET_CONFIG,
+    ...options.config,
+    theme,
+    darkTheme: options.darkTheme,
+    colorScheme: (_c = shellModeOverride != null ? shellModeOverride : (_b = options.config) == null ? void 0 : _b.colorScheme) != null ? _c : "light"
+  };
+  return applySceneConfig(base, scene, (_d = options.appendedMessages) != null ? _d : []);
+}
+function buildPreviewConfigWithMessages(options, messages, shellModeOverride) {
   var _a, _b, _c;
   const theme = options.theme ? createTheme(options.theme, { validate: false }) : createTheme();
   const scene = (_a = options.scene) != null ? _a : "conversation";
@@ -17935,7 +18676,7 @@ function buildPreviewConfig(options, shellModeOverride) {
     darkTheme: options.darkTheme,
     colorScheme: (_c = shellModeOverride != null ? shellModeOverride : (_b = options.config) == null ? void 0 : _b.colorScheme) != null ? _c : "light"
   };
-  return applySceneConfig(base, scene);
+  return applySceneConfig(base, scene, messages);
 }
 
 // src/theme-editor/preview.ts
@@ -18253,20 +18994,24 @@ function createThemePreview(container, initialOptions) {
   ThemeEditorState,
   ZOOM_MAX,
   ZOOM_MIN,
+  appendPreviewTranscriptEntry,
   applySceneConfig,
   applyShellTheme,
   buildPreviewConfig,
+  buildPreviewConfigWithMessages,
   buildShellCss,
   buildSrcdoc,
   convertFromPx,
   convertToPx,
   createPreviewMessages,
+  createPreviewTranscriptEntry,
   createThemePreview,
   detectRoleAssignment,
   escapeHtml,
   findSection,
   formatCssValue,
   generateColorScale,
+  getPreviewTranscriptPresetLabel,
   getShellPalette,
   getThemeEditorPreset,
   hexToHsl,