@elizaos/ui 2.0.0-beta.2 → 2.0.3-beta.2

package/components/composites/chat/chat-message.js

@@ -1,12 +1,59 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useEffect, useRef, useState, } from "react";
+import { Sparkles, X } from "lucide-react";
+import { memo, useCallback, useEffect, useRef, useState, useSyncExternalStore, } from "react";
 import { cn } from "../../../lib/utils.js";
 import { Button } from "../../ui/button.js";
 import { Textarea } from "../../ui/textarea.js";
 import { ChatBubble } from "./chat-bubble.js";
 import { ChatMessageActions } from "./chat-message-actions.js";
-import { normalizeChatSourceKey, renderChatReactionEmoji } from "./chat-source.js";
-export function getChatMessageAnchorId(messageId) {
+import { ChatVoiceSpeakerBadge } from "./chat-source.js";
+import { normalizeChatSourceKey, renderChatReactionEmoji, resolveChatVoiceSpeakerLabel, } from "./chat-source.helpers.js";
+const HOVER_MEDIA_QUERY = "(hover: hover) and (pointer: fine)";
+const hoverSupportListeners = new Set();
+let hoverMediaQuery = null;
+let hoverMediaQueryUnsubscribe = null;
+function getHoverMediaQuery() {
+    if (hoverMediaQuery)
+        return hoverMediaQuery;
+    if (typeof window === "undefined" ||
+        typeof window.matchMedia !== "function") {
+        return null;
+    }
+    hoverMediaQuery = window.matchMedia(HOVER_MEDIA_QUERY);
+    return hoverMediaQuery;
+}
+function readSupportsHover() {
+    return getHoverMediaQuery()?.matches ?? true;
+}
+function subscribeSupportsHover(listener) {
+    hoverSupportListeners.add(listener);
+    const mediaQuery = getHoverMediaQuery();
+    if (mediaQuery && hoverSupportListeners.size === 1) {
+        const notify = () => {
+            for (const current of hoverSupportListeners)
+                current();
+        };
+        if (typeof mediaQuery.addEventListener === "function") {
+            mediaQuery.addEventListener("change", notify);
+            hoverMediaQueryUnsubscribe = () => mediaQuery.removeEventListener("change", notify);
+        }
+        else {
+            mediaQuery.addListener(notify);
+            hoverMediaQueryUnsubscribe = () => mediaQuery.removeListener(notify);
+        }
+    }
+    return () => {
+        hoverSupportListeners.delete(listener);
+        if (hoverSupportListeners.size === 0) {
+            hoverMediaQueryUnsubscribe?.();
+            hoverMediaQueryUnsubscribe = null;
+        }
+    };
+}
+function useSupportsHover() {
+    return useSyncExternalStore(subscribeSupportsHover, readSupportsHover, () => true);
+}
+function getChatMessageAnchorId(messageId) {
     return `chat-message-${messageId}`;
 }
 function normalizeSenderHandle(handle) {
@@ -21,6 +68,9 @@ function resolveSenderDisplayName(message) {
     const from = typeof message.from === "string" ? message.from.trim() : "";
     if (from)
         return from;
+    const voiceLabel = resolveChatVoiceSpeakerLabel(message.voiceSpeaker);
+    if (voiceLabel)
+        return voiceLabel;
     return normalizeSenderHandle(message.fromUserName);
 }
 function resolveSenderHandle(message, displayName) {
@@ -74,16 +124,61 @@ function ReactionStrip({ alignRight, reactions, }) {
             const title = Array.isArray(reaction.users) && reaction.users.length > 0
                 ? reaction.users.join(", ")
                 : undefined;
-            return (_jsxs("span", { "data-testid": "chat-reaction-badge", title: title, className: "inline-flex items-center gap-1 rounded-full border border-border/28 bg-bg/70 px-2 py-1 text-xs-tight font-medium text-txt-strong shadow-[0_10px_18px_-16px_rgba(15,23,42,0.45)]", children: [_jsx(ReactionEmoji, { emoji: reaction.emoji }), reaction.count > 1 ? _jsx("span", { children: reaction.count }) : null] }, `${reaction.emoji}:${reaction.count}`));
+            return (_jsxs("span", { "data-testid": "chat-reaction-badge", title: title, className: "inline-flex items-center gap-1 rounded-sm border border-border bg-bg px-2 py-1 text-xs-tight font-medium text-txt-strong ", children: [_jsx(ReactionEmoji, { emoji: reaction.emoji }), reaction.count > 1 ? _jsx("span", { children: reaction.count }) : null] }, `${reaction.emoji}:${reaction.count}`));
         }) }));
 }
