veryfront 0.1.47 → 0.1.49

package/esm/src/react/components/ai/chat/composition/chat-root.d.ts

@@ -0,0 +1,43 @@
+/**
+ * ChatRoot — Context provider and container for the compound chat system.
+ *
+ * Provides ChatContextValue to all descendant components. Extra HTML div
+ * attributes (e.g. drag handlers) are forwarded to the container element.
+ *
+ * @module ai/react/components/chat/composition/chat-root
+ */
+import * as React from "react";
+import type { UIMessage } from "../../../../../agent/react/index.js";
+import type { ChatTheme } from "../../theme.js";
+import type { ModelOption } from "../../model-selector.js";
+import type { AttachmentInfo } from "../components/attachment-pill.js";
+import type { FeedbackValue } from "../components/message-feedback.js";
+import type { Source } from "../components/sources.js";
+import type { BranchInfo } from "../../../../../agent/react/index.js";
+export interface ChatRootProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children"> {
+    children: React.ReactNode;
+    messages: UIMessage[];
+    isLoading?: boolean;
+    error?: Error | null;
+    input: string;
+    setInput?: (value: string) => void;
+    onSubmit?: (e?: React.FormEvent) => void | Promise<void>;
+    onStop?: () => void;
+    onReload?: () => void;
+    model?: string;
+    models?: ModelOption[];
+    onModelChange?: (modelId: string) => void;
+    attachments?: AttachmentInfo[];
+    onAttach?: (files: FileList) => void;
+    onRemoveAttachment?: (id: string) => void;
+    editMessage?: (messageId: string, newText: string) => Promise<void>;
+    getBranches?: (messageId: string) => BranchInfo;
+    switchBranch?: (messageId: string, branchIndex: number) => void;
+    onFeedback?: (messageId: string, feedback: FeedbackValue) => void;
+    showSources?: boolean;
+    onSourceClick?: (source: Source, index: number) => void;
+    theme?: Partial<ChatTheme>;
+    maxHeight?: string;
+}
+export declare const ChatRoot: any;
+//# sourceMappingURL=chat-root.d.ts.map

package/esm/src/react/components/ai/chat/composition/chat-root.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-root.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/composition/chat-root.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AAItE,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC;IAC3F,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAG1B,QAAQ,EAAE,SAAS,EAAE,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAGrB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAGnC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACzD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAGtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC;IACvB,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAG1C,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAC/B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;IACrC,kBAAkB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAG1C,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpE,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,UAAU,CAAC;IAChD,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAGhE,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IAGlE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAGxD,KAAK,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,QAAQ,KAiHpB,CAAC"}

package/esm/src/react/components/ai/chat/composition/chat-root.js

@@ -0,0 +1,78 @@
+/**
+ * ChatRoot — Context provider and container for the compound chat system.
+ *
+ * Provides ChatContextValue to all descendant components. Extra HTML div
+ * attributes (e.g. drag handlers) are forwarded to the container element.
+ *
+ * @module ai/react/components/chat/composition/chat-root
+ */
+import * as React from "react";
+import { ChatContainer } from "../../../../primitives/index.js";
+import { cn, defaultChatTheme, generateTokenCSS, mergeThemes } from "../../theme.js";
+import { ChatContextProvider } from "../contexts/chat-context.js";
+export const ChatRoot = React.forwardRef(function ChatRoot({ children, messages, isLoading = false, error = null, input, setInput, onSubmit, onStop, onReload, model, models = [], onModelChange, attachments = [], onAttach, onRemoveAttachment, editMessage, getBranches, switchBranch, onFeedback, showSources = false, onSourceClick, theme: userTheme, maxHeight = "100%", className, style, ...containerProps }, ref) {
+    const theme = React.useMemo(() => mergeThemes(defaultChatTheme, userTheme), [userTheme]);
+    const tokenCSS = React.useMemo(() => generateTokenCSS(), []);
+    const [isAtBottom, _setIsAtBottom] = React.useState(true);
+    const scrollAreaRef = React.useRef(null);
+    const scrollToBottom = React.useCallback(() => {
+        scrollAreaRef.current?.scrollTo({
+            top: scrollAreaRef.current.scrollHeight,
+            behavior: "smooth",
+        });
+    }, []);
+    const contextValue = React.useMemo(() => ({
+        messages,
+        isLoading,
+        error,
+        input,
+        setInput: setInput ?? (() => { }),
+        onSubmit: onSubmit ?? (() => { }),
+        onStop,
+        onReload,
+        model,
+        models,
+        onModelChange,
+        attachments,
+        onAttach,
+        onRemoveAttachment,
+        editMessage,
+        getBranches,
+        switchBranch,
+        onFeedback,
+        showSources,
+        onSourceClick,
+        isEmpty: messages.length === 0,
+        isAtBottom,
+        scrollToBottom,
+        theme,
+    }), [
+        messages,
+        isLoading,
+        error,
+        input,
+        setInput,
+        onSubmit,
+        onStop,
+        onReload,
+        model,
+        models,
+        onModelChange,
+        attachments,
+        onAttach,
+        onRemoveAttachment,
+        editMessage,
+        getBranches,
+        switchBranch,
+        onFeedback,
+        showSources,
+        onSourceClick,
+        isAtBottom,
+        scrollToBottom,
+        theme,
+    ]);
+    return (React.createElement(ChatContextProvider, { value: contextValue },
+        React.createElement("style", { dangerouslySetInnerHTML: { __html: tokenCSS } }),
+        React.createElement(ChatContainer, { ref: ref, "data-vf-chat": "", className: cn(theme.container, "relative", className), style: { maxHeight, ...style }, ...containerProps }, children)));
+});
+ChatRoot.displayName = "ChatRoot";

