@memberjunction/ng-composer 0.0.0 → 5.45.0

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

@@ -0,0 +1,340 @@
+import { Component, Input, Output, EventEmitter, ViewChild } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+import * as i2 from "../mention/mention-editor.component";
+const _c0 = ["mentionEditor"];
+function MessageInputBoxComponent_Conditional_4_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 9);
+    i0.ɵɵlistener("click", function MessageInputBoxComponent_Conditional_4_Conditional_1_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.planModeToggle.emit(); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(1, "i", 10);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("plan-mode-button-icon--active", ctx_r2.planModeActive);
+    i0.ɵɵproperty("disabled", ctx_r2.disabled)("title", ctx_r2.planModeActive ? "Plan Mode ON \u2014 the agent presents a plan for your approval before it acts" : "Plan Mode: have the agent present a plan for your approval before it acts");
+    i0.ɵɵattribute("aria-pressed", ctx_r2.planModeActive);
+} }
+function MessageInputBoxComponent_Conditional_4_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 11);
+    i0.ɵɵlistener("click", function MessageInputBoxComponent_Conditional_4_Conditional_2_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.openFilePicker(); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(1, "i", 12);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("disabled", ctx_r2.disabled);
+} }
+function MessageInputBoxComponent_Conditional_4_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 13);
+    i0.ɵɵlistener("click", function MessageInputBoxComponent_Conditional_4_Conditional_3_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.onRealtimeClick(); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(1, "i", 14);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "button", 15);
+    i0.ɵɵlistener("click", function MessageInputBoxComponent_Conditional_4_Conditional_3_Template_button_click_2_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.onRealtimeOptionsClick(); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(3, "i", 16);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("voice-button-icon--active", ctx_r2.voiceActive);
+    i0.ɵɵproperty("disabled", !ctx_r2.canStartRealtime)("title", ctx_r2.voiceActive ? "Voice call active" : "Start a voice call");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("disabled", !ctx_r2.canStartRealtime);
+} }
+function MessageInputBoxComponent_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 4);
+    i0.ɵɵconditionalCreate(1, MessageInputBoxComponent_Conditional_4_Conditional_1_Template, 2, 5, "button", 7);
+    i0.ɵɵconditionalCreate(2, MessageInputBoxComponent_Conditional_4_Conditional_2_Template, 2, 1, "button", 8);
+    i0.ɵɵconditionalCreate(3, MessageInputBoxComponent_Conditional_4_Conditional_3_Template, 4, 5);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.enablePlanMode ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.enableAttachments ? 2 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.enableRealtime ? 3 : -1);
+} }
+/**
+ * Reusable message input box component (presentational)
+ * Now uses MentionEditorComponent for rich @mention functionality with chips
+ *
+ * Handles:
+ * - Text input with keyboard shortcuts via MentionEditorComponent
+ * - @mention autocomplete with visual chips (contentEditable)
+ * - Send button
+ *
+ * Does NOT handle:
+ * - Saving messages to database
+ * - Agent invocation
+ * - Artifact creation
+ * - Conversation management
+ */
+export class MessageInputBoxComponent {
+    mentionEditor;
+    placeholder = 'Type your message to start a new conversation...';
+    disabled = false;
+    value = '';
+    showCharacterCount = false;
+    /** Master switch for all mention/command triggers (pass-through to the mention editor). */
+    enableMentions = true;
+    /** Explicit trigger-provider list (pass-through to the mention editor; explicit list wins over discovery). */
+    TriggerProviders = null;
+    /** Discovery-mode filter: provider Keys to skip (pass-through to the mention editor). */
+    ExcludedTriggerKeys = [];
+    /** Optional metadata provider scoping this composer (pass-through to the mention editor). */
+    Provider = null;
+    currentUser;
+    rows = 3;
+    // Attachment settings
+    enableAttachments = true;
+    maxAttachments = 10;
+    maxAttachmentSizeBytes = 20 * 1024 * 1024; // 20MB
+    acceptedFileTypes = 'image/*';
+    /** Shows the in-composer mic button when true. */
+    enableRealtime = false;
+    /** Whether a realtime voice session is currently active (mic renders in its active state). */
+    voiceActive = false;
+    /** Whether a voice session can be started right now (mic disabled when false). */
+    canStartRealtime = true;
+    /** Shows the in-composer Plan Mode toggle button when true. */
+    enablePlanMode = false;
+    /** Current Plan Mode toggle state (renders the button in its active state). */
+    planModeActive = false;
+    textSubmitted = new EventEmitter();
+    valueChange = new EventEmitter();
+    attachmentsChanged = new EventEmitter();
+    attachmentError = new EventEmitter();
+    attachmentClicked = new EventEmitter();
+    /** Emitted when the user clicks the mic button to start/stop a voice session. */
+    voiceRequested = new EventEmitter();
+    /**
+     * Emitted when the user clicks the small caret next to the phone button — the host opens the
+     * voice agent/model picker so call options (which agent, which voice model) stay reachable
+     * without adding friction to the plain phone click's instant-start path.
+     */
+    voiceOptionsRequested = new EventEmitter();
+    /** Emitted when the user clicks the in-composer Plan Mode toggle button. */
+    planModeToggle = new EventEmitter();
+    onRealtimeClick() {
+        this.voiceRequested.emit();
+    }
+    onRealtimeOptionsClick() {
+        this.voiceOptionsRequested.emit();
+    }
+    get canSend() {
+        const hasText = this.value.trim().length > 0;
+        const hasAttachments = this.mentionEditor?.hasAttachments() || false;
+        return !this.disabled && (hasText || hasAttachments);
+    }
+    /**
+     * Handle value changes from MentionEditorComponent
+     */
+    onValueChange(newValue) {
+        this.value = newValue;
+        this.valueChange.emit(this.value);
+    }
+    /**
+     * Handle attachment changes from MentionEditorComponent
+     */
+    onAttachmentsChanged(attachments) {
+        this.attachmentsChanged.emit(attachments);
+    }
+    /**
+     * Handle attachment errors from MentionEditorComponent
+     */
+    onAttachmentError(error) {
+        this.attachmentError.emit(error);
+    }
+    /**
+     * Handle attachment click from MentionEditorComponent
+     */
+    onAttachmentClicked(attachment) {
+        this.attachmentClicked.emit(attachment);
+    }
+    /**
+     * Handle Enter key from MentionEditorComponent
+     * Extracts plain text with JSON-encoded mentions for message submission
+     */
+    onEnterPressed(_text) {
+        this.onSendClick();
+    }
+    /**
+     * Handle mention selection from MentionEditorComponent
+     */
+    onMentionSelected(suggestion) {
+        // MentionEditorComponent already inserts the mention chip
+        // This is just for additional tracking/analytics if needed
+    }
+    /**
+     * Send the message
+     * Extracts plain text with JSON-encoded mentions for proper persistence
+     */
+    onSendClick() {
+        if (this.canSend) {
+            // Get plain text with JSON-encoded mentions (preserves configuration info)
+            const textToSend = this.mentionEditor?.getPlainTextWithJsonMentions() || this.value.trim();
+            this.textSubmitted.emit(textToSend);
+            this.value = ''; // Clear input after sending
+            // Clear the editor content
+            if (this.mentionEditor) {
+                this.mentionEditor.clear();
+            }
+            this.valueChange.emit(this.value);
+        }
+    }
+    /**
+     * Handle clicks on the container - focus the mention editor
+     * Only moves cursor to end if clicking outside the contentEditable area
+     */
+    onContainerClick(event) {
+        const target = event.target;
+        // Don't handle clicks on the send button
+        if (target.closest('.send-button-icon')) {
+            return;
+        }
+        const editor = this.mentionEditor?.editorRef?.nativeElement;
+        if (!editor)
+            return;
+        // If clicking directly on the editor or its children, let the browser handle cursor placement
+        if (target === editor || editor.contains(target)) {
+            return;
+        }
+        // Only if clicking on the container (empty space), focus and move cursor to end
+        editor.focus();
+        const selection = window.getSelection();
+        const range = document.createRange();
+        if (selection) {
+            range.selectNodeContents(editor);
+            range.collapse(false); // Collapse to end
+            selection.removeAllRanges();
+            selection.addRange(range);
+        }
+    }
+    /**
+     * Public method to focus the input programmatically
+     */
+    focus() {
+        const editor = this.mentionEditor?.editorRef?.nativeElement;
+        if (editor) {
+            editor.focus();
+        }
+    }
+    /**
+     * Get mention chip data including configuration presets
+     */
+    getMentionChipsData() {
+        return this.mentionEditor?.getMentionChipsData() || [];
+    }
+    /**
+     * Get pending attachments from the editor
+     */
+    getPendingAttachments() {
+        return this.mentionEditor?.getPendingAttachments() || [];
+    }
+    /**
+     * Open file picker programmatically
+     */
+    openFilePicker() {
+        this.mentionEditor?.openFilePicker();
+    }
+    /**
+     * Add an artifact as a pending attachment (called by parent after artifact selection)
+     */
+    AddArtifactAttachment(artifact) {
+        return this.mentionEditor?.AddArtifactAttachment(artifact);
+    }
+    static ɵfac = function MessageInputBoxComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MessageInputBoxComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MessageInputBoxComponent, selectors: [["mj-message-input-box"]], viewQuery: function MessageInputBoxComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c0, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.mentionEditor = _t.first);
+        } }, inputs: { placeholder: "placeholder", disabled: "disabled", value: "value", showCharacterCount: "showCharacterCount", enableMentions: "enableMentions", TriggerProviders: "TriggerProviders", ExcludedTriggerKeys: "ExcludedTriggerKeys", Provider: "Provider", currentUser: "currentUser", rows: "rows", enableAttachments: "enableAttachments", maxAttachments: "maxAttachments", maxAttachmentSizeBytes: "maxAttachmentSizeBytes", acceptedFileTypes: "acceptedFileTypes", enableRealtime: "enableRealtime", voiceActive: "voiceActive", canStartRealtime: "canStartRealtime", enablePlanMode: "enablePlanMode", planModeActive: "planModeActive" }, outputs: { textSubmitted: "textSubmitted", valueChange: "valueChange", attachmentsChanged: "attachmentsChanged", attachmentError: "attachmentError", attachmentClicked: "attachmentClicked", voiceRequested: "voiceRequested", voiceOptionsRequested: "voiceOptionsRequested", planModeToggle: "planModeToggle" }, standalone: false, decls: 7, vars: 14, consts: [["mentionEditor", ""], [1, "message-input-box-container", 3, "click"], [1, "input-wrapper"], [3, "ngModelChange", "valueChange", "enterPressed", "mentionSelected", "attachmentsChanged", "attachmentError", "attachmentClicked", "placeholder", "disabled", "currentUser", "enableMentions", "TriggerProviders", "ExcludedTriggerKeys", "Provider", "enableAttachments", "maxAttachments", "maxAttachmentSizeBytes", "acceptedFileTypes", "ngModel"], [1, "attach-buttons"], ["title", "Send message (Enter)", 1, "send-button-icon", 3, "click", "disabled"], [1, "fa-solid", "fa-paper-plane"], ["aria-label", "Toggle Plan Mode", 1, "attach-button-icon", "plan-mode-button-icon", 3, "plan-mode-button-icon--active", "disabled", "title"], ["title", "Attach file", 1, "attach-button-icon", 3, "disabled"], ["aria-label", "Toggle Plan Mode", 1, "attach-button-icon", "plan-mode-button-icon", 3, "click", "disabled", "title"], ["aria-hidden", "true", 1, "fa-solid", "fa-route"], ["title", "Attach file", 1, "attach-button-icon", 3, "click", "disabled"], [1, "fa-solid", "fa-paperclip"], ["aria-label", "Start a voice call", 1, "attach-button-icon", "voice-button-icon", 3, "click", "disabled", "title"], ["aria-hidden", "true", 1, "fa-solid", "fa-phone"], ["title", "Voice call options (choose agent and voice model)", "aria-label", "Voice call options", 1, "attach-button-icon", "voice-options-button-icon", 3, "click", "disabled"], ["aria-hidden", "true", 1, "fa-solid", "fa-chevron-down"]], template: function MessageInputBoxComponent_Template(rf, ctx) { if (rf & 1) {
+            const _r1 = i0.ɵɵgetCurrentView();
+            i0.ɵɵelementStart(0, "div", 1);
+            i0.ɵɵlistener("click", function MessageInputBoxComponent_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onContainerClick($event)); });
+            i0.ɵɵelementStart(1, "div", 2)(2, "mj-mention-editor", 3, 0);
+            i0.ɵɵtwoWayListener("ngModelChange", function MessageInputBoxComponent_Template_mj_mention_editor_ngModelChange_2_listener($event) { i0.ɵɵrestoreView(_r1); i0.ɵɵtwoWayBindingSet(ctx.value, $event) || (ctx.value = $event); return i0.ɵɵresetView($event); });
+            i0.ɵɵlistener("valueChange", function MessageInputBoxComponent_Template_mj_mention_editor_valueChange_2_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onValueChange($event)); })("enterPressed", function MessageInputBoxComponent_Template_mj_mention_editor_enterPressed_2_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onEnterPressed($event)); })("mentionSelected", function MessageInputBoxComponent_Template_mj_mention_editor_mentionSelected_2_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onMentionSelected($event)); })("attachmentsChanged", function MessageInputBoxComponent_Template_mj_mention_editor_attachmentsChanged_2_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onAttachmentsChanged($event)); })("attachmentError", function MessageInputBoxComponent_Template_mj_mention_editor_attachmentError_2_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onAttachmentError($event)); })("attachmentClicked", function MessageInputBoxComponent_Template_mj_mention_editor_attachmentClicked_2_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onAttachmentClicked($event)); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(4, MessageInputBoxComponent_Conditional_4_Template, 4, 3, "div", 4);
+            i0.ɵɵelementStart(5, "button", 5);
+            i0.ɵɵlistener("click", function MessageInputBoxComponent_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onSendClick()); });
+            i0.ɵɵelement(6, "i", 6);
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("placeholder", ctx.placeholder)("disabled", ctx.disabled)("currentUser", ctx.currentUser)("enableMentions", ctx.enableMentions)("TriggerProviders", ctx.TriggerProviders)("ExcludedTriggerKeys", ctx.ExcludedTriggerKeys)("Provider", ctx.Provider)("enableAttachments", ctx.enableAttachments)("maxAttachments", ctx.maxAttachments)("maxAttachmentSizeBytes", ctx.maxAttachmentSizeBytes)("acceptedFileTypes", ctx.acceptedFileTypes);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.value);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.enableAttachments || ctx.enableRealtime || ctx.enablePlanMode ? 4 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("disabled", !ctx.canSend);
+        } }, dependencies: [i1.NgControlStatus, i1.NgModel, i2.MentionEditorComponent], styles: [".message-input-box-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-surface-card);\n  border: 2px solid var(--mj-border-default);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-sm);\n  transition: all 0.2s ease;\n  overflow: visible;\n  position: relative;\n  cursor: text;\n}\n.message-input-box-container[_ngcontent-%COMP%]:focus-within {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 4px 16px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n.input-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: flex-end;\n  padding: 5px;\n}\n.input-wrapper[_ngcontent-%COMP%]   mj-mention-editor[_ngcontent-%COMP%] {\n  flex: 1;\n  display: block;\n}\n\n.message-input-box-textarea[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 100px;\n  padding: 1rem;\n  padding-right: 3.5rem;\n  border: 0 !important;\n  outline: 0 !important;\n  box-shadow: none !important;\n  -webkit-appearance: none !important;\n  -moz-appearance: none !important;\n  appearance: none !important;\n  font-family: inherit;\n  font-size: 1rem;\n  line-height: 1.5;\n  resize: vertical;\n  background: transparent;\n  color: var(--mj-text-primary);\n  border: 0 !important;\n}\n.message-input-box-textarea[_ngcontent-%COMP%]::placeholder {\n  color: var(--mj-text-muted);\n}\n.message-input-box-textarea[_ngcontent-%COMP%]:disabled {\n  cursor: not-allowed;\n  opacity: 0.6;\n  background: var(--mj-bg-surface-sunken);\n}\n.message-input-box-textarea[_ngcontent-%COMP%]:focus, .message-input-box-textarea[_ngcontent-%COMP%]:active, .message-input-box-textarea[_ngcontent-%COMP%]:focus-visible {\n  outline: 0 !important;\n  box-shadow: none !important;\n}\n\n.send-button-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  bottom: 0.75rem;\n  right: 0.75rem;\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  flex-shrink: 0;\n}\n.send-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 1rem;\n}\n.send-button-icon[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: var(--mj-brand-primary-hover);\n  transform: scale(1.05);\n}\n.send-button-icon[_ngcontent-%COMP%]:active:not(:disabled) {\n  transform: scale(0.95);\n}\n.send-button-icon[_ngcontent-%COMP%]:disabled {\n  background: var(--mj-border-default);\n  color: var(--mj-text-muted);\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n\n\n.attach-buttons[_ngcontent-%COMP%] {\n  position: absolute;\n  bottom: 0.75rem;\n  right: 3rem;\n  display: flex;\n  gap: 2px;\n}\n.attach-button-icon[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  color: var(--mj-text-secondary);\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  flex-shrink: 0;\n}\n.attach-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 1rem;\n}\n.attach-button-icon[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--mj-text-primary) 5%, transparent);\n  color: var(--mj-brand-primary);\n  transform: scale(1.05);\n}\n.attach-button-icon[_ngcontent-%COMP%]:active:not(:disabled) {\n  transform: scale(0.95);\n}\n.attach-button-icon[_ngcontent-%COMP%]:disabled {\n  color: var(--mj-text-muted);\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n\n\n\n.plan-mode-button-icon--active[_ngcontent-%COMP%]:not(:disabled) {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n.plan-mode-button-icon--active[_ngcontent-%COMP%]:not(:disabled):hover {\n  background: var(--mj-brand-primary-hover, var(--mj-brand-primary));\n  color: var(--mj-text-inverse);\n}\n\n\n\n@media (max-width: 768px) {\n  .message-input-box-container[_ngcontent-%COMP%] {\n    border-radius: 10px;\n    box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-text-primary) 6%, transparent);\n  }\n  .message-input-box-textarea[_ngcontent-%COMP%] {\n    min-height: 80px;\n    padding: 0.75rem;\n    padding-right: 3rem;\n    font-size: 16px;\n    line-height: 1.4;\n  }\n  .send-button-icon[_ngcontent-%COMP%] {\n    width: 32px;\n    height: 32px;\n    bottom: 0.625rem;\n    right: 0.625rem;\n    border-radius: 6px;\n  }\n  .send-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 0.875rem;\n  }\n  .attach-buttons[_ngcontent-%COMP%] {\n    bottom: 0.625rem;\n    right: 2.75rem;\n  }\n  .attach-button-icon[_ngcontent-%COMP%] {\n    width: 32px;\n    height: 32px;\n  }\n  .attach-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 0.875rem;\n  }\n}\n\n\n@media (max-width: 480px) {\n  .message-input-box-container[_ngcontent-%COMP%] {\n    border-radius: 8px;\n    border-width: 1.5px;\n  }\n  .message-input-box-textarea[_ngcontent-%COMP%] {\n    min-height: 60px;\n    padding: 0.625rem;\n    padding-right: 2.75rem;\n    font-size: 16px;\n    line-height: 1.3;\n  }\n  .send-button-icon[_ngcontent-%COMP%] {\n    width: 36px;\n    height: 36px;\n    bottom: 0.5rem;\n    right: 0.5rem;\n    border-radius: 6px;\n  }\n  .send-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 0.875rem;\n  }\n  .attach-buttons[_ngcontent-%COMP%] {\n    bottom: 0.5rem;\n    right: 2.75rem;\n  }\n  .attach-button-icon[_ngcontent-%COMP%] {\n    width: 32px;\n    height: 32px;\n  }\n  .attach-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 0.875rem;\n  }\n}\n\n\n\n\n\n\n.voice-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n.voice-button-icon[_ngcontent-%COMP%]:hover:not(:disabled)   i[_ngcontent-%COMP%] {\n  filter: drop-shadow(0 0 4px color-mix(in srgb, var(--mj-brand-primary) 55%, transparent));\n}\n.voice-button-icon[_ngcontent-%COMP%]:disabled   i[_ngcontent-%COMP%] {\n  color: var(--mj-text-disabled);\n}\n.voice-button-icon--active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n}\n.voice-button-icon--active[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n\n\n\n\n\n.voice-options-button-icon[_ngcontent-%COMP%] {\n  width: 20px;\n  margin-left: -4px;\n}\n.voice-options-button-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 0.7rem;\n  color: var(--mj-text-muted);\n}\n.voice-options-button-icon[_ngcontent-%COMP%]:hover:not(:disabled)   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n.voice-options-button-icon[_ngcontent-%COMP%]:disabled   i[_ngcontent-%COMP%] {\n  color: var(--mj-text-disabled);\n}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MessageInputBoxComponent, [{
+        type: Component,
+        args: [{ standalone: false, selector: 'mj-message-input-box', template: "<div class=\"message-input-box-container\" (click)=\"onContainerClick($event)\">\n  <div class=\"input-wrapper\">\n    <mj-mention-editor\n      #mentionEditor\n      [placeholder]=\"placeholder\"\n      [disabled]=\"disabled\"\n      [currentUser]=\"currentUser\"\n      [enableMentions]=\"enableMentions\"\n      [TriggerProviders]=\"TriggerProviders\"\n      [ExcludedTriggerKeys]=\"ExcludedTriggerKeys\"\n      [Provider]=\"Provider\"\n      [enableAttachments]=\"enableAttachments\"\n      [maxAttachments]=\"maxAttachments\"\n      [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n      [acceptedFileTypes]=\"acceptedFileTypes\"\n      [(ngModel)]=\"value\"\n      (valueChange)=\"onValueChange($event)\"\n      (enterPressed)=\"onEnterPressed($event)\"\n      (mentionSelected)=\"onMentionSelected($event)\"\n      (attachmentsChanged)=\"onAttachmentsChanged($event)\"\n      (attachmentError)=\"onAttachmentError($event)\"\n      (attachmentClicked)=\"onAttachmentClicked($event)\">\n    </mj-mention-editor>\n\n    <!-- Attach + voice + plan-mode buttons - Positioned over editor -->\n    @if (enableAttachments || enableRealtime || enablePlanMode) {\n      <div class=\"attach-buttons\">\n        @if (enablePlanMode) {\n        <button\n          class=\"attach-button-icon plan-mode-button-icon\"\n          [class.plan-mode-button-icon--active]=\"planModeActive\"\n          [disabled]=\"disabled\"\n          [attr.aria-pressed]=\"planModeActive\"\n          (click)=\"planModeToggle.emit(); $event.stopPropagation()\"\n          [title]=\"planModeActive ? 'Plan Mode ON \u2014 the agent presents a plan for your approval before it acts' : 'Plan Mode: have the agent present a plan for your approval before it acts'\"\n          aria-label=\"Toggle Plan Mode\"\n          >\n          <i class=\"fa-solid fa-route\" aria-hidden=\"true\"></i>\n        </button>\n        }\n        @if (enableAttachments) {\n        <button\n          class=\"attach-button-icon\"\n          [disabled]=\"disabled\"\n          (click)=\"openFilePicker(); $event.stopPropagation()\"\n          title=\"Attach file\"\n          >\n          <i class=\"fa-solid fa-paperclip\"></i>\n        </button>\n        }\n        @if (enableRealtime) {\n        <button\n          class=\"attach-button-icon voice-button-icon\"\n          [class.voice-button-icon--active]=\"voiceActive\"\n          [disabled]=\"!canStartRealtime\"\n          (click)=\"onRealtimeClick(); $event.stopPropagation()\"\n          [title]=\"voiceActive ? 'Voice call active' : 'Start a voice call'\"\n          aria-label=\"Start a voice call\"\n          >\n          <i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i>\n        </button>\n        <!-- Caret beside the phone: opens the agent/model picker so call OPTIONS stay one\n             click away while the plain phone click keeps its instant-start behavior. -->\n        <button\n          class=\"attach-button-icon voice-options-button-icon\"\n          [disabled]=\"!canStartRealtime\"\n          (click)=\"onRealtimeOptionsClick(); $event.stopPropagation()\"\n          title=\"Voice call options (choose agent and voice model)\"\n          aria-label=\"Voice call options\"\n          >\n          <i class=\"fa-solid fa-chevron-down\" aria-hidden=\"true\"></i>\n        </button>\n        }\n      </div>\n    }\n\n    <!-- Send Button (Icon Only) - Positioned over editor -->\n    <button\n      class=\"send-button-icon\"\n      [disabled]=\"!canSend\"\n      (click)=\"onSendClick()\"\n      title=\"Send message (Enter)\"\n      >\n      <i class=\"fa-solid fa-paper-plane\"></i>\n    </button>\n  </div>\n</div>\n", styles: [".message-input-box-container {\n  display: flex;\n  flex-direction: column;\n  background: var(--mj-bg-surface-card);\n  border: 2px solid var(--mj-border-default);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-sm);\n  transition: all 0.2s ease;\n  overflow: visible;\n  position: relative;\n  cursor: text;\n}\n.message-input-box-container:focus-within {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 4px 16px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n.input-wrapper {\n  position: relative;\n  display: flex;\n  align-items: flex-end;\n  padding: 5px;\n}\n.input-wrapper mj-mention-editor {\n  flex: 1;\n  display: block;\n}\n\n.message-input-box-textarea {\n  flex: 1;\n  min-height: 100px;\n  padding: 1rem;\n  padding-right: 3.5rem;\n  border: 0 !important;\n  outline: 0 !important;\n  box-shadow: none !important;\n  -webkit-appearance: none !important;\n  -moz-appearance: none !important;\n  appearance: none !important;\n  font-family: inherit;\n  font-size: 1rem;\n  line-height: 1.5;\n  resize: vertical;\n  background: transparent;\n  color: var(--mj-text-primary);\n  border: 0 !important;\n}\n.message-input-box-textarea::placeholder {\n  color: var(--mj-text-muted);\n}\n.message-input-box-textarea:disabled {\n  cursor: not-allowed;\n  opacity: 0.6;\n  background: var(--mj-bg-surface-sunken);\n}\n.message-input-box-textarea:focus, .message-input-box-textarea:active, .message-input-box-textarea:focus-visible {\n  outline: 0 !important;\n  box-shadow: none !important;\n}\n\n.send-button-icon {\n  position: absolute;\n  bottom: 0.75rem;\n  right: 0.75rem;\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  flex-shrink: 0;\n}\n.send-button-icon i {\n  font-size: 1rem;\n}\n.send-button-icon:hover:not(:disabled) {\n  background: var(--mj-brand-primary-hover);\n  transform: scale(1.05);\n}\n.send-button-icon:active:not(:disabled) {\n  transform: scale(0.95);\n}\n.send-button-icon:disabled {\n  background: var(--mj-border-default);\n  color: var(--mj-text-muted);\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/* Attach buttons container */\n.attach-buttons {\n  position: absolute;\n  bottom: 0.75rem;\n  right: 3rem;\n  display: flex;\n  gap: 2px;\n}\n.attach-button-icon {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: transparent;\n  color: var(--mj-text-secondary);\n  border: none;\n  border-radius: 8px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  flex-shrink: 0;\n}\n.attach-button-icon i {\n  font-size: 1rem;\n}\n.attach-button-icon:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--mj-text-primary) 5%, transparent);\n  color: var(--mj-brand-primary);\n  transform: scale(1.05);\n}\n.attach-button-icon:active:not(:disabled) {\n  transform: scale(0.95);\n}\n.attach-button-icon:disabled {\n  color: var(--mj-text-muted);\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/* Plan Mode toggle \u2014 inherits .attach-button-icon; when active it fills with the brand color\n   so the on/off state reads clearly at a glance (parallels the voice button's active state). */\n.plan-mode-button-icon--active:not(:disabled) {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n.plan-mode-button-icon--active:not(:disabled):hover {\n  background: var(--mj-brand-primary-hover, var(--mj-brand-primary));\n  color: var(--mj-text-inverse);\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n  .message-input-box-container {\n    border-radius: 10px;\n    box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-text-primary) 6%, transparent);\n  }\n  .message-input-box-textarea {\n    min-height: 80px;\n    padding: 0.75rem;\n    padding-right: 3rem;\n    font-size: 16px;\n    line-height: 1.4;\n  }\n  .send-button-icon {\n    width: 32px;\n    height: 32px;\n    bottom: 0.625rem;\n    right: 0.625rem;\n    border-radius: 6px;\n  }\n  .send-button-icon i {\n    font-size: 0.875rem;\n  }\n  .attach-buttons {\n    bottom: 0.625rem;\n    right: 2.75rem;\n  }\n  .attach-button-icon {\n    width: 32px;\n    height: 32px;\n  }\n  .attach-button-icon i {\n    font-size: 0.875rem;\n  }\n}\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n  .message-input-box-container {\n    border-radius: 8px;\n    border-width: 1.5px;\n  }\n  .message-input-box-textarea {\n    min-height: 60px;\n    padding: 0.625rem;\n    padding-right: 2.75rem;\n    font-size: 16px;\n    line-height: 1.3;\n  }\n  .send-button-icon {\n    width: 36px;\n    height: 36px;\n    bottom: 0.5rem;\n    right: 0.5rem;\n    border-radius: 6px;\n  }\n  .send-button-icon i {\n    font-size: 0.875rem;\n  }\n  .attach-buttons {\n    bottom: 0.5rem;\n    right: 2.75rem;\n  }\n  .attach-button-icon {\n    width: 32px;\n    height: 32px;\n  }\n  .attach-button-icon i {\n    font-size: 0.875rem;\n  }\n}\n\n/* Voice call button \u2014 a phone icon in the attach-buttons cluster, left of send.\n   Inherits .attach-button-icon base. Subtle brand glow on hover; active state (call\n   live) renders a brand-color tint. The orb visual now lives ONLY inside the call\n   overlay's banner. */\n.voice-button-icon i {\n  color: var(--mj-brand-primary);\n}\n.voice-button-icon:hover:not(:disabled) i {\n  filter: drop-shadow(0 0 4px color-mix(in srgb, var(--mj-brand-primary) 55%, transparent));\n}\n.voice-button-icon:disabled i {\n  color: var(--mj-text-disabled);\n}\n.voice-button-icon--active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, transparent);\n}\n.voice-button-icon--active:hover:not(:disabled) {\n  background: color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n\n/* Voice OPTIONS caret \u2014 a slim chevron hugging the phone button. Opens the agent/model\n   picker; intentionally quieter (smaller icon, narrower hit area) than the phone so the\n   common instant-start click stays the visual primary. */\n.voice-options-button-icon {\n  width: 20px;\n  margin-left: -4px;\n}\n.voice-options-button-icon i {\n  font-size: 0.7rem;\n  color: var(--mj-text-muted);\n}\n.voice-options-button-icon:hover:not(:disabled) i {\n  color: var(--mj-brand-primary);\n}\n.voice-options-button-icon:disabled i {\n  color: var(--mj-text-disabled);\n}\n"] }]
+    }], null, { mentionEditor: [{
+            type: ViewChild,
+            args: ['mentionEditor']
+        }], placeholder: [{
+            type: Input
+        }], disabled: [{
+            type: Input
+        }], value: [{
+            type: Input
+        }], showCharacterCount: [{
+            type: Input
+        }], enableMentions: [{
+            type: Input
+        }], TriggerProviders: [{
+            type: Input
+        }], ExcludedTriggerKeys: [{
+            type: Input
+        }], Provider: [{
+            type: Input
+        }], currentUser: [{
+            type: Input
+        }], rows: [{
+            type: Input
+        }], enableAttachments: [{
+            type: Input
+        }], maxAttachments: [{
+            type: Input
+        }], maxAttachmentSizeBytes: [{
+            type: Input
+        }], acceptedFileTypes: [{
+            type: Input
+        }], enableRealtime: [{
+            type: Input
+        }], voiceActive: [{
+            type: Input
+        }], canStartRealtime: [{
+            type: Input
+        }], enablePlanMode: [{
+            type: Input
+        }], planModeActive: [{
+            type: Input
+        }], textSubmitted: [{
+            type: Output
+        }], valueChange: [{
+            type: Output
+        }], attachmentsChanged: [{
+            type: Output
+        }], attachmentError: [{
+            type: Output
+        }], attachmentClicked: [{
+            type: Output
+        }], voiceRequested: [{
+            type: Output
+        }], voiceOptionsRequested: [{
+            type: Output
+        }], planModeToggle: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MessageInputBoxComponent, { className: "MessageInputBoxComponent", filePath: "src/lib/components/message/message-input-box.component.ts", lineNumber: 27 }); })();
+//# sourceMappingURL=message-input-box.component.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"message-input-box.component.js","sourceRoot":"","sources":["../../../../src/lib/components/message/message-input-box.component.ts","../../../../src/lib/components/message/message-input-box.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, Output, EventEmitter, ViewChild } from '@angular/core';\nimport { IMetadataProvider, UserInfo } from '@memberjunction/core';\nimport { ComposerTriggerProvider, MentionSuggestion } from '../../composer-trigger-provider';\nimport { MentionEditorComponent, PendingAttachment } from '../mention/mention-editor.component';\n\n/**\n * Reusable message input box component (presentational)\n * Now uses MentionEditorComponent for rich @mention functionality with chips\n *\n * Handles:\n * - Text input with keyboard shortcuts via MentionEditorComponent\n * - @mention autocomplete with visual chips (contentEditable)\n * - Send button\n *\n * Does NOT handle:\n * - Saving messages to database\n * - Agent invocation\n * - Artifact creation\n * - Conversation management\n */\n@Component({\n  standalone: false,\n  selector: 'mj-message-input-box',\n  templateUrl: './message-input-box.component.html',\n  styleUrls: ['./message-input-box.component.css']\n})\nexport class MessageInputBoxComponent {\n  @ViewChild('mentionEditor') mentionEditor?: MentionEditorComponent;\n\n  @Input() placeholder: string = 'Type your message to start a new conversation...';\n  @Input() disabled: boolean = false;\n  @Input() value: string = '';\n  @Input() showCharacterCount: boolean = false;\n  /** Master switch for all mention/command triggers (pass-through to the mention editor). */\n  @Input() enableMentions: boolean = true;\n  /** Explicit trigger-provider list (pass-through to the mention editor; explicit list wins over discovery). */\n  @Input() TriggerProviders: ComposerTriggerProvider[] | null = null;\n  /** Discovery-mode filter: provider Keys to skip (pass-through to the mention editor). */\n  @Input() ExcludedTriggerKeys: string[] = [];\n  /** Optional metadata provider scoping this composer (pass-through to the mention editor). */\n  @Input() Provider: IMetadataProvider | null = null;\n  @Input() currentUser?: UserInfo;\n  @Input() rows: number = 3;\n\n  // Attachment settings\n  @Input() enableAttachments: boolean = true;\n  @Input() maxAttachments: number = 10;\n  @Input() maxAttachmentSizeBytes: number = 20 * 1024 * 1024; // 20MB\n  @Input() acceptedFileTypes: string = 'image/*';\n\n  /** Shows the in-composer mic button when true. */\n  @Input() enableRealtime: boolean = false;\n  /** Whether a realtime voice session is currently active (mic renders in its active state). */\n  @Input() voiceActive: boolean = false;\n  /** Whether a voice session can be started right now (mic disabled when false). */\n  @Input() canStartRealtime: boolean = true;\n  /** Shows the in-composer Plan Mode toggle button when true. */\n  @Input() enablePlanMode: boolean = false;\n  /** Current Plan Mode toggle state (renders the button in its active state). */\n  @Input() planModeActive: boolean = false;\n\n  @Output() textSubmitted = new EventEmitter<string>();\n  @Output() valueChange = new EventEmitter<string>();\n  @Output() attachmentsChanged = new EventEmitter<PendingAttachment[]>();\n  @Output() attachmentError = new EventEmitter<string>();\n  @Output() attachmentClicked = new EventEmitter<PendingAttachment>();\n  /** Emitted when the user clicks the mic button to start/stop a voice session. */\n  @Output() voiceRequested = new EventEmitter<void>();\n  /**\n   * Emitted when the user clicks the small caret next to the phone button — the host opens the\n   * voice agent/model picker so call options (which agent, which voice model) stay reachable\n   * without adding friction to the plain phone click's instant-start path.\n   */\n  @Output() voiceOptionsRequested = new EventEmitter<void>();\n  /** Emitted when the user clicks the in-composer Plan Mode toggle button. */\n  @Output() planModeToggle = new EventEmitter<void>();\n\n  onRealtimeClick(): void {\n    this.voiceRequested.emit();\n  }\n\n  onRealtimeOptionsClick(): void {\n    this.voiceOptionsRequested.emit();\n  }\n\n  get canSend(): boolean {\n    const hasText = this.value.trim().length > 0;\n    const hasAttachments = this.mentionEditor?.hasAttachments() || false;\n    return !this.disabled && (hasText || hasAttachments);\n  }\n\n  /**\n   * Handle value changes from MentionEditorComponent\n   */\n  onValueChange(newValue: string): void {\n    this.value = newValue;\n    this.valueChange.emit(this.value);\n  }\n\n  /**\n   * Handle attachment changes from MentionEditorComponent\n   */\n  onAttachmentsChanged(attachments: PendingAttachment[]): void {\n    this.attachmentsChanged.emit(attachments);\n  }\n\n  /**\n   * Handle attachment errors from MentionEditorComponent\n   */\n  onAttachmentError(error: string): void {\n    this.attachmentError.emit(error);\n  }\n\n  /**\n   * Handle attachment click from MentionEditorComponent\n   */\n  onAttachmentClicked(attachment: PendingAttachment): void {\n    this.attachmentClicked.emit(attachment);\n  }\n\n  /**\n   * Handle Enter key from MentionEditorComponent\n   * Extracts plain text with JSON-encoded mentions for message submission\n   */\n  onEnterPressed(_text: string): void {\n    this.onSendClick();\n  }\n\n  /**\n   * Handle mention selection from MentionEditorComponent\n   */\n  onMentionSelected(suggestion: MentionSuggestion): void {\n    // MentionEditorComponent already inserts the mention chip\n    // This is just for additional tracking/analytics if needed\n  }\n\n  /**\n   * Send the message\n   * Extracts plain text with JSON-encoded mentions for proper persistence\n   */\n  onSendClick(): void {\n    if (this.canSend) {\n      // Get plain text with JSON-encoded mentions (preserves configuration info)\n      const textToSend = this.mentionEditor?.getPlainTextWithJsonMentions() || this.value.trim();\n      this.textSubmitted.emit(textToSend);\n      this.value = ''; // Clear input after sending\n\n      // Clear the editor content\n      if (this.mentionEditor) {\n        this.mentionEditor.clear();\n      }\n\n      this.valueChange.emit(this.value);\n    }\n  }\n\n  /**\n   * Handle clicks on the container - focus the mention editor\n   * Only moves cursor to end if clicking outside the contentEditable area\n   */\n  onContainerClick(event: MouseEvent): void {\n    const target = event.target as HTMLElement;\n\n    // Don't handle clicks on the send button\n    if (target.closest('.send-button-icon')) {\n      return;\n    }\n\n    const editor = this.mentionEditor?.editorRef?.nativeElement;\n    if (!editor) return;\n\n    // If clicking directly on the editor or its children, let the browser handle cursor placement\n    if (target === editor || editor.contains(target)) {\n      return;\n    }\n\n    // Only if clicking on the container (empty space), focus and move cursor to end\n    editor.focus();\n    const selection = window.getSelection();\n    const range = document.createRange();\n\n    if (selection) {\n      range.selectNodeContents(editor);\n      range.collapse(false); // Collapse to end\n      selection.removeAllRanges();\n      selection.addRange(range);\n    }\n  }\n\n  /**\n   * Public method to focus the input programmatically\n   */\n  focus(): void {\n    const editor = this.mentionEditor?.editorRef?.nativeElement;\n    if (editor) {\n      editor.focus();\n    }\n  }\n\n  /**\n   * Get mention chip data including configuration presets\n   */\n  getMentionChipsData(): Array<{ id: string; type: string; name: string; presetId?: string; presetName?: string }> {\n    return this.mentionEditor?.getMentionChipsData() || [];\n  }\n\n  /**\n   * Get pending attachments from the editor\n   */\n  getPendingAttachments(): PendingAttachment[] {\n    return this.mentionEditor?.getPendingAttachments() || [];\n  }\n\n  /**\n   * Open file picker programmatically\n   */\n  openFilePicker(): void {\n    this.mentionEditor?.openFilePicker();\n  }\n\n  /**\n   * Add an artifact as a pending attachment (called by parent after artifact selection)\n   */\n  AddArtifactAttachment(artifact: {\n    fileID: string; fileName: string; mimeType: string;\n    sizeBytes: number; artifactVersionId?: string;\n  }): PendingAttachment | undefined {\n    return this.mentionEditor?.AddArtifactAttachment(artifact);\n  }\n}\n","<div class=\"message-input-box-container\" (click)=\"onContainerClick($event)\">\n  <div class=\"input-wrapper\">\n    <mj-mention-editor\n      #mentionEditor\n      [placeholder]=\"placeholder\"\n      [disabled]=\"disabled\"\n      [currentUser]=\"currentUser\"\n      [enableMentions]=\"enableMentions\"\n      [TriggerProviders]=\"TriggerProviders\"\n      [ExcludedTriggerKeys]=\"ExcludedTriggerKeys\"\n      [Provider]=\"Provider\"\n      [enableAttachments]=\"enableAttachments\"\n      [maxAttachments]=\"maxAttachments\"\n      [maxAttachmentSizeBytes]=\"maxAttachmentSizeBytes\"\n      [acceptedFileTypes]=\"acceptedFileTypes\"\n      [(ngModel)]=\"value\"\n      (valueChange)=\"onValueChange($event)\"\n      (enterPressed)=\"onEnterPressed($event)\"\n      (mentionSelected)=\"onMentionSelected($event)\"\n      (attachmentsChanged)=\"onAttachmentsChanged($event)\"\n      (attachmentError)=\"onAttachmentError($event)\"\n      (attachmentClicked)=\"onAttachmentClicked($event)\">\n    </mj-mention-editor>\n\n    <!-- Attach + voice + plan-mode buttons - Positioned over editor -->\n    @if (enableAttachments || enableRealtime || enablePlanMode) {\n      <div class=\"attach-buttons\">\n        @if (enablePlanMode) {\n        <button\n          class=\"attach-button-icon plan-mode-button-icon\"\n          [class.plan-mode-button-icon--active]=\"planModeActive\"\n          [disabled]=\"disabled\"\n          [attr.aria-pressed]=\"planModeActive\"\n          (click)=\"planModeToggle.emit(); $event.stopPropagation()\"\n          [title]=\"planModeActive ? 'Plan Mode ON — the agent presents a plan for your approval before it acts' : 'Plan Mode: have the agent present a plan for your approval before it acts'\"\n          aria-label=\"Toggle Plan Mode\"\n          >\n          <i class=\"fa-solid fa-route\" aria-hidden=\"true\"></i>\n        </button>\n        }\n        @if (enableAttachments) {\n        <button\n          class=\"attach-button-icon\"\n          [disabled]=\"disabled\"\n          (click)=\"openFilePicker(); $event.stopPropagation()\"\n          title=\"Attach file\"\n          >\n          <i class=\"fa-solid fa-paperclip\"></i>\n        </button>\n        }\n        @if (enableRealtime) {\n        <button\n          class=\"attach-button-icon voice-button-icon\"\n          [class.voice-button-icon--active]=\"voiceActive\"\n          [disabled]=\"!canStartRealtime\"\n          (click)=\"onRealtimeClick(); $event.stopPropagation()\"\n          [title]=\"voiceActive ? 'Voice call active' : 'Start a voice call'\"\n          aria-label=\"Start a voice call\"\n          >\n          <i class=\"fa-solid fa-phone\" aria-hidden=\"true\"></i>\n        </button>\n        <!-- Caret beside the phone: opens the agent/model picker so call OPTIONS stay one\n             click away while the plain phone click keeps its instant-start behavior. -->\n        <button\n          class=\"attach-button-icon voice-options-button-icon\"\n          [disabled]=\"!canStartRealtime\"\n          (click)=\"onRealtimeOptionsClick(); $event.stopPropagation()\"\n          title=\"Voice call options (choose agent and voice model)\"\n          aria-label=\"Voice call options\"\n          >\n          <i class=\"fa-solid fa-chevron-down\" aria-hidden=\"true\"></i>\n        </button>\n        }\n      </div>\n    }\n\n    <!-- Send Button (Icon Only) - Positioned over editor -->\n    <button\n      class=\"send-button-icon\"\n      [disabled]=\"!canSend\"\n      (click)=\"onSendClick()\"\n      title=\"Send message (Enter)\"\n      >\n      <i class=\"fa-solid fa-paper-plane\"></i>\n    </button>\n  </div>\n</div>\n"]}