-export const ChatMessage = memo(function ChatMessage({ message, isGrouped = false, agentName = "Agent", children, labels = {}, onCopy, onSpeak, onEdit, onDelete, replyTarget = null, userMessagesOnRight = true, }) {
+function arePropsEqual(prev, next) {
+    // The transcript re-renders the full list on every streamed token. Without
+    // a per-row comparator React.memo's shallow check trips on the inline
+    // `message`/`replyTarget` references that are rebuilt on every parent
+    // render even when nothing about a given row changed.
+    if (prev.message === next.message) {
+        return (prev.isGrouped === next.isGrouped &&
+            prev.agentName === next.agentName &&
+            prev.labels === next.labels &&
+            prev.onCopy === next.onCopy &&
+            prev.onDelete === next.onDelete &&
+            prev.onEdit === next.onEdit &&
+            prev.onSpeak === next.onSpeak &&
+            prev.replyTarget?.id === next.replyTarget?.id &&
+            prev.renderContent === next.renderContent &&
+            prev.userMessagesOnRight === next.userMessagesOnRight &&
+            prev.children === next.children);
+    }
+    const a = prev.message;
+    const b = next.message;
+    if (a.id !== b.id ||
+        a.role !== b.role ||
+        a.text !== b.text ||
+        a.source !== b.source ||
+        a.interrupted !== b.interrupted ||
+        a.from !== b.from ||
+        a.fromUserName !== b.fromUserName ||
+        a.avatarUrl !== b.avatarUrl ||
+        a.replyToMessageId !== b.replyToMessageId ||
+        a.replyToSenderName !== b.replyToSenderName ||
+        a.replyToSenderUserName !== b.replyToSenderUserName ||
+        a.reactions !== b.reactions ||
+        a.voiceSpeaker !== b.voiceSpeaker) {
+        return false;
+    }
+    return (prev.isGrouped === next.isGrouped &&
+        prev.agentName === next.agentName &&
+        prev.labels === next.labels &&
+        prev.onCopy === next.onCopy &&
+        prev.onDelete === next.onDelete &&
+        prev.onEdit === next.onEdit &&
+        prev.onSpeak === next.onSpeak &&
+        prev.replyTarget?.id === next.replyTarget?.id &&
+        prev.renderContent === next.renderContent &&
+        prev.userMessagesOnRight === next.userMessagesOnRight &&
+        prev.children === next.children);
+}
+export const ChatMessage = memo(function ChatMessage({ message, isGrouped = false, agentName = "Agent", children, enterOnMount = false, labels = {}, onCopy, onSpeak, onEdit, onDelete, replyTarget = null, renderContent, userMessagesOnRight = true, }) {
     const [copied, setCopied] = useState(false);
     const copiedTimerRef = useRef(null);
     const [showActions, setShowActions] = useState(false);
-    const [supportsHover, setSupportsHover] = useState(() => typeof window !== "undefined" && typeof window.matchMedia === "function"
-        ? window.matchMedia("(hover: hover) and (pointer: fine)").matches
-        : true);
+    const supportsHover = useSupportsHover();
     const [isEditing, setIsEditing] = useState(false);
     const [draftText, setDraftText] = useState(message.text);
     const [savingEdit, setSavingEdit] = useState(false);
@@ -97,11 +192,24 @@ export const ChatMessage = memo(function ChatMessage({ message, isGrouped = fals
         !message.id.startsWith("temp-");
     const canPlay = Boolean(!isUser && typeof onSpeak === "function" && message.text.trim());
     const normalizedSource = normalizeChatSourceKey(message.source) ?? undefined;
+    // Proactive interaction comments (#8792) are agent-initiated *suggestions*, not
+    // replies — render them with a distinct, one-tap-dismissible affordance.
+    const isSuggestion = !isUser && normalizedSource === "proactive-interaction";
     const senderDisplayName = isUser ? resolveSenderDisplayName(message) : null;
     const senderHandle = isUser
         ? resolveSenderHandle(message, senderDisplayName)
         : null;
     const senderPrimaryLabel = senderDisplayName ?? senderHandle ?? "User";
+    const voiceSpeakerLabel = isUser
+        ? resolveChatVoiceSpeakerLabel(message.voiceSpeaker)
+        : null;
+    // Hide the inline mic pill when its label is already the displayed sender
+    // header — keeps the bubble compact for the common case of a single OWNER.
+    const showVoiceSpeakerBadge = isUser &&
+        !isGrouped &&
+        Boolean(message.voiceSpeaker) &&
+        Boolean(voiceSpeakerLabel) &&
+        voiceSpeakerLabel !== senderDisplayName;
     const replyTargetId = typeof message.replyToMessageId === "string"
         ? message.replyToMessageId.trim()
         : "";
@@ -185,36 +293,18 @@ export const ChatMessage = memo(function ChatMessage({ message, isGrouped = fals
         }
     }, [handleCancelEditing, handleSaveEdit]);
     useEffect(() => {
-        if (!isEditing) {
-            setDraftText(message.text);
+        if (!isEditing)
             return;
-        }
         const textarea = editTextareaRef.current;
         if (!textarea)
             return;
         textarea.focus();
         textarea.setSelectionRange(textarea.value.length, textarea.value.length);
-    }, [isEditing, message.text]);
+    }, [isEditing]);
     useEffect(() => {
-        if (typeof window === "undefined" ||
-            typeof window.matchMedia !== "function") {
-            return;
-        }
-        const mediaQuery = window.matchMedia("(hover: hover) and (pointer: fine)");
-        const syncSupportsHover = () => {
-            setSupportsHover(mediaQuery.matches);
-            if (mediaQuery.matches) {
-                setShowActions(false);
-            }
-        };
-        syncSupportsHover();
-        if (typeof mediaQuery.addEventListener === "function") {
-            mediaQuery.addEventListener("change", syncSupportsHover);
-            return () => mediaQuery.removeEventListener("change", syncSupportsHover);
-        }
-        mediaQuery.addListener(syncSupportsHover);
-        return () => mediaQuery.removeListener(syncSupportsHover);
-    }, []);
+        if (supportsHover && showActions)
+            setShowActions(false);
+    }, [showActions, supportsHover]);
     useEffect(() => {
         if (supportsHover || !showActions || typeof document === "undefined") {
             return;
@@ -242,17 +332,23 @@ export const ChatMessage = memo(function ChatMessage({ message, isGrouped = fals
         event.preventDefault();
         target.scrollIntoView({ behavior: "smooth", block: "center" });
     }, [replyTargetId]);
-    return (_jsx("article", { ref: articleRef, id: getChatMessageAnchorId(message.id), className: `flex items-start gap-2 sm:gap-3 ${isRightAligned ? "justify-end" : "justify-start"} ${isGrouped ? "mt-0.5" : "mt-1.5"}`, "data-testid": "chat-message", "data-role": message.role, onMouseEnter: supportsHover ? () => setShowActions(true) : undefined, onMouseLeave: supportsHover ? () => setShowActions(false) : undefined, onTouchEnd: handleTapReveal, "aria-label": `${isUser && showSenderHeader
+    return (_jsx("article", { ref: articleRef, id: getChatMessageAnchorId(message.id), className: `flex items-start gap-2 sm:gap-3 ${isRightAligned ? "justify-end" : "justify-start"} ${isGrouped ? "mt-0.5" : "mt-1.5"} ${enterOnMount
+            ? "motion-safe:animate-[chat-turn-in_320ms_cubic-bezier(0.22,1,0.36,1)]"
+            : ""}`, "data-testid": "chat-message", "data-role": message.role, onMouseEnter: supportsHover ? () => setShowActions(true) : undefined, onMouseLeave: supportsHover ? () => setShowActions(false) : undefined, onTouchEnd: handleTapReveal, "aria-label": `${isUser && showSenderHeader
             ? senderPrimaryLabel
             : isUser
                 ? userMessagesOnRight
                     ? "Your"
                     : senderPrimaryLabel
-                : agentName} message`, children: _jsxs("div", { className: `max-w-[88%] min-w-0 sm:max-w-[80%] ${isRightAligned ? "mr-1" : "ml-1"}`, children: [!isUser && !isGrouped ? (_jsx("div", { className: cn("text-xs font-semibold text-accent", isRightAligned ? "text-right" : "text-left"), children: agentName })) : null, isUser && !isGrouped && !showSenderHeader ? (_jsx("div", { className: cn("text-xs font-semibold text-accent", isRightAligned ? "text-right" : "text-left"), children: "You" })) : null, showSenderHeader ? (_jsx("div", { className: cn("flex items-center gap-2", isRightAligned ? "justify-end" : "justify-start"), children: _jsxs("div", { className: cn("min-w-0", isRightAligned ? "text-right" : "text-left"), children: [_jsx("div", { className: "truncate text-xs font-semibold text-txt-strong", children: senderPrimaryLabel }), senderHandle ? (_jsx("div", { className: "truncate text-xs-tight text-muted", children: senderHandle })) : null] }) })) : null, _jsxs(ChatBubble, { tone: isUser ? "user" : "assistant", source: normalizedSource, className: `relative group py-1 text-[15px] leading-[1.7] whitespace-pre-wrap break-words`, style: { fontFamily: "var(--font-chat)" }, children: [showReplyReference ? (_jsx("a", { href: `#${getChatMessageAnchorId(replyTargetId)}`, onClick: handleReplyReferenceClick, className: "mb-2 block text-xs font-medium text-muted underline decoration-border/60 underline-offset-2 transition-colors hover:text-txt-strong", children: replyReferenceLabel })) : null, isEditing ? (_jsxs("div", { className: "space-y-3", children: [_jsx(Textarea, { ref: editTextareaRef, value: draftText, onChange: (event) => setDraftText(event.target.value), onKeyDown: handleEditKeyDown, className: "min-h-[110px] w-full rounded-xl border border-border/28 bg-[linear-gradient(180deg,color-mix(in_srgb,var(--card)_86%,transparent),color-mix(in_srgb,var(--bg)_95%,transparent))] px-3 py-2.5 text-[15px] leading-[1.7] text-txt outline-none shadow-[inset_0_1px_0_rgba(255,255,255,0.12),0_14px_20px_-20px_rgba(15,23,42,0.1)] focus-visible:border-accent/28 focus-visible:ring-2 focus-visible:ring-accent/12", style: { fontFamily: "var(--font-chat)" }, "aria-label": labels.edit ?? "Edit message", disabled: savingEdit }), _jsxs("div", { className: "flex items-center justify-end gap-2", children: [_jsx(Button, { variant: "surface", size: "sm", onClick: handleCancelEditing, disabled: savingEdit, className: "h-8 rounded-lg px-3 text-xs", children: labels.cancel ?? "Cancel" }), _jsx(Button, { variant: "surfaceAccent", size: "sm", onClick: () => void handleSaveEdit(), disabled: savingEdit ||
+                : agentName} message`, children: _jsxs("div", { className: `max-w-[88%] min-w-0 sm:max-w-[80%] ${isRightAligned ? "mr-1" : "ml-1"}`, children: [!isUser && !isGrouped ? (_jsx("div", { className: cn("text-xs font-semibold text-accent", isRightAligned ? "text-right" : "text-left"), children: agentName })) : null, isUser && !isGrouped && !showSenderHeader ? (_jsxs("div", { className: cn("flex items-center gap-1.5 text-xs font-semibold text-accent", isRightAligned ? "justify-end" : "justify-start"), children: [_jsx("span", { children: "You" }), showVoiceSpeakerBadge ? (_jsx(ChatVoiceSpeakerBadge, { speaker: message.voiceSpeaker, "data-testid": `chat-message-voice-speaker-${message.id}` })) : null] })) : null, showSenderHeader ? (_jsx("div", { className: cn("flex items-center gap-2", isRightAligned ? "justify-end" : "justify-start"), children: _jsxs("div", { className: cn("min-w-0", isRightAligned ? "text-right" : "text-left"), children: [_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx("div", { className: "truncate text-xs font-semibold text-txt-strong", children: senderPrimaryLabel }), showVoiceSpeakerBadge ? (_jsx(ChatVoiceSpeakerBadge, { speaker: message.voiceSpeaker, "data-testid": `chat-message-voice-speaker-${message.id}` })) : null] }), senderHandle ? (_jsx("div", { className: "truncate text-xs-tight text-muted", children: senderHandle })) : null] }) })) : null, _jsxs(ChatBubble, { tone: isUser ? "user" : "assistant", source: normalizedSource, className: cn("relative group py-1 text-[15px] leading-[1.7] whitespace-pre-wrap break-words", 
+                    // Suggestion treatment: subtle accent tint + dashed accent border so
+                    // a proactive offer reads as a suggestion, not a normal reply.
+                    isSuggestion &&
+                        "border border-dashed border-accent/45 bg-accent/[0.06]"), style: { fontFamily: "var(--font-chat)" }, "data-proactive-suggestion": isSuggestion ? "true" : undefined, children: [isSuggestion && !isEditing ? (_jsxs("div", { className: "mb-1.5 flex items-center justify-between gap-2", children: [_jsxs("span", { className: "inline-flex items-center gap-1 text-xs-tight font-medium text-accent/85", children: [_jsx(Sparkles, { className: "h-3.5 w-3.5", "aria-hidden": "true" }), labels.suggestion ?? "Suggestion"] }), onDelete ? (_jsx(Button, { variant: "surface", size: "icon", onClick: () => onDelete?.(message.id), className: "h-6 w-6 rounded-sm text-muted", title: labels.dismiss ?? "Dismiss suggestion", "aria-label": labels.dismiss ?? "Dismiss suggestion", children: _jsx(X, { className: "h-3.5 w-3.5" }) })) : null] })) : null, showReplyReference ? (_jsx("a", { href: `#${getChatMessageAnchorId(replyTargetId)}`, onClick: handleReplyReferenceClick, className: "mb-2 block text-xs font-medium text-muted underline decoration-border/60 underline-offset-2 transition-colors hover:text-txt-strong", children: replyReferenceLabel })) : null, isEditing ? (_jsxs("div", { className: "space-y-3", children: [_jsx(Textarea, { ref: editTextareaRef, value: draftText, onChange: (event) => setDraftText(event.target.value), onKeyDown: handleEditKeyDown, className: "min-h-[110px] w-full rounded-sm border border-border bg-card px-3 py-2.5 text-[15px] leading-[1.7] text-txt outline-none focus-visible:border-accent focus-visible:ring-2 focus-visible:ring-accent/30", style: { fontFamily: "var(--font-chat)" }, "aria-label": labels.edit ?? "Edit message", disabled: savingEdit }), _jsxs("div", { className: "flex items-center justify-end gap-2", children: [_jsx(Button, { variant: "surface", size: "sm", onClick: handleCancelEditing, disabled: savingEdit, className: "h-8 rounded-sm px-3 text-xs", children: labels.cancel ?? "Cancel" }), _jsx(Button, { variant: "surfaceAccent", size: "sm", onClick: () => void handleSaveEdit(), disabled: savingEdit ||
                                                 !draftText.trim() ||
-                                                draftText.trim() === message.text.trim(), className: "h-8 rounded-lg px-3 text-xs disabled:border-border/20 disabled:bg-bg-accent disabled:text-muted-strong", children: savingEdit
+                                                draftText.trim() === message.text.trim(), className: "h-8 rounded-sm px-3 text-xs disabled:border-border/20 disabled:bg-bg-accent disabled:text-muted-strong", children: savingEdit
                                                 ? (labels.saving ?? "Saving...")
-                                                : (labels.saveAndResend ?? "Save and resend") })] })] })) : ((children ?? message.text)), !isUser && message.interrupted ? (_jsx("div", { className: "mt-2 border-t border-danger/30 pt-2", children: _jsx("span", { className: "inline-flex rounded-full border border-danger/30 bg-danger/10 px-2 py-0.5 text-xs font-medium text-danger", children: labels.responseInterrupted ?? "Response interrupted" }) })) : null, !isEditing ? (_jsx("div", { className: cn("absolute top-0 flex items-center gap-1 transition-opacity duration-200", 
+                                                : (labels.saveAndResend ?? "Save and resend") })] })] })) : ((renderContent?.(message) ?? children ?? message.text)), !isUser && message.interrupted ? (_jsx("div", { className: "mt-2 border-t border-danger/30 pt-2", children: _jsx("span", { className: "inline-flex rounded-sm border border-danger/30 bg-danger/10 px-2 py-0.5 text-xs font-medium text-danger", children: labels.responseInterrupted ?? "Response interrupted" }) })) : null, !isEditing ? (_jsx("div", { className: cn("absolute top-0 flex items-center gap-1 transition-opacity duration-200", 
                             // Below the `sm` breakpoint (narrow phones) anchor the
                             // action rail to the bubble's top-right corner so it can
                             // never overflow the viewport. From `sm` up the rail
@@ -264,4 +360,4 @@ export const ChatMessage = memo(function ChatMessage({ message, isGrouped = fals
                                 : "right-1 sm:right-0 sm:translate-x-full", actionsVisible
                                 ? "opacity-100"
                                 : "pointer-events-none opacity-0"), children: _jsx(ChatMessageActions, { canDelete: Boolean(onDelete), canEdit: canEdit, canPlay: canPlay, copied: copied, labels: labels, onCopy: handleCopy, onDelete: () => onDelete?.(message.id), onEdit: handleStartEditing, onPlay: () => onSpeak?.(message.id, message.text) }) })) : null] }), _jsx(ReactionStrip, { alignRight: isRightAligned, reactions: visibleReactions })] }) }));