package/esm/src/react/components/ai/chat/composition/error-banner.d.ts

@@ -0,0 +1,12 @@
+/**
+ * ErrorBanner — Inline error display with optional retry action.
+ *
+ * @module ai/react/components/chat/composition/error-banner
+ */
+export interface ErrorBannerProps {
+    error: Error;
+    onRetry?: () => void;
+    className?: string;
+}
+export declare const ErrorBanner: any;
+//# sourceMappingURL=error-banner.d.ts.map

package/esm/src/react/components/ai/chat/composition/error-banner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"error-banner.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/composition/error-banner.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAMH,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,KAoBvB,CAAC"}

package/esm/src/react/components/ai/chat/composition/error-banner.js

@@ -0,0 +1,17 @@
+/**
+ * ErrorBanner — Inline error display with optional retry action.
+ *
+ * @module ai/react/components/chat/composition/error-banner
+ */
+import * as React from "react";
+import { cn } from "../../theme.js";
+import { RefreshCwIcon } from "../../icons/index.js";
+export const ErrorBanner = React.forwardRef(function ErrorBanner({ error, onRetry, className }, ref) {
+    return (React.createElement("div", { ref: ref, className: cn("max-w-2xl mx-auto px-4 pb-2", className) },
+        React.createElement("div", { className: "px-4 py-3 bg-red-50 rounded-2xl text-red-600 text-sm flex items-center justify-between gap-3 border border-red-100" },
+            React.createElement("span", null, error.message),
+            onRetry && (React.createElement("button", { type: "button", onClick: onRetry, className: "inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium text-red-600 bg-red-100 hover:bg-red-200 rounded-full transition-colors" },
+                React.createElement(RefreshCwIcon, { className: "size-3" }),
+                "Retry")))));
+});
+ErrorBanner.displayName = "ErrorBanner";

package/esm/src/react/components/ai/chat/composition/message.d.ts

@@ -0,0 +1,54 @@
+/**
+ * Message — Compound component for rendering individual chat messages.
+ *
+ * Provides fine-grained control over per-message rendering. Each sub-component
+ * consumes MessageContext, so they must be nested inside Message.Root.
+ *
+ * @example
+ * ```tsx
+ * <Message.Root message={msg}>
+ *   <Message.Avatar />
+ *   <div className="flex-1">
+ *     <Message.Content />
+ *     <Message.Actions />
+ *   </div>
+ * </Message.Root>
+ * ```
+ *
+ * @module ai/react/components/chat/composition/message
+ */
+import * as React from "react";
+import type { BranchInfo, DynamicToolUIPart, ToolUIPart, UIMessage } from "../../../../../agent/react/index.js";
+import type { MessageContextValue } from "../contexts/message-context.js";
+import type { FeedbackValue } from "../components/message-feedback.js";
+import type { Source } from "../components/sources.js";
+export interface MessageRootProps {
+    message: UIMessage;
+    isStreaming?: boolean;
+    children: React.ReactNode;
+    className?: string;
+    editMessage?: (messageId: string, newText: string) => Promise<void>;
+    getBranches?: (messageId: string) => BranchInfo;
+    switchBranch?: (messageId: string, branchIndex: number) => void;
+    onFeedback?: (messageId: string, feedback: FeedbackValue) => void;
+    feedback?: FeedbackValue | null;
+}
+export interface MessageAvatarProps {
+    className?: string;
+}
+export interface MessageContentProps {
+    renderTool?: (tool: ToolUIPart | DynamicToolUIPart) => React.ReactNode;
+    showSteps?: boolean;
+    showSources?: boolean;
+    onSourceClick?: (source: Source, index: number) => void;
+    className?: string;
+}
+export interface MessageActionsWrapperProps {
+    className?: string;
+}
+export interface MessageFeedbackWrapperProps {
+    className?: string;
+}
+export type { MessageContentProps as MessageCompoundContentProps, MessageContextValue };
+export declare const Message: any;
+//# sourceMappingURL=message.d.ts.map

