@lostgradient/cinder 0.5.0 → 0.7.0

package/src/components/chat/container/chat.svelte

@@ -1,196 +1,82 @@
 <script lang="ts" module>
-  import type { Attachment } from 'svelte/attachments';
-  import type { ChatAdapter, ChatCommand, ChatPushHandlers } from '../adapter/chat-adapter.ts';
-  import type { Message, MessageInput } from '../conversation-model.ts';
-  import type { ChatAttachment } from '../input/chat-attachment.ts';
-
-  // `ChatProps` is owned by `../chat.types.ts` (the analyzer + schema generator
-  // read that symbol). The implementation imports it from there rather than
-  // redeclaring it, so the public type and the `$props()` shape can never drift.
-  import type { ChatProps } from '../chat.types.ts';
-
-  export type { ChatProps };
-  export type {
-    ChatScrollStateChangeEvent,
-    ChatStopGeneratingEvent,
-    ChatSubmitEvent,
-    ChatUnreadIndicatorChangeEvent,
-  } from './chat-events.ts';
+export {};
 </script>
 
 <script lang="ts">
-  import { tick, untrack } from 'svelte';
-  import { classNames } from '../../../utilities/class-names.ts';
-  import {
-    getMessages,
-    pairToolCallsWithResults,
-    resolveMessageReasoning,
-    resolveMessageSteps,
-    resolveMessageSuggestions,
-  } from '../utilities';
-  import { ChatMessage, ChatDateSeparator } from '../message';
-  import { ChatInput } from '../input';
-  import { DEFAULT_SCROLL_CONFIGURATION } from './scroll-utilities';
-  import { useChatScrollState } from './use-chat-scroll-state.svelte';
-  import { useChatUnreadState } from './use-chat-unread-state.svelte';
-  import { useChatKeyboardNav } from './use-chat-keyboard-nav.svelte';
-  import { useChatSearch } from './use-chat-search.svelte';
-  import { useIntersection } from '../../../utilities/use-intersection.svelte.ts';
-  import ChatJumpControls from './chat-jump-controls.svelte';
-  import ChatHistoryTrigger from './chat-history-trigger.svelte';
-  import ChatStatusAnnouncer from './chat-status-announcer.svelte';
-  import ChatSearchBar from './chat-search-bar.svelte';
-  import {
-    buildChatRenderRows,
-    buildMessagesWithDateSeparators,
-    chatRenderRowKey,
-    findPairedToolResultIds,
-    findRenderRowIndexByMessageId,
-    type ChatRenderRow,
-  } from './use-chat-message-groups.svelte.ts';
-  import { ChatVirtualizer } from './use-chat-virtualizer.svelte.ts';
-  import { useChatDisclosureState } from './use-chat-disclosure-state.svelte.ts';
-  import type { VirtualItem } from '../../../_internal/virtual-item.ts';
-  import { useChatTypingIndicator } from './use-chat-typing-indicator.svelte.ts';
-  import { useChatReadReceipts } from './use-chat-read-receipts.svelte.ts';
-  import ChatParticipantTyping from './chat-participant-typing.svelte';
-  import ChatReadReceipt from '../message/chat-read-receipt.svelte';
-
-  const noopAttachment: Attachment<HTMLElement> = () => {};
-  type ChatMessageRenderRow = Extract<ChatRenderRow, { type: 'message' }>;
-  type PendingHistoryScroll = {
-    previousFirstMessageId: string | null;
-    previousFirstTranscriptMessageId: string | null;
-    previousFirstMessageViewportOffset: number;
-    previousCount: number;
-    previousScrollTop: number;
-    previousScrollHeight: number;
-    previousTotalSize: number;
-  };
-
-  let {
-    id,
-    conversation,
-    atBottom = $bindable(true),
-    unreadCount = $bindable(0),
-    newMessageIndicatorVisible = $bindable(false),
-    class: className,
-    surfaceMode = 'default',
-    density = 'comfortable',
-    variant = 'bubble',
-    bottomThreshold = DEFAULT_SCROLL_CONFIGURATION.bottomThreshold,
-    jumpThreshold = DEFAULT_SCROLL_CONFIGURATION.jumpThreshold,
-    streaming = false,
-    streamingStatus,
-    capabilities,
-    virtualized = false,
-    virtualizationEstimatedRowHeight = 88,
-    virtualizationOverscan = 3,
-    virtualizationInitialHeight = 640,
-    moreHistoryAvailable = true,
-    loadEarlierLabel = 'Load earlier messages',
-    loadingEarlierLabel = 'Loading earlier messages',
-    header,
-    empty,
-    emptyPrompts,
-    messageActions,
-    messageStatus,
-    row,
-    messagePart,
-    viewportAttachment,
-    typingParticipants,
-    readReceipts,
-    adapter,
-    onadaptererror,
-    onpushmessage,
-    ontypingchange,
-    onreadreceipt,
-    onsubmit,
-    onretry,
-    onedit,
-    onapprove,
-    ondeny,
-    messageReasoning,
-    messageSteps,
-    messageSuggestions,
-    onsuggestionselect,
-    onloadhistory,
-    onstopgenerating,
-    onjumptolatest,
-    onscrollstatechange,
-    onunreadindicatorchange,
-    onexpandedchange,
-    onattachmentadd,
-    onattachmentremove,
-    onattachmentfailure,
-    ...rest
-  }: ChatProps = $props();
-
-  // ==========================================================================
-  // Refs and Internal State
-  // ==========================================================================
-
-  let viewport = $state<HTMLElement | null>(null);
-  let containerRef = $state<HTMLElement | null>(null);
-  let inputRef:
-    | {
-        focus: () => void;
-        clear: () => void;
-        addFiles: (files: File[]) => void;
-        getAttachments: () => ChatAttachment[];
-      }
-    | undefined;
-  let searchBarRef = $state<{ focusInput: () => void } | undefined>(undefined);
-  let historyTriggerRef = $state<{ focus: (options?: FocusOptions) => void } | undefined>(
-    undefined,
-  );
-
-  // Container-level drag-and-drop state for full-window drop zone
-  let isContainerDragOver = $state(false);
-
-  // Streaming state: separate from the Conversation to avoid re-rendering the message list
-  let streamingContent = $state('');
-  let streamingMessageId = $state<string | null>(null);
-  let streamingRowElement = $state<HTMLElement | null>(null);
-
-  // Token buffer: accumulate tokens as an array; joined and flushed once per animation frame
-  // to avoid O(n²) string work from calling join() on every push.
-  let tokenBuffer: string[] = [];
-  // rAF handle for batching token flushes and scroll throttling during streaming
-  let streamingScrollRaf: number | undefined;
-
-  // C3 — tool approval state. Keyed by tool call id. Both sets are UI-only and
-  // are never written back to the transcript. A pending tool-approval part has
-  // its call id in neither set (approved === undefined). Once the consumer or
-  // adapter resolves the approval, the id moves into one of the sets and the
-  // part re-derives to show the resolved state.
-  let approvedToolCallIds = $state(new Set<string>());
-  let deniedToolCallIds = $state(new Set<string>());
-
-  // Per-message disclosure state (reasoning blocks + tool-call cards). UI-only;
-  // never written to the transcript. Both are collapsed by default; toggling
-  // triggers a virtualizer remeasure so the row's height tracks the expanded
-  // content. Kept as separate instances so a message carrying both a reasoning
-  // block and a tool-call card discloses each independently.
-  function remeasureRow(messageId: string): void {
-    if (!isVirtualized || !viewport) return;
+import { tick, untrack } from 'svelte';
+import { classNames } from '../../../utilities/class-names.ts';
+import { getMessages, pairToolCallsWithResults, resolveMessageReasoning, resolveMessageSteps, resolveMessageSuggestions, } from '../utilities';
+import { ChatMessage, ChatDateSeparator } from '../message';
+import { ChatInput } from '../input';
+import { DEFAULT_SCROLL_CONFIGURATION } from './scroll-utilities';
+import { useChatScrollState } from './use-chat-scroll-state.svelte';
+import { useChatUnreadState } from './use-chat-unread-state.svelte';
+import { useChatKeyboardNav } from './use-chat-keyboard-nav.svelte';
+import { useChatSearch } from './use-chat-search.svelte';
+import { useIntersection } from '../../../utilities/use-intersection.svelte.ts';
+import ChatJumpControls from './chat-jump-controls.svelte';
+import ChatHistoryTrigger from './chat-history-trigger.svelte';
+import ChatStatusAnnouncer from './chat-status-announcer.svelte';
+import ChatSearchBar from './chat-search-bar.svelte';
+import { buildChatRenderRows, buildMessagesWithDateSeparators, chatRenderRowKey, findPairedToolResultIds, findRenderRowIndexByMessageId, } from './use-chat-message-groups.svelte.ts';
+import { ChatVirtualizer } from './use-chat-virtualizer.svelte.ts';
+import { useChatDisclosureState } from './use-chat-disclosure-state.svelte.ts';
+import { useChatTypingIndicator } from './use-chat-typing-indicator.svelte.ts';
+import { useChatReadReceipts } from './use-chat-read-receipts.svelte.ts';
+import ChatParticipantTyping from './chat-participant-typing.svelte';
+import ChatReadReceipt from '../message/chat-read-receipt.svelte';
+const noopAttachment = () => { };
+let { id, conversation, atBottom = $bindable(true), unreadCount = $bindable(0), newMessageIndicatorVisible = $bindable(false), class: className, surfaceMode = 'default', density = 'comfortable', variant = 'bubble', bottomThreshold = DEFAULT_SCROLL_CONFIGURATION.bottomThreshold, jumpThreshold = DEFAULT_SCROLL_CONFIGURATION.jumpThreshold, streaming = false, streamingStatus, capabilities, virtualized = false, virtualizationEstimatedRowHeight = 88, virtualizationOverscan = 3, virtualizationInitialHeight = 640, moreHistoryAvailable = true, loadEarlierLabel = 'Load earlier messages', loadingEarlierLabel = 'Loading earlier messages', header, empty, emptyPrompts, messageActions, messageStatus, row, messagePart, viewportAttachment, typingParticipants, readReceipts, adapter, onadaptererror, onpushmessage, ontypingchange, onreadreceipt, onsubmit, onretry, onedit, onapprove, ondeny, messageReasoning, messageSteps, messageSuggestions, onsuggestionselect, onloadhistory, onstopgenerating, onjumptolatest, onscrollstatechange, onunreadindicatorchange, onexpandedchange, onattachmentadd, onattachmentremove, onattachmentfailure, ...rest } = $props();
+// ==========================================================================
+// Refs and Internal State
+// ==========================================================================
+let viewport = $state(null);
+let containerRef = $state(null);
+let inputRef;
+let searchBarRef = $state(undefined);
+let historyTriggerRef = $state(undefined);
+// Container-level drag-and-drop state for full-window drop zone
+let isContainerDragOver = $state(false);
+// Streaming state: separate from the Conversation to avoid re-rendering the message list
+let streamingContent = $state('');
+let streamingMessageId = $state(null);
+let streamingRowElement = $state(null);
+// Token buffer: accumulate tokens as an array; joined and flushed once per animation frame
+// to avoid O(n²) string work from calling join() on every push.
+let tokenBuffer = [];
+// rAF handle for batching token flushes and scroll throttling during streaming
+let streamingScrollRaf;
+// C3 — tool approval state. Keyed by tool call id. Both sets are UI-only and
+// are never written back to the transcript. A pending tool-approval part has
+// its call id in neither set (approved === undefined). Once the consumer or
+// adapter resolves the approval, the id moves into one of the sets and the
+// part re-derives to show the resolved state.
+let approvedToolCallIds = $state(new Set());
+let deniedToolCallIds = $state(new Set());
+// Per-message disclosure state (reasoning blocks + tool-call cards). UI-only;
+// never written to the transcript. Both are collapsed by default; toggling
+// triggers a virtualizer remeasure so the row's height tracks the expanded
+// content. Kept as separate instances so a message carrying both a reasoning
+// block and a tool-call card discloses each independently.
+function remeasureRow(messageId) {
+    if (!isVirtualized || !viewport)
+        return;
     // Find the message row DOM node via the stable id and re-measure it so
     // the virtualizer updates the row's height after the disclosure transitions.
-    const rowNode = viewport.querySelector<HTMLElement>(`#message-${CSS.escape(messageId)}`);
+    const rowNode = viewport.querySelector(`#message-${CSS.escape(messageId)}`);
     if (rowNode) {
-      chatVirtualizer.measureElementNode(rowNode);
+        chatVirtualizer.measureElementNode(rowNode);
     }
-  }
-  const reasoningState = useChatDisclosureState({ onRemeasureRow: remeasureRow });
-  const toolCallState = useChatDisclosureState({ onRemeasureRow: remeasureRow });
-
-  // Reset UI-only approval/disclosure/typing/receipt state on conversation change
-  // so stale approved/denied sets, expanded reasoning/tool-call disclosures,
-  // adapter-derived typing state, and accumulated read receipts from the previous conversation
-  // are cleared (their message ids can collide). The void reference to
-  // `conversationId` at the start of the effect body is the Svelte 5 pattern for
-  // declaring a reactive dependency on a derived without reading its value.
-  $effect(() => {
+}
+const reasoningState = useChatDisclosureState({ onRemeasureRow: remeasureRow });
+const toolCallState = useChatDisclosureState({ onRemeasureRow: remeasureRow });
+// Reset UI-only approval/disclosure/typing/receipt state on conversation change
+// so stale approved/denied sets, expanded reasoning/tool-call disclosures,
+// adapter-derived typing state, and accumulated read receipts from the previous conversation
+// are cleared (their message ids can collide). The void reference to
+// `conversationId` at the start of the effect body is the Svelte 5 pattern for
+// declaring a reactive dependency on a derived without reading its value.
+$effect(() => {
     conversationId;
     approvedToolCallIds = new Set();
     deniedToolCallIds = new Set();
@@ -198,112 +84,100 @@
     toolCallState.reset();
     typingIndicatorState.reset();
     readReceiptsState.reset();
-  });
-
-  let isLoadingHistory = $state(false);
-  let adapterHasMoreHistory = $state<boolean | undefined>(undefined);
-  let historyAnnouncement = $state('');
-  let pendingHistoryScroll: PendingHistoryScroll | null = $state(null);
-  let deferredAdapterHasMoreHistory: boolean | null = null;
-  let historyAnchorMessageId = $state<string | null>(null);
-  let historyAnchorViewportOffset = $state<number | null>(null);
-  let historyAnchorRestoredScrollTop: number | null = null;
-  let previousHistoryConversationId: string | undefined;
-  let previousHistoryAdapter: ChatAdapter | undefined;
-
-  // ==========================================================================
-  // Initialize Helpers
-  // ==========================================================================
-
-  const scrollState = useChatScrollState({
+});
+let isLoadingHistory = $state(false);
+let adapterHasMoreHistory = $state(undefined);
+let historyAnnouncement = $state('');
+let pendingHistoryScroll = $state(null);
+let deferredAdapterHasMoreHistory = null;
+let historyAnchorMessageId = $state(null);
+let historyAnchorViewportOffset = $state(null);
+let historyAnchorRestoredScrollTop = null;
+let previousHistoryConversationId;
+let previousHistoryAdapter;
+// ==========================================================================
+// Initialize Helpers
+// ==========================================================================
+const scrollState = useChatScrollState({
     getBottomThreshold: () => bottomThreshold,
     getJumpThreshold: () => jumpThreshold,
     onScrollStateChange: handleScrollStateChange,
     onReachBottom: () => {
-      // The sentinel fires when the user reaches the bottom via
-      // IntersectionObserver, which does not emit onScrollStateChange.
-      // Update the bindable prop here so it stays in sync with the sentinel path.
-      atBottom = true;
-      if (unreadState.unreadCount > 0 || unreadState.newMessageIndicatorVisible) {
-        unreadState.markAllAsRead();
-      }
+        // The sentinel fires when the user reaches the bottom via
+        // IntersectionObserver, which does not emit onScrollStateChange.
+        // Update the bindable prop here so it stays in sync with the sentinel path.
+        atBottom = true;
+        if (unreadState.unreadCount > 0 || unreadState.newMessageIndicatorVisible) {
+            unreadState.markAllAsRead();
+        }
     },
-  });
-
-  const unreadState = useChatUnreadState({
+});
+const unreadState = useChatUnreadState({
     onUnreadIndicatorChange: (event) => {
-      // Update the bindable props at the mutation site rather than via a $effect.
-      unreadCount = event.unreadCount;
-      newMessageIndicatorVisible = event.newMessageIndicatorVisible;
-      onunreadindicatorchange?.(event);
+        // Update the bindable props at the mutation site rather than via a $effect.
+        unreadCount = event.unreadCount;
+        newMessageIndicatorVisible = event.newMessageIndicatorVisible;
+        onunreadindicatorchange?.(event);
     },
-  });
-
-  const keyboardNav = useChatKeyboardNav({
+});
+const keyboardNav = useChatKeyboardNav({
     onJumpToLatest: handleJumpToLatest,
     onJumpToStart: () => {
-      if (isVirtualized) {
-        chatVirtualizer.scrollToOffset(0, { behavior: scrollState.getScrollBehavior() });
-      }
+        if (isVirtualized) {
+            chatVirtualizer.scrollToOffset(0, { behavior: scrollState.getScrollBehavior() });
+        }
     },
     getScrollBehavior: scrollState.getScrollBehavior,
     getHistoryTrigger: () => (showHistoryTrigger ? historyTriggerRef : null),
     onVirtualMessageNavigation: (direction) => navigateVirtualMessage(direction),
-  });
-
-  const messages = $derived(getMessages(conversation));
-  // C5 — suggested replies are a per-TURN affordance shown only beneath the last
-  // message, not on every historical message that still carries the metadata.
-  const lastMessageId = $derived(messages.at(-1)?.id);
-  let previousAutoScrollMessageCount = getMessages(conversation).length;
-
-  // The conversation id as a stable VALUE dependency. The subscribe effect keys
-  // on this (not on `conversation.id` read inline) so a consumer passing a fresh
-  // `conversation` snapshot on every transcript update — but with the same id —
-  // does not tear down and reopen the real-time subscription each render.
-  const conversationId = $derived(conversation.id);
-
-  const showTypingIndicator = $derived(streaming && !streamingMessageId);
-
-  // Expand capabilities object with per-feature defaults.
-  const allowAttachments = $derived(capabilities?.attachments ?? true);
-  const allowSearch = $derived(capabilities?.search ?? true);
-  const allowCopy = $derived(capabilities?.copy ?? true);
-  const allowEditing = $derived(capabilities?.editing ?? true);
-  const allowRetry = $derived(capabilities?.retry ?? true);
-  const toolCallPairsByCallId = $derived.by(() => {
+});
+const messages = $derived(getMessages(conversation));
+// C5 — suggested replies are a per-TURN affordance shown only beneath the last
+// message, not on every historical message that still carries the metadata.
+const lastMessageId = $derived(messages.at(-1)?.id);
+let previousAutoScrollMessageCount = getMessages(conversation).length;
+// The conversation id as a stable VALUE dependency. The subscribe effect keys
+// on this (not on `conversation.id` read inline) so a consumer passing a fresh
+// `conversation` snapshot on every transcript update — but with the same id —
+// does not tear down and reopen the real-time subscription each render.
+const conversationId = $derived(conversation.id);
+const showTypingIndicator = $derived(streaming && !streamingMessageId);
+// Expand capabilities object with per-feature defaults.
+const allowAttachments = $derived(capabilities?.attachments ?? true);
+const allowSearch = $derived(capabilities?.search ?? true);
+const allowCopy = $derived(capabilities?.copy ?? true);
+const allowEditing = $derived(capabilities?.editing ?? true);
+const allowRetry = $derived(capabilities?.retry ?? true);
+const toolCallPairsByCallId = $derived.by(() => {
     const toolCallPairs = pairToolCallsWithResults(messages);
-    const map = new Map<string, ReturnType<typeof pairToolCallsWithResults>>();
+    const map = new Map();
     for (const pair of toolCallPairs) {
-      const existing = map.get(pair.call.id);
-      if (existing) {
-        existing.push(pair);
-      } else {
-        map.set(pair.call.id, [pair]);
-      }
+        const existing = map.get(pair.call.id);
+        if (existing) {
+            existing.push(pair);
+        }
+        else {
+            map.set(pair.call.id, [pair]);
+        }
     }
     return map;
-  });
-  const renderRows = $derived.by(() => {
+});
+const renderRows = $derived.by(() => {
     const pairedToolResultIds = findPairedToolResultIds(messages);
     const messagesWithDates = buildMessagesWithDateSeparators(messages, pairedToolResultIds);
     return buildChatRenderRows(messagesWithDates, {
-      firstUnreadId: unreadState.firstUnreadId,
-      showTypingIndicator,
+        firstUnreadId: unreadState.firstUnreadId,
+        showTypingIndicator,
     });
-  });
-  let hasMounted = $state(false);
-  $effect(() => {
+});
+let hasMounted = $state(false);
+$effect(() => {
     hasMounted = true;
-  });
-
-  const isVirtualized = $derived(virtualized && hasMounted && messages.length > 0);
-  const timelineResetIdentity = $derived(
-    `${conversationId}:${isVirtualized ? 'virtualized' : 'full'}`,
-  );
-  const staticRowsResetIdentity = $derived(messages[0]?.id ?? '');
-
-  const chatVirtualizer = new ChatVirtualizer({
+});
+const isVirtualized = $derived(virtualized && hasMounted && messages.length > 0);
+const timelineResetIdentity = $derived(`${conversationId}:${isVirtualized ? 'virtualized' : 'full'}`);
+const staticRowsResetIdentity = $derived(messages[0]?.id ?? '');
+const chatVirtualizer = new ChatVirtualizer({
     getScrollElement: () => viewport,
     getCount: () => (isVirtualized ? renderRows.length : 0),
     getItemKey: (index) => chatRenderRowKey(renderRows[index] ?? { type: 'typing' }),
@@ -311,192 +185,159 @@
     getOverscan: () => virtualizationOverscan,
     getInitialHeight: () => virtualizationInitialHeight,
     getScrollPaddingStart: () => virtualSpacerOffsetTop(),
-  });
-
-  const virtualRows = $derived.by(() => {
-    if (!isVirtualized) return [];
-
-    const renderedIndexes = new Set<number>();
-    const rows: { row: ChatRenderRow; virtualItem: VirtualItem }[] = [];
+});
+const virtualRows = $derived.by(() => {
+    if (!isVirtualized)
+        return [];
+    const renderedIndexes = new Set();
+    const rows = [];
     for (const virtualItem of chatVirtualizer.virtualItems) {
-      const row = renderRows[virtualItem.index];
-      if (!row) continue;
-      renderedIndexes.add(virtualItem.index);
-      rows.push({ row, virtualItem: pinHistoryAnchorVirtualItem(row, virtualItem) });
+        const row = renderRows[virtualItem.index];
+        if (!row)
+            continue;
+        renderedIndexes.add(virtualItem.index);
+        rows.push({ row, virtualItem: pinHistoryAnchorVirtualItem(row, virtualItem) });
     }
-
     if (streamingMessageId) {
-      const streamingIndex = findRenderRowIndexByMessageId(renderRows, streamingMessageId);
-      if (streamingIndex >= 0 && !renderedIndexes.has(streamingIndex)) {
-        const virtualItem = chatVirtualizer.getVirtualItem(streamingIndex);
-        if (!virtualItem) return rows;
-        rows.push({
-          row: renderRows[streamingIndex]!,
-          virtualItem,
-        });
-      }
+        const streamingIndex = findRenderRowIndexByMessageId(renderRows, streamingMessageId);
+        if (streamingIndex >= 0 && !renderedIndexes.has(streamingIndex)) {
+            const virtualItem = chatVirtualizer.getVirtualItem(streamingIndex);
+            if (!virtualItem)
+                return rows;
+            rows.push({
+                row: renderRows[streamingIndex],
+                virtualItem,
+            });
+        }
     }
-
     if (historyAnchorMessageId) {
-      const historyAnchorIndex = findRenderRowIndexByMessageId(renderRows, historyAnchorMessageId);
-      if (historyAnchorIndex >= 0 && !renderedIndexes.has(historyAnchorIndex)) {
-        const virtualItem = chatVirtualizer.getVirtualItem(historyAnchorIndex);
-        if (!virtualItem) return rows;
-        const row = renderRows[historyAnchorIndex];
-        if (row) {
-          rows.push({
-            row,
-            virtualItem: pinHistoryAnchorVirtualItem(row, virtualItem),
-          });
+        const historyAnchorIndex = findRenderRowIndexByMessageId(renderRows, historyAnchorMessageId);
+        if (historyAnchorIndex >= 0 && !renderedIndexes.has(historyAnchorIndex)) {
+            const virtualItem = chatVirtualizer.getVirtualItem(historyAnchorIndex);
+            if (!virtualItem)
+                return rows;
+            const row = renderRows[historyAnchorIndex];
+            if (row) {
+                rows.push({
+                    row,
+                    virtualItem: pinHistoryAnchorVirtualItem(row, virtualItem),
+                });
+            }
         }
-      }
     }
-
     rows.sort((a, b) => a.virtualItem.index - b.virtualItem.index);
     return rows;
-  });
-
-  function pinHistoryAnchorVirtualItem(row: ChatRenderRow, virtualItem: VirtualItem): VirtualItem {
-    if (
-      historyAnchorViewportOffset === null ||
-      row.type !== 'message' ||
-      row.message.id !== historyAnchorMessageId
-    ) {
-      return virtualItem;
+});
+function pinHistoryAnchorVirtualItem(row, virtualItem) {
+    if (historyAnchorViewportOffset === null ||
+        row.type !== 'message' ||
+        row.message.id !== historyAnchorMessageId) {
+        return virtualItem;
     }
-
     const scrollTop = viewport?.scrollTop ?? chatVirtualizer.scrollOffset;
-    const start = Math.max(
-      0,
-      scrollTop - chatVirtualizer.scrollPaddingStart + historyAnchorViewportOffset,
-    );
+    const start = Math.max(0, scrollTop - chatVirtualizer.scrollPaddingStart + historyAnchorViewportOffset);
     return {
-      ...virtualItem,
-      start,
-      end: start + virtualItem.size,
+        ...virtualItem,
+        start,
+        end: start + virtualItem.size,
     };
-  }
-
-  const searchState = useChatSearch({
+}
+const searchState = useChatSearch({
     getMessages: () => messages,
-  });
-
-  // ==========================================================================
-  // C6 — Per-participant typing indicators + read receipts (out-of-band state)
-  // ==========================================================================
-
-  const typingIndicatorState = useChatTypingIndicator({
+});
+// ==========================================================================
+// C6 — Per-participant typing indicators + read receipts (out-of-band state)
+// ==========================================================================
+const typingIndicatorState = useChatTypingIndicator({
     getTypingParticipants: () => typingParticipants,
-  });
-
-  const readReceiptsState = useChatReadReceipts({
+});
+const readReceiptsState = useChatReadReceipts({
     getReadReceipts: () => readReceipts,
-  });
-
-  // ==========================================================================
-  // Derived Values
-  // ==========================================================================
-
-  const viewportAttach = $derived(viewportAttachment ?? noopAttachment);
-  const effectiveHasMoreHistory = $derived(adapterHasMoreHistory ?? moreHistoryAvailable);
-  const hasHistoryLoader = $derived(
-    onloadhistory !== undefined || adapter?.loadOlderMessages !== undefined,
-  );
-  const showHistoryTrigger = $derived(hasHistoryLoader && effectiveHasMoreHistory);
-
-  $effect(() => {
+});
+// ==========================================================================
+// Derived Values
+// ==========================================================================
+const viewportAttach = $derived(viewportAttachment ?? noopAttachment);
+const effectiveHasMoreHistory = $derived(adapterHasMoreHistory ?? moreHistoryAvailable);
+const hasHistoryLoader = $derived(onloadhistory !== undefined || adapter?.loadOlderMessages !== undefined);
+const showHistoryTrigger = $derived(hasHistoryLoader && effectiveHasMoreHistory);
+$effect(() => {
     chatVirtualizer.setScrollElement(isVirtualized ? viewport : null);
-  });
-
-  $effect(() => {
+});
+$effect(() => {
     for (const renderRow of renderRows) {
-      chatRenderRowKey(renderRow);
+        chatRenderRowKey(renderRow);
     }
     chatVirtualizer.syncOptions();
-  });
-
-  $effect(() => {
+});
+$effect(() => {
     const currentConversationId = conversationId;
     const currentAdapter = adapter;
     if (previousHistoryConversationId === undefined) {
-      previousHistoryConversationId = currentConversationId;
-      previousHistoryAdapter = currentAdapter;
-      return;
+        previousHistoryConversationId = currentConversationId;
+        previousHistoryAdapter = currentAdapter;
+        return;
     }
-
-    if (
-      currentConversationId !== previousHistoryConversationId ||
-      currentAdapter !== previousHistoryAdapter
-    ) {
-      adapterHasMoreHistory = undefined;
-      pendingHistoryScroll = null;
-      deferredAdapterHasMoreHistory = null;
-      clearHistoryAnchor();
+    if (currentConversationId !== previousHistoryConversationId ||
+        currentAdapter !== previousHistoryAdapter) {
+        adapterHasMoreHistory = undefined;
+        pendingHistoryScroll = null;
+        deferredAdapterHasMoreHistory = null;
+        clearHistoryAnchor();
     }
     previousHistoryConversationId = currentConversationId;
     previousHistoryAdapter = currentAdapter;
-  });
-
-  // A retry/edit affordance shows when EITHER a callback OR the adapter can
-  // handle it — so an adapter-only consumer (no `onretry`/`onedit`) still gets
-  // working buttons, and a callback-only consumer is unchanged.
-  const canRetry = $derived(onretry !== undefined || adapter?.retryMessage !== undefined);
-  const canEdit = $derived(onedit !== undefined || adapter?.editMessage !== undefined);
-
-  // Stable bottom-sentinel attachment. Wrapping useIntersection in $derived (matching
-  // load-more) means the IntersectionObserver is only torn down + recreated when
-  // `viewport` or `bottomThreshold` actually change — NOT on every chat re-render
-  // (which is frequent during streaming and would otherwise make bottom detection flicker).
-  const sentinelAttach = $derived(
-    isVirtualized
-      ? noopAttachment
-      : useIntersection(scrollState.handleSentinelEntry, {
-          root: viewport,
-          rootMargin: `0px 0px ${bottomThreshold}px 0px`,
-        }),
-  );
-
-  // Accessibility IDs
-  const timelineId = $derived(`${id}-timeline`);
-  const inputId = $derived(`${id}-input`);
-  const statusId = $derived(`${id}-status`);
-
-  // C3 — assertive announcement for action-required tool approvals. Derived from
-  // the first pending tool-approval part in the current transcript. When a new
-  // tool-approval part appears (outcome === 'action_required' + action present),
-  // this updates and the assertive live region interrupts screen readers.
-  const toolApprovalAssertiveMessage = $derived.by(() => {
+});
+// A retry/edit affordance shows when EITHER a callback OR the adapter can
+// handle it — so an adapter-only consumer (no `onretry`/`onedit`) still gets
+// working buttons, and a callback-only consumer is unchanged.
+const canRetry = $derived(onretry !== undefined || adapter?.retryMessage !== undefined);
+const canEdit = $derived(onedit !== undefined || adapter?.editMessage !== undefined);
+// Stable bottom-sentinel attachment. Wrapping useIntersection in $derived (matching
+// load-more) means the IntersectionObserver is only torn down + recreated when
+// `viewport` or `bottomThreshold` actually change — NOT on every chat re-render
+// (which is frequent during streaming and would otherwise make bottom detection flicker).
+const sentinelAttach = $derived(isVirtualized
+    ? noopAttachment
+    : useIntersection(scrollState.handleSentinelEntry, {
+        root: viewport,
+        rootMargin: `0px 0px ${bottomThreshold}px 0px`,
+    }));
+// Accessibility IDs
+const timelineId = $derived(`${id}-timeline`);
+const inputId = $derived(`${id}-input`);
+const statusId = $derived(`${id}-status`);
+// C3 — assertive announcement for action-required tool approvals. Derived from
+// the first pending tool-approval part in the current transcript. When a new
+// tool-approval part appears (outcome === 'action_required' + action present),
+// this updates and the assertive live region interrupts screen readers.
+const toolApprovalAssertiveMessage = $derived.by(() => {
     for (const message of messages) {
-      if (
-        message.role === 'tool-result' &&
-        message.toolResult?.outcome === 'action_required' &&
-        message.toolResult.action &&
-        !approvedToolCallIds.has(message.toolResult.callId) &&
-        !deniedToolCallIds.has(message.toolResult.callId)
-      ) {
-        const actionMessage =
-          message.toolResult.action.message ??
-          'This tool call requires your approval before it can continue.';
-        return `Action required: ${actionMessage}`;
-      }
+        if (message.role === 'tool-result' &&
+            message.toolResult?.outcome === 'action_required' &&
+            message.toolResult.action &&
+            !approvedToolCallIds.has(message.toolResult.callId) &&
+            !deniedToolCallIds.has(message.toolResult.callId)) {
+            const actionMessage = message.toolResult.action.message ??
+                'This tool call requires your approval before it can continue.';
+            return `Action required: ${actionMessage}`;
+        }
     }
     return '';
-  });
-
-  // ==========================================================================
-  // Scroll Anchoring via $effect.pre
-  // ==========================================================================
-
-  /**
-   * $effect.pre runs BEFORE DOM updates.
-   * We capture scroll state here and schedule scroll-to-bottom after DOM updates.
-   *
-   * Key pattern: Read `messages.length` synchronously to register dependency,
-   * then use `tick()` to wait for DOM updates before scrolling.
-   */
-  $effect.pre(() => {
-    if (!viewport) return undefined;
-
+});
+// ==========================================================================
+// Scroll Anchoring via $effect.pre
+// ==========================================================================
+/**
+ * $effect.pre runs BEFORE DOM updates.
+ * We capture scroll state here and schedule scroll-to-bottom after DOM updates.
+ *
+ * Key pattern: Read `messages.length` synchronously to register dependency,
+ * then use `tick()` to wait for DOM updates before scrolling.
+ */
+$effect.pre(() => {
+    if (!viewport)
+        return undefined;
     // Register dependency on message count
     const currentCount = messages.length;
     const isTranscriptAppend = currentCount > previousAutoScrollMessageCount;
@@ -505,257 +346,217 @@
     // trigger one final bottom correction after the appended row is measured.
     const currentScrollExtent = isVirtualized ? chatVirtualizer.scrollSize : viewport.scrollHeight;
     void currentScrollExtent;
-
     // Read atBottom without making it a dependency (prevents loops)
     const atBottom = untrack(() => scrollState.atBottom);
-
     // Skip if user initiated a smooth scroll (e.g., via jump button)
-    if (scrollState.isUserScrolling) return undefined;
-
+    if (scrollState.isUserScrolling)
+        return undefined;
     // Explicit history anchoring owns scroll restoration while a prepend is pending
     // and until the user scrolls away from the restored anchor.
-    const hasActiveHistoryAnchor = untrack(
-      () => pendingHistoryScroll !== null || historyAnchorMessageId !== null,
-    );
-    if (hasActiveHistoryAnchor) return undefined;
-
+    const hasActiveHistoryAnchor = untrack(() => pendingHistoryScroll !== null || historyAnchorMessageId !== null);
+    if (hasActiveHistoryAnchor)
+        return undefined;
     if (atBottom && currentCount > 0) {
-      let cancelled = false;
-      const waitForBottomTarget = isTranscriptAppend ? waitForLayoutFrame() : tick();
-      void waitForBottomTarget.then(() => {
-        if (cancelled || !viewport || pendingHistoryScroll || historyAnchorMessageId !== null) {
-          return;
-        }
-        if (isVirtualized) {
-          chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, { behavior: 'instant' });
-        } else {
-          viewport?.scrollTo({ top: viewport.scrollHeight, behavior: 'instant' });
-        }
-      });
-
-      return () => {
-        cancelled = true;
-      };
+        let cancelled = false;
+        const waitForBottomTarget = isTranscriptAppend ? waitForLayoutFrame() : tick();
+        void waitForBottomTarget.then(() => {
+            if (cancelled || !viewport || pendingHistoryScroll || historyAnchorMessageId !== null) {
+                return;
+            }
+            if (isVirtualized) {
+                chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, { behavior: 'instant' });
+            }
+            else {
+                viewport?.scrollTo({ top: viewport.scrollHeight, behavior: 'instant' });
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
     }
-
     return undefined;
-  });
-
-  $effect.pre(() => {
-    if (!viewport || !pendingHistoryScroll) return;
-
+});
+$effect.pre(() => {
+    if (!viewport || !pendingHistoryScroll)
+        return;
     const pending = pendingHistoryScroll;
     messages.length;
     messages[0]?.id;
     void restorePendingHistoryScrollAfterLayout(pending);
-  });
-
-  async function waitForLayoutFrame(): Promise<void> {
+});
+async function waitForLayoutFrame() {
     await tick();
-    if (typeof requestAnimationFrame !== 'function') return;
-
-    await new Promise<void>((resolve) => {
-      requestAnimationFrame(() => resolve());
+    if (typeof requestAnimationFrame !== 'function')
+        return;
+    await new Promise((resolve) => {
+        requestAnimationFrame(() => resolve());
     });
-  }
-
-  async function restorePendingHistoryScrollAfterLayout(
-    pending: PendingHistoryScroll,
-  ): Promise<boolean> {
+}
+async function restorePendingHistoryScrollAfterLayout(pending) {
     await waitForLayoutFrame();
-    if (pendingHistoryScroll !== pending) return false;
+    if (pendingHistoryScroll !== pending)
+        return false;
     return restoreHistoryScroll(pending);
-  }
-
-  function restoreHistoryScroll(pending: PendingHistoryScroll): boolean {
-    if (!viewport) return false;
-
+}
+function restoreHistoryScroll(pending) {
+    if (!viewport)
+        return false;
     const currentFirstMessageId = messages[0]?.id ?? null;
     const currentCount = messages.length;
-    if (
-      currentCount <= pending.previousCount ||
-      currentFirstMessageId === pending.previousFirstTranscriptMessageId
-    ) {
-      return false;
+    if (currentCount <= pending.previousCount ||
+        currentFirstMessageId === pending.previousFirstTranscriptMessageId) {
+        return false;
     }
-
     const prependedCount = currentCount - pending.previousCount;
     pendingHistoryScroll = null;
     finishDeferredAdapterHistoryLoading();
     if (isVirtualized) {
-      setHistoryAnchor(pending);
+        setHistoryAnchor(pending);
     }
-
     if (isVirtualized) {
-      const newTotalSize = chatVirtualizer.scrollSize;
-      const delta = newTotalSize - pending.previousTotalSize;
-      const targetScrollTop = pending.previousScrollTop + delta;
-      chatVirtualizer.scrollToOffset(targetScrollTop, { behavior: 'instant' });
-      historyAnchorRestoredScrollTop = viewport?.scrollTop ?? chatVirtualizer.scrollOffset;
-    } else {
-      clearHistoryAnchor();
-      const newTotalSize = viewport.scrollHeight;
-      const delta = newTotalSize - pending.previousScrollHeight;
-      viewport.scrollTo({
-        top: pending.previousScrollTop + delta,
-        behavior: 'instant',
-      });
+        const newTotalSize = chatVirtualizer.scrollSize;
+        const delta = newTotalSize - pending.previousTotalSize;
+        const targetScrollTop = pending.previousScrollTop + delta;
+        chatVirtualizer.scrollToOffset(targetScrollTop, { behavior: 'instant' });
+        historyAnchorRestoredScrollTop = viewport?.scrollTop ?? chatVirtualizer.scrollOffset;
     }
-    const announcement =
-      prependedCount === 1
+    else {
+        clearHistoryAnchor();
+        const newTotalSize = viewport.scrollHeight;
+        const delta = newTotalSize - pending.previousScrollHeight;
+        viewport.scrollTo({
+            top: pending.previousScrollTop + delta,
+            behavior: 'instant',
+        });
+    }
+    const announcement = prependedCount === 1
         ? '1 earlier message loaded.'
         : `${prependedCount} earlier messages loaded.`;
     historyAnnouncement = announcement;
     setTimeout(() => {
-      if (historyAnnouncement === announcement) {
-        historyAnnouncement = '';
-      }
+        if (historyAnnouncement === announcement) {
+            historyAnnouncement = '';
+        }
     }, 1000);
     void tick().then(() => {
-      focusAfterHistoryRestore(pending);
+        focusAfterHistoryRestore(pending);
     });
     return true;
-  }
-
-  function setHistoryAnchor(pending: PendingHistoryScroll): void {
+}
+function setHistoryAnchor(pending) {
     historyAnchorMessageId = pending.previousFirstMessageId;
     historyAnchorViewportOffset = pending.previousFirstMessageViewportOffset;
     historyAnchorRestoredScrollTop = null;
-  }
-
-  function clearHistoryAnchor(): void {
+}
+function clearHistoryAnchor() {
     historyAnchorMessageId = null;
     historyAnchorViewportOffset = null;
     historyAnchorRestoredScrollTop = null;
-  }
-
-  function clearHistoryAnchorAfterScroll(scrollTop: number): void {
-    if (
-      historyAnchorMessageId !== null &&
-      historyAnchorRestoredScrollTop !== null &&
-      Math.abs(scrollTop - historyAnchorRestoredScrollTop) > 2
-    ) {
-      clearHistoryAnchor();
+}
+function clearHistoryAnchorAfterScroll(scrollTop) {
+    if (historyAnchorMessageId !== null &&
+        historyAnchorRestoredScrollTop !== null &&
+        Math.abs(scrollTop - historyAnchorRestoredScrollTop) > 2) {
+        clearHistoryAnchor();
     }
-  }
-
-  function handleScrollStateChange(event: {
-    atBottom: boolean;
-    scrollTop: number;
-    scrollHeight: number;
-  }): void {
+}
+function handleScrollStateChange(event) {
     clearHistoryAnchorAfterScroll(event.scrollTop);
-
     // Update the bindable prop at the mutation site rather than via a $effect.
     atBottom = event.atBottom;
-
     onscrollstatechange?.(event);
-  }
-
-  function virtualSpacerOffsetTop(): number {
-    if (!viewport) return 0;
-
-    const spacer = viewport.querySelector<HTMLElement>('.chat-virtual-spacer');
-    if (!spacer) return 0;
-
+}
+function virtualSpacerOffsetTop() {
+    if (!viewport)
+        return 0;
+    const spacer = viewport.querySelector('.chat-virtual-spacer');
+    if (!spacer)
+        return 0;
     const offsetTop = spacer.offsetTop;
     const spacerRect = spacer.getBoundingClientRect();
     const viewportRect = viewport.getBoundingClientRect();
-    const hasLayoutBox =
-      spacerRect.top !== 0 ||
-      spacerRect.bottom !== 0 ||
-      viewportRect.top !== 0 ||
-      viewportRect.bottom !== 0;
-    if (!hasLayoutBox) return Math.max(0, offsetTop);
-
+    const hasLayoutBox = spacerRect.top !== 0 ||
+        spacerRect.bottom !== 0 ||
+        viewportRect.top !== 0 ||
+        viewportRect.bottom !== 0;
+    if (!hasLayoutBox)
+        return Math.max(0, offsetTop);
     const rectOffset = spacerRect.top - viewportRect.top + viewport.scrollTop;
     return Math.max(0, Number.isFinite(rectOffset) ? rectOffset : offsetTop);
-  }
-
-  function focusAfterHistoryRestore(pending: PendingHistoryScroll): void {
-    if (!viewport) return;
-
+}
+function focusAfterHistoryRestore(pending) {
+    if (!viewport)
+        return;
     if (showHistoryTrigger && historyTriggerRef) {
-      historyTriggerRef.focus({ preventScroll: true });
-      return;
+        historyTriggerRef.focus({ preventScroll: true });
+        return;
     }
-
     const anchor = pending.previousFirstMessageId
-      ? viewport.querySelector<HTMLElement>(
-          `#message-${CSS.escape(pending.previousFirstMessageId)}`,
-        )
-      : null;
-    const target = anchor ?? viewport.querySelector<HTMLElement>('.chat-message');
+        ? viewport.querySelector(`#message-${CSS.escape(pending.previousFirstMessageId)}`)
+        : null;
+    const target = anchor ?? viewport.querySelector('.chat-message');
     target?.focus({ preventScroll: true });
-  }
-
-  // ==========================================================================
-  // Process Messages for Unread Detection
-  // ==========================================================================
-
-  $effect(() => {
+}
+// ==========================================================================
+// Process Messages for Unread Detection
+// ==========================================================================
+$effect(() => {
     // Pass a getter function for scrollState.atBottom to avoid creating a scroll dependency.
     // The effect should only re-run when messages change, not on every scroll.
     unreadState.processMessages(messages, conversation.id, () => scrollState.atBottom);
-  });
-
-  // ==========================================================================
-  // Streaming rAF Cleanup
-  // ==========================================================================
-
-  // Cancel any pending animation frame when the component unmounts during active streaming.
-  // Without this, the rAF callback fires after destruction and mutates orphaned $state.
-  $effect(() => {
+});
+// ==========================================================================
+// Streaming rAF Cleanup
+// ==========================================================================
+// Cancel any pending animation frame when the component unmounts during active streaming.
+// Without this, the rAF callback fires after destruction and mutates orphaned $state.
+$effect(() => {
     return () => {
-      if (streamingScrollRaf !== undefined) {
-        cancelAnimationFrame(streamingScrollRaf);
-        streamingScrollRaf = undefined;
-      }
+        if (streamingScrollRaf !== undefined) {
+            cancelAnimationFrame(streamingScrollRaf);
+            streamingScrollRaf = undefined;
+        }
     };
-  });
-
-  // ==========================================================================
-  // Adapter Real-Time Subscription
-  // ==========================================================================
-
-  // When an adapter exposes `subscribe`, open a real-time subscription keyed on
-  // the conversation id and tear it down on cleanup. `$effect` never runs on the
-  // server, so no browser guard is needed. Streaming pushes drive Chat's own
-  // imperative buffer (so a push-driven stream is self-contained); transcript /
-  // peripheral pushes forward to the consumer (Chat never mutates `conversation`).
-  //
-  // The effect re-subscribes ONLY when the adapter reference or the
-  // `conversationId` VALUE changes — keying on the derived id value (not on
-  // `conversation.id` read inline) means a new `conversation` snapshot bearing
-  // the same id does not churn the subscription. The forwarding callbacks are
-  // read through `untrack` at invocation time so a consumer passing inline arrow
-  // functions (whose identity churns every render) does not tear down and reopen
-  // the transport on every render — each handler still calls the LATEST callback,
-  // it just isn't a dependency of the subscription effect.
-  $effect(() => {
+});
+// ==========================================================================
+// Adapter Real-Time Subscription
+// ==========================================================================
+// When an adapter exposes `subscribe`, open a real-time subscription keyed on
+// the conversation id and tear it down on cleanup. `$effect` never runs on the
+// server, so no browser guard is needed. Streaming pushes drive Chat's own
+// imperative buffer (so a push-driven stream is self-contained); transcript /
+// peripheral pushes forward to the consumer (Chat never mutates `conversation`).
+//
+// The effect re-subscribes ONLY when the adapter reference or the
+// `conversationId` VALUE changes — keying on the derived id value (not on
+// `conversation.id` read inline) means a new `conversation` snapshot bearing
+// the same id does not churn the subscription. The forwarding callbacks are
+// read through `untrack` at invocation time so a consumer passing inline arrow
+// functions (whose identity churns every render) does not tear down and reopen
+// the transport on every render — each handler still calls the LATEST callback,
+// it just isn't a dependency of the subscription effect.
+$effect(() => {
     const resolvedAdapter = adapter;
-    if (!resolvedAdapter?.subscribe) return;
-
+    if (!resolvedAdapter?.subscribe)
+        return;
     const currentConversationId = conversationId;
-    const handlers: ChatPushHandlers = {
-      onMessage: (message) => untrack(() => onpushmessage)?.(message),
-      onTypingChange: (isTyping) => {
-        // Drive the C6 per-participant typing indicator via the adapter path.
-        typingIndicatorState.handleAdapterTypingChange(isTyping);
-        untrack(() => ontypingchange)?.(isTyping);
-      },
-      onReadReceipt: (event) => {
-        // Accumulate the receipt into C6 read receipt state.
-        readReceiptsState.handleAdapterReadReceipt(event);
-        untrack(() => onreadreceipt)?.(event);
-      },
-      onStreamBegin: (messageId) => beginStreaming(messageId),
-      onTokenPush: (token) => pushToken(token),
-      onStreamEnd: () => endStreaming(),
+    const handlers = {
+        onMessage: (message) => untrack(() => onpushmessage)?.(message),
+        onTypingChange: (isTyping) => {
+            // Drive the C6 per-participant typing indicator via the adapter path.
+            typingIndicatorState.handleAdapterTypingChange(isTyping);
+            untrack(() => ontypingchange)?.(isTyping);
+        },
+        onReadReceipt: (event) => {
+            // Accumulate the receipt into C6 read receipt state.
+            readReceiptsState.handleAdapterReadReceipt(event);
+            untrack(() => onreadreceipt)?.(event);
+        },
+        onStreamBegin: (messageId) => beginStreaming(messageId),
+        onTokenPush: (token) => pushToken(token),
+        onStreamEnd: () => endStreaming(),
     };
-
     const unsubscribe = resolvedAdapter.subscribe(currentConversationId, handlers);
-
     // Teardown: close the transport (guarding a contract-violating non-function
     // return so a bad adapter can't crash Svelte's cleanup), clear the imperative
     // streaming buffer, AND clear the adapter-derived C6 typing/receipt state.
@@ -766,112 +567,93 @@
     // participant, a pending live-region timer, and accumulated receipts alive
     // (the conversation-change effect above only fires on an id change).
     return () => {
-      if (typeof unsubscribe === 'function') unsubscribe();
-      endStreaming();
-      typingIndicatorState.reset();
-      readReceiptsState.reset();
+        if (typeof unsubscribe === 'function')
+            unsubscribe();
+        endStreaming();
+        typingIndicatorState.reset();
+        readReceiptsState.reset();
     };
-  });
-
-  // ==========================================================================
-  // Create Scroll Attachment
-  // ==========================================================================
-
-  const scrollAttachment = scrollState.createScrollAttachment();
-  const historyAnchorScrollAttachment = $derived<Attachment<HTMLElement>>(
-    historyAnchorMessageId === null || historyAnchorRestoredScrollTop === null
-      ? noopAttachment
-      : (node) => {
-          const handleScroll = () => clearHistoryAnchorAfterScroll(node.scrollTop);
-          node.addEventListener('scroll', handleScroll, { passive: true });
-
-          return () => node.removeEventListener('scroll', handleScroll);
-        },
-  );
-  // ==========================================================================
-  // Actions
-  // ==========================================================================
-
-  function handleJumpToLatest(): void {
+});
+// ==========================================================================
+// Create Scroll Attachment
+// ==========================================================================
+const scrollAttachment = scrollState.createScrollAttachment();
+const historyAnchorScrollAttachment = $derived(historyAnchorMessageId === null || historyAnchorRestoredScrollTop === null
+    ? noopAttachment
+    : (node) => {
+        const handleScroll = () => clearHistoryAnchorAfterScroll(node.scrollTop);
+        node.addEventListener('scroll', handleScroll, { passive: true });
+        return () => node.removeEventListener('scroll', handleScroll);
+    });
+// ==========================================================================
+// Actions
+// ==========================================================================
+function handleJumpToLatest() {
     if (isVirtualized) {
-      chatVirtualizer.scrollToIndex(Math.max(0, renderRows.length - 1), {
-        align: 'end',
-        behavior: scrollState.getScrollBehavior(),
-      });
-      unreadState.markAllAsRead();
-      onjumptolatest?.();
-      tick().then(() => {
-        const lastMessage = viewport?.querySelector<HTMLElement>(
-          `.chat-message-wrapper:last-of-type .chat-message`,
-        );
-        lastMessage?.focus();
-      });
-      return;
+        chatVirtualizer.scrollToIndex(Math.max(0, renderRows.length - 1), {
+            align: 'end',
+            behavior: scrollState.getScrollBehavior(),
+        });
+        unreadState.markAllAsRead();
+        onjumptolatest?.();
+        tick().then(() => {
+            const lastMessage = viewport?.querySelector(`.chat-message-wrapper:last-of-type .chat-message`);
+            lastMessage?.focus();
+        });
+        return;
     }
-
     scrollState.jumpToLatest(viewport, () => {
-      unreadState.markAllAsRead();
-      onjumptolatest?.();
+        unreadState.markAllAsRead();
+        onjumptolatest?.();
     });
-  }
-
-  // ==========================================================================
-  // Command Dispatch (callbacks + optional adapter, one path)
-  // ==========================================================================
-
-  // One internal path for every user command so callback-driven and
-  // adapter-driven usage behave identically. The adapter method takes
-  // precedence when present (a transport owner); otherwise the callback fires.
-  //
-  // "Present" is decided by `runAdapterMethod` returning a value (not by the
-  // method's own return value): the call site returns `undefined` ONLY when the
-  // adapter lacks that optional method, and otherwise returns the method's
-  // result wrapped in `Promise.resolve(...)`. This means a synchronously-
-  // returning adapter method (one that resolves to `undefined` rather than a
-  // promise) is still treated as "handled" — the callback does NOT also fire, so
-  // there's no double-dispatch even for a type-violating sync method.
-  //
-  // The whole adapter path is wrapped so BOTH a rejected promise AND a
-  // synchronous throw from the adapter route to `onadaptererror` rather than
-  // escaping. `onadaptererror` is scoped to ADAPTER failures only — the fallback
-  // callback path is the consumer's own code, so a throw there propagates
-  // synchronously rather than being converted into a rejected dispatcher promise.
-  function dispatchCommand(
-    command: ChatCommand,
-    runAdapterMethod: (adapter: ChatAdapter) => Promise<void> | undefined,
-    callback: (() => void) | undefined,
-  ): Promise<void> | void {
+}
+// ==========================================================================
+// Command Dispatch (callbacks + optional adapter, one path)
+// ==========================================================================
+// One internal path for every user command so callback-driven and
+// adapter-driven usage behave identically. The adapter method takes
+// precedence when present (a transport owner); otherwise the callback fires.
+//
+// "Present" is decided by `runAdapterMethod` returning a value (not by the
+// method's own return value): the call site returns `undefined` ONLY when the
+// adapter lacks that optional method, and otherwise returns the method's
+// result wrapped in `Promise.resolve(...)`. This means a synchronously-
+// returning adapter method (one that resolves to `undefined` rather than a
+// promise) is still treated as "handled" — the callback does NOT also fire, so
+// there's no double-dispatch even for a type-violating sync method.
+//
+// The whole adapter path is wrapped so BOTH a rejected promise AND a
+// synchronous throw from the adapter route to `onadaptererror` rather than
+// escaping. `onadaptererror` is scoped to ADAPTER failures only — the fallback
+// callback path is the consumer's own code, so a throw there propagates
+// synchronously rather than being converted into a rejected dispatcher promise.
+function dispatchCommand(command, runAdapterMethod, callback) {
     if (adapter) {
-      try {
-        const run = runAdapterMethod(adapter);
-        // `undefined` means the adapter has no such method → fall through to the
-        // callback. Any other return (a promise, including one wrapping a sync
-        // `undefined` result) means the adapter handled it — never fire the callback.
-        if (run !== undefined) {
-          return run.catch((error: unknown) => {
+        try {
+            const run = runAdapterMethod(adapter);
+            // `undefined` means the adapter has no such method → fall through to the
+            // callback. Any other return (a promise, including one wrapping a sync
+            // `undefined` result) means the adapter handled it — never fire the callback.
+            if (run !== undefined) {
+                return run.catch((error) => {
+                    onadaptererror?.({ command, error });
+                });
+            }
+        }
+        catch (error) {
             onadaptererror?.({ command, error });
-          });
+            return;
         }
-      } catch (error) {
-        onadaptererror?.({ command, error });
-        return;
-      }
     }
     callback?.();
-  }
-
-  function handleSubmit(message: MessageInput, attachments: ChatAttachment[]): void {
+}
+function handleSubmit(message, attachments) {
     // Fire-and-forget the command (the dispatcher owns awaiting + error routing);
     // scroll immediately so the round-trip latency never delays the auto-scroll.
     // `Promise.resolve(...)` normalizes a sync-returning method to a promise so
     // the dispatcher always treats a present method as "handled" (sendMessage is
     // required, so it's always present here).
-    void dispatchCommand(
-      'sendMessage',
-      (resolvedAdapter) => Promise.resolve(resolvedAdapter.sendMessage(message, attachments)),
-      () => onsubmit?.({ message, attachments }),
-    );
-
+    void dispatchCommand('sendMessage', (resolvedAdapter) => Promise.resolve(resolvedAdapter.sendMessage(message, attachments)), () => onsubmit?.({ message, attachments }));
     // Auto-scroll after sending.
     // Also update the bindable prop so the parent binding reflects the new
     // atBottom=true state immediately — scrollState.setAtBottom() only
@@ -880,574 +662,490 @@
     scrollState.setAtBottom(true);
     atBottom = true;
     tick().then(() => {
-      if (isVirtualized) {
-        chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, { behavior: 'instant' });
-      } else {
-        viewport?.scrollTo({ top: viewport.scrollHeight, behavior: 'instant' });
-      }
+        if (isVirtualized) {
+            chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, { behavior: 'instant' });
+        }
+        else {
+            viewport?.scrollTo({ top: viewport.scrollHeight, behavior: 'instant' });
+        }
     });
-  }
-
-  function captureHistoryScroll(): void {
+}
+function captureHistoryScroll() {
     const previousFirstTranscriptMessageId = messages[0]?.id ?? null;
     const visibleAnchor = firstVisibleRenderedMessage();
     const previousFirstMessageId = visibleAnchor?.messageId ?? previousFirstTranscriptMessageId;
     const previousScrollTop = viewport?.scrollTop ?? chatVirtualizer.scrollOffset;
-    const previousFirstMessageElement =
-      previousFirstMessageId !== null ? renderedMessageById(previousFirstMessageId) : null;
-    const previousFirstMessageViewportOffset =
-      visibleAnchor?.viewportOffset ??
-      (previousFirstMessageElement && viewport
-        ? previousFirstMessageElement.getBoundingClientRect().top -
-          viewport.getBoundingClientRect().top
-        : 0);
+    const previousFirstMessageElement = previousFirstMessageId !== null ? renderedMessageById(previousFirstMessageId) : null;
+    const previousFirstMessageViewportOffset = visibleAnchor?.viewportOffset ??
+        (previousFirstMessageElement && viewport
+            ? previousFirstMessageElement.getBoundingClientRect().top -
+                viewport.getBoundingClientRect().top
+            : 0);
     pendingHistoryScroll = {
-      previousFirstMessageId,
-      previousFirstTranscriptMessageId,
-      previousFirstMessageViewportOffset,
-      previousCount: messages.length,
-      previousScrollTop,
-      previousScrollHeight: viewport?.scrollHeight ?? 0,
-      previousTotalSize: chatVirtualizer.scrollSize,
+        previousFirstMessageId,
+        previousFirstTranscriptMessageId,
+        previousFirstMessageViewportOffset,
+        previousCount: messages.length,
+        previousScrollTop,
+        previousScrollHeight: viewport?.scrollHeight ?? 0,
+        previousTotalSize: chatVirtualizer.scrollSize,
     };
-  }
-
-  async function settlePendingHistoryScroll(pending: PendingHistoryScroll): Promise<void> {
+}
+async function settlePendingHistoryScroll(pending) {
     for (let attempt = 0; attempt < 5; attempt += 1) {
-      if (pendingHistoryScroll !== pending) return;
-      if (await restorePendingHistoryScrollAfterLayout(pending)) return;
+        if (pendingHistoryScroll !== pending)
+            return;
+        if (await restorePendingHistoryScrollAfterLayout(pending))
+            return;
     }
-
     if (pendingHistoryScroll === pending) {
-      pendingHistoryScroll = null;
-      finishDeferredAdapterHistoryLoading();
+        pendingHistoryScroll = null;
+        finishDeferredAdapterHistoryLoading();
     }
-  }
-
-  function finishDeferredAdapterHistoryLoading(): void {
-    if (deferredAdapterHasMoreHistory === null) return;
-
+}
+function finishDeferredAdapterHistoryLoading() {
+    if (deferredAdapterHasMoreHistory === null)
+        return;
     adapterHasMoreHistory = deferredAdapterHasMoreHistory;
     deferredAdapterHasMoreHistory = null;
     isLoadingHistory = false;
-  }
-
-  function historyTranscriptChanged(pending: PendingHistoryScroll): boolean {
-    return (
-      messages.length > pending.previousCount ||
-      messages[0]?.id !== pending.previousFirstTranscriptMessageId
-    );
-  }
-
-  async function handleLoadHistory(): Promise<void> {
-    if (isLoadingHistory || !showHistoryTrigger) return;
-
+}
+function historyTranscriptChanged(pending) {
+    return (messages.length > pending.previousCount ||
+        messages[0]?.id !== pending.previousFirstTranscriptMessageId);
+}
+async function handleLoadHistory() {
+    if (isLoadingHistory || !showHistoryTrigger)
+        return;
     isLoadingHistory = true;
     captureHistoryScroll();
     const pending = pendingHistoryScroll;
     if (pending === null) {
-      isLoadingHistory = false;
-      return;
-    }
-
-    if (adapter?.loadOlderMessages) {
-      let nextHasMoreHistory: boolean | undefined;
-      try {
-        const result = await adapter.loadOlderMessages(conversationId);
-        nextHasMoreHistory = result.hasMore;
-      } catch (error) {
-        pendingHistoryScroll = null;
         isLoadingHistory = false;
-        onadaptererror?.({ command: 'loadOlderMessages', error });
         return;
-      }
-
-      const transcriptChanged = historyTranscriptChanged(pending);
-      if (isVirtualized && !transcriptChanged) {
-        deferredAdapterHasMoreHistory = nextHasMoreHistory ?? null;
-        await tick();
-        if (historyTranscriptChanged(pending)) {
-          await settlePendingHistoryScroll(pending);
-        } else if (pendingHistoryScroll === pending) {
-          pendingHistoryScroll = null;
-          finishDeferredAdapterHistoryLoading();
-        } else {
-          finishDeferredAdapterHistoryLoading();
+    }
+    if (adapter?.loadOlderMessages) {
+        let nextHasMoreHistory;
+        try {
+            const result = await adapter.loadOlderMessages(conversationId);
+            nextHasMoreHistory = result.hasMore;
+        }
+        catch (error) {
+            pendingHistoryScroll = null;
+            isLoadingHistory = false;
+            onadaptererror?.({ command: 'loadOlderMessages', error });
+            return;
+        }
+        const transcriptChanged = historyTranscriptChanged(pending);
+        if (isVirtualized && !transcriptChanged) {
+            deferredAdapterHasMoreHistory = nextHasMoreHistory ?? null;
+            await tick();
+            if (historyTranscriptChanged(pending)) {
+                await settlePendingHistoryScroll(pending);
+            }
+            else if (pendingHistoryScroll === pending) {
+                pendingHistoryScroll = null;
+                finishDeferredAdapterHistoryLoading();
+            }
+            else {
+                finishDeferredAdapterHistoryLoading();
+            }
+            return;
+        }
+        if (isVirtualized || transcriptChanged) {
+            await settlePendingHistoryScroll(pending);
+        }
+        else {
+            pendingHistoryScroll = null;
         }
+        adapterHasMoreHistory = nextHasMoreHistory;
+        isLoadingHistory = false;
         return;
-      }
-
-      if (isVirtualized || transcriptChanged) {
+    }
+    try {
+        await onloadhistory?.();
         await settlePendingHistoryScroll(pending);
-      } else {
+    }
+    catch (error) {
         pendingHistoryScroll = null;
-      }
-      adapterHasMoreHistory = nextHasMoreHistory;
-      isLoadingHistory = false;
-      return;
+        throw error;
     }
-
-    try {
-      await onloadhistory?.();
-      await settlePendingHistoryScroll(pending);
-    } catch (error) {
-      pendingHistoryScroll = null;
-      throw error;
-    } finally {
-      isLoadingHistory = false;
+    finally {
+        isLoadingHistory = false;
     }
-  }
-
-  function handleRetry(messageId: string): void {
-    void dispatchCommand(
-      'retryMessage',
-      // Return `undefined` ONLY when the optional method is absent; otherwise
-      // wrap its result so a present-but-sync method still counts as handled.
-      (resolvedAdapter) =>
-        resolvedAdapter.retryMessage
-          ? Promise.resolve(resolvedAdapter.retryMessage(messageId))
-          : undefined,
-      () => onretry?.(messageId),
-    );
-  }
-
-  function handleEdit(event: { messageId: string; content: string }): void {
-    void dispatchCommand(
-      'editMessage',
-      (resolvedAdapter) =>
-        resolvedAdapter.editMessage
-          ? Promise.resolve(resolvedAdapter.editMessage(event))
-          : undefined,
-      () => onedit?.(event),
-    );
-  }
-
-  // C5 — suggestion selection handler. Calls the consumer callback then
-  // moves focus to the composer so keyboard users are not left stranded on a
-  // chip button that gets removed from the DOM when the suggestion set clears.
-  function handleSuggestionSelect(label: string): void {
+}
+function handleRetry(messageId) {
+    void dispatchCommand('retryMessage', 
+    // Return `undefined` ONLY when the optional method is absent; otherwise
+    // wrap its result so a present-but-sync method still counts as handled.
+    (resolvedAdapter) => resolvedAdapter.retryMessage
+        ? Promise.resolve(resolvedAdapter.retryMessage(messageId))
+        : undefined, () => onretry?.(messageId));
+}
+function handleEdit(event) {
+    void dispatchCommand('editMessage', (resolvedAdapter) => resolvedAdapter.editMessage
+        ? Promise.resolve(resolvedAdapter.editMessage(event))
+        : undefined, () => onedit?.(event));
+}
+// C5 — suggestion selection handler. Calls the consumer callback then
+// moves focus to the composer so keyboard users are not left stranded on a
+// chip button that gets removed from the DOM when the suggestion set clears.
+function handleSuggestionSelect(label) {
     onsuggestionselect?.(label);
     inputRef?.focus();
-  }
-
-  // C3 — an approve/deny affordance only resolves when SOMETHING can handle it —
-  // the adapter command OR the consumer callback. `canApprove`/`canDeny` gate
-  // both the button-enabled state (passed to ToolApprovalPart) and the resolve
-  // guard, so a consumer that wires neither path gets disabled buttons rather
-  // than a click that commits UI-only state to nowhere (matches canRetry/canEdit).
-  const canApprove = $derived(onapprove !== undefined || adapter?.approveToolCall !== undefined);
-  const canDeny = $derived(ondeny !== undefined || adapter?.denyToolCall !== undefined);
-
-  // C3 — tool approval handlers. The resolution is recorded optimistically in the
-  // UI-only id sets for immediate feedback, then the adapter command (if present)
-  // runs and, on SUCCESS, the consumer callback fires (adapter-first-then-callback
-  // contract). Guard double-resolution: if the call id is already in either set,
-  // skip so a second tap/Escape cannot flip a resolved state. If the ADAPTER
-  // command REJECTS (or throws), the optimistic resolution is rolled back so the
-  // prompt returns to pending instead of being stuck "approved"/"denied" on a
-  // transport failure — the error routes to onadaptererror and the callback does
-  // NOT fire. With no adapter method, the callback fires synchronously.
-  function resolveToolApproval(
-    toolCallId: string,
-    command: 'approveToolCall' | 'denyToolCall',
-    canHandle: boolean,
-    commit: (id: string) => void,
-    rollback: (id: string) => void,
-    runAdapter: (adapter: ChatAdapter) => Promise<void> | undefined,
-    callback: (() => void) | undefined,
-  ): void {
-    if (!canHandle) return;
-    if (approvedToolCallIds.has(toolCallId) || deniedToolCallIds.has(toolCallId)) return;
+}
+// C3 — an approve/deny affordance only resolves when SOMETHING can handle it —
+// the adapter command OR the consumer callback. `canApprove`/`canDeny` gate
+// both the button-enabled state (passed to ToolApprovalPart) and the resolve
+// guard, so a consumer that wires neither path gets disabled buttons rather
+// than a click that commits UI-only state to nowhere (matches canRetry/canEdit).
+const canApprove = $derived(onapprove !== undefined || adapter?.approveToolCall !== undefined);
+const canDeny = $derived(ondeny !== undefined || adapter?.denyToolCall !== undefined);
+// C3 — tool approval handlers. The resolution is recorded optimistically in the
+// UI-only id sets for immediate feedback, then the adapter command (if present)
+// runs and, on SUCCESS, the consumer callback fires (adapter-first-then-callback
+// contract). Guard double-resolution: if the call id is already in either set,
+// skip so a second tap/Escape cannot flip a resolved state. If the ADAPTER
+// command REJECTS (or throws), the optimistic resolution is rolled back so the
+// prompt returns to pending instead of being stuck "approved"/"denied" on a
+// transport failure — the error routes to onadaptererror and the callback does
+// NOT fire. With no adapter method, the callback fires synchronously.
+function resolveToolApproval(toolCallId, command, canHandle, commit, rollback, runAdapter, callback) {
+    if (!canHandle)
+        return;
+    if (approvedToolCallIds.has(toolCallId) || deniedToolCallIds.has(toolCallId))
+        return;
     commit(toolCallId);
-
     if (adapter) {
-      let run: Promise<void> | undefined;
-      try {
-        run = runAdapter(adapter);
-      } catch (error) {
-        rollback(toolCallId);
-        onadaptererror?.({ command, error });
-        return;
-      }
-      if (run !== undefined) {
-        void run.then(
-          () => callback?.(),
-          (error: unknown) => {
+        let run;
+        try {
+            run = runAdapter(adapter);
+        }
+        catch (error) {
             rollback(toolCallId);
             onadaptererror?.({ command, error });
-          },
-        );
-        return;
-      }
+            return;
+        }
+        if (run !== undefined) {
+            void run.then(() => callback?.(), (error) => {
+                rollback(toolCallId);
+                onadaptererror?.({ command, error });
+            });
+            return;
+        }
     }
     callback?.();
-  }
-
-  function handleApprove(toolCallId: string): void {
-    resolveToolApproval(
-      toolCallId,
-      'approveToolCall',
-      canApprove,
-      (id) => (approvedToolCallIds = new Set([...approvedToolCallIds, id])),
-      (id) => (approvedToolCallIds = removeFromSet(approvedToolCallIds, id)),
-      (resolvedAdapter) =>
-        resolvedAdapter.approveToolCall
-          ? Promise.resolve(resolvedAdapter.approveToolCall(toolCallId))
-          : undefined,
-      () => onapprove?.(toolCallId),
-    );
-  }
-
-  function handleDeny(toolCallId: string): void {
-    resolveToolApproval(
-      toolCallId,
-      'denyToolCall',
-      canDeny,
-      (id) => (deniedToolCallIds = new Set([...deniedToolCallIds, id])),
-      (id) => (deniedToolCallIds = removeFromSet(deniedToolCallIds, id)),
-      (resolvedAdapter) =>
-        resolvedAdapter.denyToolCall
-          ? Promise.resolve(resolvedAdapter.denyToolCall(toolCallId))
-          : undefined,
-      () => ondeny?.(toolCallId),
-    );
-  }
-
-  function removeFromSet(set: Set<string>, value: string): Set<string> {
+}
+function handleApprove(toolCallId) {
+    resolveToolApproval(toolCallId, 'approveToolCall', canApprove, (id) => (approvedToolCallIds = new Set([...approvedToolCallIds, id])), (id) => (approvedToolCallIds = removeFromSet(approvedToolCallIds, id)), (resolvedAdapter) => resolvedAdapter.approveToolCall
+        ? Promise.resolve(resolvedAdapter.approveToolCall(toolCallId))
+        : undefined, () => onapprove?.(toolCallId));
+}
+function handleDeny(toolCallId) {
+    resolveToolApproval(toolCallId, 'denyToolCall', canDeny, (id) => (deniedToolCallIds = new Set([...deniedToolCallIds, id])), (id) => (deniedToolCallIds = removeFromSet(deniedToolCallIds, id)), (resolvedAdapter) => resolvedAdapter.denyToolCall
+        ? Promise.resolve(resolvedAdapter.denyToolCall(toolCallId))
+        : undefined, () => ondeny?.(toolCallId));
+}
+function removeFromSet(set, value) {
     const next = new Set(set);
     next.delete(value);
     return next;
-  }
-
-  function handleStopGenerating(): void {
+}
+function handleStopGenerating() {
     // Find the streaming message (last assistant message)
     // Using backwards loop instead of findLast() for broader browser compatibility
-    let streamingMessage: Message | undefined;
+    let streamingMessage;
     for (let i = messages.length - 1; i >= 0; i--) {
-      const message = messages[i];
-      if (message?.role === 'assistant') {
-        streamingMessage = message;
-        break;
-      }
+        const message = messages[i];
+        if (message?.role === 'assistant') {
+            streamingMessage = message;
+            break;
+        }
     }
     if (streamingMessage) {
-      // Local name avoids shadowing the module-level `streamingMessageId` $state.
-      const targetMessageId = streamingMessage.id;
-      void dispatchCommand(
-        'stopGenerating',
-        (resolvedAdapter) =>
-          resolvedAdapter.stopGenerating
+        // Local name avoids shadowing the module-level `streamingMessageId` $state.
+        const targetMessageId = streamingMessage.id;
+        void dispatchCommand('stopGenerating', (resolvedAdapter) => resolvedAdapter.stopGenerating
             ? Promise.resolve(resolvedAdapter.stopGenerating(targetMessageId))
-            : undefined,
-        () => onstopgenerating?.({ messageId: targetMessageId }),
-      );
+            : undefined, () => onstopgenerating?.({ messageId: targetMessageId }));
     }
-  }
-
-  function handlePromptClick(prompt: string): void {
+}
+function handlePromptClick(prompt) {
     // Filter to only ready attachments — pending ones have not yet resolved their
     // textContent, so forwarding them would produce an inconsistent payload compared
     // to the regular send-button flow which also filters on 'ready'.
-    const currentAttachments = (inputRef?.getAttachments() ?? []).filter(
-      (a) => a.status === 'ready',
-    );
+    const currentAttachments = (inputRef?.getAttachments() ?? []).filter((a) => a.status === 'ready');
     handleSubmit({ role: 'user', content: prompt }, currentAttachments);
     inputRef?.clear();
-  }
-
-  function handleKeyDown(event: KeyboardEvent): void {
+}
+function handleKeyDown(event) {
     // Intercept Ctrl+F / Cmd+F to open in-app search instead of browser search.
     // If the search bar is already open, refocus its input rather than being a no-op.
     if (allowSearch && (event.ctrlKey || event.metaKey) && event.key === 'f') {
-      event.preventDefault();
-      if (searchState.isOpen) {
-        searchBarRef?.focusInput();
-      } else {
-        searchState.open();
-      }
-      return;
+        event.preventDefault();
+        if (searchState.isOpen) {
+            searchBarRef?.focusInput();
+        }
+        else {
+            searchState.open();
+        }
+        return;
     }
-
     // Let the chat keyboard nav helper handle all other shortcuts.
     // The keyboard nav only handles Home/End/PageUp/PageDown/Arrow keys, so
     // Enter and Escape pass through without conflict when the search bar is open.
     // The search bar's own onkeydown handles Enter/Escape directly on its input.
     keyboardNav.handleKeyDown(event, viewport);
-  }
-
-  function messageIdFromElement(element: HTMLElement): string | null {
-    if (!element.id.startsWith('message-')) return null;
+}
+function messageIdFromElement(element) {
+    if (!element.id.startsWith('message-'))
+        return null;
     return element.id.slice('message-'.length);
-  }
-
-  function renderedMessageById(messageId: string): HTMLElement | null {
-    return viewport?.querySelector<HTMLElement>(`#message-${CSS.escape(messageId)}`) ?? null;
-  }
-
-  function firstVisibleRenderedMessage(): { messageId: string; viewportOffset: number } | null {
-    if (!viewport) return null;
-
+}
+function renderedMessageById(messageId) {
+    return viewport?.querySelector(`#message-${CSS.escape(messageId)}`) ?? null;
+}
+function firstVisibleRenderedMessage() {
+    if (!viewport)
+        return null;
     const viewportRect = viewport.getBoundingClientRect();
-    for (const message of viewport.querySelectorAll<HTMLElement>('.chat-message')) {
-      const messageId = messageIdFromElement(message);
-      if (!messageId) continue;
-
-      const rect = message.getBoundingClientRect();
-      if (rect.bottom <= viewportRect.top || rect.top >= viewportRect.bottom) continue;
-
-      return {
-        messageId,
-        viewportOffset: rect.top - viewportRect.top,
-      };
+    for (const message of viewport.querySelectorAll('.chat-message')) {
+        const messageId = messageIdFromElement(message);
+        if (!messageId)
+            continue;
+        const rect = message.getBoundingClientRect();
+        if (rect.bottom <= viewportRect.top || rect.top >= viewportRect.bottom)
+            continue;
+        return {
+            messageId,
+            viewportOffset: rect.top - viewportRect.top,
+        };
     }
-
     return null;
-  }
-
-  async function focusVirtualMessage(messageId: string): Promise<void> {
+}
+async function focusVirtualMessage(messageId) {
     const existing = renderedMessageById(messageId);
     if (existing) {
-      existing.focus();
-      existing.scrollIntoView({ behavior: scrollState.getScrollBehavior(), block: 'nearest' });
-      return;
+        existing.focus();
+        existing.scrollIntoView({ behavior: scrollState.getScrollBehavior(), block: 'nearest' });
+        return;
     }
-
     const targetIndex = findRenderRowIndexByMessageId(renderRows, messageId);
-    if (targetIndex < 0) return;
-
+    if (targetIndex < 0)
+        return;
     chatVirtualizer.scrollToIndex(targetIndex, {
-      align: 'auto',
-      behavior: scrollState.getScrollBehavior(),
+        align: 'auto',
+        behavior: scrollState.getScrollBehavior(),
     });
     await tick();
     const target = renderedMessageById(messageId);
     target?.focus();
     target?.scrollIntoView({ behavior: scrollState.getScrollBehavior(), block: 'nearest' });
-  }
-
-  function navigateVirtualMessage(direction: 'next' | 'previous'): boolean {
-    if (!isVirtualized || !viewport) return false;
-    const activeElement =
-      document.activeElement instanceof HTMLElement ? document.activeElement : null;
-    if (!activeElement?.classList.contains('chat-message')) return false;
-
+}
+function navigateVirtualMessage(direction) {
+    if (!isVirtualized || !viewport)
+        return false;
+    const activeElement = document.activeElement instanceof HTMLElement ? document.activeElement : null;
+    if (!activeElement?.classList.contains('chat-message'))
+        return false;
     const currentMessageId = messageIdFromElement(activeElement);
-    if (!currentMessageId) return false;
-
+    if (!currentMessageId)
+        return false;
     const currentIndex = findRenderRowIndexByMessageId(renderRows, currentMessageId);
-    if (currentIndex < 0) return false;
-
+    if (currentIndex < 0)
+        return false;
     const step = direction === 'next' ? 1 : -1;
-    for (
-      let targetIndex = currentIndex + step;
-      targetIndex >= 0 && targetIndex < renderRows.length;
-      targetIndex += step
-    ) {
-      const targetRow = renderRows[targetIndex];
-      if (targetRow?.type !== 'message') continue;
-
-      void focusVirtualMessage(targetRow.message.id);
-      return true;
+    for (let targetIndex = currentIndex + step; targetIndex >= 0 && targetIndex < renderRows.length; targetIndex += step) {
+        const targetRow = renderRows[targetIndex];
+        if (targetRow?.type !== 'message')
+            continue;
+        void focusVirtualMessage(targetRow.message.id);
+        return true;
     }
-
     return true;
-  }
-
-  // Scroll to the currently matched message when the current match changes
-  $effect(() => {
+}
+// Scroll to the currently matched message when the current match changes
+$effect(() => {
     const match = searchState.currentMatch;
-    if (!match || !viewport) return;
-
+    if (!match || !viewport)
+        return;
     void scrollCurrentSearchMatch(match.message.id);
-  });
-
-  async function scrollCurrentSearchMatch(messageId: string): Promise<void> {
-    if (!viewport) return;
-
+});
+async function scrollCurrentSearchMatch(messageId) {
+    if (!viewport)
+        return;
     if (isVirtualized) {
-      const targetIndex = findRenderRowIndexByMessageId(renderRows, messageId);
-      if (targetIndex >= 0) {
-        chatVirtualizer.scrollToIndex(targetIndex, { align: 'center', behavior: 'auto' });
-        await tick();
-      }
+        const targetIndex = findRenderRowIndexByMessageId(renderRows, messageId);
+        if (targetIndex >= 0) {
+            chatVirtualizer.scrollToIndex(targetIndex, { align: 'center', behavior: 'auto' });
+            await tick();
+        }
     }
-
-    const messageElement = viewport.querySelector<HTMLElement>(`#message-${CSS.escape(messageId)}`);
+    const messageElement = viewport.querySelector(`#message-${CSS.escape(messageId)}`);
     if (messageElement) {
-      messageElement.scrollIntoView({ behavior: 'auto', block: 'nearest' });
+        messageElement.scrollIntoView({ behavior: 'auto', block: 'nearest' });
     }
-  }
-
-  // ==========================================================================
-  // Container-Level Drag and Drop
-  // ==========================================================================
-
-  function handleContainerDrop(event: DragEvent): void {
+}
+// ==========================================================================
+// Container-Level Drag and Drop
+// ==========================================================================
+function handleContainerDrop(event) {
     // Only intercept file drops — text/URL drops should not have their
     // default behavior suppressed, matching the dragover guard above.
-    if (!event.dataTransfer?.types.includes('Files')) return;
+    if (!event.dataTransfer?.types.includes('Files'))
+        return;
     isContainerDragOver = false;
-
-    if (!allowAttachments) return;
+    if (!allowAttachments)
+        return;
     event.preventDefault();
-
     const files = event.dataTransfer.files;
     if (files.length > 0) {
-      inputRef?.addFiles(Array.from(files));
+        inputRef?.addFiles(Array.from(files));
     }
-  }
-
-  function handleContainerDragOver(event: DragEvent): void {
+}
+function handleContainerDragOver(event) {
     // Only intercept file drags — text/URL drags should not show the file drop overlay
     // or have their default behavior suppressed.
-    if (!event.dataTransfer?.types.includes('Files')) return;
-    if (!allowAttachments) return;
+    if (!event.dataTransfer?.types.includes('Files'))
+        return;
+    if (!allowAttachments)
+        return;
     event.preventDefault();
     event.dataTransfer.dropEffect = 'copy';
     isContainerDragOver = true;
-  }
-
-  function handleContainerDragLeave(event: DragEvent): void {
+}
+function handleContainerDragLeave(event) {
     // Only clear if leaving the container entirely (not entering a child)
-    const container = event.currentTarget as HTMLElement;
-    if (!container.contains(event.relatedTarget as Node)) {
-      isContainerDragOver = false;
-    }
-  }
-
-  // Capture-phase drop listener: resets the overlay even when a child (e.g. ChatInput)
-  // calls stopPropagation() on the drop event, which prevents the bubbling ondrop handler
-  // on this container from ever firing.
-  $effect(() => {
-    if (!containerRef) return;
-    function resetDragOver(event: DragEvent): void {
-      if (event.dataTransfer?.types.includes('Files')) {
+    const container = event.currentTarget;
+    if (!container.contains(event.relatedTarget)) {
         isContainerDragOver = false;
-      }
+    }
+}
+// Capture-phase drop listener: resets the overlay even when a child (e.g. ChatInput)
+// calls stopPropagation() on the drop event, which prevents the bubbling ondrop handler
+// on this container from ever firing.
+$effect(() => {
+    if (!containerRef)
+        return;
+    function resetDragOver(event) {
+        if (event.dataTransfer?.types.includes('Files')) {
+            isContainerDragOver = false;
+        }
     }
     containerRef.addEventListener('drop', resetDragOver, { capture: true });
     return () => {
-      containerRef?.removeEventListener('drop', resetDragOver, { capture: true });
+        containerRef?.removeEventListener('drop', resetDragOver, { capture: true });
     };
-  });
-
-  // ==========================================================================
-  // Imperative API
-  // ==========================================================================
-
-  export function scrollToBottom(): void {
+});
+// ==========================================================================
+// Imperative API
+// ==========================================================================
+export function scrollToBottom() {
     if (isVirtualized) {
-      chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, {
-        behavior: scrollState.getScrollBehavior(),
-      });
-    } else {
-      scrollState.scrollToBottom(viewport);
+        chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, {
+            behavior: scrollState.getScrollBehavior(),
+        });
     }
-  }
-
-  export function scrollToTop(): void {
+    else {
+        scrollState.scrollToBottom(viewport);
+    }
+}
+export function scrollToTop() {
     if (isVirtualized) {
-      chatVirtualizer.scrollToOffset(0, { behavior: scrollState.getScrollBehavior() });
-    } else {
-      scrollState.scrollToTop(viewport);
+        chatVirtualizer.scrollToOffset(0, { behavior: scrollState.getScrollBehavior() });
     }
-  }
-
-  export function focusInput(): void {
+    else {
+        scrollState.scrollToTop(viewport);
+    }
+}
+export function focusInput() {
     inputRef?.focus();
-  }
-
-  /**
-   * Begin streaming content for a specific message.
-   * The message should already exist in the conversation.
-   * Replaces the typing indicator dots with actual content.
-   * Cancels any pending rAF from a prior pushToken call so a stale flush does
-   * not overwrite the fresh stream if beginStreaming is called without a
-   * preceding endStreaming.
-   */
-  export function beginStreaming(messageId: string): void {
+}
+/**
+ * Begin streaming content for a specific message.
+ * The message should already exist in the conversation.
+ * Replaces the typing indicator dots with actual content.
+ * Cancels any pending rAF from a prior pushToken call so a stale flush does
+ * not overwrite the fresh stream if beginStreaming is called without a
+ * preceding endStreaming.
+ */
+export function beginStreaming(messageId) {
     if (streamingScrollRaf !== undefined) {
-      cancelAnimationFrame(streamingScrollRaf);
-      streamingScrollRaf = undefined;
+        cancelAnimationFrame(streamingScrollRaf);
+        streamingScrollRaf = undefined;
     }
     streamingMessageId = messageId;
     streamingContent = '';
     tokenBuffer = [];
-  }
-
-  /**
-   * Append a token to the streaming content buffer.
-   * Tokens are accumulated in an array and flushed (joined once) per animation frame,
-   * avoiding O(n²) work from calling join() on every individual token push.
-   * Scroll updates are batched in the same frame to avoid excessive layout work.
-   */
-  export function pushToken(token: string): void {
+}
+/**
+ * Append a token to the streaming content buffer.
+ * Tokens are accumulated in an array and flushed (joined once) per animation frame,
+ * avoiding O(n²) work from calling join() on every individual token push.
+ * Scroll updates are batched in the same frame to avoid excessive layout work.
+ */
+export function pushToken(token) {
     tokenBuffer.push(token);
-
     // Batch the join + scroll update to once per animation frame.
     // Without this, join() is O(n) per push → O(n²) total across the stream.
     if (streamingScrollRaf === undefined) {
-      streamingScrollRaf = requestAnimationFrame(() => {
-        streamingScrollRaf = undefined;
-        // Flush: join the entire buffer once per frame
-        streamingContent = tokenBuffer.join('');
-        if (streamingRowElement) {
-          tick().then(() => {
+        streamingScrollRaf = requestAnimationFrame(() => {
+            streamingScrollRaf = undefined;
+            // Flush: join the entire buffer once per frame
+            streamingContent = tokenBuffer.join('');
             if (streamingRowElement) {
-              chatVirtualizer.measureElementNode(streamingRowElement);
+                tick().then(() => {
+                    if (streamingRowElement) {
+                        chatVirtualizer.measureElementNode(streamingRowElement);
+                    }
+                });
             }
-          });
-        }
-        // Auto-scroll if at bottom
-        if (scrollState.atBottom && viewport) {
-          if (isVirtualized) {
-            chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, { behavior: 'instant' });
-          } else {
-            viewport.scrollTo({ top: viewport.scrollHeight, behavior: 'instant' });
-          }
-        }
-      });
+            // Auto-scroll if at bottom
+            if (scrollState.atBottom && viewport) {
+                if (isVirtualized) {
+                    chatVirtualizer.scrollToOffset(chatVirtualizer.scrollSize, { behavior: 'instant' });
+                }
+                else {
+                    viewport.scrollTo({ top: viewport.scrollHeight, behavior: 'instant' });
+                }
+            }
+        });
     }
-  }
-
-  /**
-   * End streaming for the current message.
-   * The message's final content should already be committed to the Conversation.
-   * Cancels any pending rAF flush so the stale buffer is not written after endStreaming.
-   */
-  export function endStreaming(): void {
+}
+/**
+ * End streaming for the current message.
+ * The message's final content should already be committed to the Conversation.
+ * Cancels any pending rAF flush so the stale buffer is not written after endStreaming.
+ */
+export function endStreaming() {
     if (streamingScrollRaf !== undefined) {
-      cancelAnimationFrame(streamingScrollRaf);
-      streamingScrollRaf = undefined;
+        cancelAnimationFrame(streamingScrollRaf);
+        streamingScrollRaf = undefined;
     }
     streamingMessageId = null;
     streamingContent = '';
     tokenBuffer = [];
-  }
-
-  function virtualizedSpacerStyle(): string {
+}
+function virtualizedSpacerStyle() {
     return `height: ${chatVirtualizer.totalSize}px; position: relative; width: 100%;`;
-  }
-
-  function virtualizedRowStyle(virtualItem: VirtualItem): string {
+}
+function virtualizedRowStyle(virtualItem) {
     return `position: absolute; inset-inline: 0; top: 0; transform: translateY(${virtualItem.start}px);`;
-  }
-
-  function virtualRowAttachment(row: ChatRenderRow): Attachment<HTMLElement> {
+}
+function virtualRowAttachment(row) {
     return (node) => {
-      const detachMeasurement = chatVirtualizer.measureElement(node);
-      if (row.type === 'message' && row.message.id === streamingMessageId) {
-        streamingRowElement = node;
-      }
-
-      return () => {
-        detachMeasurement?.();
-        if (streamingRowElement === node) {
-          streamingRowElement = null;
+        const detachMeasurement = chatVirtualizer.measureElement(node);
+        if (row.type === 'message' && row.message.id === streamingMessageId) {
+            streamingRowElement = node;
         }
-      };
+        return () => {
+            detachMeasurement?.();
+            if (streamingRowElement === node) {
+                streamingRowElement = null;
+            }
+        };
     };
-  }
+}
 </script>
 
 <div