package/dist/lib/composer-trigger-provider.d.ts

@@ -0,0 +1,123 @@
+import { IMetadataProvider, UserInfo } from '@memberjunction/core';
+/**
+ * A configuration preset attached to a mention suggestion (e.g. an agent's
+ * Fast / Standard / High Power presets). When a suggestion carries 2+ presets the
+ * mention editor renders a preset picker on the inserted chip; the selected preset's
+ * ID/Name travel with the chip (`data-preset-id` / `data-preset-name`) and survive
+ * serialization via `getPlainTextWithJsonMentions()`.
+ *
+ * This is a deliberately generic shape — the composer has no knowledge of what a
+ * preset IS. Trigger providers map their domain objects (e.g. `MJ: AI Agent
+ * Configurations` rows) into this shape when building suggestions.
+ */
+export interface MentionSuggestionPreset {
+    /** Stable identifier stored on the chip (`data-preset-id`). */
+    ID: string;
+    /** Machine name stored on the chip (`data-preset-name`). */
+    Name: string;
+    /** Friendly label shown in the preset picker (falls back to Name). */
+    DisplayName?: string;
+    /** Optional descriptive text shown under the preset label. */
+    Description?: string;
+    /** The preset preselected on chip insert. First preset wins when none is flagged. */
+    IsDefault?: boolean;
+}
+/**
+ * Item in the mention-autocomplete dropdown, and the payload carried by an inserted
+ * mention chip. Fully generic — `type` is an open string (providers choose their own
+ * vocabulary, e.g. 'agent' | 'user' | 'entity' | 'query' | 'skill'); the editor and
+ * dropdown only use it for cosmetic styling (chip palette, badge label) and for the
+ * plain-text serialization prefix.
+ */
+export interface MentionSuggestion {
+    /** Open string discriminator chosen by the provider (drives chip/badge styling). */
+    type: string;
+    id: string;
+    name: string;
+    displayName: string;
+    description?: string;
+    /** Image rendered in the dropdown row + chip when present (e.g. an agent LogoURL). */
+    imageUrl?: string;
+    /** Font Awesome (or custom) icon class for the dropdown row + chip. */
+    icon?: string;
+    /** Accent color for the chip/badge (e.g. a skill's own Color UX metadata). */
+    color?: string;
+    /** Optional presets — 2+ presets render a preset picker on the inserted chip. */
+    presets?: MentionSuggestionPreset[];
+    /** Provider-defined extra payload; the composer never inspects it. */
+    data?: Record<string, unknown>;
+}
+/**
+ * Request passed to {@link ComposerTriggerProvider.GetSuggestions} each time the user
+ * types after an active trigger character.
+ */
+export interface ComposerSuggestionRequest {
+    /** The text typed after the trigger character (may be empty — show the full list). */
+    Query: string;
+    /** Maximum number of suggestions the editor will display; providers should honor it. */
+    MaxResults: number;
+    /** The current user, when the host supplied one. Providers should fail closed (return []) if they require a user and none is present. */
+    ContextUser: UserInfo | null;
+    /** The metadata provider scoping this editor instance, when the host supplied one (multi-provider support). */
+    Provider: IMetadataProvider | null;
+}
+/**
+ * Pluggable mention/command trigger for the composer's mention editor.
+ *
+ * Each provider owns ONE trigger character (e.g. '@', '#', '/') and supplies the
+ * suggestions shown while the user types after it. The composer itself ships with
+ * ZERO providers — it is a plain text editor until providers are supplied, either:
+ *
+ * 1. **Explicitly** — bind `[TriggerProviders]` on `mj-mention-editor` /
+ *    `mj-message-input-box` with provider instances (explicit list always wins), or
+ * 2. **By discovery** — register subclasses with the MJ ClassFactory via
+ *    `@RegisterClass(ComposerTriggerProvider, '<Key>')`; the editor resolves them
+ *    through {@link DiscoverComposerTriggerProviders} when no explicit list is bound.
+ *    Hosts opt individual triggers out with `[ExcludedTriggerKeys]`.
+ *
+ * The AI-aware providers (agent mentions, entity/query record mentions, skill
+ * commands) live in `@memberjunction/ng-conversations` — see its `composer-plugins`
+ * folder and the `mj-ai-composer` wrapper component.
+ */
+export declare abstract class ComposerTriggerProvider {
+    /** The single character that opens this provider's autocomplete (e.g. '@'). */
+    abstract readonly TriggerChar: string;
+    /**
+     * Stable identifier for this provider (e.g. 'agent-mentions'). Used as the
+     * ClassFactory registration key and by `ExcludedTriggerKeys` filtering.
+     */
+    abstract readonly Key: string;
+    /**
+     * Ordering weight — higher runs first. When multiple providers share a
+     * TriggerChar, results are concatenated in priority order (then Key order).
+     */
+    readonly Priority: number;
+    /**
+     * Returns the suggestions for the current query. Called on every keystroke after
+     * an active trigger; implementations should be fast (serve from warm caches) and
+     * must never throw — return [] on failure.
+     */
+    abstract GetSuggestions(request: ComposerSuggestionRequest): Promise<MentionSuggestion[]>;
+    /**
+     * Optional warm-up hook, invoked once by the editor when it initializes with this
+     * provider active. Default is a no-op; override to pre-load caches so the first
+     * keystroke is fast. Must be safe to call repeatedly and concurrently.
+     */
+    Initialize(contextUser: UserInfo | null): Promise<void>;
+}
+/**
+ * Resolves every `@RegisterClass(ComposerTriggerProvider, ...)` registration in the
+ * MJ ClassFactory into a provider instance list.
+ *
+ * - Instantiates each winning registration once (module-level cache keyed by the
+ *   registered subclass) — repeated calls are cheap.
+ * - When multiple registrations share a Key, the ClassFactory's highest-priority
+ *   registration wins (standard override-by-import-order semantics).
+ * - `excludedKeys` filters providers out by their stable Key (case-insensitive).
+ * - Returns [] gracefully when nothing is registered — the editor then behaves as a
+ *   plain text editor.
+ *
+ * Results are sorted by provider `Priority` (desc), then `Key` (asc) for stability.
+ */
+export declare function DiscoverComposerTriggerProviders(excludedKeys?: string[]): ComposerTriggerProvider[];
+//# sourceMappingURL=composer-trigger-provider.d.ts.map