package/esm/src/react/components/ai/chat/composition/message.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"message.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/composition/message.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,UAAU,EAAE,iBAAiB,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAKhH,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AAE1E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AASvE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAavD,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,SAAS,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IAGnB,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpE,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,UAAU,CAAC;IAChD,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IAClE,QAAQ,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;CACjC;AAsGD,MAAM,WAAW,kBAAkB;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAkBD,MAAM,WAAW,mBAAmB;IAClC,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,GAAG,iBAAiB,KAAK,KAAK,CAAC,SAAS,CAAC;IACvE,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA8ED,MAAM,WAAW,0BAA0B;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAeD,MAAM,WAAW,2BAA2B;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAwCD,YAAY,EAAE,mBAAmB,IAAI,2BAA2B,EAAE,mBAAmB,EAAE,CAAC;AAExF,eAAO,MAAM,OAAO,KAOlB,CAAC"}

package/esm/src/react/components/ai/chat/composition/message.js

@@ -0,0 +1,175 @@
+/**
+ * Message — Compound component for rendering individual chat messages.
+ *
+ * Provides fine-grained control over per-message rendering. Each sub-component
+ * consumes MessageContext, so they must be nested inside Message.Root.
+ *
+ * @example
+ * ```tsx
+ * <Message.Root message={msg}>
+ *   <Message.Avatar />
+ *   <div className="flex-1">
+ *     <Message.Content />
+ *     <Message.Actions />
+ *   </div>
+ * </Message.Root>
+ * ```
+ *
+ * @module ai/react/components/chat/composition/message
+ */
+import * as React from "react";
+import { cn } from "../../theme.js";
+import { Markdown } from "../../markdown.js";
+import { MessageItem } from "../../../../primitives/index.js";
+import { MessageContextProvider, useMessageContext } from "../contexts/message-context.js";
+import { useChatContextOptional } from "../contexts/chat-context.js";
+import { MessageActions as ActionsImpl } from "../components/message-actions.js";
+import { MessageFeedback as FeedbackImpl } from "../components/message-feedback.js";
+import { BranchPicker as BranchPickerImpl } from "../components/branch-picker.js";
+import { ReasoningCard } from "../components/reasoning.js";
+import { SkillBadge } from "../components/skill-badge.js";
+import { ToolCallCard } from "../components/tool-ui.js";
+import { StepIndicator } from "../components/step-indicator.js";
+import { Sources as SourcesImpl } from "../components/sources.js";
+import { ModelAvatar as AvatarImpl } from "./model-avatar.js";
+import { extractSourcesFromParts, getTextContent, groupPartsInOrder, isSkillToolPart, } from "../utils/message-parts.js";
+const MessageRoot = React.forwardRef(function MessageRoot({ message, isStreaming = false, children, className, ...overrides }, ref) {
+    const chat = useChatContextOptional();
+    const role = message.role;
+    const parts = React.useMemo(() => groupPartsInOrder(message.parts), [message.parts]);
+    const textContent = React.useMemo(() => getTextContent(message), [message]);
+    const editMessage = overrides.editMessage ?? chat?.editMessage;
+    const getBranches = overrides.getBranches ?? chat?.getBranches;
+    const switchBranch = overrides.switchBranch ?? chat?.switchBranch;
+    const onFeedbackProp = overrides.onFeedback ?? chat?.onFeedback;
+    const branch = React.useMemo(() => getBranches?.(message.id) ?? null, [getBranches, message.id]);
+    const onCopy = React.useCallback(async () => {
+        try {
+            await navigator.clipboard.writeText(textContent);
+        }
+        catch {
+            const textarea = document.createElement("textarea");
+            textarea.value = textContent;
+            document.body.appendChild(textarea);
+            textarea.select();
+            document.execCommand("copy");
+            document.body.removeChild(textarea);
+        }
+    }, [textContent]);
+    const contextValue = React.useMemo(() => ({
+        message,
+        role,
+        isStreaming,
+        parts,
+        textContent,
+        branch,
+        onBranchPrev: branch && switchBranch
+            ? () => switchBranch(message.id, branch.current - 2)
+            : undefined,
+        onBranchNext: branch && switchBranch
+            ? () => switchBranch(message.id, branch.current)
+            : undefined,
+        onCopy,
+        onEdit: editMessage
+            ? (content) => {
+                editMessage(message.id, content);
+            }
+            : undefined,
+        onFeedback: onFeedbackProp
+            ? (value) => onFeedbackProp(message.id, value)
+            : undefined,
+        feedback: overrides.feedback,
+    }), [
+        message,
+        message.id,
+        role,
+        isStreaming,
+        parts,
+        textContent,
+        branch,
+        switchBranch,
+        onCopy,
+        editMessage,
+        onFeedbackProp,
+        overrides.feedback,
+    ]);
+    const isUser = role === "user";
+    return (React.createElement(MessageContextProvider, { value: contextValue },
+        React.createElement(MessageItem, { ref: ref, role: message.role, className: cn(isUser
+                ? "flex flex-col items-end group/msg"
+                : "flex items-start gap-3 justify-start group/msg", className) }, children)));
+});
+MessageRoot.displayName = "Message.Root";
+function MessageAvatar({ className }) {
+    const { message, role } = useMessageContext();
+    if (role === "user")
+        return null;
+    return (React.createElement(AvatarImpl, { model: message.metadata?.model || undefined, className: className }));
+}
+MessageAvatar.displayName = "Message.Avatar";
+function MessageContent({ renderTool, showSteps = false, showSources = false, onSourceClick, className, }) {
+    const { message, role, parts, textContent } = useMessageContext();
+    const chat = useChatContextOptional();
+    const shouldShowSources = showSources || chat?.showSources || false;
+    const sourceClickHandler = onSourceClick ?? chat?.onSourceClick;
+    if (role === "user") {
+        return (React.createElement("div", { className: cn(chat?.theme.message?.user, className) },
+            React.createElement("p", { className: "whitespace-pre-wrap text-[15px] leading-relaxed" }, textContent)));
+    }
+    const stepCount = parts.filter((g) => g.type === "step").length;
+    const messageSources = shouldShowSources ? extractSourcesFromParts(message.parts) : [];
+    return (React.createElement("div", { className: cn(chat?.theme.message?.assistant, "flex-1 min-w-0", className) },
+        parts.map((group, index) => {
+            if (group.type === "text") {
+                return (React.createElement(Markdown, { key: `text-${index}`, className: "text-[15px] leading-7" }, group.content));
+            }
+            if (group.type === "reasoning") {
+                return (React.createElement(ReasoningCard, { key: `reasoning-${index}`, text: group.text, isStreaming: group.isStreaming }));
+            }
+            if (group.type === "step") {
+                return showSteps && stepCount > 1
+                    ? (React.createElement(StepIndicator, { key: `step-${group.stepIndex}`, stepIndex: group.stepIndex, isComplete: group.isComplete }))
+                    : null;
+            }
+            const isSkill = isSkillToolPart(group.tool);
+            return (React.createElement("div", { key: group.tool.toolCallId, className: isSkill ? "my-2" : "my-3" }, renderTool
+                ? renderTool(group.tool)
+                : isSkill
+                    ? React.createElement(SkillBadge, { tool: group.tool })
+                    : React.createElement(ToolCallCard, { tool: group.tool })));
+        }),
+        messageSources.length > 0 && (React.createElement(SourcesImpl, { sources: messageSources, onSourceClick: sourceClickHandler }))));
+}
+MessageContent.displayName = "Message.Content";
+function MessageActionsWrapper({ className }) {
+    const { textContent, onEdit } = useMessageContext();
+    if (!textContent)
+        return null;
+    return React.createElement(ActionsImpl, { content: textContent, onEdit: onEdit, className: className });
+}
+MessageActionsWrapper.displayName = "Message.Actions";
+function MessageFeedbackWrapper({ className }) {
+    const { message, onFeedback, feedback } = useMessageContext();
+    if (!onFeedback)
+        return null;
+    return (React.createElement(FeedbackImpl, { messageId: message.id, feedback: feedback, onFeedback: (_msgId, value) => onFeedback(value), className: className }));
+}
+MessageFeedbackWrapper.displayName = "Message.Feedback";
+// ---------------------------------------------------------------------------
+// Message.BranchPicker
+// ---------------------------------------------------------------------------
+function MessageBranchPicker() {
+    const { branch, onBranchPrev, onBranchNext } = useMessageContext();
+    if (!branch || branch.total <= 1)
+        return null;
+    return (React.createElement(BranchPickerImpl, { current: branch.current, total: branch.total, onPrev: onBranchPrev ?? (() => { }), onNext: onBranchNext ?? (() => { }) }));
+}
+MessageBranchPicker.displayName = "Message.BranchPicker";
+export const Message = Object.assign(MessageRoot, {
+    Root: MessageRoot,
+    Avatar: MessageAvatar,
+    Content: MessageContent,
+    Actions: MessageActionsWrapper,
+    Feedback: MessageFeedbackWrapper,
+    BranchPicker: MessageBranchPicker,
+});

