@hivegpt/hiveai-angular 0.0.611 → 0.0.613

package/fesm2015/hivegpt-hiveai-angular.mjs

@@ -1644,6 +1644,8 @@ class ChatDrawerComponent {
         /** Guards against our own programmatic scrolls triggering the userHasScrolled detection. */
         this.isProgrammaticScroll = false;
         this.scrollListenerTimer = null;
+        /** Throttle timer for streaming chunk scroll — prevents firing on every chunk. */
+        this.chunkScrollRAF = null;
         /** Connections list from host (e.g. from store selectConnectionsList). Each item has userId. When set, used for Connect/Request Sent/Disconnect button state. */
         this.connectionsList = [];
         /** Pending sent request user IDs from host (e.g. from store selectPendingConnectionsSentList). When set, used for Request Sent state. */
@@ -3426,7 +3428,8 @@ class ChatDrawerComponent {
             var _a, _b, _c, _d;
             const lastItem = this.chatLog[this.chatLog.length - 1];
             if (done) {
-                lastItem.message = this.processMessageForDisplay(lastItem.message);
+                // Final pass with the complete raw text (aiResponse) for a clean render
+                lastItem.message = this.processMessageForDisplay(this.aiResponse);
                 this.chatLog.pop();
                 this.chatLog.push(lastItem);
                 if (allSuggestions === null || allSuggestions === void 0 ? void 0 : allSuggestions.length) {
@@ -3455,7 +3458,7 @@ class ChatDrawerComponent {
                         allSuggestions.push(match === null || match === void 0 ? void 0 : match.replace(/<\/?sug>/g, ''));
                     });
                 }
-                lastItem.message = this.aiResponse;
+                lastItem.message = this.processMessageForDisplay(this.aiResponse);
                 this.cdr.markForCheck();
             }
             else {
@@ -3743,7 +3746,7 @@ class ChatDrawerComponent {
         }
         this.cdr.detectChanges();
     }
-    scrollToBottom(force = false, smooth = true) {
+    scrollToBottom(force = false) {
         var _a;
         if (!force && !this.autoScrollOnNewMessage) {
             return;
@@ -3757,10 +3760,37 @@ class ChatDrawerComponent {
         this.isProgrammaticScroll = true;
         el.scrollTo({
             top: el.scrollHeight,
-            behavior: smooth ? 'smooth' : 'auto',
+            behavior: 'smooth',
+        });
+        setTimeout(() => { this.isProgrammaticScroll = false; }, 400);
+    }
+    /**
+     * Lightweight scroll-to-bottom used during streaming chunks.
+     * Coalesces via requestAnimationFrame so we get at most one smooth
+     * nudge per paint frame, no matter how fast chunks arrive.
+     */
+    scrollToBottomStreaming() {
+        if (this.userHasScrolled)
+            return;
+        if (this.chunkScrollRAF !== null)
+            return; // already queued
+        this.chunkScrollRAF = requestAnimationFrame(() => {
+            var _a;
+            this.chunkScrollRAF = null;
+            if (this.userHasScrolled)
+                return;
+            const el = (_a = this.chatMain) === null || _a === void 0 ? void 0 : _a.nativeElement;
+            if (!el)
+                return;
+            // Small gap check: only scroll if we're within a reasonable distance from the bottom
+            const gap = el.scrollHeight - el.scrollTop - el.clientHeight;
+            if (gap <= 0)
+                return; // already at bottom
+            this.isProgrammaticScroll = true;
+            // Use a quick smooth nudge rather than instant jump
+            el.scrollTo({ top: el.scrollHeight, behavior: 'smooth' });
+            setTimeout(() => { this.isProgrammaticScroll = false; }, 300);
         });
-        // Release the guard after the smooth scroll settles
-        setTimeout(() => { this.isProgrammaticScroll = false; }, smooth ? 400 : 50);
     }
     /** Scrolls the chat container so the top of the AI message with the given id is visible. */
     scrollToAiMessage(messageId) {
@@ -4650,7 +4680,7 @@ class ChatDrawerComponent {
         return false;
     }
     handleAskWebSocketMessage(rawMessage) {
-        var _a, _b, _c, _d, _e;
+        var _a, _b, _c, _d, _e, _f;
         if (!rawMessage)
             return;
         let parsed = null;
@@ -4672,7 +4702,9 @@ class ChatDrawerComponent {
                     return;
                 const isNewAiMessage = !this.chatLog.find((p) => p._id == messageId);
                 const currentChatMessage = this.upsertAiChatMessage(messageId);
-                currentChatMessage.message = `${currentChatMessage.message || ''}${(payload === null || payload === void 0 ? void 0 : payload.text) || ''}`;
+                // Accumulate raw text and render markdown in real-time
+                currentChatMessage.rawMessage = `${currentChatMessage.rawMessage || ''}${(payload === null || payload === void 0 ? void 0 : payload.text) || ''}`;
+                currentChatMessage.message = this.processMessageForDisplay(currentChatMessage.rawMessage);
                 if (isNewAiMessage) {
                     // First chunk: hide Thinking indicator and scroll to the message start
                     this.isChatingWithAi = false;
@@ -4681,7 +4713,7 @@ class ChatDrawerComponent {
                 }
                 else {
                     this.cdr.markForCheck();
-                    setTimeout(() => this.scrollToBottom(true, false), 0);
+                    this.scrollToBottomStreaming();
                 }
                 break;
             }
@@ -4692,19 +4724,21 @@ class ChatDrawerComponent {
                     break;
                 }
                 const currentChatMessage = this.upsertAiChatMessage(messageId);
-                const finalAnswer = (_c = (_b = payload === null || payload === void 0 ? void 0 : payload.text) !== null && _b !== void 0 ? _b : currentChatMessage.message) !== null && _c !== void 0 ? _c : '';
+                const finalAnswer = (_d = (_c = (_b = payload === null || payload === void 0 ? void 0 : payload.text) !== null && _b !== void 0 ? _b : currentChatMessage.rawMessage) !== null && _c !== void 0 ? _c : currentChatMessage.message) !== null && _d !== void 0 ? _d : '';
                 const hasCardResponse = this.applyToolResultCardMessage(currentChatMessage, messageId, finalAnswer, payload === null || payload === void 0 ? void 0 : payload.tool_results);
                 if (!hasCardResponse) {
                     currentChatMessage.type = 'ai';
                     currentChatMessage.message = this.processMessageForDisplay(finalAnswer);
                 }
+                // Clean up raw accumulator
+                delete currentChatMessage.rawMessage;
                 if (Array.isArray(payload === null || payload === void 0 ? void 0 : payload.suggestions)) {
                     currentChatMessage.relatedListItems = payload.suggestions;
                 }
                 if (Array.isArray(payload === null || payload === void 0 ? void 0 : payload.web_results)) {
                     currentChatMessage.sourcesList = payload.web_results;
-                    currentChatMessage.displayedSources = (_d = payload.web_results) === null || _d === void 0 ? void 0 : _d.slice(0, 3);
-                    currentChatMessage.remainingSources = (_e = payload.web_results) === null || _e === void 0 ? void 0 : _e.slice(3);
+                    currentChatMessage.displayedSources = (_e = payload.web_results) === null || _e === void 0 ? void 0 : _e.slice(0, 3);
+                    currentChatMessage.remainingSources = (_f = payload.web_results) === null || _f === void 0 ? void 0 : _f.slice(3);
                 }
                 if (payload === null || payload === void 0 ? void 0 : payload.tool_results) {
                     currentChatMessage.toolResults = payload.tool_results;
@@ -4712,13 +4746,10 @@ class ChatDrawerComponent {
                 this.showFeedBackIconsIndex = this.chatLog.length - 1;
                 this.activeAskMessageId = '';
                 this.isChatingWithAi = false;
-                // For card responses (tool results), scroll to the message text bubble
-                // instead of the very bottom — avoids cards pushing the view too far down
-                if (hasCardResponse && messageId) {
-                    this.cdr.markForCheck();
-                    setTimeout(() => this.scrollToAiMessage(messageId), 30);
-                }
-                else {
+                // For card responses (tool results), don't scroll at all —
+                // user is already viewing the AI text from the streaming phase,
+                // cards render below and the user can scroll down to see them.
+                if (!hasCardResponse) {
                     this.scrollToBottom();
                 }
                 this.focusOnTextarea();