@gendive/chatllm 0.4.0 → 0.6.0

package/dist/react/index.d.mts

@@ -57,6 +57,14 @@ interface AlternativeResponse {
     model: string;
     content: string;
     timestamp: number;
+    sources?: SourceItem[];
+}
+interface SourceItem {
+    id: string;
+    title: string;
+    url: string;
+    snippet?: string;
+    favicon?: string;
 }
 interface ChatMessage {
     id: string;
@@ -65,6 +73,7 @@ interface ChatMessage {
     model?: string;
     timestamp: number;
     alternatives?: AlternativeResponse[];
+    sources?: SourceItem[];
 }
 interface ChatSession {
     id: string;
@@ -139,7 +148,7 @@ interface ChatUIProps {
     /** CSS 클래스 */
     className?: string;
     /** 메시지 전송 핸들러 (커스텀 API 사용 시) */
-    onSendMessage?: (params: SendMessageParams) => Promise<ReadableStream<Uint8Array> | string>;
+    onSendMessage?: (params: SendMessageParams) => Promise<SendMessageResponse>;
     /** 세션 변경 핸들러 */
     onSessionChange?: (session: ChatSession | null) => void;
     /** 에러 핸들러 */
@@ -155,6 +164,11 @@ interface SendMessageParams {
     apiKey?: string;
     systemPrompt?: string;
 }
+/** onSendMessage 반환 타입 */
+type SendMessageResponse = ReadableStream<Uint8Array> | string | {
+    content: string;
+    sources?: SourceItem[];
+};
 interface ChatUIComponents {
     /** 사이드바 컴포넌트 */
     Sidebar?: React.ComponentType<SidebarProps>;
@@ -191,7 +205,9 @@ interface MessageListProps {
     onEdit: (message: ChatMessage) => void;
     onRegenerate: (id: string) => void;
     onQuote: (text: string) => void;
-    onAskOtherModel?: (messageId: string, targetModel: string) => void;
+    onAskOtherModel?: (userMessageId: string, assistantMessageId: string, targetModel: string) => void;
+    onSetActiveAlternative?: (assistantMessageId: string, index: number) => void;
+    activeAlternatives?: Record<string, number>;
     models?: ModelConfig[];
     copiedId: string | null;
     editingId: string | null;
@@ -206,10 +222,11 @@ interface MessageBubbleProps {
     onRegenerate?: () => void;
     onQuote?: (text: string) => void;
     onAskOtherModel?: (targetModel: string) => void;
+    onAlternativeChange?: (index: number) => void;
+    nextAssistantMessage?: ChatMessage | null;
+    activeAlternativeIndex?: number;
     models?: ModelConfig[];
     alternatives?: AlternativeResponse[];
-    activeAlternativeIndex?: number;
-    onAlternativeChange?: (index: number) => void;
 }
 interface InputProps {
     value: string;
@@ -268,6 +285,7 @@ interface UseChatUIReturn {
     copiedMessageId: string | null;
     editingMessageId: string | null;
     personalization: PersonalizationConfig;
+    activeAlternatives: Record<string, number>;
     setInput: (value: string) => void;
     sendMessage: (content?: string) => Promise<void>;
     stopGeneration: () => void;
@@ -286,6 +304,8 @@ interface UseChatUIReturn {
     saveEdit: (content: string) => Promise<void>;
     regenerate: (messageId: string) => Promise<void>;
     askOtherModel: (messageId: string, targetModel: string) => Promise<void>;
+    setActiveAlternative: (assistantMessageId: string, index: number) => void;
+    getActiveAlternative: (assistantMessageId: string) => number;
     updatePersonalization: (config: Partial<PersonalizationConfig>) => void;
     models: ModelConfig[];
 }
@@ -322,7 +342,7 @@ interface UseChatUIOptions {
     /** 압축 후 유지할 메시지 수 */
     keepRecentMessages?: number;
     /** 커스텀 메시지 전송 핸들러 */
-    onSendMessage?: (params: SendMessageParams) => Promise<ReadableStream<Uint8Array> | string>;
+    onSendMessage?: (params: SendMessageParams) => Promise<SendMessageResponse>;
     /** 세션 변경 핸들러 */
     onSessionChange?: (session: ChatSession | null) => void;
     /** 에러 핸들러 */
@@ -493,4 +513,4 @@ interface SettingsModalProps {
 }
 declare const SettingsModal: React$1.FC<SettingsModalProps>;
 
-export { type ActionItem, type ActionMenuProps, type AlternativeResponse, ChatHeader, ChatInput, type ChatMessage, type ChatSession, ChatSidebar, ChatUI, type ChatUIComponents, type ChatUIProps, EmptyState, type EmptyStateProps, type HeaderProps, Icon, type IconName, type IconProps, IconSvg, type InputProps, LinkChip, type LinkChipProps, MarkdownRenderer, type MarkdownRendererProps, type MemoryItem, MemoryPanel, type MemoryPanelProps, MessageBubble, type MessageBubbleProps, MessageList, type MessageListProps, type ModelConfig, type ModelSelectorProps, type PersonalizationConfig, type PromptTemplate, type ProviderType, type ResponseStyle, type SendMessageParams, SettingsModal, type SettingsModalProps, type SettingsTab, type SidebarProps, type ThemeConfig, type ThemeMode, type UseChatUIOptions, type UseChatUIReturn, type UserProfile, useChatUI };
+export { type ActionItem, type ActionMenuProps, type AlternativeResponse, ChatHeader, ChatInput, type ChatMessage, type ChatSession, ChatSidebar, ChatUI, type ChatUIComponents, type ChatUIProps, EmptyState, type EmptyStateProps, type HeaderProps, Icon, type IconName, type IconProps, IconSvg, type InputProps, LinkChip, type LinkChipProps, MarkdownRenderer, type MarkdownRendererProps, type MemoryItem, MemoryPanel, type MemoryPanelProps, MessageBubble, type MessageBubbleProps, MessageList, type MessageListProps, type ModelConfig, type ModelSelectorProps, type PersonalizationConfig, type PromptTemplate, type ProviderType, type ResponseStyle, type SendMessageParams, type SendMessageResponse, SettingsModal, type SettingsModalProps, type SettingsTab, type SidebarProps, type SourceItem, type ThemeConfig, type ThemeMode, type UseChatUIOptions, type UseChatUIReturn, type UserProfile, useChatUI };

package/dist/react/index.d.ts

@@ -57,6 +57,14 @@ interface AlternativeResponse {
     model: string;
     content: string;
     timestamp: number;
+    sources?: SourceItem[];
+}
+interface SourceItem {
+    id: string;
+    title: string;
+    url: string;
+    snippet?: string;
+    favicon?: string;
 }
 interface ChatMessage {
     id: string;
@@ -65,6 +73,7 @@ interface ChatMessage {
     model?: string;
     timestamp: number;
     alternatives?: AlternativeResponse[];
+    sources?: SourceItem[];
 }
 interface ChatSession {
     id: string;
@@ -139,7 +148,7 @@ interface ChatUIProps {
     /** CSS 클래스 */
     className?: string;
     /** 메시지 전송 핸들러 (커스텀 API 사용 시) */
-    onSendMessage?: (params: SendMessageParams) => Promise<ReadableStream<Uint8Array> | string>;
+    onSendMessage?: (params: SendMessageParams) => Promise<SendMessageResponse>;
     /** 세션 변경 핸들러 */
     onSessionChange?: (session: ChatSession | null) => void;
     /** 에러 핸들러 */
@@ -155,6 +164,11 @@ interface SendMessageParams {
     apiKey?: string;
     systemPrompt?: string;
 }
+/** onSendMessage 반환 타입 */
+type SendMessageResponse = ReadableStream<Uint8Array> | string | {
+    content: string;
+    sources?: SourceItem[];
+};
 interface ChatUIComponents {
     /** 사이드바 컴포넌트 */
     Sidebar?: React.ComponentType<SidebarProps>;
@@ -191,7 +205,9 @@ interface MessageListProps {
     onEdit: (message: ChatMessage) => void;
     onRegenerate: (id: string) => void;
     onQuote: (text: string) => void;
-    onAskOtherModel?: (messageId: string, targetModel: string) => void;
+    onAskOtherModel?: (userMessageId: string, assistantMessageId: string, targetModel: string) => void;
+    onSetActiveAlternative?: (assistantMessageId: string, index: number) => void;
+    activeAlternatives?: Record<string, number>;
     models?: ModelConfig[];
     copiedId: string | null;
     editingId: string | null;
@@ -206,10 +222,11 @@ interface MessageBubbleProps {
     onRegenerate?: () => void;
     onQuote?: (text: string) => void;
     onAskOtherModel?: (targetModel: string) => void;
+    onAlternativeChange?: (index: number) => void;
+    nextAssistantMessage?: ChatMessage | null;
+    activeAlternativeIndex?: number;
     models?: ModelConfig[];
     alternatives?: AlternativeResponse[];
-    activeAlternativeIndex?: number;
-    onAlternativeChange?: (index: number) => void;
 }
 interface InputProps {
     value: string;
@@ -268,6 +285,7 @@ interface UseChatUIReturn {
     copiedMessageId: string | null;
     editingMessageId: string | null;
     personalization: PersonalizationConfig;
+    activeAlternatives: Record<string, number>;
     setInput: (value: string) => void;
     sendMessage: (content?: string) => Promise<void>;
     stopGeneration: () => void;
@@ -286,6 +304,8 @@ interface UseChatUIReturn {
     saveEdit: (content: string) => Promise<void>;
     regenerate: (messageId: string) => Promise<void>;
     askOtherModel: (messageId: string, targetModel: string) => Promise<void>;
+    setActiveAlternative: (assistantMessageId: string, index: number) => void;
+    getActiveAlternative: (assistantMessageId: string) => number;
     updatePersonalization: (config: Partial<PersonalizationConfig>) => void;
     models: ModelConfig[];
 }
@@ -322,7 +342,7 @@ interface UseChatUIOptions {
     /** 압축 후 유지할 메시지 수 */
     keepRecentMessages?: number;
     /** 커스텀 메시지 전송 핸들러 */
-    onSendMessage?: (params: SendMessageParams) => Promise<ReadableStream<Uint8Array> | string>;
+    onSendMessage?: (params: SendMessageParams) => Promise<SendMessageResponse>;
     /** 세션 변경 핸들러 */
     onSessionChange?: (session: ChatSession | null) => void;
     /** 에러 핸들러 */
@@ -493,4 +513,4 @@ interface SettingsModalProps {
 }
 declare const SettingsModal: React$1.FC<SettingsModalProps>;
 
-export { type ActionItem, type ActionMenuProps, type AlternativeResponse, ChatHeader, ChatInput, type ChatMessage, type ChatSession, ChatSidebar, ChatUI, type ChatUIComponents, type ChatUIProps, EmptyState, type EmptyStateProps, type HeaderProps, Icon, type IconName, type IconProps, IconSvg, type InputProps, LinkChip, type LinkChipProps, MarkdownRenderer, type MarkdownRendererProps, type MemoryItem, MemoryPanel, type MemoryPanelProps, MessageBubble, type MessageBubbleProps, MessageList, type MessageListProps, type ModelConfig, type ModelSelectorProps, type PersonalizationConfig, type PromptTemplate, type ProviderType, type ResponseStyle, type SendMessageParams, SettingsModal, type SettingsModalProps, type SettingsTab, type SidebarProps, type ThemeConfig, type ThemeMode, type UseChatUIOptions, type UseChatUIReturn, type UserProfile, useChatUI };
+export { type ActionItem, type ActionMenuProps, type AlternativeResponse, ChatHeader, ChatInput, type ChatMessage, type ChatSession, ChatSidebar, ChatUI, type ChatUIComponents, type ChatUIProps, EmptyState, type EmptyStateProps, type HeaderProps, Icon, type IconName, type IconProps, IconSvg, type InputProps, LinkChip, type LinkChipProps, MarkdownRenderer, type MarkdownRendererProps, type MemoryItem, MemoryPanel, type MemoryPanelProps, MessageBubble, type MessageBubbleProps, MessageList, type MessageListProps, type ModelConfig, type ModelSelectorProps, type PersonalizationConfig, type PromptTemplate, type ProviderType, type ResponseStyle, type SendMessageParams, type SendMessageResponse, SettingsModal, type SettingsModalProps, type SettingsTab, type SidebarProps, type SourceItem, type ThemeConfig, type ThemeMode, type UseChatUIOptions, type UseChatUIReturn, type UserProfile, useChatUI };

package/dist/react/index.js

@@ -108,6 +108,7 @@ var useChatUI = (options) => {
     ...DEFAULT_PERSONALIZATION,
     ...initialPersonalization
   });
+  const [activeAlternatives, setActiveAlternatives] = (0, import_react.useState)({});
   const abortControllerRef = (0, import_react.useRef)(null);
   const currentSession = sessions.find((s) => s.id === currentSessionId) || null;
   const messages = currentSession?.messages || [];
@@ -408,6 +409,22 @@ ${contextSummary}` },
           );
           return;
         }
+        if (typeof result === "object" && "content" in result) {
+          setSessions(
+            (prev) => prev.map((s) => {
+              if (s.id === capturedSessionId) {
+                return {
+                  ...s,
+                  messages: s.messages.map(
+                    (m) => m.id === assistantMessageId ? { ...m, content: result.content, sources: result.sources } : m
+                  )
+                };
+              }
+              return s;
+            })
+          );
+          return;
+        }
         response = new Response(result);
       } else {
         response = await fetch(apiEndpoint, {
@@ -567,6 +584,7 @@ ${currentSession.contextSummary}` },
       const modelConfig = models.find((m) => m.id === targetModel);
       const provider = modelConfig?.provider || "ollama";
       let responseContent = "";
+      let responseSources;
       if (onSendMessage) {
         const result = await onSendMessage({
           messages: messagesForApi,
@@ -577,6 +595,9 @@ ${currentSession.contextSummary}` },
         });
         if (typeof result === "string") {
           responseContent = result;
+        } else if (typeof result === "object" && "content" in result) {
+          responseContent = result.content;
+          responseSources = result.sources;
         } else {
           const reader = result.getReader();
           const decoder = new TextDecoder();
@@ -640,7 +661,8 @@ ${currentSession.contextSummary}` },
         id: generateId("alt"),
         model: targetModel,
         content: responseContent,
-        timestamp: Date.now()
+        timestamp: Date.now(),
+        sources: responseSources
       };
       const capturedSessionId = currentSessionId;
       setSessions(
@@ -686,6 +708,15 @@ ${currentSession.contextSummary}` },
     onSendMessage,
     onError
   ]);
+  const setActiveAlternative = (0, import_react.useCallback)((assistantMessageId, index) => {
+    setActiveAlternatives((prev) => ({
+      ...prev,
+      [assistantMessageId]: index
+    }));
+  }, []);
+  const getActiveAlternative = (0, import_react.useCallback)((assistantMessageId) => {
+    return activeAlternatives[assistantMessageId] ?? 0;
+  }, [activeAlternatives]);
   return {
     // State
     sessions,
@@ -702,6 +733,7 @@ ${currentSession.contextSummary}` },
     copiedMessageId,
     editingMessageId,
     personalization,
+    activeAlternatives,
     // Actions
     setInput,
     sendMessage,
@@ -721,6 +753,8 @@ ${currentSession.contextSummary}` },
     saveEdit,
     regenerate,
     askOtherModel,
+    setActiveAlternative,
+    getActiveAlternative,
     updatePersonalization,
     models
   };
@@ -2186,15 +2220,20 @@ var MessageBubble = ({
   models,
   alternatives,
   activeAlternativeIndex = 0,
-  onAlternativeChange
+  onAlternativeChange,
+  nextAssistantMessage
 }) => {
   const [showActions, setShowActions] = (0, import_react6.useState)(false);
   const [showModelMenu, setShowModelMenu] = (0, import_react6.useState)(false);
   const isUser = message.role === "user";
   const isAssistant = message.role === "assistant";
-  const otherModels = models?.filter((m) => m.id !== message.model) || [];
-  const displayContent = alternatives && alternatives.length > 0 && activeAlternativeIndex > 0 ? alternatives[activeAlternativeIndex - 1]?.content || message.content : message.content;
-  const displayModel = alternatives && alternatives.length > 0 && activeAlternativeIndex > 0 ? alternatives[activeAlternativeIndex - 1]?.model : message.model;
+  const relevantAlternatives = isUser ? alternatives : message.alternatives;
+  const relevantActiveIndex = activeAlternativeIndex;
+  const currentAssistantModel = isUser ? nextAssistantMessage?.model : message.model;
+  const otherModels = models?.filter((m) => m.id !== currentAssistantModel) || [];
+  const displayContent = isAssistant && relevantAlternatives && relevantAlternatives.length > 0 && relevantActiveIndex > 0 ? relevantAlternatives[relevantActiveIndex - 1]?.content || message.content : message.content;
+  const displayModel = isAssistant && relevantAlternatives && relevantAlternatives.length > 0 && relevantActiveIndex > 0 ? relevantAlternatives[relevantActiveIndex - 1]?.model : message.model;
+  const displaySources = isAssistant && relevantAlternatives && relevantAlternatives.length > 0 && relevantActiveIndex > 0 ? relevantAlternatives[relevantActiveIndex - 1]?.sources : message.sources;
   const handleMouseUp = () => {
     if (!onQuote) return;
     const selection = window.getSelection();
@@ -2319,7 +2358,44 @@ var MessageBubble = ({
               ]
             }
           ),
-          alternatives && alternatives.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+          displaySources && displaySources.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+            "div",
+            {
+              style: {
+                display: "flex",
+                flexWrap: "wrap",
+                gap: "8px",
+                marginTop: "12px",
+                paddingTop: "12px",
+                borderTop: "1px solid var(--chatllm-border-light, #f3f4f6)"
+              },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  "span",
+                  {
+                    style: {
+                      fontSize: "12px",
+                      fontWeight: 500,
+                      color: "var(--chatllm-text-muted, #9ca3af)",
+                      marginRight: "4px"
+                    },
+                    children: "\uCD9C\uCC98:"
+                  }
+                ),
+                displaySources.map((source, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+                  LinkChip,
+                  {
+                    text: source.title,
+                    url: source.url,
+                    index: index + 1,
+                    showFavicon: true
+                  },
+                  source.id
+                ))
+              ]
+            }
+          ),
+          isUser && relevantAlternatives && relevantAlternatives.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
             "div",
             {
               style: {
@@ -2334,30 +2410,30 @@ var MessageBubble = ({
                 /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
                   "button",
                   {
-                    onClick: () => onAlternativeChange?.(Math.max(0, activeAlternativeIndex - 1)),
-                    disabled: activeAlternativeIndex === 0,
+                    onClick: () => onAlternativeChange?.(Math.max(0, relevantActiveIndex - 1)),
+                    disabled: relevantActiveIndex === 0,
                     style: {
                       ...navButtonStyle,
-                      opacity: activeAlternativeIndex === 0 ? 0.5 : 1,
-                      cursor: activeAlternativeIndex === 0 ? "not-allowed" : "pointer"
+                      opacity: relevantActiveIndex === 0 ? 0.5 : 1,
+                      cursor: relevantActiveIndex === 0 ? "not-allowed" : "pointer"
                     },
                     children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconSvg, { name: "arrow-left-line", size: 14 })
                   }
                 ),
                 /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { style: { fontSize: "12px", color: "var(--chatllm-text-muted, #9ca3af)" }, children: [
-                  activeAlternativeIndex + 1,
+                  relevantActiveIndex + 1,
                   " / ",
-                  alternatives.length + 1
+                  relevantAlternatives.length + 1
                 ] }),
                 /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
                   "button",
                   {
-                    onClick: () => onAlternativeChange?.(Math.min(alternatives.length, activeAlternativeIndex + 1)),
-                    disabled: activeAlternativeIndex === alternatives.length,
+                    onClick: () => onAlternativeChange?.(Math.min(relevantAlternatives.length, relevantActiveIndex + 1)),
+                    disabled: relevantActiveIndex === relevantAlternatives.length,
                     style: {
                       ...navButtonStyle,
-                      opacity: activeAlternativeIndex === alternatives.length ? 0.5 : 1,
-                      cursor: activeAlternativeIndex === alternatives.length ? "not-allowed" : "pointer"
+                      opacity: relevantActiveIndex === relevantAlternatives.length ? 0.5 : 1,
+                      cursor: relevantActiveIndex === relevantAlternatives.length ? "not-allowed" : "pointer"
                     },
                     children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconSvg, { name: "arrow-right-line", size: 14 })
                   }
@@ -2384,7 +2460,7 @@ var MessageBubble = ({
                 ) }),
                 isUser && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { onClick: onEdit, style: actionButtonStyle, title: "\uC218\uC815", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconSvg, { name: "edit-line", size: 16, color: "var(--chatllm-text-muted, #9ca3af)" }) }),
                 isAssistant && onRegenerate && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { onClick: onRegenerate, style: actionButtonStyle, title: "\uB2E4\uC2DC \uC0DD\uC131", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconSvg, { name: "refresh-line", size: 16, color: "var(--chatllm-text-muted, #9ca3af)" }) }),
-                isAssistant && onAskOtherModel && otherModels.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { position: "relative" }, children: [
+                isUser && onAskOtherModel && otherModels.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { position: "relative" }, children: [
                   /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
                     "button",
                     {
@@ -2534,6 +2610,8 @@ var MessageList = ({
   onRegenerate,
   onQuote,
   onAskOtherModel,
+  onSetActiveAlternative,
+  activeAlternatives = {},
   models,
   copiedId,
   editingId
@@ -2588,23 +2666,31 @@ var MessageList = ({
       },
       onMouseUp: handleMouseUp,
       children: [
-        messages.map((message, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-          MessageBubble,
-          {
-            message,
-            isLoading: isLoading && index === messages.length - 1 && message.role === "assistant",
-            isCopied: copiedId === message.id,
-            isEditing: editingId === message.id,
-            onCopy: () => onCopy(message.content, message.id),
-            onEdit: () => onEdit(message),
-            onRegenerate: message.role === "assistant" ? () => onRegenerate(message.id) : void 0,
-            onQuote,
-            onAskOtherModel: message.role === "assistant" && onAskOtherModel ? (targetModel) => onAskOtherModel(message.id, targetModel) : void 0,
-            models,
-            alternatives: message.alternatives
-          },
-          message.id
-        )),
+        messages.map((message, index) => {
+          const nextAssistant = message.role === "user" && index + 1 < messages.length ? messages[index + 1] : null;
+          const assistantForAlts = nextAssistant?.role === "assistant" ? nextAssistant : null;
+          const activeAltIndex = assistantForAlts ? activeAlternatives[assistantForAlts.id] ?? 0 : 0;
+          return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+            MessageBubble,
+            {
+              message,
+              isLoading: isLoading && index === messages.length - 1 && message.role === "assistant",
+              isCopied: copiedId === message.id,
+              isEditing: editingId === message.id,
+              onCopy: () => onCopy(message.content, message.id),
+              onEdit: () => onEdit(message),
+              onRegenerate: message.role === "assistant" ? () => onRegenerate(message.id) : void 0,
+              onQuote,
+              nextAssistantMessage: assistantForAlts,
+              activeAlternativeIndex: message.role === "user" ? activeAltIndex : activeAlternatives[message.id] ?? 0,
+              onAskOtherModel: message.role === "user" && assistantForAlts && onAskOtherModel ? (targetModel) => onAskOtherModel(message.id, assistantForAlts.id, targetModel) : void 0,
+              onAlternativeChange: message.role === "user" && assistantForAlts && onSetActiveAlternative ? (idx) => onSetActiveAlternative(assistantForAlts.id, idx) : message.role === "assistant" && onSetActiveAlternative ? (idx) => onSetActiveAlternative(message.id, idx) : void 0,
+              models,
+              alternatives: message.role === "assistant" ? message.alternatives : assistantForAlts?.alternatives
+            },
+            message.id
+          );
+        }),
         selectionPosition && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           "div",
           {