package/esm/src/react/components/ai/chat/composition/model-avatar.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Model Avatar — Provider-specific avatar icons.
+ *
+ * Uses official brand logomarks from Simple Icons (simpleicons.org).
+ *
+ * @module ai/react/components/chat/composition/model-avatar
+ */
+import * as React from "react";
+export interface ModelAvatarProps {
+    model?: string;
+    className?: string;
+}
+export declare function ModelAvatar({ model, className }: ModelAvatarProps): React.ReactElement;
+//# sourceMappingURL=model-avatar.d.ts.map

package/esm/src/react/components/ai/chat/composition/model-avatar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"model-avatar.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/composition/model-avatar.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA+CD,wBAAgB,WAAW,CACzB,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,gBAAgB,GACrC,KAAK,CAAC,YAAY,CAsCpB"}

package/esm/src/react/components/ai/chat/composition/model-avatar.js

@@ -0,0 +1,60 @@
+/**
+ * Model Avatar — Provider-specific avatar icons.
+ *
+ * Uses official brand logomarks from Simple Icons (simpleicons.org).
+ *
+ * @module ai/react/components/chat/composition/model-avatar
+ */
+import * as React from "react";
+import { cn } from "../../theme.js";
+import { SparklesIcon } from "../../icons/index.js";
+// Official Anthropic logomark — Simple Icons (viewBox 0 0 24 24)
+function AnthropicLogo({ className }) {
+    return (React.createElement("svg", { className: className, viewBox: "0 0 24 24", fill: "currentColor" },
+        React.createElement("path", { d: "M17.3041 3.541h-3.6718l6.696 16.918H24Zm-10.6082 0L0 20.459h3.7442l1.3693-3.5527h7.0052l1.3693 3.5528h3.7442L10.5363 3.5409Zm-.3712 10.2232 2.2914-5.9456 2.2914 5.9456Z" })));
+}
+// Official OpenAI logomark — Simple Icons (viewBox 0 0 24 24)
+function OpenAILogo({ className }) {
+    return (React.createElement("svg", { className: className, viewBox: "0 0 24 24", fill: "currentColor" },
+        React.createElement("path", { d: "M22.2819 9.8211a5.9847 5.9847 0 0 0-.5157-4.9108 6.0462 6.0462 0 0 0-6.5098-2.9A6.0651 6.0651 0 0 0 4.9807 4.1818a5.9847 5.9847 0 0 0-3.9977 2.9 6.0462 6.0462 0 0 0 .7427 7.0966 5.98 5.98 0 0 0 .511 4.9107 6.051 6.051 0 0 0 6.5146 2.9001A5.9847 5.9847 0 0 0 13.2599 24a6.0557 6.0557 0 0 0 5.7718-4.2058 5.9894 5.9894 0 0 0 3.9977-2.9001 6.0557 6.0557 0 0 0-.7475-7.0729zm-9.022 12.6081a4.4755 4.4755 0 0 1-2.8764-1.0408l.1419-.0804 4.7783-2.7582a.7948.7948 0 0 0 .3927-.6813v-6.7369l2.02 1.1686a.071.071 0 0 1 .038.052v5.5826a4.504 4.504 0 0 1-4.4945 4.4944zm-9.6607-4.1254a4.4708 4.4708 0 0 1-.5346-3.0137l.142.0852 4.783 2.7582a.7712.7712 0 0 0 .7806 0l5.8428-3.3685v2.3324a.0804.0804 0 0 1-.0332.0615L9.74 19.9502a4.4992 4.4992 0 0 1-6.1408-1.6464zM2.3408 7.8956a4.485 4.485 0 0 1 2.3655-1.9728V11.6a.7664.7664 0 0 0 .3879.6765l5.8144 3.3543-2.0201 1.1685a.0757.0757 0 0 1-.071 0l-4.8303-2.7865A4.504 4.504 0 0 1 2.3408 7.872zm16.5963 3.8558L13.1038 8.364 15.1192 7.2a.0757.0757 0 0 1 .071 0l4.8303 2.7913a4.4944 4.4944 0 0 1-.6765 8.1042v-5.6772a.79.79 0 0 0-.407-.667zm2.0107-3.0231l-.142-.0852-4.7735-2.7818a.7759.7759 0 0 0-.7854 0L9.409 9.2297V6.8974a.0662.0662 0 0 1 .0284-.0615l4.8303-2.7866a4.4992 4.4992 0 0 1 6.6802 4.66zM8.3065 12.863l-2.02-1.1638a.0804.0804 0 0 1-.038-.0567V6.0742a4.4992 4.4992 0 0 1 7.3757-3.4537l-.142.0805L8.704 5.459a.7948.7948 0 0 0-.3927.6813zm1.0976-2.3654l2.602-1.4998 2.6069 1.4998v2.9994l-2.5974 1.4997-2.6067-1.4997Z" })));
+}
+// Official Google Gemini logomark — Simple Icons (viewBox 0 0 24 24)
+function GeminiLogo({ className }) {
+    return (React.createElement("svg", { className: className, viewBox: "0 0 24 24", fill: "currentColor" },
+        React.createElement("path", { d: "M11.04 19.32Q12 21.51 12 24q0-2.49.93-4.68.96-2.19 2.58-3.81t3.81-2.55Q21.51 12 24 12q-2.49 0-4.68-.93a12.3 12.3 0 0 1-3.81-2.58 12.3 12.3 0 0 1-2.58-3.81Q12 2.49 12 0q0 2.49-.96 4.68-.93 2.19-2.55 3.81a12.3 12.3 0 0 1-3.81 2.58Q2.49 12 0 12q2.49 0 4.68.96 2.19.93 3.81 2.55t2.55 3.81" })));
+}
+function resolveProvider(model) {
+    const m = model.toLowerCase();
+    if (m.includes("anthropic") || m.includes("claude"))
+        return "anthropic";
+    if (m.includes("openai") || m.includes("gpt") || m.includes("o1") ||
+        m.includes("o3") || m.includes("o4"))
+        return "openai";
+    if (m.includes("google") || m.includes("gemini"))
+        return "google";
+    return "unknown";
+}
+const PROVIDER_STYLES = {
+    anthropic: "bg-[#181818]",
+    openai: "bg-[var(--foreground)]",
+    google: "bg-[var(--foreground)]",
+    unknown: "bg-[var(--muted-foreground)]",
+};
+export function ModelAvatar({ model, className }) {
+    const provider = resolveProvider(model ?? "");
+    const base = cn("mt-1 shrink-0 size-8 rounded-full flex items-center justify-center", PROVIDER_STYLES[provider], className);
+    if (provider === "anthropic") {
+        return (React.createElement("div", { className: base },
+            React.createElement(AnthropicLogo, { className: "size-4 text-[#D4A27F]" })));
+    }
+    if (provider === "openai") {
+        return (React.createElement("div", { className: base },
+            React.createElement(OpenAILogo, { className: "size-4 text-[var(--background)]" })));
+    }
+    if (provider === "google") {
+        return (React.createElement("div", { className: base },
+            React.createElement(GeminiLogo, { className: "size-4 text-[var(--background)]" })));
+    }
+    return (React.createElement("div", { className: base },
+        React.createElement(SparklesIcon, { className: "size-4 text-[var(--background)]" })));
+}

