@c8y/ngx-components 1024.15.13 → 1024.16.10

package/fesm2022/c8y-ngx-components-ai-agent-chat.mjs

@@ -1,16 +1,19 @@
 import { NgComponentOutlet, AsyncPipe } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Injectable, inject, input, computed, output, signal, viewChildren, ChangeDetectionStrategy, Component, Injector, Input } from '@angular/core';
-import { GainsightService, DatePipe, ModalService, AlertService, C8Y_PLUGIN_CONTEXT_PATH, AppStateService, Status, LoadingComponent, EmptyStateComponent, C8yTranslateDirective, GuideDocsComponent, GuideHrefDirective, MarkdownToHtmlPipe, C8yTranslatePipe, NumberPipe, ContextRouteService } from '@c8y/ngx-components';
+import { Injectable, inject, input, output, ChangeDetectionStrategy, Component, contentChildren, computed, signal, viewChildren, viewChild, Injector, Input } from '@angular/core';
+import { GainsightService, IconDirective, C8yTranslatePipe, DatePipe, ModalService, UserPreferencesService, AlertService, C8Y_PLUGIN_CONTEXT_PATH, AppStateService, Status, LoadingComponent, EmptyStateComponent, C8yTranslateDirective, GuideDocsComponent, GuideHrefDirective, MarkdownToHtmlPipe, NumberPipe, ContextRouteService } from '@c8y/ngx-components';
 import { TranslateService } from '@ngx-translate/core';
-import { AIService, defaultPruneMessagesForAgent } from '@c8y/ngx-components/ai';
+import { AIService, AiToolApprovalMemoryService, defaultPruneMessagesForAgent } from '@c8y/ngx-components/ai';
 import { gettext } from '@c8y/ngx-components/gettext';
-import { AiChatAssistantMessageComponent, AiChatComponent, AiChatSuggestionComponent, AiChatMessageComponent, AiChatMessageActionComponent } from '@c8y/ngx-components/ai/ai-chat';
+import { firstValueFrom, of, isObservable } from 'rxjs';
+import { AiChatActionComponent, AiChatAssistantMessageComponent, AiChatComponent, AiChatSuggestionComponent, AiChatMessageComponent, AiChatMessageActionComponent } from '@c8y/ngx-components/ai/ai-chat';
 import { CollapseModule } from 'ngx-bootstrap/collapse';
-import * as i1 from 'ngx-bootstrap/tooltip';
+import * as i1$1 from 'ngx-bootstrap/tooltip';
 import { TooltipModule } from 'ngx-bootstrap/tooltip';
+import { CdkTrapFocus } from '@angular/cdk/a11y';
+import * as i1 from 'ngx-bootstrap/dropdown';
+import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
 import { WidgetConfigService, WidgetConfigFeedbackComponent } from '@c8y/ngx-components/context-dashboard';
-import { of, isObservable } from 'rxjs';
 
 /** A stateless service used by agent-chat for managing chat history. Not public. */
 class ChatHistoryService {
@@ -328,7 +331,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                 }]
         }] });
 