-});
+}, arePropsEqual);

package/components/composites/chat/chat-source.d.ts

@@ -1,23 +1,21 @@
-import type * as React from "react";
-type SourceIconProps = {
-    className?: string;
-};
-export type ChatSourceMeta = {
-    badgeClassName: string;
-    borderClassName: string;
-    iconClassName: string;
-    Icon: React.ComponentType<SourceIconProps>;
-    label: string;
-};
-export declare function normalizeChatSourceKey(source: string | null | undefined): string | null;
-export declare function registerChatSourceMetaEntries(entries: Record<string, ChatSourceMeta>): void;
-export declare function registerChatReactionEmojiRenderer(renderer: ((emoji: string) => React.ReactNode | null) | null): void;
-export declare function renderChatReactionEmoji(emoji: string): React.ReactNode | null;
-export declare function getChatSourceMeta(source: string): ChatSourceMeta;
+import type { ChatVoiceSpeaker } from "./chat-types";
+export type { ChatSourceMeta } from "./chat-source.helpers";
 export declare function ChatSourceIcon({ source, className, decorative, }: {
     className?: string;
     decorative?: boolean;
     source: string;
 }): import("react/jsx-runtime").JSX.Element;
-export {};
+/**
+ * Compact attribution pill rendered next to a voice-captured user message.
+ * Shows the speaker name with a Mic glyph and, when the speaker is the
+ * OWNER, a Crown affordance matching the shared `OwnerBadge` styling.
+ *
+ * R10 §4.1 — surface "who spoke this turn" in the chat transcript so
+ * multi-speaker rooms stay legible without leaning on entity ids.
+ */
+export declare function ChatVoiceSpeakerBadge({ speaker, className, "data-testid": dataTestId, }: {
+    speaker: ChatVoiceSpeaker | null | undefined;
+    className?: string;
+    "data-testid"?: string;
+}): import("react/jsx-runtime").JSX.Element | null;
 //# sourceMappingURL=chat-source.d.ts.map