package/esm/src/react/components/ai/chat/contexts/chat-context.d.ts

@@ -0,0 +1,45 @@
+/**
+ * ChatContext — Root-level shared state for the chat component system.
+ *
+ * Provided by ChatRoot. Consumed by all descendant chat components via useChatContext().
+ *
+ * @module ai/react/components/chat/contexts/chat-context
+ */
+import * as React from "react";
+import type { UIMessage } from "../../../../../agent/react/index.js";
+import type { ChatTheme } from "../../theme.js";
+import type { ModelOption } from "../../model-selector.js";
+import type { AttachmentInfo } from "../components/attachment-pill.js";
+import type { FeedbackValue } from "../components/message-feedback.js";
+import type { Source } from "../components/sources.js";
+import type { BranchInfo } from "../../../../../agent/react/index.js";
+export interface ChatContextValue {
+    messages: UIMessage[];
+    isLoading: boolean;
+    error: Error | null;
+    input: string;
+    setInput: (value: string) => void;
+    onSubmit: (e?: React.FormEvent) => void | Promise<void>;
+    onStop?: () => void;
+    onReload?: () => void;
+    model?: string;
+    models: ModelOption[];
+    onModelChange?: (modelId: string) => void;
+    attachments: AttachmentInfo[];
+    onAttach?: (files: FileList) => void;
+    onRemoveAttachment?: (id: string) => void;
+    editMessage?: (messageId: string, newText: string) => Promise<void>;
+    getBranches?: (messageId: string) => BranchInfo;
+    switchBranch?: (messageId: string, branchIndex: number) => void;
+    onFeedback?: (messageId: string, feedback: FeedbackValue) => void;
+    showSources: boolean;
+    onSourceClick?: (source: Source, index: number) => void;
+    isEmpty: boolean;
+    isAtBottom: boolean;
+    scrollToBottom: () => void;
+    theme: ChatTheme;
+}
+export declare function useChatContext(): ChatContextValue;
+export declare function useChatContextOptional(): ChatContextValue | null;
+export declare const ChatContextProvider: any;
+//# sourceMappingURL=chat-context.d.ts.map

