@hivegpt/hiveai-angular 0.0.610 → 0.0.612

package/fesm2015/hivegpt-hiveai-angular.mjs

@@ -1639,6 +1639,11 @@ class ChatDrawerComponent {
         this.displayAvatarUrl = 'https://www.jotform.com/uploads/mehmetkarakasli/form_files/1564593667676a8e85f23758.86945537_icon.png';
         /** When true, chat auto-scrolls to bottom when new content is added. Default: false (no auto scroll). */
         this.autoScrollOnNewMessage = false;
+        /** Tracks whether the user has manually scrolled up, suppressing auto-scroll until they scroll back to bottom or send a new message. */
+        this.userHasScrolled = false;
+        /** Guards against our own programmatic scrolls triggering the userHasScrolled detection. */
+        this.isProgrammaticScroll = false;
+        this.scrollListenerTimer = 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. */
@@ -3336,6 +3341,8 @@ class ChatDrawerComponent {
         if (!this.input || this.loading) {
             return;
         }
+        // Reset auto-scroll suppression when user sends a new message
+        this.userHasScrolled = false;
         this.chatLog.push({
             type: 'user',
             message: this.processMessageForDisplay(this.input),
@@ -3359,6 +3366,8 @@ class ChatDrawerComponent {
         if (!inputMsg || this.loading) {
             return;
         }
+        // Reset auto-scroll suppression when user sends a new message
+        this.userHasScrolled = false;
         try {
             chat.relatedListItems = [];
             this.cdr.detectChanges();
@@ -3417,7 +3426,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) {
@@ -3446,7 +3456,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 {
@@ -3734,32 +3744,43 @@ class ChatDrawerComponent {
         }
         this.cdr.detectChanges();
     }
-    scrollToBottom(force = false) {
+    scrollToBottom(force = false, smooth = true) {
         var _a;
         if (!force && !this.autoScrollOnNewMessage) {
             return;
         }
+        if (this.userHasScrolled) {
+            return;
+        }
         if (!((_a = this.chatMain) === null || _a === void 0 ? void 0 : _a.nativeElement))
             return;
-        let counter = 0;
-        const interval = setInterval(() => {
-            this.chatMain.nativeElement.scrollTop =
-                this.chatMain.nativeElement.scrollHeight;
-            if (counter++ > 5)
-                clearInterval(interval);
-        }, 5);
+        const el = this.chatMain.nativeElement;
+        this.isProgrammaticScroll = true;
+        el.scrollTo({
+            top: el.scrollHeight,
+            behavior: smooth ? 'smooth' : 'auto',
+        });
+        // 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) {
         var _a;
+        if (this.userHasScrolled)
+            return;
         if (!((_a = this.chatMain) === null || _a === void 0 ? void 0 : _a.nativeElement))
             return;
         const container = this.chatMain.nativeElement;
         const el = container.querySelector(`[data-msg-id="${messageId}"]`);
         if (!el)
             return;
-        const offset = el.getBoundingClientRect().top - container.getBoundingClientRect().top;
-        container.scrollTop = container.scrollTop + offset - 8;
+        const targetTop = el.getBoundingClientRect().top - container.getBoundingClientRect().top;
+        this.isProgrammaticScroll = true;
+        container.scrollTo({
+            top: container.scrollTop + targetTop - 8,
+            behavior: 'smooth',
+        });
+        setTimeout(() => { this.isProgrammaticScroll = false; }, 400);
     }
     focusOnTextarea() {
         setTimeout(() => {
@@ -3775,6 +3796,23 @@ class ChatDrawerComponent {
         }
     }
     ngAfterViewInit() {
+        var _a;
+        // Detect user manual scroll to suppress auto-scroll (debounced, ignores programmatic scrolls)
+        if ((_a = this.chatMain) === null || _a === void 0 ? void 0 : _a.nativeElement) {
+            this.chatMain.nativeElement.addEventListener('scroll', () => {
+                if (this.isProgrammaticScroll)
+                    return;
+                clearTimeout(this.scrollListenerTimer);
+                this.scrollListenerTimer = setTimeout(() => {
+                    var _a;
+                    const el = (_a = this.chatMain) === null || _a === void 0 ? void 0 : _a.nativeElement;
+                    if (!el)
+                        return;
+                    const atBottom = el.scrollHeight - el.scrollTop - el.clientHeight < 80;
+                    this.userHasScrolled = !atBottom;
+                }, 100);
+            });
+        }
         // Check if the drawer is initially open and apply overflow hidden to body if so
         if (this.drawer.opened) {
             this.setBodyOverflow();
@@ -4613,7 +4651,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;
@@ -4635,7 +4673,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;
@@ -4644,7 +4684,7 @@ class ChatDrawerComponent {
                 }
                 else {
                     this.cdr.markForCheck();
-                    setTimeout(() => this.scrollToBottom(true), 0);
+                    setTimeout(() => this.scrollToBottom(true, false), 0);
                 }
                 break;
             }
@@ -4655,19 +4695,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;
@@ -4675,7 +4717,12 @@ class ChatDrawerComponent {
                 this.showFeedBackIconsIndex = this.chatLog.length - 1;
                 this.activeAskMessageId = '';
                 this.isChatingWithAi = false;
-                this.scrollToBottom();
+                // 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();
                 this.cdr.markForCheck();
                 break;
@@ -4794,6 +4841,7 @@ class ChatDrawerComponent {
         return Object.keys(obj).map((key) => ({ key, value: obj[key] }));
     }
     startNewConversation() {
+        this.userHasScrolled = false;
         this.conversationKey = this.conversationService.getKey(this.botId, true, this.eventId);
         this.chatLog = [this.chatLog[0]];
         this.isChatingWithAi = false;