package/components/composites/chat/chat-source.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chat-source.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/composites/chat/chat-source.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,KAAK,eAAe,GAAG;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IAC3C,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAgBF,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,GAChC,MAAM,GAAG,IAAI,CAMf;AAED,wBAAgB,6BAA6B,CAC3C,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,GACtC,IAAI,CAQN;AAED,wBAAgB,iCAAiC,CAC/C,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,IAAI,GAC3D,IAAI,CAEN;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,GAAG,IAAI,CAE7E;AAWD,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,MAAM,GAAG,cAAc,CAQhE;AAED,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,SAAS,EACT,UAAkB,GACnB,EAAE;IACD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB,2CAoBA"}
+{"version":3,"file":"chat-source.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/composites/chat/chat-source.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAErD,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAE5D,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,SAAS,EACT,UAAkB,GACnB,EAAE;IACD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;CAChB,2CAoBA;AAED;;;;;;;GAOG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,OAAO,EACP,SAAS,EACT,aAAa,EAAE,UAAU,GAC1B,EAAE;IACD,OAAO,EAAE,gBAAgB,GAAG,IAAI,GAAG,SAAS,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,kDA2BA"}

package/components/composites/chat/chat-source.helpers.d.ts

@@ -0,0 +1,25 @@
+import type * as React from "react";
+import type { ChatVoiceSpeaker } from "./chat-types";
+type SourceIconProps = {
+    className?: string;
+};
+export type ChatSourceMeta = {
+    badgeClassName: string;
+    borderClassName: string;
+    iconClassName: string;
+    Icon: React.ComponentType<SourceIconProps>;
+    label: string;
+};
+export declare function normalizeChatSourceKey(source: string | null | undefined): string | null;
+export declare function registerChatSourceMetaEntries(entries: Record<string, ChatSourceMeta>): void;
+export declare function registerChatReactionEmojiRenderer(renderer: ((emoji: string) => React.ReactNode | null) | null): void;
+export declare function renderChatReactionEmoji(emoji: string): React.ReactNode | null;
+export declare function getChatSourceMeta(source: string): ChatSourceMeta;
+/**
+ * Picks the best display label for a voice speaker attribution. Returns
+ * `null` when the speaker block has no usable label (so callers can skip
+ * the badge entirely).
+ */
+export declare function resolveChatVoiceSpeakerLabel(speaker: ChatVoiceSpeaker | null | undefined): string | null;
+export {};
+//# sourceMappingURL=chat-source.helpers.d.ts.map

