@memberjunction/ng-conversations 2.110.1 → 2.111.0

package/dist/lib/components/message/message-input.component.d.ts

@@ -1,4 +1,4 @@
-import { EventEmitter, ElementRef, OnInit, OnDestroy, OnChanges, SimpleChanges, AfterViewInit } from '@angular/core';
+import { EventEmitter, OnInit, OnDestroy, OnChanges, SimpleChanges, AfterViewInit } from '@angular/core';
 import { UserInfo } from '@memberjunction/core';
 import { ConversationDetailEntity, AIAgentEntityExtended } from '@memberjunction/core-entities';
 import { DialogService } from '../../services/dialog.service';
@@ -8,7 +8,7 @@ import { ConversationStateService } from '../../services/conversation-state.serv
 import { DataCacheService } from '../../services/data-cache.service';
 import { ActiveTasksService } from '../../services/active-tasks.service';
 import { BaseAgentSuggestedResponse } from '@memberjunction/ai-core-plus';
-import { MentionAutocompleteService, MentionSuggestion } from '../../services/mention-autocomplete.service';
+import { MentionAutocompleteService } from '../../services/mention-autocomplete.service';
 import { MentionParserService } from '../../services/mention-parser.service';
 import * as i0 from "@angular/core";
 export declare class MessageInputComponent implements OnInit, OnDestroy, OnChanges, AfterViewInit {
@@ -18,8 +18,8 @@ export declare class MessageInputComponent implements OnInit, OnDestroy, OnChang
     private conversationState;
     private dataCache;
     private activeTasks;
-    private mentionAutocomplete;
     private mentionParser;
+    private mentionAutocomplete;
     private readonly JSON_ARTIFACT_TYPE_ID;
     conversationId: string;
     currentUser: UserInfo;
@@ -27,6 +27,7 @@ export declare class MessageInputComponent implements OnInit, OnDestroy, OnChang
     placeholder: string;
     parentMessageId?: string;
     conversationHistory: ConversationDetailEntity[];
+    initialMessage: string | null;
     messageSent: EventEmitter<ConversationDetailEntity>;
     agentResponse: EventEmitter<{
         message: ConversationDetailEntity;
@@ -59,25 +60,16 @@ export declare class MessageInputComponent implements OnInit, OnDestroy, OnChang
     }>;
     intentCheckStarted: EventEmitter<void>;
     intentCheckCompleted: EventEmitter<void>;
-    messageTextarea: ElementRef;
+    inputBox: any;
     messageText: string;
     isSending: boolean;
     isProcessing: boolean;
     processingMessage: string;
     converationManagerAgent: AIAgentEntityExtended | null;
-    showMentionDropdown: boolean;
-    mentionSuggestions: MentionSuggestion[];
-    mentionDropdownPosition: {
-        top: number;
-        left: number;
-    };
-    mentionDropdownShowAbove: boolean;
-    private mentionStartIndex;
-    private mentionQuery;
     private pushStatusSubscription?;
     private activeTaskExecutionMessageIds;
     private completionTimestamps;
-    constructor(dialogService: DialogService, toastService: ToastService, agentService: ConversationAgentService, conversationState: ConversationStateService, dataCache: DataCacheService, activeTasks: ActiveTasksService, mentionAutocomplete: MentionAutocompleteService, mentionParser: MentionParserService);
+    constructor(dialogService: DialogService, toastService: ToastService, agentService: ConversationAgentService, conversationState: ConversationStateService, dataCache: DataCacheService, activeTasks: ActiveTasksService, mentionParser: MentionParserService, mentionAutocomplete: MentionAutocompleteService);
     ngOnInit(): Promise<void>;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
@@ -100,29 +92,9 @@ export declare class MessageInputComponent implements OnInit, OnDestroy, OnChang
     private updateTaskExecutionMessages;
     get canSend(): boolean;
     /**
-     * Handle input events to detect @ mentions
-     */
-    onInput(event: Event): void;
-    /**
-     * Handle keydown events in the textarea
-     * - Enter alone: Send message (unless dropdown is open)
-     * - Shift+Enter: Add new line
-     * - Arrow keys, Tab, Escape: Handle mention dropdown if open
-     */
-    onKeyDown(event: KeyboardEvent): void;
-    /**
-     * Calculate position for mention dropdown
-     * Keeps dropdown anchored to textarea edge regardless of content size
+     * Handle text submitted from the input box
      */
-    private calculateDropdownPosition;
-    /**
-     * Handle mention suggestion selection
-     */
-    onMentionSelected(suggestion: MentionSuggestion): void;
-    /**
-     * Close mention dropdown
-     */
-    closeMentionDropdown(): void;
+    onTextSubmitted(text: string): Promise<void>;
     onSend(): Promise<void>;
     /**
      * Send a message with custom text WITHOUT modifying the visible messageText input
@@ -133,6 +105,10 @@ export declare class MessageInputComponent implements OnInit, OnDestroy, OnChang
      * Creates and configures a new conversation detail message
      */
     private createMessageDetail;
+    /**
+     * Creates and configures a new conversation detail message from provided text
+     */
+    private createMessageDetailFromText;
     /**
      * Handles successful message send - routes to appropriate agent
      */
@@ -247,6 +223,6 @@ export declare class MessageInputComponent implements OnInit, OnDestroy, OnChang
      */
     private cleanupCompletionTimestamp;
     static ɵfac: i0.ɵɵFactoryDeclaration<MessageInputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MessageInputComponent, "mj-message-input", never, { "conversationId": { "alias": "conversationId"; "required": false; }; "currentUser": { "alias": "currentUser"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "parentMessageId": { "alias": "parentMessageId"; "required": false; }; "conversationHistory": { "alias": "conversationHistory"; "required": false; }; }, { "messageSent": "messageSent"; "agentResponse": "agentResponse"; "agentRunDetected": "agentRunDetected"; "agentRunUpdate": "agentRunUpdate"; "messageComplete": "messageComplete"; "artifactCreated": "artifactCreated"; "conversationRenamed": "conversationRenamed"; "intentCheckStarted": "intentCheckStarted"; "intentCheckCompleted": "intentCheckCompleted"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MessageInputComponent, "mj-message-input", never, { "conversationId": { "alias": "conversationId"; "required": false; }; "currentUser": { "alias": "currentUser"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "parentMessageId": { "alias": "parentMessageId"; "required": false; }; "conversationHistory": { "alias": "conversationHistory"; "required": false; }; "initialMessage": { "alias": "initialMessage"; "required": false; }; }, { "messageSent": "messageSent"; "agentResponse": "agentResponse"; "agentRunDetected": "agentRunDetected"; "agentRunUpdate": "agentRunUpdate"; "messageComplete": "messageComplete"; "artifactCreated": "artifactCreated"; "conversationRenamed": "conversationRenamed"; "intentCheckStarted": "intentCheckStarted"; "intentCheckCompleted": "intentCheckCompleted"; }, never, never, false, never>;
 }
 //# sourceMappingURL=message-input.component.d.ts.map

package/dist/lib/components/message/message-input.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"message-input.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/message/message-input.component.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"message-input.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/message/message-input.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/components/message/message-input.component.js

@@ -9,15 +9,14 @@ import * as i3 from "../../services/conversation-agent.service";
 import * as i4 from "../../services/conversation-state.service";
 import * as i5 from "../../services/data-cache.service";
 import * as i6 from "../../services/active-tasks.service";
-import * as i7 from "../../services/mention-autocomplete.service";
-import * as i8 from "../../services/mention-parser.service";
+import * as i7 from "../../services/mention-parser.service";
+import * as i8 from "../../services/mention-autocomplete.service";
 import * as i9 from "@angular/common";
-import * as i10 from "@angular/forms";
-import * as i11 from "../mention/mention-dropdown.component";
-const _c0 = ["messageTextarea"];
-function MessageInputComponent_div_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 10);
-    i0.ɵɵelement(1, "i", 11);
+import * as i10 from "./message-input-box.component";
+const _c0 = ["inputBox"];
+function MessageInputComponent_div_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 4);
+    i0.ɵɵelement(1, "i", 5);
     i0.ɵɵelementStart(2, "span");
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
@@ -33,8 +32,8 @@ export class MessageInputComponent {
     conversationState;
     dataCache;
     activeTasks;
-    mentionAutocomplete;
     mentionParser;
+    mentionAutocomplete;
     // Default artifact type ID for JSON (when agent doesn't specify DefaultArtifactTypeID)
     JSON_ARTIFACT_TYPE_ID = 'ae674c7e-ea0d-49ea-89e4-0649f5eb20d4';
     conversationId;
@@ -43,6 +42,7 @@ export class MessageInputComponent {
     placeholder = 'Type a message... (Ctrl+Enter to send)';
     parentMessageId; // Optional: for replying in threads
     conversationHistory = []; // For agent context
+    initialMessage = null; // Message to send automatically when component initializes
     messageSent = new EventEmitter();
     agentResponse = new EventEmitter();
     agentRunDetected = new EventEmitter();
@@ -52,38 +52,31 @@ export class MessageInputComponent {
     conversationRenamed = new EventEmitter();
     intentCheckStarted = new EventEmitter(); // Emits when intent checking starts
     intentCheckCompleted = new EventEmitter(); // Emits when intent checking completes
-    messageTextarea;
+    inputBox; // MessageInputBoxComponent
     messageText = '';
     isSending = false;
     isProcessing = false; // True when waiting for agent/naming response
     processingMessage = 'AI is responding...'; // Message shown during processing
     converationManagerAgent = null;
-    // Mention autocomplete state
-    showMentionDropdown = false;
-    mentionSuggestions = [];
-    mentionDropdownPosition = { top: 0, left: 0 };
-    mentionDropdownShowAbove = false; // Controls transform direction
-    mentionStartIndex = -1;
-    mentionQuery = '';
     // PubSub subscription for task progress updates
     pushStatusSubscription;
     // Track active task execution message IDs for real-time updates
     activeTaskExecutionMessageIds = new Set();
     // Track completion timestamps to prevent race conditions with late progress updates
     completionTimestamps = new Map();
-    constructor(dialogService, toastService, agentService, conversationState, dataCache, activeTasks, mentionAutocomplete, mentionParser) {
+    constructor(dialogService, toastService, agentService, conversationState, dataCache, activeTasks, mentionParser, mentionAutocomplete) {
         this.dialogService = dialogService;
         this.toastService = toastService;
         this.agentService = agentService;
         this.conversationState = conversationState;
         this.dataCache = dataCache;
         this.activeTasks = activeTasks;
-        this.mentionAutocomplete = mentionAutocomplete;
         this.mentionParser = mentionParser;
+        this.mentionAutocomplete = mentionAutocomplete;
     }
     async ngOnInit() {
         this.converationManagerAgent = await this.agentService.getConversationManagerAgent();
-        // Initialize mention autocomplete
+        // Initialize mention autocomplete (needed for parsing mentions in messages)
         await this.mentionAutocomplete.initialize(this.currentUser);
         // Subscribe to PubSub for task progress updates
         this.subscribeToPushStatus();
@@ -97,6 +90,13 @@ export class MessageInputComponent {
     ngAfterViewInit() {
         // Focus input on initial load
         this.focusInput();
+        // If there's an initial message to send (from empty state), send it automatically
+        if (this.initialMessage) {
+            console.log('📨 MessageInputComponent received initialMessage:', this.initialMessage);
+            setTimeout(() => {
+                this.sendMessageWithText(this.initialMessage);
+            }, 100);
+        }
     }
     ngOnDestroy() {
         // Clean up PubSub subscription
@@ -110,8 +110,8 @@ export class MessageInputComponent {
     focusInput() {
         // Use setTimeout to ensure DOM is ready
         setTimeout(() => {
-            if (this.messageTextarea?.nativeElement) {
-                this.messageTextarea.nativeElement.focus();
+            if (this.inputBox) {
+                this.inputBox.focus();
             }
         }, 100);
     }
@@ -201,130 +201,34 @@ export class MessageInputComponent {
         return !this.disabled && !this.isSending && this.messageText.trim().length > 0;
     }
     /**
-     * Handle input events to detect @ mentions
+     * Handle text submitted from the input box
      */
-    onInput(event) {
-        const textarea = event.target;
-        const cursorPos = textarea.selectionStart;
-        const text = textarea.value;
-        // Check if we're typing after an @ symbol
-        const textBeforeCursor = text.substring(0, cursorPos);
-        const mentionMatch = textBeforeCursor.match(/@(\S*)$/);
-        if (mentionMatch) {
-            // We found an @ mention being typed
-            this.mentionStartIndex = cursorPos - mentionMatch[0].length;
-            this.mentionQuery = mentionMatch[1] || '';
-            console.log('[MentionInput] Detected @mention:', this.mentionQuery);
-            // Get suggestions
-            this.mentionSuggestions = this.mentionAutocomplete.getSuggestions(this.mentionQuery);
-            console.log('[MentionInput] Got suggestions:', this.mentionSuggestions.length, this.mentionSuggestions);
-            // Calculate dropdown position
-            this.calculateDropdownPosition(textarea);
-            // Show dropdown if we have suggestions OR to show empty state
-            this.showMentionDropdown = true;
-            console.log('[MentionInput] Showing dropdown:', this.showMentionDropdown);
-        }
-        else {
-            // No @ mention, close dropdown
-            this.closeMentionDropdown();
+    async onTextSubmitted(text) {
+        console.log('[MessageInput] onTextSubmitted called with text:', text);
+        // Use the text parameter directly since the box component already cleared its value
+        if (!text || !text.trim()) {
+            console.log('[MessageInput] Empty text, aborting');
+            return;
         }
-    }
-    /**
-     * Handle keydown events in the textarea
-     * - Enter alone: Send message (unless dropdown is open)
-     * - Shift+Enter: Add new line
-     * - Arrow keys, Tab, Escape: Handle mention dropdown if open
-     */
-    onKeyDown(event) {
-        // If mention dropdown is open, let it handle certain keys
-        if (this.showMentionDropdown) {
-            if (['ArrowDown', 'ArrowUp', 'Enter', 'Tab', 'Escape'].includes(event.key)) {
-                // These keys are handled by the dropdown component
-                return;
+        this.isSending = true;
+        try {
+            const messageDetail = await this.createMessageDetailFromText(text.trim());
+            console.log('[MessageInput] Created message detail:', messageDetail.Message);
+            const saved = await messageDetail.Save();
+            if (saved) {
+                await this.handleSuccessfulSend(messageDetail);
+            }
+            else {
+                this.handleSendFailure(messageDetail);
             }
         }
-        // Regular key handling
-        if (event.key === 'Enter' && !event.shiftKey) {
-            // Prevent default behavior (adding newline)
-            event.preventDefault();
-            // Send the message
-            this.onSend();
-        }
-        // If Shift+Enter, allow default behavior (add newline)
-    }
-    /**
-     * Calculate position for mention dropdown
-     * Keeps dropdown anchored to textarea edge regardless of content size
-     */
-    calculateDropdownPosition(textarea) {
-        const rect = textarea.getBoundingClientRect();
-        const container = textarea.closest('.message-input-container');
-        const containerRect = container?.getBoundingClientRect();
-        if (!containerRect) {
-            // Fallback to absolute positioning
-            this.mentionDropdownPosition = {
-                top: rect.bottom + window.scrollY + 4,
-                left: rect.left + window.scrollX
-            };
-            return;
-        }
-        // Check if there's enough space below the textarea
-        const spaceBelow = window.innerHeight - rect.bottom;
-        const spaceAbove = rect.top;
-        this.mentionDropdownShowAbove = spaceBelow < 200 && spaceAbove > spaceBelow;
-        // Position relative to the container
-        // Always anchor to the textarea edge so dropdown stays in place as content changes
-        if (this.mentionDropdownShowAbove) {
-            // Show above the textarea - anchor to the TOP of the textarea
-            // CSS transform will make it grow upward from this anchor point
-            this.mentionDropdownPosition = {
-                top: rect.top - containerRect.top - 4, // Anchor just above textarea
-                left: rect.left - containerRect.left
-            };
+        catch (error) {
+            this.handleSendError(error);
         }
-        else {
-            // Show below the textarea (default) - anchor to the BOTTOM of the textarea
-            this.mentionDropdownPosition = {
-                top: rect.bottom - containerRect.top + 4,
-                left: rect.left - containerRect.left
-            };
+        finally {
+            this.isSending = false;
         }
     }
-    /**
-     * Handle mention suggestion selection
-     */
-    onMentionSelected(suggestion) {
-        if (this.mentionStartIndex === -1)
-            return;
-        const textarea = this.messageTextarea.nativeElement;
-        const cursorPos = textarea.selectionStart;
-        // Replace the @mention text with the selected name
-        const beforeMention = this.messageText.substring(0, this.mentionStartIndex);
-        const afterMention = this.messageText.substring(cursorPos);
-        // If name has spaces, wrap in quotes
-        const mentionText = suggestion.displayName.includes(' ')
-            ? `@"${suggestion.displayName}" `
-            : `@${suggestion.displayName} `;
-        this.messageText = beforeMention + mentionText + afterMention;
-        // Close dropdown
-        this.closeMentionDropdown();
-        // Set cursor position after the mention
-        const newCursorPos = beforeMention.length + mentionText.length;
-        setTimeout(() => {
-            textarea.selectionStart = newCursorPos;
-            textarea.selectionEnd = newCursorPos;
-            textarea.focus();
-        }, 0);
-    }
-    /**
-     * Close mention dropdown
-     */
-    closeMentionDropdown() {
-        this.showMentionDropdown = false;
-        this.mentionSuggestions = [];
-        this.mentionStartIndex = -1;
-        this.mentionQuery = '';
-    }
     async onSend() {
         if (!this.canSend)
             return;
@@ -399,6 +303,20 @@ export class MessageInputComponent {
         }
         return detail;
     }
+    /**
+     * Creates and configures a new conversation detail message from provided text
+     */
+    async createMessageDetailFromText(text) {
+        const detail = await this.dataCache.createConversationDetail(this.currentUser);
+        detail.ConversationID = this.conversationId;
+        detail.Message = text;
+        detail.Role = 'User';
+        detail.UserID = this.currentUser.ID; // Set the user who sent the message
+        if (this.parentMessageId) {
+            detail.ParentID = this.parentMessageId;
+        }
+        return detail;
+    }
     /**
      * Handles successful message send - routes to appropriate agent
      */
@@ -516,8 +434,8 @@ export class MessageInputComponent {
      */
     refocusTextarea() {
         setTimeout(() => {
-            if (this.messageTextarea?.nativeElement) {
-                this.messageTextarea.nativeElement.focus();
+            if (this.inputBox) {
+                this.inputBox.focus();
             }
         }, 100);
     }
@@ -1365,22 +1283,36 @@ export class MessageInputComponent {
                 if (result.agentRun.AgentID) {
                     agentResponseMessage.AgentID = result.agentRun.AgentID;
                 }
-                await this.updateConversationDetail(agentResponseMessage, result.agentRun?.Message || `✅ **${agentName}** completed`, 'Complete');
-                // Server created artifacts - emit event to trigger UI reload
-                if (result.payload && Object.keys(result.payload).length > 0) {
-                    this.artifactCreated.emit({
-                        artifactId: '',
-                        versionId: '',
-                        versionNumber: 0,
-                        conversationDetailId: agentResponseMessage.ID,
-                        name: ''
-                    });
-                    this.messageSent.emit(agentResponseMessage);
+                // Multi-stage response handling (same logic as ambient Sage)
+                // Stage 1: Check for task graph (multi-step orchestration)
+                if (result.payload?.taskGraph) {
+                    console.log('📋 Task graph detected from @mention, starting task orchestration');
+                    await this.handleTaskGraphExecution(userMessage, result, conversationId, agentResponseMessage);
+                }
+                // Stage 2: Check for sub-agent invocation (single-step delegation)
+                else if (result.agentRun.FinalStep === 'Success' && result.payload?.invokeAgent) {
+                    console.log('🎯 Sub-agent invocation detected from @mention');
+                    await this.handleSubAgentInvocation(userMessage, result, conversationId, agentResponseMessage);
+                }
+                // Stage 3: Normal chat response
+                else {
+                    await this.updateConversationDetail(agentResponseMessage, result.agentRun?.Message || `✅ **${agentName}** completed`, 'Complete');
+                    // Server created artifacts - emit event to trigger UI reload
+                    if (result.payload && Object.keys(result.payload).length > 0) {
+                        this.artifactCreated.emit({
+                            artifactId: '',
+                            versionId: '',
+                            versionNumber: 0,
+                            conversationDetailId: agentResponseMessage.ID,
+                            name: ''
+                        });
+                        this.messageSent.emit(agentResponseMessage);
+                    }
+                    // Mark user message as complete
+                    userMessage.Status = 'Complete';
+                    await userMessage.Save();
+                    this.messageSent.emit(userMessage);
                 }
-                // Mark user message as complete
-                userMessage.Status = 'Complete';
-                await userMessage.Save();
-                this.messageSent.emit(userMessage);
             }
             else {
                 // Agent failed - create error message
@@ -1636,50 +1568,32 @@ export class MessageInputComponent {
             this.completionTimestamps.delete(conversationDetailId);
         }, 5000); // 5 seconds should be more than enough
     }
-    static ɵfac = function MessageInputComponent_Factory(t) { return new (t || MessageInputComponent)(i0.ɵɵdirectiveInject(i1.DialogService), i0.ɵɵdirectiveInject(i2.ToastService), i0.ɵɵdirectiveInject(i3.ConversationAgentService), i0.ɵɵdirectiveInject(i4.ConversationStateService), i0.ɵɵdirectiveInject(i5.DataCacheService), i0.ɵɵdirectiveInject(i6.ActiveTasksService), i0.ɵɵdirectiveInject(i7.MentionAutocompleteService), i0.ɵɵdirectiveInject(i8.MentionParserService)); };
+    static ɵfac = function MessageInputComponent_Factory(t) { return new (t || MessageInputComponent)(i0.ɵɵdirectiveInject(i1.DialogService), i0.ɵɵdirectiveInject(i2.ToastService), i0.ɵɵdirectiveInject(i3.ConversationAgentService), i0.ɵɵdirectiveInject(i4.ConversationStateService), i0.ɵɵdirectiveInject(i5.DataCacheService), i0.ɵɵdirectiveInject(i6.ActiveTasksService), i0.ɵɵdirectiveInject(i7.MentionParserService), i0.ɵɵdirectiveInject(i8.MentionAutocompleteService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MessageInputComponent, selectors: [["mj-message-input"]], viewQuery: function MessageInputComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0, 5);
         } if (rf & 2) {
             let _t;
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.messageTextarea = _t.first);
-        } }, inputs: { conversationId: "conversationId", currentUser: "currentUser", disabled: "disabled", placeholder: "placeholder", parentMessageId: "parentMessageId", conversationHistory: "conversationHistory" }, outputs: { messageSent: "messageSent", agentResponse: "agentResponse", agentRunDetected: "agentRunDetected", agentRunUpdate: "agentRunUpdate", messageComplete: "messageComplete", artifactCreated: "artifactCreated", conversationRenamed: "conversationRenamed", intentCheckStarted: "intentCheckStarted", intentCheckCompleted: "intentCheckCompleted" }, features: [i0.ɵɵNgOnChangesFeature], decls: 11, vars: 13, consts: [["messageTextarea", ""], [1, "message-input-container"], ["rows", "3", 1, "message-input", 3, "ngModelChange", "keydown", "input", "ngModel", "placeholder", "disabled"], [3, "suggestionSelected", "closed", "suggestions", "position", "visible", "showAbove"], [1, "input-actions"], ["class", "processing-indicator", 4, "ngIf"], ["title", "Attach file (coming soon)", 1, "btn-attach", 3, "disabled"], [1, "fas", "fa-paperclip"], [1, "btn-send", 3, "click", "disabled", "title"], [1, "fas", "fa-paper-plane"], [1, "processing-indicator"], [1, "fas", "fa-circle-notch", "fa-spin"]], template: function MessageInputComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.inputBox = _t.first);
+        } }, inputs: { conversationId: "conversationId", currentUser: "currentUser", disabled: "disabled", placeholder: "placeholder", parentMessageId: "parentMessageId", conversationHistory: "conversationHistory", initialMessage: "initialMessage" }, outputs: { messageSent: "messageSent", agentResponse: "agentResponse", agentRunDetected: "agentRunDetected", agentRunUpdate: "agentRunUpdate", messageComplete: "messageComplete", artifactCreated: "artifactCreated", conversationRenamed: "conversationRenamed", intentCheckStarted: "intentCheckStarted", intentCheckCompleted: "intentCheckCompleted" }, features: [i0.ɵɵNgOnChangesFeature], decls: 4, vars: 8, consts: [["inputBox", ""], [1, "message-input-wrapper"], ["class", "processing-indicator", 4, "ngIf"], [3, "valueChange", "textSubmitted", "placeholder", "disabled", "showCharacterCount", "enableMentions", "currentUser", "rows", "value"], [1, "processing-indicator"], [1, "fas", "fa-circle-notch", "fa-spin"]], template: function MessageInputComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
-            i0.ɵɵelementStart(0, "div", 1)(1, "textarea", 2, 0);
-            i0.ɵɵtwoWayListener("ngModelChange", function MessageInputComponent_Template_textarea_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r1); i0.ɵɵtwoWayBindingSet(ctx.messageText, $event) || (ctx.messageText = $event); return i0.ɵɵresetView($event); });
-            i0.ɵɵlistener("keydown", function MessageInputComponent_Template_textarea_keydown_1_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onKeyDown($event)); })("input", function MessageInputComponent_Template_textarea_input_1_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onInput($event)); });
-            i0.ɵɵtext(3, "  ");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(4, "mj-mention-dropdown", 3);
-            i0.ɵɵlistener("suggestionSelected", function MessageInputComponent_Template_mj_mention_dropdown_suggestionSelected_4_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onMentionSelected($event)); })("closed", function MessageInputComponent_Template_mj_mention_dropdown_closed_4_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.closeMentionDropdown()); });
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(5, "div", 4);
-            i0.ɵɵtemplate(6, MessageInputComponent_div_6_Template, 4, 1, "div", 5);
-            i0.ɵɵelementStart(7, "button", 6);
-            i0.ɵɵelement(8, "i", 7);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(9, "button", 8);
-            i0.ɵɵlistener("click", function MessageInputComponent_Template_button_click_9_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onSend()); });
-            i0.ɵɵelement(10, "i", 9);
-            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(0, "div", 1);
+            i0.ɵɵtemplate(1, MessageInputComponent_div_1_Template, 4, 1, "div", 2);
+            i0.ɵɵelementStart(2, "mj-message-input-box", 3, 0);
+            i0.ɵɵtwoWayListener("valueChange", function MessageInputComponent_Template_mj_message_input_box_valueChange_2_listener($event) { i0.ɵɵrestoreView(_r1); i0.ɵɵtwoWayBindingSet(ctx.messageText, $event) || (ctx.messageText = $event); return i0.ɵɵresetView($event); });
+            i0.ɵɵlistener("textSubmitted", function MessageInputComponent_Template_mj_message_input_box_textSubmitted_2_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onTextSubmitted($event)); });
+            i0.ɵɵelementEnd()();
         } if (rf & 2) {
             i0.ɵɵadvance();
-            i0.ɵɵclassProp("intent-checking", ctx.isProcessing);
-            i0.ɵɵtwoWayProperty("ngModel", ctx.messageText);
-            i0.ɵɵproperty("placeholder", ctx.placeholder)("disabled", ctx.disabled || ctx.isProcessing);
-            i0.ɵɵadvance(3);
-            i0.ɵɵproperty("suggestions", ctx.mentionSuggestions)("position", ctx.mentionDropdownPosition)("visible", ctx.showMentionDropdown)("showAbove", ctx.mentionDropdownShowAbove);
-            i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.isProcessing);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("disabled", ctx.disabled);
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("disabled", !ctx.canSend)("title", ctx.isSending ? "Sending..." : "Send message");
-        } }, dependencies: [i9.NgIf, i10.DefaultValueAccessor, i10.NgControlStatus, i10.NgModel, i11.MentionDropdownComponent], styles: [".message-input-container[_ngcontent-%COMP%] {\n  position: relative;\n  padding: 16px 24px;\n  border-top: 1px solid #D9D9D9;\n  background: #FFF;\n}\n\n.message-input-wrapper[_ngcontent-%COMP%] {\n  border: 2px solid #D9D9D9;\n  border-radius: 8px;\n  padding: 12px;\n  transition: border-color 0.2s, box-shadow 0.2s;\n  background: #FFF;\n}\n\n.message-input-wrapper[_ngcontent-%COMP%]:focus-within {\n  border-color: #0076B6;\n  box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.message-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 0;\n  border: none;\n  resize: none;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 40px;\n  max-height: 200px;\n  line-height: 1.5;\n}\n\n.message-input[_ngcontent-%COMP%]:focus {\n  outline: none;\n}\n\n.message-input[_ngcontent-%COMP%]:disabled {\n  background: transparent;\n  cursor: wait;\n}\n\n//[_ngcontent-%COMP%]   Subtle[_ngcontent-%COMP%]   visual[_ngcontent-%COMP%]   feedback[_ngcontent-%COMP%]   when[_ngcontent-%COMP%]   checking[_ngcontent-%COMP%]   intent[_ngcontent-%COMP%]   (no[_ngcontent-%COMP%]   ugly[_ngcontent-%COMP%]   gray[_ngcontent-%COMP%]   background)\n.message-input.intent-checking[_ngcontent-%COMP%] {\n  opacity: 0.6;\n  transition: opacity 0.2s;\n}\n.input-actions[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 12px;\n}\n.btn-attach[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  background: transparent;\n  border: 1px solid #D9D9D9;\n  border-radius: 6px;\n  cursor: pointer;\n  color: #333;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.btn-attach[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: #F4F4F4;\n  border-color: #AAA;\n}\n.btn-attach[_ngcontent-%COMP%]:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.btn-send[_ngcontent-%COMP%] {\n  width: 40px;\n  height: 40px;\n  background: #3B82F6;\n  color: white;\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.2s;\n  flex-shrink: 0;\n}\n.btn-send[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: #2563EB;\n}\n.btn-send[_ngcontent-%COMP%]:disabled {\n  background: #D9D9D9;\n  color: #AAA;\n  cursor: not-allowed;\n}\n.btn-send[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 16px;\n}\n.processing-indicator[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  color: #6B7280;\n  margin-right: auto;\n}\n.processing-indicator[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: #0076B6;\n}"] });
+            i0.ɵɵproperty("placeholder", ctx.placeholder)("disabled", ctx.disabled || ctx.isProcessing)("showCharacterCount", false)("enableMentions", true)("currentUser", ctx.currentUser)("rows", 3);
+            i0.ɵɵtwoWayProperty("value", ctx.messageText);
+        } }, dependencies: [i9.NgIf, i10.MessageInputBoxComponent], styles: [".message-input-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n  width: 100%;\n}\n\n.processing-indicator[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  padding: 0.75rem 1.25rem;\n  background: rgba(255, 255, 255, 0.95);\n  border-radius: 8px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n  z-index: 10;\n  pointer-events: none;\n\n  i {\n    color: var(--primary-color, #007bff);\n  }\n\n  span {\n    font-size: 0.9rem;\n    color: var(--text-primary, #333);\n  }\n}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MessageInputComponent, [{
         type: Component,
-        args: [{ selector: 'mj-message-input', template: "<div class=\"message-input-container\">\n  <textarea\n    #messageTextarea\n    class=\"message-input\"\n    [class.intent-checking]=\"isProcessing\"\n    [(ngModel)]=\"messageText\"\n    [placeholder]=\"placeholder\"\n    [disabled]=\"disabled || isProcessing\"\n    (keydown)=\"onKeyDown($event)\"\n    (input)=\"onInput($event)\"\n    rows=\"3\">\n  </textarea>\n\n  <!-- Mention Autocomplete Dropdown -->\n  <mj-mention-dropdown\n    [suggestions]=\"mentionSuggestions\"\n    [position]=\"mentionDropdownPosition\"\n    [visible]=\"showMentionDropdown\"\n    [showAbove]=\"mentionDropdownShowAbove\"\n    (suggestionSelected)=\"onMentionSelected($event)\"\n    (closed)=\"closeMentionDropdown()\">\n  </mj-mention-dropdown>\n\n  <div class=\"input-actions\">\n    <div class=\"processing-indicator\" *ngIf=\"isProcessing\">\n      <i class=\"fas fa-circle-notch fa-spin\"></i>\n      <span>{{ processingMessage }}</span>\n    </div>\n    <button\n      class=\"btn-attach\"\n      [disabled]=\"disabled\"\n      title=\"Attach file (coming soon)\">\n      <i class=\"fas fa-paperclip\"></i>\n    </button>\n    <button\n      class=\"btn-send\"\n      [disabled]=\"!canSend\"\n      (click)=\"onSend()\"\n      [title]=\"isSending ? 'Sending...' : 'Send message'\">\n      <i class=\"fas fa-paper-plane\"></i>\n    </button>\n  </div>\n</div>", styles: [".message-input-container {\n  position: relative;\n  padding: 16px 24px;\n  border-top: 1px solid #D9D9D9;\n  background: #FFF;\n}\n\n.message-input-wrapper {\n  border: 2px solid #D9D9D9;\n  border-radius: 8px;\n  padding: 12px;\n  transition: border-color 0.2s, box-shadow 0.2s;\n  background: #FFF;\n}\n\n.message-input-wrapper:focus-within {\n  border-color: #0076B6;\n  box-shadow: 0 0 0 3px rgba(0, 118, 182, 0.1);\n}\n\n.message-input {\n  width: 100%;\n  padding: 0;\n  border: none;\n  resize: none;\n  font-family: inherit;\n  font-size: 14px;\n  min-height: 40px;\n  max-height: 200px;\n  line-height: 1.5;\n}\n\n.message-input:focus {\n  outline: none;\n}\n\n.message-input:disabled {\n  background: transparent;\n  cursor: wait;\n}\n\n// Subtle visual feedback when checking intent (no ugly gray background)\n.message-input.intent-checking {\n  opacity: 0.6;\n  transition: opacity 0.2s;\n}\n.input-actions {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-top: 12px;\n}\n.btn-attach {\n  padding: 8px 16px;\n  background: transparent;\n  border: 1px solid #D9D9D9;\n  border-radius: 6px;\n  cursor: pointer;\n  color: #333;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n.btn-attach:hover:not(:disabled) {\n  background: #F4F4F4;\n  border-color: #AAA;\n}\n.btn-attach:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.btn-send {\n  width: 40px;\n  height: 40px;\n  background: #3B82F6;\n  color: white;\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  transition: background 0.2s;\n  flex-shrink: 0;\n}\n.btn-send:hover:not(:disabled) {\n  background: #2563EB;\n}\n.btn-send:disabled {\n  background: #D9D9D9;\n  color: #AAA;\n  cursor: not-allowed;\n}\n.btn-send i {\n  font-size: 16px;\n}\n.processing-indicator {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 13px;\n  color: #6B7280;\n  margin-right: auto;\n}\n.processing-indicator i {\n  color: #0076B6;\n}"] }]
-    }], () => [{ type: i1.DialogService }, { type: i2.ToastService }, { type: i3.ConversationAgentService }, { type: i4.ConversationStateService }, { type: i5.DataCacheService }, { type: i6.ActiveTasksService }, { type: i7.MentionAutocompleteService }, { type: i8.MentionParserService }], { conversationId: [{
+        args: [{ selector: 'mj-message-input', template: "<div class=\"message-input-wrapper\">\n  <!-- Processing Indicator Overlay -->\n  <div class=\"processing-indicator\" *ngIf=\"isProcessing\">\n    <i class=\"fas fa-circle-notch fa-spin\"></i>\n    <span>{{ processingMessage }}</span>\n  </div>\n\n  <!-- Message Input Box -->\n  <mj-message-input-box\n    #inputBox\n    [placeholder]=\"placeholder\"\n    [disabled]=\"disabled || isProcessing\"\n    [showCharacterCount]=\"false\"\n    [enableMentions]=\"true\"\n    [currentUser]=\"currentUser\"\n    [rows]=\"3\"\n    [(value)]=\"messageText\"\n    (textSubmitted)=\"onTextSubmitted($event)\">\n  </mj-message-input-box>\n</div>", styles: [".message-input-wrapper {\n  position: relative;\n  width: 100%;\n}\n\n.processing-indicator {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  padding: 0.75rem 1.25rem;\n  background: rgba(255, 255, 255, 0.95);\n  border-radius: 8px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n  z-index: 10;\n  pointer-events: none;\n\n  i {\n    color: var(--primary-color, #007bff);\n  }\n\n  span {\n    font-size: 0.9rem;\n    color: var(--text-primary, #333);\n  }\n}"] }]
+    }], () => [{ type: i1.DialogService }, { type: i2.ToastService }, { type: i3.ConversationAgentService }, { type: i4.ConversationStateService }, { type: i5.DataCacheService }, { type: i6.ActiveTasksService }, { type: i7.MentionParserService }, { type: i8.MentionAutocompleteService }], { conversationId: [{
             type: Input
         }], currentUser: [{
             type: Input
@@ -1691,6 +1605,8 @@ export class MessageInputComponent {
             type: Input
         }], conversationHistory: [{
             type: Input
+        }], initialMessage: [{
+            type: Input
         }], messageSent: [{
             type: Output
         }], agentResponse: [{
@@ -1709,9 +1625,9 @@ export class MessageInputComponent {
             type: Output
         }], intentCheckCompleted: [{
             type: Output
-        }], messageTextarea: [{
+        }], inputBox: [{
             type: ViewChild,
-            args: ['messageTextarea']
+            args: ['inputBox']
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MessageInputComponent, { className: "MessageInputComponent", filePath: "src/lib/components/message/message-input.component.ts", lineNumber: 23 }); })();
 //# sourceMappingURL=message-input.component.js.map