package/esm/src/react/components/ai/chat/contexts/chat-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-context.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/contexts/chat-context.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AACrE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AAEtE,MAAM,WAAW,gBAAgB;IAE/B,QAAQ,EAAE,SAAS,EAAE,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAGpB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAGlC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IAGtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAG1C,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;IACrC,kBAAkB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAG1C,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpE,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,UAAU,CAAC;IAChD,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAGhE,UAAU,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,KAAK,IAAI,CAAC;IAGlE,WAAW,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAGxD,OAAO,EAAE,OAAO,CAAC;IACjB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,MAAM,IAAI,CAAC;IAG3B,KAAK,EAAE,SAAS,CAAC;CAClB;AAID,wBAAgB,cAAc,IAAI,gBAAgB,CAMjD;AAED,wBAAgB,sBAAsB,IAAI,gBAAgB,GAAG,IAAI,CAEhE;AAED,eAAO,MAAM,mBAAmB,KAAuB,CAAC"}

package/esm/src/react/components/ai/chat/contexts/chat-context.js

@@ -0,0 +1,20 @@
+/**
+ * ChatContext — Root-level shared state for the chat component system.
+ *
+ * Provided by ChatRoot. Consumed by all descendant chat components via useChatContext().
+ *
+ * @module ai/react/components/chat/contexts/chat-context
+ */
+import * as React from "react";
+const ChatContext = React.createContext(null);
+export function useChatContext() {
+    const context = React.useContext(ChatContext);
+    if (!context) {
+        throw new Error("useChatContext must be used within a ChatRoot or Chat component");
+    }
+    return context;
+}
+export function useChatContextOptional() {
+    return React.useContext(ChatContext);
+}
+export const ChatContextProvider = ChatContext.Provider;