package/components/composites/chat/chat-source.helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-source.helpers.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/composites/chat/chat-source.helpers.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAErD,KAAK,eAAe,GAAG;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC;IAC3C,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAgBF,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,GAChC,MAAM,GAAG,IAAI,CAMf;AAED,wBAAgB,6BAA6B,CAC3C,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,GACtC,IAAI,CAQN;AAED,wBAAgB,iCAAiC,CAC/C,QAAQ,EAAE,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,GAAG,IAAI,GAC3D,IAAI,CAEN;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,GAAG,IAAI,CAE7E;AAWD,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,MAAM,GAAG,cAAc,CAQhE;AAED;;;;GAIG;AACH,wBAAgB,4BAA4B,CAC1C,OAAO,EAAE,gBAAgB,GAAG,IAAI,GAAG,SAAS,GAC3C,MAAM,GAAG,IAAI,CAQf"}

package/components/composites/chat/chat-source.helpers.js

@@ -0,0 +1,66 @@
+import { MessageSquareText } from "lucide-react";
+const DEFAULT_CHAT_SOURCE_META = {
+    badgeClassName: "border-accent/25 bg-accent/8 text-muted-strong",
+    borderClassName: "border-accent/40",
+    iconClassName: "text-accent/85",
+    Icon: MessageSquareText,
+    label: "Message",
+};
+const chatSourceMetaRegistry = new Map();
+let chatReactionEmojiRenderer = null;
+export function normalizeChatSourceKey(source) {
+    if (typeof source !== "string") {
+        return null;
+    }
+    const normalized = source.trim().toLowerCase();
+    return normalized.length > 0 ? normalized : null;
+}
+export function registerChatSourceMetaEntries(entries) {
+    for (const [key, meta] of Object.entries(entries)) {
+        const normalized = normalizeChatSourceKey(key);
+        if (!normalized) {
+            continue;
+        }
+        chatSourceMetaRegistry.set(normalized, meta);
+    }
+}
+export function registerChatReactionEmojiRenderer(renderer) {
+    chatReactionEmojiRenderer = renderer;
+}
+export function renderChatReactionEmoji(emoji) {
+    return chatReactionEmojiRenderer?.(emoji) ?? null;
+}
+function toTitleCase(source) {
+    return source
+        .trim()
+        .split(/[\s_-]+/)
+        .filter(Boolean)
+        .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
+        .join(" ");
+}
+export function getChatSourceMeta(source) {
+    const normalized = normalizeChatSourceKey(source);
+    const known = normalized ? chatSourceMetaRegistry.get(normalized) : null;
+    if (known)
+        return known;
+    return {
+        ...DEFAULT_CHAT_SOURCE_META,
+        label: toTitleCase(source),
+    };
+}
+/**
+ * Picks the best display label for a voice speaker attribution. Returns
+ * `null` when the speaker block has no usable label (so callers can skip
+ * the badge entirely).
+ */
+export function resolveChatVoiceSpeakerLabel(speaker) {
+    if (!speaker)
+        return null;
+    const name = typeof speaker.name === "string" ? speaker.name.trim() : "";
+    if (name)
+        return name;
+    const userName = typeof speaker.userName === "string" ? speaker.userName.trim() : "";
+    if (userName)
+        return userName;
+    return null;
+}