package/dist/lib/composer-trigger-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"composer-trigger-provider.d.ts","sourceRoot":"","sources":["../../src/lib/composer-trigger-provider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAGnE;;;;;;;;;;GAUG;AACH,MAAM,WAAW,uBAAuB;IACtC,+DAA+D;IAC/D,EAAE,EAAE,MAAM,CAAC;IACX,4DAA4D;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,sEAAsE;IACtE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qFAAqF;IACrF,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;GAMG;AACH,MAAM,WAAW,iBAAiB;IAChC,oFAAoF;IACpF,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sFAAsF;IACtF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uEAAuE;IACvE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iFAAiF;IACjF,OAAO,CAAC,EAAE,uBAAuB,EAAE,CAAC;IACpC,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAChC;AAED;;;GAGG;AACH,MAAM,WAAW,yBAAyB;IACxC,sFAAsF;IACtF,KAAK,EAAE,MAAM,CAAC;IACd,wFAAwF;IACxF,UAAU,EAAE,MAAM,CAAC;IACnB,yIAAyI;IACzI,WAAW,EAAE,QAAQ,GAAG,IAAI,CAAC;IAC7B,+GAA+G;IAC/G,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAAC;CACpC;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,8BAAsB,uBAAuB;IAC3C,+EAA+E;IAC/E,kBAAyB,WAAW,EAAE,MAAM,CAAC;IAE7C;;;OAGG;IACH,kBAAyB,GAAG,EAAE,MAAM,CAAC;IAErC;;;OAGG;IACH,SAAgB,QAAQ,EAAE,MAAM,CAAK;IAErC;;;;OAIG;aACa,cAAc,CAAC,OAAO,EAAE,yBAAyB,GAAG,OAAO,CAAC,iBAAiB,EAAE,CAAC;IAEhG;;;;OAIG;IACU,UAAU,CAAC,WAAW,EAAE,QAAQ,GAAG,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;CAIrE;AASD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gCAAgC,CAAC,YAAY,CAAC,EAAE,MAAM,EAAE,GAAG,uBAAuB,EAAE,CAsCnG"}

