@copilotz/chat-ui 0.9.44 → 0.9.45

package/dist/index.js

@@ -840,6 +840,10 @@ var hasRenderableAssistantBody = (message) => {
   if (Array.isArray(message.attachments) && message.attachments.length > 0) return true;
   return Boolean(message.activity?.items.length);
 };
+var filterActivity = (message, placement) => {
+  const items = message.activity?.items.filter((item) => placement === "after-content" ? item.kind === "tool" : item.kind !== "tool") ?? [];
+  return items.length > 0 ? { items } : void 0;
+};
 var defaultMarkdownComponents = {
   code: ({ node, className, children, ...props }) => {
     const inline = props.inline;
@@ -1106,6 +1110,7 @@ var MediaRenderer = memo2(function MediaRenderer2({ attachment }) {
 });
 var arePropsEqual = (prevProps, nextProps) => {
   if (prevProps.message !== nextProps.message) return false;
+  if (prevProps.fragments !== nextProps.fragments) return false;
   if (prevProps.isUser !== nextProps.isUser) return false;
   if (prevProps.userAvatar !== nextProps.userAvatar) return false;
   if (prevProps.userName !== nextProps.userName) return false;
@@ -1135,6 +1140,7 @@ var arePropsEqual = (prevProps, nextProps) => {
 };
 var Message = memo2(({
   message,
+  fragments,
   isUser,
   userAvatar,
   userName = "Voc\xEA",
@@ -1167,12 +1173,15 @@ var Message = memo2(({
   const [showActions, setShowActions] = useState2(false);
   const [actionsFocused, setActionsFocused] = useState2(false);
   const [copied, setCopied] = useState2(false);
+  const sourceMessages = fragments?.length ? fragments : [message];
+  const headerMessage = sourceMessages[0];
+  const groupContent = sourceMessages.map((sourceMessage) => sourceMessage.content.trim()).filter(Boolean).join("\n\n");
   const messageIsUser = isUser ?? message.role === "user";
-  if (!hasRenderableAssistantBody(message)) {
+  if (!sourceMessages.some(hasRenderableAssistantBody)) {
     return null;
   }
   const senderDisplay = resolveMessageSenderDisplay({
-    sender: message.sender,
+    sender: headerMessage.sender,
     fallbackName: messageIsUser ? userName : assistantName,
     fallbackAvatar: messageIsUser ? void 0 : assistantAvatar,
     fallbackAvatarUrl: messageIsUser ? userAvatar : void 0,
@@ -1182,17 +1191,17 @@ var Message = memo2(({
   const normalizedPreviewChars = Math.max(longMessagePreviewChars, 1);
   const normalizedChunkChars = Math.max(longMessageChunkChars, 1);
   const previewOverride = typeof message.metadata?.previewContent === "string" ? message.metadata.previewContent : void 0;
-  const canCollapseMessage = collapseLongMessages && !message.isStreaming && message.content.length > normalizedPreviewChars && (!collapseLongMessagesForUserOnly || messageIsUser);
+  const canCollapseMessage = collapseLongMessages && sourceMessages.length === 1 && !sourceMessages.some((sourceMessage) => sourceMessage.isStreaming) && groupContent.length > normalizedPreviewChars && (!collapseLongMessagesForUserOnly || messageIsUser);
   const isCollapsed = canCollapseMessage && !isExpanded;
-  const contentToRender = isCollapsed ? getCollapsedPreview(message.content, normalizedPreviewChars, previewOverride) : message.content;
+  const contentToRender = isCollapsed ? getCollapsedPreview(groupContent, normalizedPreviewChars, previewOverride) : groupContent;
   const shouldRenderMarkdown = !isCollapsed && (!messageIsUser || renderUserMarkdown);
   const horizontalOffsetClass = showAvatar ? messageIsUser ? compactMode ? "mr-9" : "mr-11" : compactMode ? "ml-9" : "ml-11" : "";
   const handleCopy = async () => {
     try {
-      await navigator.clipboard.writeText(message.content);
+      await navigator.clipboard.writeText(groupContent);
       setCopied(true);
       setTimeout(() => setCopied(false), 2e3);
-      onAction?.({ action: "copy", messageId: message.id, content: message.content });
+      onAction?.({ action: "copy", messageId: message.id, content: groupContent });
     } catch (error) {
       console.error("Failed to copy message:", error);
     }
@@ -1238,7 +1247,7 @@ var Message = memo2(({
           showAvatar && /* @__PURE__ */ jsx9("div", { className: `flex-shrink-0 ${compactMode ? "mt-1" : "mt-0"}`, children: /* @__PURE__ */ jsx9(
             MessageSenderAvatar,
             {
-              sender: message.sender,
+              sender: headerMessage.sender,
               fallbackName: messageIsUser ? userName : assistantName,
               fallbackAvatar: messageIsUser ? void 0 : assistantAvatar,
               fallbackAvatarUrl: messageIsUser ? userAvatar : void 0,
@@ -1254,8 +1263,8 @@ var Message = memo2(({
                 children: senderDisplay.name
               }
             ),
-            showTimestamp && /* @__PURE__ */ jsx9("span", { className: "text-xs text-muted-foreground", children: formatTime(message.timestamp) }),
-            message.isEdited && /* @__PURE__ */ jsx9(Badge, { variant: "outline", className: "text-xs", children: "editado" })
+            showTimestamp && /* @__PURE__ */ jsx9("span", { className: "text-xs text-muted-foreground", children: formatTime(headerMessage.timestamp) }),
+            sourceMessages.some((sourceMessage) => sourceMessage.isEdited) && /* @__PURE__ */ jsx9(Badge, { variant: "outline", className: "text-xs", children: "editado" })
           ] })
         ] }),
         /* @__PURE__ */ jsxs5("div", { className: `flex-1 min-w-0 ${messageIsUser ? "text-right" : "text-left"} ${horizontalOffsetClass}`, children: [
@@ -1300,25 +1309,42 @@ var Message = memo2(({
               )
             ] })
           ] }) : /* @__PURE__ */ jsxs5(Fragment2, { children: [
-            !messageIsUser && /* @__PURE__ */ jsx9(
-              AssistantActivity,
-              {
-                activity: message.activity,
-                showActivity,
-                showActivityDetails,
-                labels
-              }
-            ),
-            /* @__PURE__ */ jsx9(
-              StreamingText,
-              {
-                content: contentToRender,
-                isStreaming: message.isStreaming,
-                renderMarkdown: shouldRenderMarkdown,
-                markdown,
-                plainTextChunkChars: normalizedChunkChars
-              }
-            ),
+            sourceMessages.map((sourceMessage) => {
+              const beforeContentActivity = filterActivity(sourceMessage, "before-content");
+              const afterContentActivity = filterActivity(sourceMessage, "after-content");
+              const fragmentContent = sourceMessages.length === 1 ? contentToRender : sourceMessage.content;
+              return /* @__PURE__ */ jsxs5(React3.Fragment, { children: [
+                !messageIsUser && /* @__PURE__ */ jsx9(
+                  AssistantActivity,
+                  {
+                    activity: beforeContentActivity,
+                    showActivity,
+                    showActivityDetails,
+                    labels
+                  }
+                ),
+                fragmentContent.length > 0 && /* @__PURE__ */ jsx9(
+                  StreamingText,
+                  {
+                    content: fragmentContent,
+                    isStreaming: sourceMessage.isStreaming,
+                    renderMarkdown: shouldRenderMarkdown,
+                    markdown,
+                    plainTextChunkChars: normalizedChunkChars
+                  }
+                ),
+                !messageIsUser && /* @__PURE__ */ jsx9(
+                  AssistantActivity,
+                  {
+                    activity: afterContentActivity,
+                    showActivity,
+                    showActivityDetails,
+                    labels
+                  }
+                ),
+                sourceMessage.attachments && sourceMessage.attachments.length > 0 && /* @__PURE__ */ jsx9("div", { className: "mt-3 space-y-2", children: sourceMessage.attachments.map((attachment, index) => /* @__PURE__ */ jsx9(MediaRenderer, { attachment }, `${sourceMessage.id}:${index}`)) })
+              ] }, sourceMessage.id);
+            }),
             canCollapseMessage && /* @__PURE__ */ jsx9("div", { className: "mt-3", children: /* @__PURE__ */ jsx9(
               Button,
               {
@@ -1330,8 +1356,7 @@ var Message = memo2(({
                 onClick: handleToggleExpanded,
                 children: isCollapsed ? showMoreLabel : showLessLabel
               }
-            ) }),
-            message.attachments && message.attachments.length > 0 && /* @__PURE__ */ jsx9("div", { className: "mt-3 space-y-2", children: message.attachments.map((attachment, index) => /* @__PURE__ */ jsx9(MediaRenderer, { attachment }, index)) })
+            ) })
           ] }) }),
           !isEditing && (enableCopy || canEdit) && /* @__PURE__ */ jsxs5(
             "div",
@@ -5970,72 +5995,27 @@ var getMessageSpeakerKey = (message) => {
   }
   return message.role;
 };
-var getAssistantSpeakerTokens = (message) => {
-  if (!message || message.role !== "assistant") return [];
-  if (message.sender) {
-    return Array.from(new Set([
-      `${message.sender.type}:${message.sender.id}`,
-      message.sender.agentId ? `agent:${message.sender.agentId}` : "",
-      message.sender.externalId ? `external:${message.sender.externalId}` : ""
-    ].filter(Boolean).map((value) => value.toLowerCase())));
-  }
-  return ["assistant"];
-};
-var hasAssistantContent = (message) => message.role === "assistant" && (message.content.trim().length > 0 || Boolean(message.attachments?.length));
-var hasActivity = (message) => Boolean(message.activity?.items.length);
 var canGroupMessages = (previous, next) => {
   if (previous.role !== next.role) {
     return false;
   }
   if (previous.role !== "assistant") {
-    return getMessageSpeakerKey(previous) === getMessageSpeakerKey(next);
-  }
-  const previousTokens = getAssistantSpeakerTokens(previous);
-  const nextTokens = getAssistantSpeakerTokens(next);
-  if (!previousTokens.some((token) => nextTokens.includes(token))) return false;
-  return !(hasAssistantContent(previous) && hasActivity(next));
-};
-var mergeGroupActivity = (messages) => {
-  const merged = /* @__PURE__ */ new Map();
-  for (const activity of messages.map((message) => message.activity).filter((activity2) => Boolean(activity2))) {
-    for (const item of activity.items) merged.set(item.id, item);
-  }
-  return merged.size > 0 ? { items: Array.from(merged.values()) } : void 0;
-};
-var mergeMessageGroup = (messages) => {
-  if (messages.length === 1) {
-    return messages[0];
+    return false;
   }
-  const firstMessage = messages[0];
-  const lastMessage = messages[messages.length - 1];
-  const content = messages.map((message) => message.content.trim()).filter((value) => value.length > 0).join("\n\n");
-  const attachments = messages.flatMap((message) => message.attachments ?? []);
-  return {
-    ...lastMessage,
-    id: lastMessage.id,
-    content,
-    timestamp: firstMessage.timestamp,
-    attachments: attachments.length > 0 ? attachments : void 0,
-    isStreaming: lastMessage.isStreaming,
-    isComplete: lastMessage.isComplete,
-    isEdited: messages.some((message) => message.isEdited),
-    originalContent: void 0,
-    editedAt: lastMessage.editedAt,
-    activity: mergeGroupActivity(messages),
-    sender: lastMessage.sender ?? firstMessage.sender,
-    metadata: lastMessage.metadata
-  };
+  return getMessageSpeakerKey(previous) === getMessageSpeakerKey(next);
 };
 var groupMessagesForRender = (messages) => {
   if (messages.length === 0) return [];
   const groups = [];
   let currentGroup = [messages[0]];
   const flushGroup = () => {
-    const mergedMessage = mergeMessageGroup(currentGroup);
+    const firstMessage = currentGroup[0];
+    const lastMessage = currentGroup[currentGroup.length - 1];
     groups.push({
-      id: mergedMessage.id,
-      message: mergedMessage,
-      suggestionMessageId: currentGroup[currentGroup.length - 1].id
+      id: firstMessage.id,
+      messages: currentGroup,
+      primaryMessage: lastMessage,
+      suggestionMessageId: lastMessage.id
     });
   };
   for (let index = 1; index < messages.length; index++) {
@@ -6686,7 +6666,7 @@ var ChatUI = ({
                         },
                         children: virtualizer.getVirtualItems().map((virtualRow) => {
                           const group = groupedMessages[virtualRow.index];
-                          const message = group.message;
+                          const message = group.primaryMessage;
                           return /* @__PURE__ */ jsx28(
                             "div",
                             {
@@ -6708,6 +6688,7 @@ var ChatUI = ({
                                       Message,
                                       {
                                         message,
+                                        fragments: group.messages,
                                         ...messageProps,
                                         isExpanded: Boolean(
                                           expandedMessageIds[message.id]