package/components/composites/chat/chat-source.js

@@ -1,55 +1,7 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { MessageSquareText } from "lucide-react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Crown, Mic } from "lucide-react";
 import { cn } from "../../../lib/utils.js";
-const DEFAULT_CHAT_SOURCE_META = {
-    badgeClassName: "border-accent/25 bg-accent/8 text-muted-strong",
-    borderClassName: "border-accent/40",
-    iconClassName: "text-accent/85",
-    Icon: MessageSquareText,
-    label: "Message",
-};
-const chatSourceMetaRegistry = new Map();
-let chatReactionEmojiRenderer = null;
-export function normalizeChatSourceKey(source) {
-    if (typeof source !== "string") {
-        return null;
-    }
-    const normalized = source.trim().toLowerCase();
-    return normalized.length > 0 ? normalized : null;
-}
-export function registerChatSourceMetaEntries(entries) {
-    for (const [key, meta] of Object.entries(entries)) {
-        const normalized = normalizeChatSourceKey(key);
-        if (!normalized) {
-            continue;
-        }
-        chatSourceMetaRegistry.set(normalized, meta);
-    }
-}
-export function registerChatReactionEmojiRenderer(renderer) {
-    chatReactionEmojiRenderer = renderer;
-}
-export function renderChatReactionEmoji(emoji) {
-    return chatReactionEmojiRenderer?.(emoji) ?? null;
-}
-function toTitleCase(source) {
-    return source
-        .trim()
-        .split(/[\s_-]+/)
-        .filter(Boolean)
-        .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
-        .join(" ");
-}
-export function getChatSourceMeta(source) {
-    const normalized = normalizeChatSourceKey(source);
-    const known = normalized ? chatSourceMetaRegistry.get(normalized) : null;
-    if (known)
-        return known;
-    return {
-        ...DEFAULT_CHAT_SOURCE_META,
-        label: toTitleCase(source),
-    };
-}
+import { getChatSourceMeta, normalizeChatSourceKey, resolveChatVoiceSpeakerLabel, } from "./chat-source.helpers.js";
 export function ChatSourceIcon({ source, className, decorative = false, }) {
     const meta = getChatSourceMeta(source);
     const Icon = meta.Icon;
@@ -58,3 +10,18 @@ export function ChatSourceIcon({ source, className, decorative = false, }) {
             ? { "aria-hidden": true }
             : { "aria-label": meta.label, role: "img", title: meta.label }), children: _jsx(Icon, { className: className }) }));
 }
+/**
+ * Compact attribution pill rendered next to a voice-captured user message.
+ * Shows the speaker name with a Mic glyph and, when the speaker is the
+ * OWNER, a Crown affordance matching the shared `OwnerBadge` styling.
+ *
+ * R10 §4.1 — surface "who spoke this turn" in the chat transcript so
+ * multi-speaker rooms stay legible without leaning on entity ids.
+ */
+export function ChatVoiceSpeakerBadge({ speaker, className, "data-testid": dataTestId, }) {
+    const label = resolveChatVoiceSpeakerLabel(speaker);
+    if (!speaker || !label)
+        return null;
+    const isOwner = speaker.isOwner === true;
+    return (_jsxs("span", { "data-testid": dataTestId ?? "chat-voice-speaker", "data-owner": isOwner ? "true" : undefined, className: cn("inline-flex items-center gap-1 rounded-sm border border-border bg-card px-1.5 py-0.5 text-[10px] font-medium text-muted", className), title: isOwner ? `${label} (OWNER)` : label, role: "img", "aria-label": isOwner ? `${label}, OWNER, spoken` : `${label}, spoken`, children: [_jsx(Mic, { className: "h-2.5 w-2.5", "aria-hidden": true }), _jsx("span", { className: "text-txt", children: label }), isOwner ? (_jsx(Crown, { className: "h-2.5 w-2.5 text-accent", "aria-hidden": true, "data-testid": "chat-voice-speaker-owner-crown" })) : null] }));
+}