package/esm/src/react/components/ai/chat/contexts/composer-context.d.ts

@@ -0,0 +1,34 @@
+/**
+ * ComposerContext — Input/composer state for the chat input area.
+ *
+ * Provided by Composer.Root or ChatRoot. Consumed by input, submit button,
+ * attachment controls, model selector, voice input, etc.
+ *
+ * @module ai/react/components/chat/contexts/composer-context
+ */
+import * as React from "react";
+import type { AttachmentInfo } from "../components/attachment-pill.js";
+import type { ModelOption } from "../../model-selector.js";
+export interface ComposerContextValue {
+    input: string;
+    setInput: (value: string) => void;
+    onChange: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    attachments: AttachmentInfo[];
+    onAttach?: (files: FileList) => void;
+    onRemoveAttachment?: (id: string) => void;
+    attachAccept?: string;
+    onSubmit: (e?: React.FormEvent) => void;
+    isLoading: boolean;
+    canSubmit: boolean;
+    onStop?: () => void;
+    onVoice?: () => void;
+    isListening: boolean;
+    transcript?: string;
+    model?: string;
+    models: ModelOption[];
+    onModelChange?: (modelId: string) => void;
+}
+export declare function useComposerContext(): ComposerContextValue;
+export declare function useComposerContextOptional(): ComposerContextValue | null;
+export declare const ComposerContextProvider: any;
+//# sourceMappingURL=composer-context.d.ts.map

