@meistrari/chat-nuxt 3.9.2 → 3.11.0

package/dist/runtime/messages/components/widgets/chat-workstation-query-widget.vue

@@ -335,86 +335,73 @@ const displayName = computed(() => {
 </script>
 
 <template>
-    <div class="bg-subtle rounded-16px border border-gray-200">
-        <!-- Header -->
-        <div class="px-16px py-16px flex items-center justify-between">
-            <div class="flex-1 min-w-0">
-                <h3 class="text-16px font-580 leading-20px tracking-[-0.3px] text-primary truncate">
-                    Consulta de Dados
-                </h3>
-                <p v-if="displayName !== 'Workstation'" class="text-12px text-secondary truncate mt-2px">
-                    {{ displayName }}
-                </p>
-            </div>
-            <TelaStatus
-                :variant="statusVariant"
-                :label="statusLabel"
-                :is-icon-animated="!toolResult"
-            />
-        </div>
+    <TelaChatWidgetCard
+        title="Consulta de Dados"
+        :status-variant="statusVariant"
+        :status-label="statusLabel ?? ''"
+        :is-icon-animated="!toolResult"
+    >
+        <template v-if="displayName !== 'Workstation'" #subtitle>
+            {{ displayName }}
+        </template>
 
         <!-- Filters preview (when collapsed) -->
         <div
             v-if="!expanded && canExpand && (formattedFilters || formattedOutputQuery)"
-            class="px-16px pb-12px"
+            class="flex flex-wrap items-center gap-6px"
         >
-            <div class="flex flex-wrap items-center gap-6px">
-                <template v-if="formattedFilters">
-                    <span
-                        v-for="filter in formattedFilters.slice(0, 3)"
-                        :key="filter"
-                        class="text-11px px-8px py-3px rounded-6px bg-gray-100 text-gray-600"
-                    >
-                        {{ filter }}
-                    </span>
-                </template>
-                <template v-if="formattedOutputQuery">
-                    <span
-                        v-for="query in formattedOutputQuery.slice(0, 3)"
-                        :key="query"
-                        class="text-11px px-8px py-3px rounded-6px bg-blue-100 text-blue-700"
-                    >
-                        {{ query }}
-                    </span>
-                </template>
+            <template v-if="formattedFilters">
                 <span
-                    v-if="(formattedFilters?.length || 0) + (formattedOutputQuery?.length || 0) > 3"
-                    class="text-11px text-gray-400"
+                    v-for="filter in formattedFilters.slice(0, 3)"
+                    :key="filter"
+                    class="text-11px px-8px py-3px rounded-6px bg-gray-100 text-gray-600"
                 >
-                    +{{ (formattedFilters?.length || 0) + (formattedOutputQuery?.length || 0) - 3 }} mais
+                    {{ filter }}
                 </span>
-            </div>
+            </template>
+            <template v-if="formattedOutputQuery">
+                <span
+                    v-for="query in formattedOutputQuery.slice(0, 3)"
+                    :key="query"
+                    class="text-11px px-8px py-3px rounded-6px bg-blue-100 text-blue-700"
+                >
+                    {{ query }}
+                </span>
+            </template>
+            <span
+                v-if="(formattedFilters?.length || 0) + (formattedOutputQuery?.length || 0) > 3"
+                class="text-11px text-gray-400"
+            >
+                +{{ (formattedFilters?.length || 0) + (formattedOutputQuery?.length || 0) - 3 }} mais
+            </span>
         </div>
 
         <!-- Launch message (when only have launching output) -->
-        <div v-if="toolResult && isLaunchMessage" class="px-16px pb-16px">
-            <div class="bg-blue-50 rounded-xl border-0.5px border-blue-200 px-16px py-12px">
-                <div class="flex items-center gap-8px">
-                    <div class="i-ph-clock text-16px text-blue-600 animate-pulse" />
-                    <p class="text-13px text-blue-700 m-0">
-                        Aguardando resultados da consulta...
-                    </p>
-                </div>
+        <div v-if="toolResult && isLaunchMessage" class="bg-blue-50 rounded-xl border-0.5px border-blue-200 px-16px py-12px">
+            <div class="flex items-center gap-8px">
+                <div class="i-ph-clock text-16px text-blue-600 animate-pulse" />
+                <p class="text-13px text-blue-700 m-0">
+                    Aguardando resultados da consulta...
+                </p>
             </div>
         </div>
 
         <!-- Expand/Collapse button -->
-        <div v-if="toolResult && !isLaunchMessage" class="px-16px pb-12px">
-            <button
-                type="button"
-                class="w-full flex items-center justify-center gap-6px px-12px py-8px text-13px font-medium text-gray-600 hover:text-gray-900 hover:bg-gray-50 rounded-8px transition-colors"
-                @click="expanded = !expanded"
-            >
-                <span>{{ expanded ? "Ocultar detalhes" : "Ver detalhes" }}</span>
-                <div
-                    class="i-ph-caret-down text-12px transition-transform"
-                    :class="expanded && 'rotate-180'"
-                />
-            </button>
-        </div>
+        <button
+            v-if="toolResult && !isLaunchMessage"
+            type="button"
+            class="w-full flex items-center justify-center gap-6px px-12px py-8px text-13px font-medium text-gray-600 hover:text-gray-900 hover:bg-gray-50 rounded-8px transition-colors"
+            @click="expanded = !expanded"
+        >
+            <span>{{ expanded ? "Ocultar detalhes" : "Ver detalhes" }}</span>
+            <div
+                class="i-ph-caret-down text-12px transition-transform"
+                :class="expanded && 'rotate-180'"
+            />
+        </button>
 
         <!-- Expanded content -->
-        <div v-if="expanded && toolResult && !isLaunchMessage" class="px-16px pb-16px space-y-16px">
+        <template v-if="expanded && toolResult && !isLaunchMessage">
             <!-- Filters section -->
             <div v-if="formattedFilters || formattedOutputQuery">
                 <div class="text-14px font-580 leading-16px tracking-[-0.15px] text-gray-700 mb-2">
@@ -548,6 +535,6 @@ const displayName = computed(() => {
                     <pre class="text-14px text-primary whitespace-pre-wrap break-words m-0">{{ toolResult.output }}</pre>
                 </div>
             </div>
-        </div>
-    </div>
+        </template>
+    </TelaChatWidgetCard>
 </template>

package/dist/runtime/messages/components/widgets/chat-write-widget.vue

@@ -90,23 +90,13 @@ const hasMoreLines = computed(() => {
 </script>
 
 <template>
-    <div class="bg-subtle rounded-16px border border-gray-200">
-        <!-- Header -->
-        <div class="px-16px py-16px flex items-center justify-between">
-            <div class="flex-1 min-w-0">
-                <h3 class="text-16px font-580 leading-20px tracking-[-0.3px] text-primary truncate">
-                    Write
-                </h3>
-                <p class="text-12px text-secondary truncate mt-2px">
-                    {{ fileName }}
-                    <span v-if="parentDir" class="opacity-60">em {{ parentDir }}</span>
-                </p>
-            </div>
-            <TelaStatus :variant="statusVariant" :label="statusLabel" />
-        </div>
+    <TelaChatWidgetCard title="Write" :status-variant="statusVariant" :status-label="statusLabel">
+        <template #subtitle>
+            {{ fileName }}
+            <span v-if="parentDir" class="opacity-60">em {{ parentDir }}</span>
+        </template>
 
-        <!-- Content -->
-        <div v-if="toolResult" class="px-16px pb-16px space-y-16px">
+        <template v-if="toolResult">
             <!-- File path section -->
             <div>
                 <div class="text-14px font-580 leading-16px tracking-[-0.15px] text-gray-700 mb-2">
@@ -156,8 +146,8 @@ const hasMoreLines = computed(() => {
                     </p>
                 </div>
             </div>
-        </div>
-    </div>
+        </template>
+    </TelaChatWidgetCard>
 </template>
 
 <style scoped>

package/dist/runtime/messages/composables/chat.d.ts

@@ -4,6 +4,7 @@ import type { FileUploadInput } from '../../types/schemas/chat/files.js';
 import type { SendMessageBody } from '../../types/schemas/chat/messages.js';
 import type { TelaAgentExecutionInput } from '../../types/schemas/integrations/tela-agent-api.js';
 export declare function resolveTelaAgentInputs(messageInputs: TelaAgentExecutionInput[] | undefined, configuredInputs: DeepReadonly<TelaAgentExecutionInput[]> | null | undefined): SendMessageBody['agentInputs'];
+export declare function resolveStreamingContent(authoritative: string, provisional: string): string;
 export declare function useChat(): {
     currentConversation: any;
     messages: any;
@@ -12,15 +13,20 @@ export declare function useChat(): {
     error: any;
     isPolling: any;
     hasPendingMessage: any;
+    streamingActiveMessageId: any;
+    preparingSteps: any;
     cancelling: any;
     generatingTitle: any;
     animatedTitle: any;
     loadConversation: (id: string) => Promise<void>;
     setConversation: (conv: Conversation | ConversationWithMessages) => void;
+    adoptConversation: (conv: Conversation) => void;
     setConversationModel: (model: string | null) => void;
     pendingModelSelection: any;
-    sendMessage: (content: string, files?: FileUploadInput[], agentInputs?: TelaAgentExecutionInput[]) => Promise<Message | null>;
-    retryMessage: (messageId: string) => Promise<boolean>;
+    sendMessage: (content: string, files?: FileUploadInput[], agentInputs?: TelaAgentExecutionInput[], prepare?: (signal: AbortSignal) => Promise<{
+        wakeSessionId?: string;
+    }>) => Promise<Message | null>;
+    retryMessage: (messageId: string, wakeSessionId?: string) => Promise<boolean>;
     cancelConversation: () => Promise<boolean>;
     startPolling: () => void;
     stopPolling: () => void;

package/dist/runtime/messages/composables/chat.js

@@ -20,13 +20,22 @@ import { getChatApiErrorCode, getChatApiErrorMessage } from "../../shared/chat-a
 import { useChatApi } from "../../shared/composables/chat-api.js";
 import { useConversationFileActions } from "../../files/composables/conversation-files.js";
 import { useEmbedConfig } from "../../embed/composables/embed-config.js";
+import { CHAT_PREPARING_STEPS, nextChatPreparingStepDelay } from "../../embed/loading-messages.js";
 import { usePolling } from "../../shared/composables/polling.js";
 import { terminalMessageTransitions, useChatMessageTerminal } from "./chat-message-terminal.js";
+import { useDirectStream } from "./use-direct-stream.js";
 const WORKSPACE_AGENT_NOT_READY_TEXT = "O agente deste workspace ainda n\xE3o foi configurado no Tela. Abra as configura\xE7\xF5es do workspace para criar o agente.";
 export function resolveTelaAgentInputs(messageInputs, configuredInputs) {
   const inputs = messageInputs ?? configuredInputs;
   return inputs === void 0 || inputs === null ? void 0 : inputs.map((input) => ({ ...input }));
 }
+export function resolveStreamingContent(authoritative, provisional) {
+  if (provisional.startsWith(authoritative))
+    return provisional;
+  if (authoritative.startsWith(provisional))
+    return authoritative;
+  return authoritative || provisional;
+}
 export function useChat() {
   const chatApi = useChatApi();
   const chatMessageTerminal = useChatMessageTerminal();
@@ -60,6 +69,34 @@ export function useChat() {
   });
   const loading = ref(false);
   const sending = ref(false);
+  const gateHolding = ref(false);
+  const preparingSteps = ref([]);
+  let preparingTimer;
+  let gateController = null;
+  let sendStartedAt = 0;
+  let standInOutputAtMs = null;
+  function clearPreparingSteps() {
+    if (preparingTimer)
+      clearTimeout(preparingTimer);
+    preparingTimer = void 0;
+    preparingSteps.value = [];
+    standInOutputAtMs = null;
+  }
+  function schedulePreparingStep(index) {
+    if (index >= CHAT_PREPARING_STEPS.length)
+      return;
+    const delay = nextChatPreparingStepDelay(index);
+    if (index === 0)
+      standInOutputAtMs = delay;
+    preparingTimer = setTimeout(() => {
+      preparingSteps.value = CHAT_PREPARING_STEPS.slice(0, index + 1);
+      schedulePreparingStep(index + 1);
+    }, delay);
+  }
+  function schedulePreparingSteps() {
+    clearPreparingSteps();
+    schedulePreparingStep(0);
+  }
   const error = ref(null);
   const titleGenerated = ref(false);
   const generatingTitle = ref(false);
@@ -67,12 +104,29 @@ export function useChat() {
   const hasPendingMessage = computed(
     () => messages.value.some((m) => m.status === "pending")
   );
+  const streamingMessageId = ref(null);
+  let requestDurableRecovery = () => {
+  };
+  const directStream = useDirectStream({
+    onResult: () => requestDurableRecovery(),
+    onDisconnect: () => requestDurableRecovery()
+  });
+  const streamingActiveMessageId = computed(
+    () => directStream.activity.value === "active" ? streamingMessageId.value : null
+  );
   const reasoningCache = createReasoningCache();
-  const processedMessages = computed(() => resolveReasoningDisplayMessages(messages.value, reasoningCache));
+  const processedMessages = computed(() => {
+    const resolved = resolveReasoningDisplayMessages(messages.value, reasoningCache);
+    const messageId = streamingMessageId.value;
+    const content = directStream.streamingText.value;
+    if (!messageId || !content)
+      return resolved;
+    return resolved.map((message) => message.id === messageId && message.status === "pending" ? { ...message, content: resolveStreamingContent(message.content, content) } : message);
+  });
   const stopCondition = computed(() => !hasPendingMessage.value);
   let pollGeneration = 0;
   const pollMessages = async () => {
-    if (!currentConversation.value)
+    if (!currentConversation.value || gateHolding.value)
       return;
     const generation = pollGeneration;
     try {
@@ -84,6 +138,13 @@ export function useChat() {
         return;
       const terminalMessages = terminalMessageTransitions(messages.value, response.messages);
       messages.value = response.messages;
+      const latestSessionId = response.messages.findLast((message) => message.agentSessionId)?.agentSessionId;
+      if (latestSessionId && currentConversation.value.threadSessionId === null) {
+        currentConversation.value = {
+          ...currentConversation.value,
+          threadSessionId: latestSessionId
+        };
+      }
       for (const terminalMessage of terminalMessages)
         chatMessageTerminal.emit(terminalMessage);
       if (response.newFiles && response.newFiles.length > 0) {
@@ -123,6 +184,10 @@ export function useChat() {
     pollGeneration++;
     endPolling();
   }
+  requestDurableRecovery = () => {
+    startPolling();
+    void pollMessages();
+  };
   const pendingModelBuckets = useState("chat-pending-model-selection", () => ({}));
   const pendingModelSelection = computed({
     get: () => {
@@ -142,7 +207,15 @@ export function useChat() {
       return;
     currentConversation.value = { ...conversation, model };
   };
+  const adoptConversation = (conv) => {
+    currentConversation.value = { ...conv, messages: messages.value };
+    titleGenerated.value = false;
+  };
   const setConversation = (conv) => {
+    if (currentConversation.value && currentConversation.value.id !== conv.id) {
+      directStream.disconnect();
+      streamingMessageId.value = null;
+    }
     const conversationMessages = "messages" in conv ? conv.messages : [];
     currentConversation.value = { ...conv, messages: conversationMessages };
     messages.value = conversationMessages;
@@ -163,8 +236,14 @@ export function useChat() {
       if (shouldTreatLoadedConversationTitleAsGenerated(data.messages)) {
         titleGenerated.value = true;
       }
-      if (data.messages.some((m) => m.status === "pending")) {
+      const pendingAssistant = data.messages.findLast((m) => m.role === "assistant" && m.status === "pending");
+      if (pendingAssistant) {
+        streamingMessageId.value = pendingAssistant.id;
+        directStream.beginMessage();
         startPolling();
+      } else {
+        streamingMessageId.value = null;
+        directStream.disconnect();
       }
     } catch (err) {
       currentConversation.value = null;
@@ -176,15 +255,18 @@ export function useChat() {
       loading.value = false;
     }
   };
-  const sendMessage = async (content, files, agentInputs) => {
-    if (!currentConversation.value)
+  const sendMessage = async (content, files, agentInputs, prepare) => {
+    if (!currentConversation.value && !prepare)
       return null;
     sending.value = true;
     error.value = null;
+    sendStartedAt = Date.now();
+    schedulePreparingSteps();
     const filesWithSource = files?.map((f) => ({ ...f, source: "user" })) ?? null;
+    const conversationId = currentConversation.value?.id ?? "";
     const optimisticUserMessage = {
       id: crypto.randomUUID(),
-      conversationId: currentConversation.value.id,
+      conversationId,
       role: "user",
       content,
       status: "completed",
@@ -198,7 +280,7 @@ export function useChat() {
     };
     const optimisticAssistantMessage = {
       id: crypto.randomUUID(),
-      conversationId: currentConversation.value.id,
+      conversationId,
       role: "assistant",
       content: "",
       status: "pending",
@@ -210,28 +292,68 @@ export function useChat() {
       createdAt: /* @__PURE__ */ new Date(),
       updatedAt: null
     };
+    streamingMessageId.value = optimisticAssistantMessage.id;
+    directStream.beginMessage();
     messages.value = [...messages.value, optimisticUserMessage, optimisticAssistantMessage];
+    const controller = new AbortController();
+    gateController = controller;
     try {
+      let wakeSessionId;
+      if (prepare) {
+        gateHolding.value = true;
+        try {
+          wakeSessionId = (await prepare(controller.signal)).wakeSessionId;
+        } finally {
+          gateHolding.value = false;
+        }
+      }
+      if (controller.signal.aborted)
+        throw new DOMException("Aborted", "AbortError");
+      if (!currentConversation.value)
+        throw new Error("Erro ao enviar mensagem");
       const resolvedAgentInputs = resolveTelaAgentInputs(agentInputs, embedConfig?.telaAgentInputs?.value);
       const body = {
         content,
         files,
-        ...resolvedAgentInputs !== void 0 ? { agentInputs: resolvedAgentInputs } : {}
+        ...resolvedAgentInputs !== void 0 ? { agentInputs: resolvedAgentInputs } : {},
+        ...wakeSessionId ? { wakeSessionId } : {},
+        clientTiming: {
+          // Everything the gate held goes in here: whatever the server
+          // measures, the user has already been waiting this long.
+          sinceSendMs: Math.max(0, Date.now() - sendStartedAt),
+          ...standInOutputAtMs !== null ? { standInOutputAtMs } : {}
+        }
       };
-      const response = await $fetch(
-        chatApi.path(`/conversations/${currentConversation.value.id}/messages`),
-        chatApi.withChatHeaders({
-          method: "POST",
-          body
-        })
-      );
-      messages.value = messages.value.map((msg) => {
-        if (msg.id === optimisticUserMessage.id)
-          return response.userMessage;
-        if (msg.id === optimisticAssistantMessage.id)
-          return response.assistantMessage;
-        return msg;
-      });
+      const acceptMessagePair = (response2) => {
+        messages.value = messages.value.map((msg) => {
+          if (msg.id === optimisticUserMessage.id)
+            return response2.userMessage;
+          if (msg.id === optimisticAssistantMessage.id)
+            return response2.assistantMessage;
+          return msg;
+        });
+        streamingMessageId.value = response2.assistantMessage.id;
+      };
+      let response;
+      let acceptedByStream = false;
+      try {
+        response = await directStream.connectMessage(
+          chatApi.path(`/conversations/${currentConversation.value.id}/messages/stream`),
+          chatApi.withChatHeaders({
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(body)
+          }),
+          acceptMessagePair
+        );
+        acceptedByStream = true;
+      } catch {
+        response = await $fetch(
+          chatApi.path(`/conversations/${currentConversation.value.id}/messages`),
+          chatApi.withChatHeaders({ method: "POST", body })
+        );
+        acceptMessagePair(response);
+      }
       if (files && files.length > 0) {
         addFilesToConversation(
           currentConversation.value.id,
@@ -240,29 +362,46 @@ export function useChat() {
           "user"
         );
       }
-      startPolling();
+      if (!acceptedByStream)
+        startPolling();
       return response.userMessage;
     } catch (err) {
       messages.value = messages.value.filter(
         (msg) => msg.id !== optimisticUserMessage.id && msg.id !== optimisticAssistantMessage.id
       );
+      streamingMessageId.value = null;
+      clearPreparingSteps();
+      directStream.disconnect();
       stopPolling();
+      if (err instanceof DOMException && err.name === "AbortError")
+        return null;
       const message = getChatApiErrorCode(err) === "workspace_agent_not_ready" ? WORKSPACE_AGENT_NOT_READY_TEXT : err instanceof Error ? err.message : "Erro ao enviar mensagem";
       error.value = message;
       Sentry.captureException(err);
       return null;
     } finally {
       sending.value = false;
+      gateHolding.value = false;
+      if (gateController === controller)
+        gateController = null;
     }
   };
   const clearConversation = () => {
     stopPolling();
+    gateController?.abort();
+    streamingMessageId.value = null;
+    clearPreparingSteps();
+    directStream.disconnect();
     currentConversation.value = null;
     messages.value = [];
     error.value = null;
   };
   const cancelling = ref(false);
   const cancelConversation = async () => {
+    if (gateHolding.value) {
+      gateController?.abort();
+      return true;
+    }
     if (!currentConversation.value || !hasPendingMessage.value)
       return false;
     cancelling.value = true;
@@ -278,6 +417,8 @@ export function useChat() {
         return false;
       }
       messages.value = markPendingAssistantMessagesInterrupted(messages.value);
+      streamingMessageId.value = null;
+      directStream.disconnect();
       stopPolling();
       return true;
     } catch (err) {
@@ -304,6 +445,8 @@ export function useChat() {
         messages: []
       };
       messages.value = [];
+      streamingMessageId.value = null;
+      directStream.disconnect();
       return true;
     } catch (err) {
       const message = err instanceof Error ? err.message : "Erro ao limpar conversa";
@@ -312,7 +455,7 @@ export function useChat() {
       return false;
     }
   };
-  const retryMessage = async (messageId) => {
+  const retryMessage = async (messageId, wakeSessionId) => {
     if (!currentConversation.value)
       return false;
     error.value = null;
@@ -320,15 +463,22 @@ export function useChat() {
     if (!retry)
       return false;
     messages.value = retry.messages;
+    streamingMessageId.value = messageId;
+    directStream.beginMessage();
     try {
       await $fetch(
         chatApi.path(`/conversations/${currentConversation.value.id}/messages/${messageId}/retry`),
-        chatApi.withChatHeaders({ method: "POST" })
+        chatApi.withChatHeaders({
+          method: "POST",
+          body: wakeSessionId ? { wakeSessionId } : {}
+        })
       );
       startPolling();
       return true;
     } catch (err) {
       messages.value = restoreAssistantMessageAfterRetryFailure(messages.value, retry.originalMessage);
+      streamingMessageId.value = null;
+      directStream.disconnect();
       const errorMessage = getChatApiErrorCode(err) === "workspace_agent_not_ready" ? WORKSPACE_AGENT_NOT_READY_TEXT : err instanceof Error ? err.message : "Erro ao reenviar mensagem";
       error.value = errorMessage;
       Sentry.captureException(err);
@@ -400,6 +550,8 @@ export function useChat() {
   };
   watch(hasPendingMessage, (isPending, wasPending) => {
     if (wasPending && !isPending) {
+      streamingMessageId.value = null;
+      directStream.disconnect();
       void generateTitle();
     }
   });
@@ -414,11 +566,14 @@ export function useChat() {
     error: readonly(error),
     isPolling: readonly(isPolling),
     hasPendingMessage,
+    streamingActiveMessageId,
+    preparingSteps: readonly(preparingSteps),
     cancelling: readonly(cancelling),
     generatingTitle: readonly(generatingTitle),
     animatedTitle: readonly(animatedTitle),
     loadConversation,
     setConversation,
+    adoptConversation,
     setConversationModel,
     pendingModelSelection,
     sendMessage,

package/dist/runtime/messages/composables/mention-autocomplete.js

@@ -27,6 +27,7 @@ export function useMentionAutocomplete(options) {
   const query = ref("");
   const highlightedIndex = ref(-1);
   const lastQuery = ref("");
+  const triggerCaretRect = ref(null);
   let triggerTextOffset = -1;
   const isOpen = computed(() => activeTrigger.value !== null);
   const filteredItems = computed(() => {
@@ -89,10 +90,12 @@ export function useMentionAutocomplete(options) {
     const mentionTrigger = findMentionTrigger(getTextBeforeCursor());
     if (!mentionTrigger) {
       activeTrigger.value = null;
+      triggerCaretRect.value = null;
       return;
     }
     activeTrigger.value = mentionTrigger.trigger;
     triggerTextOffset = mentionTrigger.offset;
+    triggerCaretRect.value = getCaretRangeAtOffset(triggerTextOffset)?.getBoundingClientRect() ?? null;
     if (mentionTrigger.query !== lastQuery.value) {
       highlightedIndex.value = -1;
       lastQuery.value = mentionTrigger.query;
@@ -314,6 +317,7 @@ ${varLines}
     isOpen,
     activeTrigger: readonly(activeTrigger),
     query: readonly(query),
+    triggerCaretRect: readonly(triggerCaretRect),
     filteredItems,
     highlightedIndex,
     handleKeydown,

package/dist/runtime/messages/composables/use-direct-stream.d.ts

@@ -0,0 +1,41 @@
+import type { SendMessageResponse } from '../../types/schemas/chat/messages.js';
+export type DirectStreamActivity = 'idle' | 'connected' | 'active';
+export type SseFrame = {
+    event?: string;
+    data: string;
+};
+export type MessagePartsEvent = {
+    kind: 'message-parts';
+    runId: string;
+    deltaSeq: number;
+    parentToolUseId?: string | null;
+    event: Record<string, unknown>;
+};
+export type MessagePartsAccumulator = {
+    runId: string | null;
+    lastDeltaSeq: number;
+    textByIndex: Record<number, string>;
+    thinkingByIndex: Record<number, string>;
+};
+export declare function parseSseFrames(source: string): {
+    frames: SseFrame[];
+    rest: string;
+};
+export declare function createMessagePartsAccumulator(runId?: string | null): MessagePartsAccumulator;
+export declare function applyMessagePartsEvent(accumulator: MessagePartsAccumulator, input: MessagePartsEvent): {
+    text: string;
+    thinking: string;
+    changed: boolean;
+};
+export declare function useDirectStream(options?: {
+    onResult?: () => void;
+    onDisconnect?: () => void;
+}): {
+    activity: any;
+    streamingText: any;
+    streamingThinking: any;
+    activeRunId: any;
+    connectMessage: (url: string, init: RequestInit, onAccepted: (response: SendMessageResponse) => void) => Promise<SendMessageResponse>;
+    beginMessage: () => void;
+    disconnect: (reset?: boolean) => void;
+};