+/**
+ * Dropdown that lets the user switch between manual and automatic tool approval for the agent chat.
+ * Extracted from `c8y-agent-chat` to keep that component small; place it inside a
+ * `c8y-ai-chat-action` so it renders in the chat action bar.
+ */
+class AgentChatToolApprovalModeComponent {
+    constructor() {
+        /** Whether the global "approve all tools" (Auto) mode is currently active. */
+        this.globalToolApproval = input.required(...(ngDevMode ? [{ debugName: "globalToolApproval" }] : /* istanbul ignore next */ []));
+        /** Emits the requested mode when the user picks one: `true` for Auto, `false` for Manual. */
+        this.modeChange = output();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: AgentChatToolApprovalModeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.19", type: AgentChatToolApprovalModeComponent, isStandalone: true, selector: "c8y-agent-chat-tool-approval-mode", inputs: { globalToolApproval: { classPropertyName: "globalToolApproval", publicName: "globalToolApproval", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { modeChange: "modeChange" }, host: { classAttribute: "d-contents" }, ngImport: i0, template: "@let autoLabel = 'Auto' | translate;\n@let manualLabel = 'Manual' | translate;\n<!-- Escape must close only the menu; unstopped it also closes the drawer hosting the chat. -->\n<div\n  class=\"dropdown\"\n  dropdown\n  [dropup]=\"true\"\n  #toolApprovalDropdown=\"bs-dropdown\"\n  [cdkTrapFocus]=\"toolApprovalDropdown.isOpen\"\n  (onHidden)=\"toolApprovalToggle.focus()\"\n  (keyup.escape)=\"toolApprovalDropdown.isOpen && $event.stopPropagation()\"\n  (keydown.escape)=\"toolApprovalDropdown.isOpen && $event.stopPropagation()\"\n>\n  <button\n    class=\"dropdown-toggle btn btn-clean btn-sm d-flex a-i-center gap-4\"\n    [title]=\"'Tool approval mode' | translate\"\n    [attr.aria-expanded]=\"toolApprovalDropdown.isOpen\"\n    type=\"button\"\n    data-cy=\"chat-tool-approval-mode\"\n    dropdownToggle\n    #toolApprovalToggle\n  >\n    <i\n      [c8yIcon]=\"globalToolApproval() ? 'bolt' : 'hand-paper-o'\"\n      aria-hidden=\"true\"\n    ></i>\n    <span>{{ globalToolApproval() ? autoLabel : manualLabel }}</span>\n    <i\n      c8yIcon=\"caret-down\"\n      aria-hidden=\"true\"\n    ></i>\n  </button>\n  <ul\n    class=\"dropdown-menu\"\n    [attr.aria-label]=\"'Tool approval mode' | translate\"\n    role=\"menu\"\n    *dropdownMenu\n  >\n    <li\n      [class.active]=\"!globalToolApproval()\"\n      role=\"none\"\n    >\n      <button\n        class=\"a-i-start\"\n        [attr.aria-checked]=\"!globalToolApproval()\"\n        role=\"menuitemradio\"\n        type=\"button\"\n        (click)=\"modeChange.emit(false)\"\n        data-cy=\"chat-tool-approval-manual\"\n      >\n        <i\n          [class.invisible]=\"globalToolApproval()\"\n          class=\"icon-16 text-primary\"\n          [c8yIcon]=\"'check'\"\n          aria-hidden=\"true\"\n        ></i>\n        <i\n          class=\"icon-16\"\n          [c8yIcon]=\"'hand-paper-o'\"\n          aria-hidden=\"true\"\n        ></i>\n        <span>\n          {{ manualLabel }}\n          <small class=\"d-block text-muted\">\n            {{ 'Ask before running each tool' | translate }}\n          </small>\n        </span>\n      </button>\n    </li>\n    <li\n      [class.active]=\"globalToolApproval()\"\n      role=\"none\"\n    >\n      <button\n        class=\"a-i-start\"\n        [attr.aria-checked]=\"globalToolApproval()\"\n        role=\"menuitemradio\"\n        type=\"button\"\n        (click)=\"modeChange.emit(true)\"\n        data-cy=\"chat-tool-approval-auto\"\n      >\n        <i\n          class=\"text-primary icon-16\"\n          [class.invisible]=\"!globalToolApproval()\"\n          [c8yIcon]=\"'check'\"\n          aria-hidden=\"true\"\n        ></i>\n        <i\n          class=\"icon-16\"\n          [c8yIcon]=\"'bolt'\"\n          aria-hidden=\"true\"\n        ></i>\n        <span>\n          {{ autoLabel }}\n          <small class=\"d-block text-muted\">\n            {{ 'Run tools without asking' | translate }}\n          </small>\n        </span>\n      </button>\n    </li>\n  </ul>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: BsDropdownModule }, { kind: "directive", type: i1.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i1.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i1.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: AgentChatToolApprovalModeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'c8y-agent-chat-tool-approval-mode', changeDetection: ChangeDetectionStrategy.OnPush, imports: [C8yTranslatePipe, IconDirective, BsDropdownModule, CdkTrapFocus], host: { class: 'd-contents' }, template: "@let autoLabel = 'Auto' | translate;\n@let manualLabel = 'Manual' | translate;\n<!-- Escape must close only the menu; unstopped it also closes the drawer hosting the chat. -->\n<div\n  class=\"dropdown\"\n  dropdown\n  [dropup]=\"true\"\n  #toolApprovalDropdown=\"bs-dropdown\"\n  [cdkTrapFocus]=\"toolApprovalDropdown.isOpen\"\n  (onHidden)=\"toolApprovalToggle.focus()\"\n  (keyup.escape)=\"toolApprovalDropdown.isOpen && $event.stopPropagation()\"\n  (keydown.escape)=\"toolApprovalDropdown.isOpen && $event.stopPropagation()\"\n>\n  <button\n    class=\"dropdown-toggle btn btn-clean btn-sm d-flex a-i-center gap-4\"\n    [title]=\"'Tool approval mode' | translate\"\n    [attr.aria-expanded]=\"toolApprovalDropdown.isOpen\"\n    type=\"button\"\n    data-cy=\"chat-tool-approval-mode\"\n    dropdownToggle\n    #toolApprovalToggle\n  >\n    <i\n      [c8yIcon]=\"globalToolApproval() ? 'bolt' : 'hand-paper-o'\"\n      aria-hidden=\"true\"\n    ></i>\n    <span>{{ globalToolApproval() ? autoLabel : manualLabel }}</span>\n    <i\n      c8yIcon=\"caret-down\"\n      aria-hidden=\"true\"\n    ></i>\n  </button>\n  <ul\n    class=\"dropdown-menu\"\n    [attr.aria-label]=\"'Tool approval mode' | translate\"\n    role=\"menu\"\n    *dropdownMenu\n  >\n    <li\n      [class.active]=\"!globalToolApproval()\"\n      role=\"none\"\n    >\n      <button\n        class=\"a-i-start\"\n        [attr.aria-checked]=\"!globalToolApproval()\"\n        role=\"menuitemradio\"\n        type=\"button\"\n        (click)=\"modeChange.emit(false)\"\n        data-cy=\"chat-tool-approval-manual\"\n      >\n        <i\n          [class.invisible]=\"globalToolApproval()\"\n          class=\"icon-16 text-primary\"\n          [c8yIcon]=\"'check'\"\n          aria-hidden=\"true\"\n        ></i>\n        <i\n          class=\"icon-16\"\n          [c8yIcon]=\"'hand-paper-o'\"\n          aria-hidden=\"true\"\n        ></i>\n        <span>\n          {{ manualLabel }}\n          <small class=\"d-block text-muted\">\n            {{ 'Ask before running each tool' | translate }}\n          </small>\n        </span>\n      </button>\n    </li>\n    <li\n      [class.active]=\"globalToolApproval()\"\n      role=\"none\"\n    >\n      <button\n        class=\"a-i-start\"\n        [attr.aria-checked]=\"globalToolApproval()\"\n        role=\"menuitemradio\"\n        type=\"button\"\n        (click)=\"modeChange.emit(true)\"\n        data-cy=\"chat-tool-approval-auto\"\n      >\n        <i\n          class=\"text-primary icon-16\"\n          [class.invisible]=\"!globalToolApproval()\"\n          [c8yIcon]=\"'check'\"\n          aria-hidden=\"true\"\n        ></i>\n        <i\n          class=\"icon-16\"\n          [c8yIcon]=\"'bolt'\"\n          aria-hidden=\"true\"\n        ></i>\n        <span>\n          {{ autoLabel }}\n          <small class=\"d-block text-muted\">\n            {{ 'Run tools without asking' | translate }}\n          </small>\n        </span>\n      </button>\n    </li>\n  </ul>\n</div>\n" }]
+        }], propDecorators: { globalToolApproval: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalToolApproval", required: true }] }], modeChange: [{ type: i0.Output, args: ["modeChange"] }] } });
+
+/** User preference key for the global "approve all tools" option. */
+const GLOBAL_TOOL_APPROVAL_PREFERENCE_KEY = 'ai-approve-all-tools';
 class AgentChatComponent {
+    get agentName() {
+        const value = this.agent();
+        return typeof value === 'string' ? value : value.definition.name;
+    }
+    get agentDefinition() {
+        const value = this.agent();
+        if (!value || typeof value === 'string')
+            return undefined;
+        return value;
+    }
+    /** Is an AI agent request currently in progress. This can be used to disable UI elements while a reply (which might change the state) is being loaded. */
+    get isLoadingAiResponse() {
+        return this._isLoading.asReadonly();
+    }
+    /** Returns the most recent agent health check status such as `ready`, or an error. */
+    get agentHealthStatus() {
+        return this._agentHealth()?.status || 'loading';
+    }
+    get currentContextPath() {
+        return this.pluginContextPath || this.appState.currentApplication?.value?.contextPath || '';
+    }
     constructor() {
         this.translateService = inject(TranslateService);
         this.datePipe = inject(DatePipe);
@@ -359,6 +405,12 @@ class AgentChatComponent {
         this.chatConfig = input(...(ngDevMode ? [undefined, { debugName: "chatConfig" }] : /* istanbul ignore next */ []));
         /** Template for customizing the welcome view using `ng-template`. */
         this.welcomeTemplate = input(...(ngDevMode ? [undefined, { debugName: "welcomeTemplate" }] : /* istanbul ignore next */ []));
+        /**
+         * Action-bar components projected by consumers into the action bar beneath the input box (as
+         * opposed to the per-message `c8y-ai-chat-message-action`s). They are forwarded to the inner
+         * `c8y-ai-chat` since content queries do not reach the wrapped component.
+         */
+        this.chatActions = contentChildren(AiChatActionComponent, ...(ngDevMode ? [{ debugName: "chatActions" }] : /* istanbul ignore next */ []));
         /** Indicates whether the component has zero messages and is showing the welcome page. */
         this.isWelcoming = computed(() => this.messages().length === 0, ...(ngDevMode ? [{ debugName: "isWelcoming" }] : /* istanbul ignore next */ []));
         /** Configures whether this component should automatically create the provided `agent: ClientAgentDefinition`
@@ -504,47 +556,46 @@ class AgentChatComponent {
                 message: lastMsg,
                 config: config,
                 isMessageLoading: isLoadingAiResponse,
-                messageDisplayIndex: 0
+                messageDisplayIndex: 0,
+                onToolApprovalResponse: this.respondToToolApproval,
+                canRememberToolApproval: this.canRememberToolApproval
             };
         }, ...(ngDevMode ? [{ debugName: "lastAssistantMessageContext" }] : /* istanbul ignore next */ []));
         /** If the create agent button should be shown to the user. */
         this.canCreate = false;
         this.prompt = '';
         this.aiService = inject(AIService);
+        this.toolApprovalMemory = inject(AiToolApprovalMemoryService);
+        this.userPreferences = inject(UserPreferencesService);
+        /**
+         * Identifies this conversation in the tool approval memory. Remembered approvals ("always
+         * approve this tool" and the session-wide "always approve all tools") are scoped to it, so
+         * they end with the conversation: a new component instance or a message reset starts a new
+         * session that prompts again.
+         */
+        this._chatSessionId = this.toolApprovalMemory.newSessionId();
+        /**
+         * The global "approve all tools" option, persisted as a user preference across all chats and
+         * page loads. Tools configured with `needsApproval` still prompt on every call.
+         */
+        this.globalToolApproval = signal(false, ...(ngDevMode ? [{ debugName: "globalToolApproval" }] : /* istanbul ignore next */ []));
         this.userAnalyticsService = inject(UserAnalyticsService);
         this.alertService = inject(AlertService);
         this.chatHistoryService = inject(ChatHistoryService);
         this.pluginContextPath = inject(C8Y_PLUGIN_CONTEXT_PATH, { optional: true });
         this.appState = inject(AppStateService);
         this.assistantMessageComponents = viewChildren(AiChatAssistantMessageComponent, ...(ngDevMode ? [{ debugName: "assistantMessageComponents" }] : /* istanbul ignore next */ []));
+        this.chat = viewChild(AiChatComponent, ...(ngDevMode ? [{ debugName: "chat" }] : /* istanbul ignore next */ []));
         /**
          * Stores client-supplied tool outputs to override tool results for a given toolCallId in the current assistant message.
          * Cleared at the start of each new message.
          */
         this._clientToolOutputs = {};
-    }
-    get agentName() {
-        const value = this.agent();
-        return typeof value === 'string' ? value : value.definition.name;
-    }
-    get agentDefinition() {
-        const value = this.agent();
-        if (!value || typeof value === 'string')
-            return undefined;
-        return value;
-    }
-    /** Is an AI agent request currently in progress. This can be used to disable UI elements while a reply (which might change the state) is being loaded. */
-    get isLoadingAiResponse() {
-        return this._isLoading.asReadonly();
-    }
-    /** Returns the most recent agent health check status such as `ready`, or an error. */
-    get agentHealthStatus() {
-        return this._agentHealth()?.status || 'loading';
-    }
-    get currentContextPath() {
-        return this.pluginContextPath || this.appState.currentApplication?.value?.contextPath || '';
+        this.respondToToolApproval = (part, decision) => this._respondToToolApproval(part, decision);
+        this.canRememberToolApproval = part => !this._requiresExplicitApproval(part.toolName);
     }
     async ngOnInit() {
+        void this._loadGlobalToolApproval();
         await this.initializeChat();
     }
     async ngOnChanges(changes) {
@@ -580,38 +631,11 @@ class AgentChatComponent {
         }
         this.messages.set([...this.messages(), message]);
         this.onMessagesChange.emit(this.messages());
-        this._isLoading.set(true);
-        this.agentRequestError.set(undefined); // Clear any previous stream errors
-        this.abortController = new AbortController();
-        this._clientToolOutputs = {};
-        // Prepare messages for AI service, optionally including grounding message
-        const pruneMessagesForAgent = this.pruneMessagesForAgent() || defaultPruneMessagesForAgent;
-        const messagesForAI = pruneMessagesForAgent(this.messages());
-        const groundingProvider = this.groundingContextProvider();
-        if (groundingProvider) {
-            // Insert grounding message before the last user message
-            const groundingMsg = {
-                role: 'user',
-                content: groundingProvider()
-            };
-            messagesForAI.splice(messagesForAI.length - 1, 0, groundingMsg);
-        }
-        const currentAssistantMessage = {
-            role: 'assistant',
-            content: []
-        };
-        this.messages.set([...this.messages(), currentAssistantMessage]);
-        // Branch based on agent type: object agents use a single non-streaming request,
-        // text agents use SSE streaming
-        if (this.agentDefinition?.definition.type === 'object') {
-            await this._sendObjectMessage(currentAssistantMessage, messagesForAI);
-        }
-        else {
-            await this._sendStreamMessage(messagesForAI);
-        }
+        await this._dispatchToAgent(true);
     }
     ngOnDestroy() {
         this.cancel();
+        this.toolApprovalMemory.endSession(this._chatSessionId);
     }
     async reprompt(userMessage) {
         const index = this.messages().indexOf(userMessage);
@@ -627,6 +651,8 @@ class AgentChatComponent {
                 this.messages.set(this.messages().slice(0, index));
                 this.onMessagesChange.emit(this.messages());
                 this.prompt = userMessage.content;
+                // The prompt moved to the input, so follow it there.
+                this.chat()?.focusInput();
             }
             catch (e) {
                 if (!e)
@@ -653,6 +679,8 @@ class AgentChatComponent {
         if (index > -1) {
             this.messages.set(this.messages().slice(0, index - 1));
             this.onMessagesChange.emit(this.messages());
+            // The focused action button goes away with the message.
+            this.chat()?.focusInput();
             this.sendMessage({
                 role: 'user',
                 content: userMessage.content,
@@ -680,9 +708,11 @@ class AgentChatComponent {
             }
         }
     }
-    /** Clears all messages and cancels any in-flight stream. */
+    /** Clears all messages and cancels any in-flight stream. Remembered tool approvals end with the conversation. */
     resetMessages() {
         this.cancel();
+        this.toolApprovalMemory.endSession(this._chatSessionId);
+        this._chatSessionId = this.toolApprovalMemory.newSessionId();
         this.messages.set([]);
         this.onMessagesChange.emit(this.messages());
     }
@@ -705,6 +735,8 @@ class AgentChatComponent {
         // Remove from the last user message onwards
         this.messages.set(msgs.slice(0, lastUserIndex));
         this.onMessagesChange.emit(this.messages());
+        // The focused action button goes away with the message.
+        this.chat()?.focusInput();
     }
     /**
      * Overrides the output of a specific tool result (in the current assistant message), including optionally indicating that an error occurred.
@@ -737,6 +769,207 @@ class AgentChatComponent {
         this._isLoading.set(false);
     }
     // Private methods go here:
+    /**
+     * Sends the current conversation to the agent and streams the next assistant message.
+     * @param includeGrounding Whether to inject the grounding context message before the last
+     * user message. Only applies when the conversation ends with a new user message.
+     */
+    async _dispatchToAgent(includeGrounding) {
+        this._isLoading.set(true);
+        this.agentRequestError.set(undefined); // Clear any previous stream errors
+        this.abortController = new AbortController();
+        this._clientToolOutputs = {};
+        // Prepare messages for AI service, optionally including grounding message
+        const pruneMessagesForAgent = this.pruneMessagesForAgent() || defaultPruneMessagesForAgent;
+        const messagesForAI = pruneMessagesForAgent(this.messages());
+        const groundingProvider = this.groundingContextProvider();
+        if (includeGrounding && groundingProvider) {
+            // Insert grounding message before the last user message
+            const groundingMsg = {
+                role: 'user',
+                content: groundingProvider()
+            };
+            messagesForAI.splice(messagesForAI.length - 1, 0, groundingMsg);
+        }
+        const currentAssistantMessage = {
+            role: 'assistant',
+            content: []
+        };
+        this.messages.set([...this.messages(), currentAssistantMessage]);
+        // Branch based on agent type: object agents use a single non-streaming request,
+        // text agents use SSE streaming
+        if (this.agentDefinition?.definition.type === 'object') {
+            await this._sendObjectMessage(currentAssistantMessage, messagesForAI);
+        }
+        else {
+            await this._sendStreamMessage(messagesForAI);
+        }
+    }
+    /**
+     * Records the user's decision for a tool call awaiting approval. If the user chose to remember
+     * the decision, it is persisted so future calls are approved without prompting. The conversation
+     * only resumes once every approval request in the message has a decision, since the agent
+     * rejects a resumed conversation with unanswered approval requests.
+     */
+    async _respondToToolApproval(part, decision) {
+        if (this.isLoadingAiResponse())
+            return;
+        if (decision.approved && decision.remember) {
+            if (decision.remember === 'all') {
+                this.toolApprovalMemory.rememberAllTools(this._chatSessionId);
+            }
+            else {
+                this.toolApprovalMemory.rememberTool(this._chatSessionId, part.toolName);
+            }
+        }
+        const recorded = this._recordApprovalDecisions(p => p.toolCallId === part.toolCallId ? decision.approved : undefined);
+        if (!recorded)
+            return;
+        // A newly remembered preference may also cover other approvals still pending in this message
+        this._autoApproveRememberedTools();
+        await this._resumeIfAllApprovalsDecided();
+    }
+    /**
+     * Maps the pending `tool-approval-requested` parts of the last assistant message through
+     * `decide`, converting each part that receives a decision into `tool-approval-responded`.
+     * New part/message instances are created so change detection picks the update up.
+     * @returns Whether at least one decision was recorded.
+     */
+    _recordApprovalDecisions(decide) {
+        const msgs = this.messages();
+        const lastMsg = msgs[msgs.length - 1];
+        if (lastMsg?.role !== 'assistant')
+            return false;
+        let recorded = false;
+        const newContent = lastMsg.content.map(p => {
+            if (p.type !== 'tool-approval-requested')
+                return p;
+            const approved = decide(p);
+            if (approved === undefined)
+                return p;
+            recorded = true;
+            return {
+                ...p,
+                type: 'tool-approval-responded',
+                approval: { ...p.approval, approvalId: p.approval?.approvalId ?? '', approved }
+            };
+        });
+        if (!recorded)
+            return false;
+        this.messages.set([...msgs.slice(0, -1), { ...lastMsg, content: newContent }]);
+        this.onMessagesChange.emit(this.messages());
+        return true;
+    }
+    /**
+     * Approves the pending approval requests for tools the user chose to approve automatically:
+     * tools remembered individually for this conversation, every tool when the session-wide YOLO
+     * mode ("always approve all tools") is enabled, and every tool when the global "approve all
+     * tools" user preference is set. Tools configured with `needsApproval` are never covered -
+     * they must be approved explicitly on every call.
+     * @returns Whether any request was auto-approved.
+     */
+    _autoApproveRememberedTools() {
+        return this._recordApprovalDecisions(part => {
+            if (this._requiresExplicitApproval(part.toolName)) {
+                return undefined;
+            }
+            if (this.toolApprovalMemory.isToolRemembered(this._chatSessionId, part.toolName)) {
+                return true;
+            }
+            if (this.toolApprovalMemory.isApproveAllToolsEnabled(this._chatSessionId) ||
+                this.globalToolApproval()) {
+                return true;
+            }
+            return undefined;
+        });
+    }
+    /**
+     * Whether the tool is configured with `needsApproval` (inline on its `tools` entry, falling
+     * back to the MCP-entry-level setting), meaning every call must be approved explicitly: such
+     * tools are never approved automatically, neither by remembered decisions nor by the
+     * session-wide or global "approve all tools" options.
+     *
+     * Without a client-side agent definition (agent given by name only) no configuration is
+     * visible, so this returns false.
+     */
+    _requiresExplicitApproval(toolName) {
+        return (this.agentDefinition?.definition.mcp ?? []).some(server => {
+            const entry = server.tools?.find(tool => (typeof tool === 'string' ? tool : tool.name) === toolName);
+            if (entry === undefined)
+                return false;
+            // The tool's own needsApproval decides when set; otherwise the MCP-entry-level one applies
+            if (typeof entry === 'object' && entry.needsApproval !== undefined) {
+                return entry.needsApproval;
+            }
+            return (server.needsApproval === true ||
+                (Array.isArray(server.needsApproval) && server.needsApproval.includes(toolName)));
+        });
+    }
+    /**
+     * Sets the global "approve all tools" option and persists it as a user preference. When
+     * enabled, pending approval requests (except tools configured with `needsApproval`) are
+     * approved immediately and the conversation resumes. Enabling it asks for confirmation first,
+     * since it applies to every chat until turned off again, not just the current conversation.
+     *
+     * If the confirmation is cancelled, the preference is left untouched. The mode selector reflects
+     * the current value through its `globalToolApproval()` binding, so no manual reset is required.
+     * @param approveAll `true` for the "Auto" mode, `false` for "Manual".
+     */
+    async setGlobalToolApproval(approveAll) {
+        if (approveAll === this.globalToolApproval()) {
+            return;
+        }
+        if (approveAll) {
+            try {
+                await this.modalService.confirm(gettext('Auto-approve all tools?'), this.translateService.instant(gettext('Tool calls will run without asking for approval, in this and every future chat, until you turn this off again. Tools requiring explicit approval will still ask.')), Status.WARNING, { cancel: gettext('Cancel'), ok: gettext('Auto-approve all tools') });
+            }
+            catch (e) {
+                if (!e) {
+                    return; // User dismissed the dialog - leave the preference untouched
+                }
+                throw e; // Unexpected error, rethrow to propagate
+            }
+        }
+        this.globalToolApproval.set(approveAll);
+        if (approveAll && this._autoApproveRememberedTools()) {
+            void this._resumeIfAllApprovalsDecided();
+        }
+        try {
+            await this.userPreferences.set(GLOBAL_TOOL_APPROVAL_PREFERENCE_KEY, approveAll);
+        }
+        catch (e) {
+            // The mode is applied for the current session, but persistence failed - tell the user it
+            // will not carry over to future chats so they are not misled by the confirmation dialog.
+            console.error('Failed to save the tool approval preference:', e);
+            this.alertService.danger(gettext('Failed to save the tool approval mode.'));
+        }
+    }
+    /** Loads the persisted global "approve all tools" user preference. */
+    async _loadGlobalToolApproval() {
+        try {
+            const stored = await firstValueFrom(this.userPreferences.get(GLOBAL_TOOL_APPROVAL_PREFERENCE_KEY));
+            this.globalToolApproval.set(stored === true);
+        }
+        catch (e) {
+            // The chat still works without the preference - the user is simply prompted
+            console.error('Failed to load the tool approval preference:', e);
+        }
+    }
+    /**
+     * Resumes the conversation if the last assistant message stopped for tool approval and every
+     * request now has a decision. The agent then executes (or skips) the tools and continues.
+     */
+    async _resumeIfAllApprovalsDecided() {
+        const msgs = this.messages();
+        const lastMsg = msgs[msgs.length - 1];
+        if (lastMsg?.role !== 'assistant')
+            return;
+        const hasDecision = lastMsg.content.some(p => p.type === 'tool-approval-responded');
+        const stillPending = lastMsg.content.some(p => p.type === 'tool-approval-requested');
+        if (hasDecision && !stillPending) {
+            await this._dispatchToAgent(false);
+        }
+    }
     async initializeChat() {
         this._restoreChatHistory(this.initialChatHistory());
         if (this.skipHealthCheck()) {
@@ -955,6 +1188,11 @@ class AgentChatComponent {
                     // Should never happen, but worth knowing if it does (indicates bug in processAgentMessage)
                     console.error('AI response stream completed but message loading indicator was not reset');
                 }
+                else if (this._autoApproveRememberedTools()) {
+                    // Tools the user chose to always approve are approved without prompting; if no other
+                    // approvals are pending this resumes the conversation immediately
+                    void this._resumeIfAllApprovalsDecided();
+                }
             },
             error: async (error) => {
                 // Currently errors from the AIService are often a big JSON with no human-friendly message anywhere
@@ -1029,12 +1267,13 @@ class AgentChatComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: AgentChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: AgentChatComponent, isStandalone: true, selector: "c8y-agent-chat", inputs: { agent: { classPropertyName: "agent", publicName: "agent", isSignal: true, isRequired: true, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: true, isRequired: false, transformFunction: null }, chatConfig: { classPropertyName: "chatConfig", publicName: "chatConfig", isSignal: true, isRequired: false, transformFunction: null }, welcomeTemplate: { classPropertyName: "welcomeTemplate", publicName: "welcomeTemplate", isSignal: true, isRequired: false, transformFunction: null }, autoCreateAgents: { classPropertyName: "autoCreateAgents", publicName: "autoCreateAgents", isSignal: true, isRequired: false, transformFunction: null }, variables: { classPropertyName: "variables", publicName: "variables", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageComponent: { classPropertyName: "assistantMessageComponent", publicName: "assistantMessageComponent", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageDisplayConfig: { classPropertyName: "assistantMessageDisplayConfig", publicName: "assistantMessageDisplayConfig", isSignal: true, isRequired: false, transformFunction: null }, preprocessAgentMessage: { classPropertyName: "preprocessAgentMessage", publicName: "preprocessAgentMessage", isSignal: true, isRequired: false, transformFunction: null }, pruneMessagesForAgent: { classPropertyName: "pruneMessagesForAgent", publicName: "pruneMessagesForAgent", isSignal: true, isRequired: false, transformFunction: null }, skipHealthCheck: { classPropertyName: "skipHealthCheck", publicName: "skipHealthCheck", isSignal: true, isRequired: false, transformFunction: null }, initialChatHistory: { classPropertyName: "initialChatHistory", publicName: "initialChatHistory", isSignal: true, isRequired: false, transformFunction: null }, groundingContextProvider: { classPropertyName: "groundingContextProvider", publicName: "groundingContextProvider", isSignal: true, isRequired: false, transformFunction: null }, userAnalyticsContext: { classPropertyName: "userAnalyticsContext", publicName: "userAnalyticsContext", isSignal: true, isRequired: false, transformFunction: null }, telemetry: { classPropertyName: "telemetry", publicName: "telemetry", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onMessageFinish: "onMessageFinish", onToolResult: "onToolResult", onFeedback: "onFeedback", onMessagesChange: "onMessagesChange" }, viewQueries: [{ propertyName: "assistantMessageComponents", predicate: AiChatAssistantMessageComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <span>{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n    [cumulativeUsage]=\"chatConfig()?.showCumulativeUsage ? cumulativeUsage() : null\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else if (\n          message.role === 'assistant' && isLoadingAiResponse() && i === messages$.length - 1\n        ) {\n          <div>\n            <!-- Last assistant message uses reactive computed context -->\n            <ng-container\n              [ngComponentOutlet]=\"assistantMessageComponent()\"\n              [ngComponentOutletInputs]=\"{ assistantMessageContext: lastAssistantMessageContext() }\"\n            ></ng-container>\n          </div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          i > 0 &&\n          chatConfig()?.showUsagePerMessage &&\n          message.usage\n        ) {\n          <c8y-ai-chat-message-action [custom]=\"true\">\n            <span\n              class=\"tag tag--info m-l-auto\"\n              [tooltip]=\"\n                'Input tokens: {{ input }}\\nOutput tokens: {{ output }}'\n                  | translate\n                    : {\n                        input: message.usage.inputTokens || 0 | c8yNumber: 'floor' : '1.0-0',\n                        output: message.usage.outputTokens || 0 | c8yNumber: 'floor' : '1.0-0'\n                      }\n              \"\n            >\n              {{ 'Tokens used: {{total}}' | translate: { total: message.usage.totalTokens || 0 |\n              c8yNumber: 'floor' : '1.0-0' } }}\n            </span>\n          </c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          !isLoadingAiResponse() &&\n          chatConfig()?.showDeleteAction &&\n          isLastMessage\n        ) {\n          <c8y-ai-chat-message-action\n            icon=\"delete-bin\"\n            [tooltip]=\"'Delete last exchange' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"deleteLastExchange()\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentRequestError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"], dependencies: [{ kind: "component", type: AiChatComponent, selector: "c8y-ai-chat", inputs: ["isLoading", "disabled", "prompt", "suggestionsTemplate", "welcomeTemplate", "cumulativeUsage", "config"], outputs: ["onMessage", "onCancel"] }, { kind: "component", type: AiChatSuggestionComponent, selector: "c8y-ai-chat-suggestion", inputs: ["label", "prompt", "icon", "useAiButtons", "disabled"], outputs: ["suggestionClicked"] }, { kind: "component", type: AiChatMessageComponent, selector: "c8y-ai-chat-message", inputs: ["role", "message"] }, { kind: "component", type: AiChatMessageActionComponent, selector: "c8y-ai-chat-message-action", inputs: ["custom", "disabled", "tooltip", "icon"], outputs: ["actionClicked"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "progressLabel", "message"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "pipe", type: MarkdownToHtmlPipe, name: "markdownToHtml" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: NumberPipe, name: "c8yNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: AgentChatComponent, isStandalone: true, selector: "c8y-agent-chat", inputs: { agent: { classPropertyName: "agent", publicName: "agent", isSignal: true, isRequired: true, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: true, isRequired: false, transformFunction: null }, chatConfig: { classPropertyName: "chatConfig", publicName: "chatConfig", isSignal: true, isRequired: false, transformFunction: null }, welcomeTemplate: { classPropertyName: "welcomeTemplate", publicName: "welcomeTemplate", isSignal: true, isRequired: false, transformFunction: null }, autoCreateAgents: { classPropertyName: "autoCreateAgents", publicName: "autoCreateAgents", isSignal: true, isRequired: false, transformFunction: null }, variables: { classPropertyName: "variables", publicName: "variables", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageComponent: { classPropertyName: "assistantMessageComponent", publicName: "assistantMessageComponent", isSignal: true, isRequired: false, transformFunction: null }, assistantMessageDisplayConfig: { classPropertyName: "assistantMessageDisplayConfig", publicName: "assistantMessageDisplayConfig", isSignal: true, isRequired: false, transformFunction: null }, preprocessAgentMessage: { classPropertyName: "preprocessAgentMessage", publicName: "preprocessAgentMessage", isSignal: true, isRequired: false, transformFunction: null }, pruneMessagesForAgent: { classPropertyName: "pruneMessagesForAgent", publicName: "pruneMessagesForAgent", isSignal: true, isRequired: false, transformFunction: null }, skipHealthCheck: { classPropertyName: "skipHealthCheck", publicName: "skipHealthCheck", isSignal: true, isRequired: false, transformFunction: null }, initialChatHistory: { classPropertyName: "initialChatHistory", publicName: "initialChatHistory", isSignal: true, isRequired: false, transformFunction: null }, groundingContextProvider: { classPropertyName: "groundingContextProvider", publicName: "groundingContextProvider", isSignal: true, isRequired: false, transformFunction: null }, userAnalyticsContext: { classPropertyName: "userAnalyticsContext", publicName: "userAnalyticsContext", isSignal: true, isRequired: false, transformFunction: null }, telemetry: { classPropertyName: "telemetry", publicName: "telemetry", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onMessageFinish: "onMessageFinish", onToolResult: "onToolResult", onFeedback: "onFeedback", onMessagesChange: "onMessagesChange" }, queries: [{ propertyName: "chatActions", predicate: AiChatActionComponent, isSignal: true }], viewQueries: [{ propertyName: "assistantMessageComponents", predicate: AiChatAssistantMessageComponent, descendants: true, isSignal: true }, { propertyName: "chat", first: true, predicate: AiChatComponent, descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<!-- Instantiates any projected action-bar items so they can be queried and forwarded to c8y-ai-chat.\n The items render nothing here (their content is exposed as a template), only inside the action bar. -->\n<ng-content select=\"c8y-ai-chat-action\"></ng-content>\n\n@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <!-- Only the message is announced; the actions and links stay out of the live region. -->\n      <span role=\"alert\">{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  @let showGlobalToolApprovalToggle = chatConfig()?.showGlobalToolApprovalToggle !== false;\n  @if (showGlobalToolApprovalToggle && globalToolApproval()) {\n    <div\n      class=\"alert alert-info m-b-0 max-width-unset\"\n      role=\"status\"\n      data-cy=\"chat-global-tool-approval-banner\"\n    >\n      <p>\n        {{\n          'Auto-approve is on. Tool calls run without asking until you turn this off. Tools requiring explicit approval will still ask.'\n            | translate\n        }}\n      </p>\n    </div>\n  }\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n    [actions]=\"chatActions()\"\n    [cumulativeUsage]=\"chatConfig()?.showCumulativeUsage ? cumulativeUsage() : null\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else if (\n          message.role === 'assistant' && isLoadingAiResponse() && i === messages$.length - 1\n        ) {\n          <div>\n            <!-- Last assistant message uses reactive computed context -->\n            <ng-container\n              [ngComponentOutlet]=\"assistantMessageComponent()\"\n              [ngComponentOutletInputs]=\"{ assistantMessageContext: lastAssistantMessageContext() }\"\n            ></ng-container>\n          </div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i,\n                onToolApprovalResponse: respondToToolApproval,\n                canRememberToolApproval: canRememberToolApproval\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          i > 0 &&\n          chatConfig()?.showUsagePerMessage &&\n          message.usage\n        ) {\n          <c8y-ai-chat-message-action [custom]=\"true\">\n            @let usageLabel =\n              'Input tokens: {{ input }}\\nOutput tokens: {{ output }}'\n                | translate\n                  : {\n                      input: message.usage.inputTokens || 0 | c8yNumber: 'floor' : '1.0-0',\n                      output: message.usage.outputTokens || 0 | c8yNumber: 'floor' : '1.0-0'\n                    };\n            <!-- The tooltip is hover-only, so repeat the breakdown as a label. -->\n            <span\n              class=\"tag tag--info m-l-auto\"\n              [attr.aria-label]=\"usageLabel\"\n              tabindex=\"0\"\n              [tooltip]=\"usageLabel\"\n            >\n              {{ 'Tokens used: {{total}}' | translate: { total: message.usage.totalTokens || 0 |\n              c8yNumber: 'floor' : '1.0-0' } }}\n            </span>\n          </c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          !isLoadingAiResponse() &&\n          chatConfig()?.showDeleteAction &&\n          isLastMessage\n        ) {\n          <c8y-ai-chat-message-action\n            icon=\"delete-bin\"\n            [tooltip]=\"'Delete last exchange' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"deleteLastExchange()\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentRequestError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n\n    @if (showGlobalToolApprovalToggle) {\n      <c8y-ai-chat-action placement=\"left\">\n        <c8y-agent-chat-tool-approval-mode\n          [globalToolApproval]=\"globalToolApproval()\"\n          (modeChange)=\"setGlobalToolApproval($event)\"\n        ></c8y-agent-chat-tool-approval-mode>\n      </c8y-ai-chat-action>\n    }\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"], dependencies: [{ kind: "component", type: AiChatComponent, selector: "c8y-ai-chat", inputs: ["isLoading", "disabled", "prompt", "suggestionsTemplate", "welcomeTemplate", "cumulativeUsage", "actions", "config"], outputs: ["onMessage", "onCancel"] }, { kind: "component", type: AiChatActionComponent, selector: "c8y-ai-chat-action", inputs: ["placement"] }, { kind: "component", type: AiChatSuggestionComponent, selector: "c8y-ai-chat-suggestion", inputs: ["label", "prompt", "icon", "useAiButtons", "disabled"], outputs: ["suggestionClicked"] }, { kind: "component", type: AiChatMessageComponent, selector: "c8y-ai-chat-message", inputs: ["role", "message"] }, { kind: "component", type: AiChatMessageActionComponent, selector: "c8y-ai-chat-message-action", inputs: ["custom", "disabled", "tooltip", "icon"], outputs: ["actionClicked"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "progressLabel", "message"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1$1.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: AgentChatToolApprovalModeComponent, selector: "c8y-agent-chat-tool-approval-mode", inputs: ["globalToolApproval"], outputs: ["modeChange"] }, { kind: "pipe", type: MarkdownToHtmlPipe, name: "markdownToHtml" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: NumberPipe, name: "c8yNumber" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: AgentChatComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c8y-agent-chat', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         AiChatComponent,
+                        AiChatActionComponent,
                         AiChatSuggestionComponent,
                         AiChatMessageComponent,
                         AiChatMessageActionComponent,
@@ -1049,9 +1288,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                         GuideDocsComponent,
                         GuideHrefDirective,
                         TooltipModule,
-                        NumberPipe
-                    ], template: "@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <span>{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n    [cumulativeUsage]=\"chatConfig()?.showCumulativeUsage ? cumulativeUsage() : null\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else if (\n          message.role === 'assistant' && isLoadingAiResponse() && i === messages$.length - 1\n        ) {\n          <div>\n            <!-- Last assistant message uses reactive computed context -->\n            <ng-container\n              [ngComponentOutlet]=\"assistantMessageComponent()\"\n              [ngComponentOutletInputs]=\"{ assistantMessageContext: lastAssistantMessageContext() }\"\n            ></ng-container>\n          </div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          i > 0 &&\n          chatConfig()?.showUsagePerMessage &&\n          message.usage\n        ) {\n          <c8y-ai-chat-message-action [custom]=\"true\">\n            <span\n              class=\"tag tag--info m-l-auto\"\n              [tooltip]=\"\n                'Input tokens: {{ input }}\\nOutput tokens: {{ output }}'\n                  | translate\n                    : {\n                        input: message.usage.inputTokens || 0 | c8yNumber: 'floor' : '1.0-0',\n                        output: message.usage.outputTokens || 0 | c8yNumber: 'floor' : '1.0-0'\n                      }\n              \"\n            >\n              {{ 'Tokens used: {{total}}' | translate: { total: message.usage.totalTokens || 0 |\n              c8yNumber: 'floor' : '1.0-0' } }}\n            </span>\n          </c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          !isLoadingAiResponse() &&\n          chatConfig()?.showDeleteAction &&\n          isLastMessage\n        ) {\n          <c8y-ai-chat-message-action\n            icon=\"delete-bin\"\n            [tooltip]=\"'Delete last exchange' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"deleteLastExchange()\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentRequestError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"] }]
-        }], propDecorators: { agent: [{ type: i0.Input, args: [{ isSignal: true, alias: "agent", required: true }] }], suggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggestions", required: false }] }], chatConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "chatConfig", required: false }] }], welcomeTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "welcomeTemplate", required: false }] }], autoCreateAgents: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoCreateAgents", required: false }] }], variables: [{ type: i0.Input, args: [{ isSignal: true, alias: "variables", required: false }] }], assistantMessageComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "assistantMessageComponent", required: false }] }], assistantMessageDisplayConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "assistantMessageDisplayConfig", required: false }] }], preprocessAgentMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "preprocessAgentMessage", required: false }] }], pruneMessagesForAgent: [{ type: i0.Input, args: [{ isSignal: true, alias: "pruneMessagesForAgent", required: false }] }], skipHealthCheck: [{ type: i0.Input, args: [{ isSignal: true, alias: "skipHealthCheck", required: false }] }], initialChatHistory: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialChatHistory", required: false }] }], groundingContextProvider: [{ type: i0.Input, args: [{ isSignal: true, alias: "groundingContextProvider", required: false }] }], userAnalyticsContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "userAnalyticsContext", required: false }] }], telemetry: [{ type: i0.Input, args: [{ isSignal: true, alias: "telemetry", required: false }] }], onMessageFinish: [{ type: i0.Output, args: ["onMessageFinish"] }], onToolResult: [{ type: i0.Output, args: ["onToolResult"] }], onFeedback: [{ type: i0.Output, args: ["onFeedback"] }], onMessagesChange: [{ type: i0.Output, args: ["onMessagesChange"] }], assistantMessageComponents: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AiChatAssistantMessageComponent), { isSignal: true }] }] } });
+                        NumberPipe,
+                        AgentChatToolApprovalModeComponent
+                    ], template: "<!-- Instantiates any projected action-bar items so they can be queried and forwarded to c8y-ai-chat.\n The items render nothing here (their content is exposed as a template), only inside the action bar. -->\n<ng-content select=\"c8y-ai-chat-action\"></ng-content>\n\n@let agentHealthErrorMsg = _agentHealthError();\n@if (agentHealthErrorMsg) {\n  @if (isLoadingAiResponse()) {\n    <c8y-loading class=\"m-auto\"></c8y-loading>\n  } @else {\n    <c8y-ui-empty-state\n      class=\"m-auto\"\n      [icon]=\"'settings'\"\n      [title]=\"'AI agent is not available.' | translate\"\n    >\n      <!-- Only the message is announced; the actions and links stay out of the live region. -->\n      <span role=\"alert\">{{ agentHealthErrorMsg }}</span>\n\n      @if (canCreate) {\n        <div class=\"text-center m-t-16 m-b-16\">\n          <button\n            class=\"btn btn-primary\"\n            (click)=\"createAgent()\"\n          >\n            {{ 'Create agent' | translate }}\n          </button>\n        </div>\n      } @else {\n        <p\n          class=\"text-pre-wrap m-t-8\"\n          data-cy=\"agent-health-detailed-messages\"\n        >\n          <small>{{ agentHealthDetailedMessages() }}</small>\n        </p>\n      }\n\n      <p c8y-guide-docs>\n        <small\n          translate\n          ngNonBindable\n        >\n          Find out more in the\n          <a c8y-guide-href=\"/docs/ai\">user documentation</a>.\n        </small>\n      </p>\n    </c8y-ui-empty-state>\n  }\n}\n\n@if (!agentHealthErrorMsg) {\n  @let showGlobalToolApprovalToggle = chatConfig()?.showGlobalToolApprovalToggle !== false;\n  @if (showGlobalToolApprovalToggle && globalToolApproval()) {\n    <div\n      class=\"alert alert-info m-b-0 max-width-unset\"\n      role=\"status\"\n      data-cy=\"chat-global-tool-approval-banner\"\n    >\n      <p>\n        {{\n          'Auto-approve is on. Tool calls run without asking until you turn this off. Tools requiring explicit approval will still ask.'\n            | translate\n        }}\n      </p>\n    </div>\n  }\n  <c8y-ai-chat\n    (onMessage)=\"sendMessage($event)\"\n    [isLoading]=\"isLoadingAiResponse()\"\n    (onCancel)=\"cancel()\"\n    [config]=\"chatConfig() ?? {}\"\n    [prompt]=\"prompt\"\n    [suggestionsTemplate]=\"suggestionsRef\"\n    [welcomeTemplate]=\"welcomeTemplate()\"\n    [actions]=\"chatActions()\"\n    [cumulativeUsage]=\"chatConfig()?.showCumulativeUsage ? cumulativeUsage() : null\"\n  >\n    @let messages$ = messages();\n    @for (message of messages$; track $index; let i = $index) {\n      <c8y-ai-chat-message [message]=\"message\">\n        @if (message.role !== 'user' && model) {\n          <!-- Visually hidden label included when users copy-paste from the chat, e.g. to report issues. It's quite helpful to know the model. -->\n          <span\n            class=\"hidden-copy-label\"\n            aria-hidden=\"true\"\n          >\n            {{ `(Using model: ${model})` }}</span\n          >\n        }\n\n        @if (message.role === 'user') {\n          <div\n            class=\"message-content\"\n            data-cy=\"user-message-content\"\n            [innerHTML]=\"message.content | markdownToHtml | async\"\n          ></div>\n        } @else if (\n          message.role === 'assistant' && isLoadingAiResponse() && i === messages$.length - 1\n        ) {\n          <div>\n            <!-- Last assistant message uses reactive computed context -->\n            <ng-container\n              [ngComponentOutlet]=\"assistantMessageComponent()\"\n              [ngComponentOutletInputs]=\"{ assistantMessageContext: lastAssistantMessageContext() }\"\n            ></ng-container>\n          </div>\n        } @else {\n          <ng-container\n            [ngComponentOutlet]=\"assistantMessageComponent()\"\n            [ngComponentOutletInputs]=\"{\n              assistantMessageContext: {\n                message: message,\n                config: assistantMessageDisplayConfig(),\n                isMessageLoading: isLoadingAiResponse() && i === messages$.length - 1,\n                messageDisplayIndex: messages$.length - 1 - i,\n                onToolApprovalResponse: respondToToolApproval,\n                canRememberToolApproval: canRememberToolApproval\n              }\n            }\"\n          ></ng-container>\n        }\n\n        @let isLastMessage = i === messages$.length - 1;\n\n        @if (message.role === 'user') {\n          <c8y-ai-chat-message-action\n            icon=\"pencil\"\n            [tooltip]=\"'Edit and resend this message' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reprompt(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          i > 0 &&\n          chatConfig()?.showUsagePerMessage &&\n          message.usage\n        ) {\n          <c8y-ai-chat-message-action [custom]=\"true\">\n            @let usageLabel =\n              'Input tokens: {{ input }}\\nOutput tokens: {{ output }}'\n                | translate\n                  : {\n                      input: message.usage.inputTokens || 0 | c8yNumber: 'floor' : '1.0-0',\n                      output: message.usage.outputTokens || 0 | c8yNumber: 'floor' : '1.0-0'\n                    };\n            <!-- The tooltip is hover-only, so repeat the breakdown as a label. -->\n            <span\n              class=\"tag tag--info m-l-auto\"\n              [attr.aria-label]=\"usageLabel\"\n              tabindex=\"0\"\n              [tooltip]=\"usageLabel\"\n            >\n              {{ 'Tokens used: {{total}}' | translate: { total: message.usage.totalTokens || 0 |\n              c8yNumber: 'floor' : '1.0-0' } }}\n            </span>\n          </c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-up\"\n            [tooltip]=\"'This is useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, true)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (message.role === 'assistant' && i > 0 && !isLoadingAiResponse() && telemetry()) {\n          <c8y-ai-chat-message-action\n            icon=\"thumbs-down\"\n            [tooltip]=\"'This is not useful' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"rate(message, false)\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        @if (\n          message.role === 'assistant' &&\n          !isLoadingAiResponse() &&\n          chatConfig()?.showDeleteAction &&\n          isLastMessage\n        ) {\n          <c8y-ai-chat-message-action\n            icon=\"delete-bin\"\n            [tooltip]=\"'Delete last exchange' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"deleteLastExchange()\"\n          ></c8y-ai-chat-message-action>\n        }\n\n        <!-- Only allow regenerating the last message, otherwise we could be deleting a lot of useful message history -->\n        @if (message.role === 'assistant' && i > 0 && isLastMessage && !isLoadingAiResponse()) {\n          <c8y-ai-chat-message-action\n            icon=\"refresh\"\n            [tooltip]=\"'Regenerate this response' | translate\"\n            [disabled]=\"isLoadingAiResponse()\"\n            (click)=\"reload(message)\"\n          ></c8y-ai-chat-message-action>\n        }\n      </c8y-ai-chat-message>\n    }\n\n    @let agentErrorMsg = agentRequestError();\n    @if (agentErrorMsg) {\n      <c8y-ai-chat-message [message]=\"{ role: 'assistant', content: agentErrorMsg }\">\n        <div\n          class=\"alert alert-danger d-flex a-i-center gap-8\"\n          role=\"alert\"\n        >\n          <!-- Since errors come from the backend the only translation is for the fallback error message supplied by the UI. -->\n          <div class=\"flex-grow text-pre-wrap\">{{ agentErrorMsg | translate }}</div>\n        </div>\n      </c8y-ai-chat-message>\n    }\n\n    <ng-template #suggestionsRef>\n      @if (!isLoadingAiResponse()) {\n        <!-- As soon as we have any suggestions (even empty) these take priority over what we restored from history -->\n        @let activeSuggestions = suggestions() === undefined ? _restoredSuggestions : suggestions();\n        @for (suggestion of activeSuggestions; track $index) {\n          <c8y-ai-chat-suggestion\n            [icon]=\"suggestion.icon || 'c8y-bulb'\"\n            [useAiButtons]=\"true\"\n            [prompt]=\"suggestion.prompt\"\n            [label]=\"suggestion.label ?? suggestion.prompt\"\n            (suggestionClicked)=\"sendMessage($event)\"\n            [disabled]=\"isLoadingAiResponse()\"\n          ></c8y-ai-chat-suggestion>\n        }\n      }\n    </ng-template>\n\n    @if (showGlobalToolApprovalToggle) {\n      <c8y-ai-chat-action placement=\"left\">\n        <c8y-agent-chat-tool-approval-mode\n          [globalToolApproval]=\"globalToolApproval()\"\n          (modeChange)=\"setGlobalToolApproval($event)\"\n        ></c8y-agent-chat-tool-approval-mode>\n      </c8y-ai-chat-action>\n    }\n  </c8y-ai-chat>\n}\n", styles: ["@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.fade-in-out{animation:fadeIn .2s ease-in}.fade-in-out.ng-leave-active{animation:fadeOut .2s ease-out}.hidden-copy-label{display:block;font-size:0;line-height:0;-webkit-user-select:text;user-select:text}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { agent: [{ type: i0.Input, args: [{ isSignal: true, alias: "agent", required: true }] }], suggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggestions", required: false }] }], chatConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "chatConfig", required: false }] }], welcomeTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "welcomeTemplate", required: false }] }], chatActions: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => AiChatActionComponent), { isSignal: true }] }], autoCreateAgents: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoCreateAgents", required: false }] }], variables: [{ type: i0.Input, args: [{ isSignal: true, alias: "variables", required: false }] }], assistantMessageComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "assistantMessageComponent", required: false }] }], assistantMessageDisplayConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "assistantMessageDisplayConfig", required: false }] }], preprocessAgentMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "preprocessAgentMessage", required: false }] }], pruneMessagesForAgent: [{ type: i0.Input, args: [{ isSignal: true, alias: "pruneMessagesForAgent", required: false }] }], skipHealthCheck: [{ type: i0.Input, args: [{ isSignal: true, alias: "skipHealthCheck", required: false }] }], initialChatHistory: [{ type: i0.Input, args: [{ isSignal: true, alias: "initialChatHistory", required: false }] }], groundingContextProvider: [{ type: i0.Input, args: [{ isSignal: true, alias: "groundingContextProvider", required: false }] }], userAnalyticsContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "userAnalyticsContext", required: false }] }], telemetry: [{ type: i0.Input, args: [{ isSignal: true, alias: "telemetry", required: false }] }], onMessageFinish: [{ type: i0.Output, args: ["onMessageFinish"] }], onToolResult: [{ type: i0.Output, args: ["onToolResult"] }], onFeedback: [{ type: i0.Output, args: ["onFeedback"] }], onMessagesChange: [{ type: i0.Output, args: ["onMessagesChange"] }], assistantMessageComponents: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AiChatAssistantMessageComponent), { isSignal: true }] }], chat: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AiChatComponent), { isSignal: true }] }] } });
 
 class WidgetAiChatSectionComponent {
     constructor() {
@@ -1164,5 +1404,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AgentChatComponent, WidgetAiChatSectionComponent };
+export { AgentChatComponent, AgentChatToolApprovalModeComponent, WidgetAiChatSectionComponent };
 //# sourceMappingURL=c8y-ngx-components-ai-agent-chat.mjs.map