package/components/composites/chat/chat-transcript.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chat-transcript.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/composites/chat/chat-transcript.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAMpC,OAAO,KAAK,EACV,eAAe,EACf,iBAAiB,EACjB,WAAW,EACZ,MAAM,cAAc,CAAC;AAEtB,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,eAAe,EAAE,CAAC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,QAAQ,EAAE,eAAe,EAAE,CAAC;IAC5B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;IACzE,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,CAAC;IACrE,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB;AAgFD,eAAO,MAAM,cAAc,4MAcxB,mBAAmB,6CA0GpB,CAAC"}
+{"version":3,"file":"chat-transcript.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/composites/chat/chat-transcript.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAMpC,OAAO,KAAK,EACV,eAAe,EACf,iBAAiB,EACjB,WAAW,EACZ,MAAM,cAAc,CAAC;AAEtB,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iBAAiB,CAAC,EAAE,eAAe,EAAE,CAAC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,QAAQ,EAAE,eAAe,EAAE,CAAC;IAC5B,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,MAAM,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC;IACzE,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpD,oBAAoB,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,CAAC;IACrE,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB;AAgFD,eAAO,MAAM,cAAc,4MAcxB,mBAAmB,6CAqIpB,CAAC"}

package/components/composites/chat/chat-transcript.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo } from "react";
+import { memo, useEffect, useMemo, useRef } from "react";
 import { ChatBubble } from "./chat-bubble.js";
 import { ChatMessage } from "./chat-message.js";
 function renderTranscriptMessageContent(message, renderMessageContent) {
@@ -63,26 +63,46 @@ function getMessageGroupingKey(message) {
     return `user:${source}|${senderName}|${senderHandle}|${avatarUrl}`;
 }
 export const ChatTranscript = memo(function ChatTranscript({ agentName = "Agent", carryoverMessages = [], carryoverOpacity = 1, labels, messages, onCopy, onDelete, onEdit, onSpeak, renderMessageContent, typingIndicator, userMessagesOnRight = true, variant = "default", }) {
-    const normalizedMessages = messages.map(normalizeTranscriptMessage);
+    const normalizedMessages = useMemo(() => messages.map(normalizeTranscriptMessage), [messages]);
+    // Index by id so reply-target resolution is O(1) per row instead of an O(n)
+    // .find() — i.e. O(n²) over a long transcript on a phone.
+    const messagesById = useMemo(() => new Map(normalizedMessages.map((m) => [m.id, m])), [normalizedMessages]);
+    // A freshly-arrived last turn (and only that one) plays the mount entrance.
+    // `seenIdsRef` holds the ids present last render; a last message absent from it
+    // (with the transcript already non-empty) is newly arrived. We LATCH such ids
+    // into `animatedIdsRef` and keep `enterOnMount` true for the row's whole life,
+    // so streamed-token re-renders keep the class (CSS plays once, never cancels)
+    // — and reloaded history (first render, empty seen set) never animates.
+    const seenIdsRef = useRef(new Set());
+    const animatedIdsRef = useRef(new Set());
+    const lastMessageId = normalizedMessages.at(-1)?.id ?? null;
+    if (lastMessageId != null &&
+        seenIdsRef.current.size > 0 &&
+        !seenIdsRef.current.has(lastMessageId)) {
+        animatedIdsRef.current.add(lastMessageId);
+    }
+    useEffect(() => {
+        seenIdsRef.current = new Set(normalizedMessages.map((m) => m.id));
+    }, [normalizedMessages]);
     if (variant === "game-modal") {
         return (_jsxs("div", { className: "flex min-h-full w-full flex-col justify-end gap-4 px-1 py-4", children: [carryoverMessages.map((message) => {
                     const isUser = message.role === "user";
-                    return (_jsx("div", { "data-testid": "companion-message-row", "data-companion-carryover": "true", className: `flex w-full ${isUser ? "justify-end" : "justify-start"}`, style: { opacity: carryoverOpacity }, children: _jsx(ChatBubble, { tone: isUser ? "user" : "assistant", className: `max-w-[min(85%,24rem)] rounded-2xl px-4 py-3 text-[15px] leading-relaxed backdrop-blur-md ${isUser ? "rounded-br-sm" : "rounded-bl-sm"}`, children: _jsx("div", { className: "break-words", style: { fontFamily: "var(--font-chat)" }, children: renderTranscriptMessageContent(message, renderMessageContent) }) }) }, `carryover-${message.id}`));
+                    return (_jsx("div", { "data-testid": "companion-message-row", "data-companion-carryover": "true", className: `flex w-full ${isUser ? "justify-end" : "justify-start"}`, style: { opacity: carryoverOpacity }, children: _jsx(ChatBubble, { tone: isUser ? "user" : "assistant", className: `max-w-[min(85%,24rem)] rounded-sm px-4 py-3 text-[15px] leading-relaxed ${isUser ? "rounded-br-none" : "rounded-bl-none"}`, children: _jsx("div", { className: "break-words", style: { fontFamily: "var(--font-chat)" }, children: renderTranscriptMessageContent(message, renderMessageContent) }) }) }, `carryover-${message.id}`));
                 }), normalizedMessages.map((message) => {
                     const isUser = message.role === "user";
-                    return (_jsx("div", { "data-testid": "companion-message-row", className: `flex w-full ${isUser ? "justify-end" : "justify-start"}`, children: _jsx(ChatBubble, { tone: isUser ? "user" : "assistant", className: `max-w-[min(85%,24rem)] rounded-2xl px-4 py-3 text-[15px] leading-relaxed backdrop-blur-md ${isUser ? "rounded-br-sm" : "rounded-bl-sm"}`, children: _jsx("div", { className: "break-words", style: { fontFamily: "var(--font-chat)" }, children: renderTranscriptMessageContent(message, renderMessageContent) }) }) }, message.id));
+                    return (_jsx("div", { "data-testid": "companion-message-row", className: `flex w-full ${isUser ? "justify-end" : "justify-start"}`, children: _jsx(ChatBubble, { tone: isUser ? "user" : "assistant", className: `max-w-[min(85%,24rem)] rounded-sm px-4 py-3 text-[15px] leading-relaxed ${isUser ? "rounded-br-none" : "rounded-bl-none"}`, children: _jsx("div", { className: "break-words", style: { fontFamily: "var(--font-chat)" }, children: renderTranscriptMessageContent(message, renderMessageContent) }) }) }, message.id));
                 }), typingIndicator] }));
     }
     return (_jsxs("div", { className: "w-full space-y-1.5", children: [normalizedMessages.map((message, index) => {
                 const replyTarget = typeof message.replyToMessageId === "string" &&
                     message.replyToMessageId.length > 0
-                    ? (normalizedMessages.find((candidate) => candidate.id === message.replyToMessageId) ?? null)
+                    ? (messagesById.get(message.replyToMessageId) ?? null)
                     : null;
                 const previousMessage = index > 0 ? normalizedMessages[index - 1] : null;
                 const isGrouped = previousMessage?.role === message.role &&
                     previousMessage != null &&
                     getMessageGroupingKey(previousMessage) ===
                         getMessageGroupingKey(message);
-                return (_jsx(ChatMessage, { message: message, isGrouped: isGrouped, agentName: agentName, labels: labels, onCopy: onCopy, onDelete: onDelete, onEdit: onEdit, onSpeak: onSpeak, replyTarget: replyTarget, userMessagesOnRight: userMessagesOnRight, children: renderTranscriptMessageContent(message, renderMessageContent) }, message.id));
+                return (_jsx(ChatMessage, { message: message, isGrouped: isGrouped, enterOnMount: animatedIdsRef.current.has(message.id), agentName: agentName, labels: labels, onCopy: onCopy, onDelete: onDelete, onEdit: onEdit, onSpeak: onSpeak, replyTarget: replyTarget, renderContent: renderMessageContent, userMessagesOnRight: userMessagesOnRight }, message.id));
             }), typingIndicator] }));
 });

package/components/composites/chat/chat-types.d.ts

@@ -15,6 +15,10 @@ export interface ChatLabelSet {
     copy?: string;
     delete?: string;
     deleteConfirm?: string;
+    /** Eyebrow label on a proactive suggestion bubble (#8792). */
+    suggestion?: string;
+    /** Dismiss control on a proactive suggestion bubble (#8792). */
+    dismiss?: string;
     deleteNo?: string;
     deleteYes?: string;
     edit?: string;
@@ -48,12 +52,29 @@ export interface ChatAttachmentItem {
     id: string;
     name: string;
     src: string;
+    /** Attachment kind — drives the preview tile (image thumbnail vs file chip). */
+    kind?: "image" | "audio" | "video" | "document";
 }
 export interface ChatMessageReaction {
     emoji: string;
     count: number;
     users?: string[];
 }
+/**
+ * Voice speaker attribution metadata attached to a chat message. Populated
+ * when the user message was captured via voice and R2's speaker-id pipeline
+ * tagged the turn with an identified speaker.
+ */
+export interface ChatVoiceSpeaker {
+    /** Stable entity id for the speaker. */
+    entityId?: string;
+    /** Human-friendly display name shown in the bubble header. */
+    name?: string;
+    /** Connector username/handle (fallback when `name` is missing). */
+    userName?: string;
+    /** True when this speaker has the OWNER role on the device. */
+    isOwner?: boolean;
+}
 export interface ChatMessageData {
     avatarUrl?: string;
     from?: string;
@@ -67,6 +88,8 @@ export interface ChatMessageData {
     role: string;
     source?: string;
     text: string;
+    /** Voice speaker attribution when this message arrived via voice (R10 §4.1). */
+    voiceSpeaker?: ChatVoiceSpeaker;
 }
 export interface ChatMessageLabels extends ChatLabelSet {
 }

package/components/composites/chat/chat-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chat-types.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/composites/chat/chat-types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"chat-types.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/composites/chat/chat-types.ts"],"names":[],"mappings":"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"}

package/components/composites/chat/chat-typing-indicator.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ChatBubble } from "./chat-bubble.js";
 export function TypingIndicator({ agentName, className, dotClassName, variant = "default", }) {
     if (variant === "game-modal") {
-        return (_jsx("div", { className: className ?? "flex w-full justify-start", children: _jsx(ChatBubble, { tone: "assistant", className: "flex max-w-[min(85%,24rem)] items-center gap-1 rounded-2xl rounded-bl-sm px-4 py-3 backdrop-blur-md", children: [0, 150, 300].map((delay) => (_jsx("span", { className: dotClassName ??
+        return (_jsx("div", { className: className ?? "flex w-full justify-start", children: _jsx(ChatBubble, { tone: "assistant", className: "flex max-w-[min(85%,24rem)] items-center gap-1 rounded-sm px-4 py-3", children: [0, 150, 300].map((delay) => (_jsx("span", { className: dotClassName ??
                         "h-1.5 w-1.5 rounded-full bg-[color:color-mix(in_srgb,var(--muted)_82%,transparent)] animate-bounce", style: { animationDelay: `${delay}ms` } }, delay))) }) }));
     }
     return (_jsxs("div", { className: className ?? "mt-1.5 flex min-w-0 flex-col", children: [_jsx("div", { className: "mb-0.5 text-xs font-semibold text-accent", children: agentName }), _jsx("div", { className: "flex gap-1 py-1", children: [0, 200, 400].map((delay) => (_jsx("span", { className: dotClassName ??