package/esm/src/react/components/ai/chat/contexts/composer-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"composer-context.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/contexts/composer-context.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,WAAW,oBAAoB;IAEnC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KAAK,IAAI,CAAC;IAGjF,WAAW,EAAE,cAAc,EAAE,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,CAAC;IACrC,kBAAkB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,SAAS,KAAK,IAAI,CAAC;IACxC,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IAGnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAGpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAID,wBAAgB,kBAAkB,IAAI,oBAAoB,CAMzD;AAED,wBAAgB,0BAA0B,IAAI,oBAAoB,GAAG,IAAI,CAExE;AAED,eAAO,MAAM,uBAAuB,KAA2B,CAAC"}

package/esm/src/react/components/ai/chat/contexts/composer-context.js

@@ -0,0 +1,21 @@
+/**
+ * ComposerContext — Input/composer state for the chat input area.
+ *
+ * Provided by Composer.Root or ChatRoot. Consumed by input, submit button,
+ * attachment controls, model selector, voice input, etc.
+ *
+ * @module ai/react/components/chat/contexts/composer-context
+ */
+import * as React from "react";
+const ComposerContext = React.createContext(null);
+export function useComposerContext() {
+    const context = React.useContext(ComposerContext);
+    if (!context) {
+        throw new Error("useComposerContext must be used within a Composer or Chat component");
+    }
+    return context;
+}
+export function useComposerContextOptional() {
+    return React.useContext(ComposerContext);
+}
+export const ComposerContextProvider = ComposerContext.Provider;

package/esm/src/react/components/ai/chat/contexts/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Chat Contexts
+ *
+ * React contexts for the compound component system. Each context provides
+ * state to a specific layer of the component tree.
+ *
+ * @module ai/react/components/chat/contexts
+ */
+export { ChatContextProvider, type ChatContextValue, useChatContext, useChatContextOptional, } from "./chat-context.js";
+export { MessageContextProvider, type MessageContextValue, useMessageContext, useMessageContextOptional, } from "./message-context.js";
+export { ComposerContextProvider, type ComposerContextValue, useComposerContext, useComposerContextOptional, } from "./composer-context.js";
+export { ThreadListContextProvider, type ThreadListContextValue, useThreadListContext, useThreadListContextOptional, } from "./thread-list-context.js";
+//# sourceMappingURL=index.d.ts.map

package/esm/src/react/components/ai/chat/contexts/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../../src/src/react/components/ai/chat/contexts/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,mBAAmB,EACnB,KAAK,gBAAgB,EACrB,cAAc,EACd,sBAAsB,GACvB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EACL,sBAAsB,EACtB,KAAK,mBAAmB,EACxB,iBAAiB,EACjB,yBAAyB,GAC1B,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EACL,uBAAuB,EACvB,KAAK,oBAAoB,EACzB,kBAAkB,EAClB,0BAA0B,GAC3B,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EACL,yBAAyB,EACzB,KAAK,sBAAsB,EAC3B,oBAAoB,EACpB,4BAA4B,GAC7B,MAAM,0BAA0B,CAAC"}

package/esm/src/react/components/ai/chat/contexts/index.js

@@ -0,0 +1,12 @@
+/**
+ * Chat Contexts
+ *
+ * React contexts for the compound component system. Each context provides
+ * state to a specific layer of the component tree.
+ *
+ * @module ai/react/components/chat/contexts
+ */
+export { ChatContextProvider, useChatContext, useChatContextOptional, } from "./chat-context.js";
+export { MessageContextProvider, useMessageContext, useMessageContextOptional, } from "./message-context.js";
+export { ComposerContextProvider, useComposerContext, useComposerContextOptional, } from "./composer-context.js";
+export { ThreadListContextProvider, useThreadListContext, useThreadListContextOptional, } from "./thread-list-context.js";