package/dist/lib/composer-trigger-provider.js

@@ -0,0 +1,91 @@
+import { MJGlobal } from '@memberjunction/global';
+/**
+ * Pluggable mention/command trigger for the composer's mention editor.
+ *
+ * Each provider owns ONE trigger character (e.g. '@', '#', '/') and supplies the
+ * suggestions shown while the user types after it. The composer itself ships with
+ * ZERO providers — it is a plain text editor until providers are supplied, either:
+ *
+ * 1. **Explicitly** — bind `[TriggerProviders]` on `mj-mention-editor` /
+ *    `mj-message-input-box` with provider instances (explicit list always wins), or
+ * 2. **By discovery** — register subclasses with the MJ ClassFactory via
+ *    `@RegisterClass(ComposerTriggerProvider, '<Key>')`; the editor resolves them
+ *    through {@link DiscoverComposerTriggerProviders} when no explicit list is bound.
+ *    Hosts opt individual triggers out with `[ExcludedTriggerKeys]`.
+ *
+ * The AI-aware providers (agent mentions, entity/query record mentions, skill
+ * commands) live in `@memberjunction/ng-conversations` — see its `composer-plugins`
+ * folder and the `mj-ai-composer` wrapper component.
+ */
+export class ComposerTriggerProvider {
+    /**
+     * Ordering weight — higher runs first. When multiple providers share a
+     * TriggerChar, results are concatenated in priority order (then Key order).
+     */
+    Priority = 0;
+    /**
+     * Optional warm-up hook, invoked once by the editor when it initializes with this
+     * provider active. Default is a no-op; override to pre-load caches so the first
+     * keystroke is fast. Must be safe to call repeatedly and concurrently.
+     */
+    async Initialize(contextUser) {
+        // default no-op — providers override to warm caches
+        void contextUser;
+    }
+}
+/**
+ * One instance per registered provider subclass, shared across all editors in the
+ * process — providers are expected to be stateless facades over shared engines, so a
+ * single instance avoids duplicate cache warm-ups.
+ */
+const discoveredProviderInstances = new Map();
+/**
+ * Resolves every `@RegisterClass(ComposerTriggerProvider, ...)` registration in the
+ * MJ ClassFactory into a provider instance list.
+ *
+ * - Instantiates each winning registration once (module-level cache keyed by the
+ *   registered subclass) — repeated calls are cheap.
+ * - When multiple registrations share a Key, the ClassFactory's highest-priority
+ *   registration wins (standard override-by-import-order semantics).
+ * - `excludedKeys` filters providers out by their stable Key (case-insensitive).
+ * - Returns [] gracefully when nothing is registered — the editor then behaves as a
+ *   plain text editor.
+ *
+ * Results are sorted by provider `Priority` (desc), then `Key` (asc) for stability.
+ */
+export function DiscoverComposerTriggerProviders(excludedKeys) {
+    const factory = MJGlobal.Instance.ClassFactory;
+    const registrations = factory.GetAllRegistrations(ComposerTriggerProvider);
+    if (!registrations || registrations.length === 0) {
+        return [];
+    }
+    const excluded = new Set((excludedKeys ?? []).map((k) => k.trim().toLowerCase()));
+    const seenKeys = new Set();
+    const providers = [];
+    for (const registration of registrations) {
+        const normalizedKey = registration.Key?.trim().toLowerCase();
+        if (!normalizedKey || seenKeys.has(normalizedKey) || excluded.has(normalizedKey)) {
+            continue;
+        }
+        seenKeys.add(normalizedKey);
+        // Resolve the WINNING registration for this key (there may be multiple when a
+        // consumer overrides a provider) — mirrors GetRegistration's priority semantics.
+        const winner = factory.GetRegistration(ComposerTriggerProvider, registration.Key);
+        if (!winner?.SubClass) {
+            continue;
+        }
+        let instance = discoveredProviderInstances.get(winner.SubClass);
+        if (!instance) {
+            const ProviderConstructor = winner.SubClass;
+            instance = new ProviderConstructor();
+            discoveredProviderInstances.set(winner.SubClass, instance);
+        }
+        providers.push(instance);
+    }
+    return providers.sort((a, b) => {
+        if (b.Priority !== a.Priority)
+            return b.Priority - a.Priority;
+        return a.Key.localeCompare(b.Key);
+    });
+}
+//# sourceMappingURL=composer-trigger-provider.js.map