@dataclouder/ngx-agent-cards 0.2.0 → 0.2.1

package/fesm2022/dataclouder-ngx-agent-cards.mjs

@@ -1465,7 +1465,12 @@ class DefaultAgentCardsService extends EntityCommunicationService {
         this.randomSeed = Math.floor(Math.random() * 100000);
     }
     partialUpdateAgentCard(agentCard) {
-        return this.httpService.put(`api/${this.serviceName}/partial-update`, agentCard, 'primary');
+        const id = agentCard.id || agentCard._id;
+        return this.operation({
+            action: 'updateOne',
+            query: { _id: id },
+            payload: { $set: agentCard }
+        });
     }
     generateMainImage(idCard) {
         return this.httpService.get(`api/${this.serviceName}-generate/generate-image-card/${idCard}`, 'primary');
@@ -1503,11 +1508,6 @@ class DefaultAgentCardsService extends EntityCommunicationService {
         const response = await this.httpService.post(`api/${this.serviceName}/query`, filters, 'primary');
         return response.rows[0];
     }
-    async remove(id) {
-        // Assuming the backend returns the deleted card, or this matches an expected API contract.
-        // HttpCoreService.delete by default returns Promise<DeletedData>.
-        await this.httpService.delete(`api/${this.serviceName}/${id}`, 'primary');
-    }
     async getConversationUserChatSettings() {
         const settings = this.userService.user()?.settings?.conversation;
         return settings;
@@ -2028,9 +2028,7 @@ class DynamicFlowService {
             this.messagesStateService.updateMessage(messageId, { tags: [emoji] });
         }
         else {
-            // Find the last assistant message
             const messages = this.messagesStateService.getMessagesSignal()();
-            // We look for the last message that is from the assistant
             const lastAssistantMessage = messages
                 .slice()
                 .reverse()
@@ -2044,7 +2042,12 @@ class DynamicFlowService {
         if (!mood)
             return undefined;
         const moodState = MoodStateOptions.find((option) => option.value === mood);
-        return moodState?.emoji;
+        if (moodState?.emoji) {
+            return moodState.emoji;
+        }
+        // Fallback for moods not in options (e.g., 'neutral', or unrecognized states)
+        // Use dash with mood label to show "mood was detected but has no video asset"
+        return `${mood}`;
     }
     /**
      * @description
@@ -2084,13 +2087,29 @@ Mark challenges as completed (true) ONLY if the user has satisfied the condition
             }
         }
         if (config.moodState?.enabled) {
-            let detectableStates = config.moodState.detectableStates;
-            if (!detectableStates || detectableStates.length === 0) {
-                detectableStates = Object.values(MoodState);
+            let detectableStates = [];
+            if (config.moodState.useAssetStatesOnly) {
+                const agentCard = this.agentCardStateService.agentCard$();
+                if (agentCard?.assets?.motions) {
+                    const moodStatesFromAssets = new Set();
+                    agentCard.assets.motions.forEach((m) => {
+                        if (m.metadata?.moodState) {
+                            moodStatesFromAssets.add(m.metadata.moodState);
+                        }
+                    });
+                    detectableStates = Array.from(moodStatesFromAssets);
+                }
+            }
+            else {
+                detectableStates = config.moodState.detectableStates || [];
+                if (detectableStates.length === 0) {
+                    detectableStates = Object.values(MoodState);
+                }
             }
             prompt += `
 - Mood: Detect the agent's mood based on the conversation.
-Detectable states: ${detectableStates.join(', ')}
+Stricly use one of these Detectable states: ${detectableStates.join(', ')}
+If really not posible to fit into one then use neutral.
 `;
         }
         const lastMessages = messages.slice(-4);
@@ -3479,7 +3498,7 @@ class AIGenerationService {
     async generateImage(chatMessage, chatText) {
         const agentCard = this.conversationService.agentCard$();
         const pictureDescription = agentCard?.characterCard?.data?.appearance;
-        const urlImage = await this.vertexService.generateComfyImage({ prompt: `${pictureDescription} ${chatText}` });
+        const urlImage = await this.vertexService.image.generateComfyImage({ prompt: `${pictureDescription} ${chatText}` });
         this.messagesStateService.updateMessage(chatMessage.messageId, { generatedImg: urlImage });
         return urlImage;
     }
@@ -3786,17 +3805,21 @@ class VideoPlayerNativeService {
         this.conversationFlowStateService = inject(ConversationFlowStateService);
         this.videoQueue = [];
         this.defaultVideoUrl = null;
+        this.pendingPlayingHandler = null;
+        this.pendingPlayingTarget = null;
         this.agentCard = signal(undefined, ...(ngDevMode ? [{ debugName: "agentCard" }] : /* istanbul ignore next */ []));
         this.isVideoPlaying = signal(false, ...(ngDevMode ? [{ debugName: "isVideoPlaying" }] : /* istanbul ignore next */ []));
         this.moodSubscription = this.conversationFlowStateService.moodUpdated$.subscribe((mood) => {
             const card = this.agentCard();
-            if (mood && card?.assets?.motions) {
-                const motionUrl = card.assets.motions.find((m) => m.metadata?.moodState === mood)?.url;
-                if (motionUrl) {
-                    this.addVideosToQueue([motionUrl]);
-                    this.playAndRewind();
-                }
-            }
+            if (!mood || !card?.assets?.motions)
+                return;
+            const motionUrl = card.assets.motions.find((m) => m.metadata?.moodState === mood)?.url;
+            if (!motionUrl)
+                return;
+            // Interrupt current playback. transitionToVideo loads the new clip
+            // into the hidden <video> and crossfades only when its first frame
+            // is ready, so the active clip keeps showing until then (no flash).
+            this.transitionToVideo(motionUrl);
         });
         this.onVideoEndedBound = this.onVideoEnded.bind(this);
     }
@@ -3816,6 +3839,8 @@ class VideoPlayerNativeService {
         this.videoA.style.zIndex = '2';
         this.videoB.style.opacity = '0';
         this.videoB.style.zIndex = '1';
+        this.videoA.volume = 0.1;
+        this.videoB.volume = 0.1;
         this.videoA.addEventListener('ended', this.onVideoEndedBound);
         this.videoB.addEventListener('ended', this.onVideoEndedBound);
     }
@@ -3910,11 +3935,21 @@ class VideoPlayerNativeService {
     transitionToVideo(videoUrl) {
         if (!this.activeVideo || !this.inactiveVideo)
             return;
+        // Drop any in-flight transition: if a previous transitionToVideo
+        // hasn't fired its 'playing' yet (e.g. mood arrives back-to-back),
+        // remove its listener so we don't end up with two crossfades racing.
+        if (this.pendingPlayingHandler && this.pendingPlayingTarget) {
+            this.pendingPlayingTarget.removeEventListener('playing', this.pendingPlayingHandler);
+            this.pendingPlayingHandler = null;
+            this.pendingPlayingTarget = null;
+        }
         const targetVideo = this.inactiveVideo;
         const currentActive = this.activeVideo;
         const onPlaying = () => {
             this.isVideoPlaying.set(true);
             targetVideo.removeEventListener('playing', onPlaying);
+            this.pendingPlayingHandler = null;
+            this.pendingPlayingTarget = null;
             // Crossfade
             targetVideo.style.opacity = '1';
             targetVideo.style.zIndex = '2';
@@ -3930,10 +3965,14 @@ class VideoPlayerNativeService {
             this.inactiveVideo = currentActive;
         };
         targetVideo.addEventListener('playing', onPlaying);
+        this.pendingPlayingHandler = onPlaying;
+        this.pendingPlayingTarget = targetVideo;
         targetVideo.src = videoUrl;
         targetVideo.play().catch(e => {
             console.error("Error playing next video", e);
             targetVideo.removeEventListener('playing', onPlaying);
+            this.pendingPlayingHandler = null;
+            this.pendingPlayingTarget = null;
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: VideoPlayerNativeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
@@ -4088,6 +4127,10 @@ class ChatFooterComponent {
         console.log(event);
         this.onMicFinished(event);
     }
+    handleAudioCanceled() {
+        this.isUserTalking = false;
+        this.lastUserMessageId = null;
+    }
     /**
      * Handles the mic status changed event
      * @param event The status event from the mic component
@@ -4124,11 +4167,11 @@ class ChatFooterComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ChatFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ChatFooterComponent, isStandalone: true, selector: "dc-chat-footer", inputs: { isAIThinking: { classPropertyName: "isAIThinking", publicName: "isAIThinking", isSignal: true, isRequired: false, transformFunction: null }, micSettings: { classPropertyName: "micSettings", publicName: "micSettings", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sendMessage: "sendMessage", textInputChanged: "textInputChanged" }, viewQueries: [{ propertyName: "micComponent", first: true, predicate: DCMicComponent, descendants: true }], ngImport: i0, template: "<div class=\"progress-input\">\n  <div class=\"input-container\">\n    <dc-mic (onFinished)=\"handleAudioRecorded($event)\"></dc-mic>\n\n    <textarea pTextarea [formControl]=\"chatInputControl\" (keyup.enter)=\"prepareUserMsnAndSend()\" rows=\"1\"></textarea>\n\n    <p-button (click)=\"prepareUserMsnAndSend()\" [disabled]=\"isAIThinking() || !chatInputControl.value\" label=\"Enviar\" [rounded]=\"true\" />\n  </div>\n\n  @if(challenges().length > 0) {\n  <div class=\"challenges-container\">\n    @for(challenge of challenges(); track challenge.name) {\n    <span class=\"challenge-emoji\" [title]=\"challenge.description\" [style.opacity]=\"challenge.completed ? 1 : 0.3\">\n      {{ challenge.emoji }}\n    </span>\n    }\n  </div>\n  } @if(agentCardStateService.conversationFlow$()?.goal?.enabled) {\n\n  <p-progressbar showValue=\"false\" [value]=\"score()\" [style]=\"{ height: '6px' }\" />\n  }\n</div>\n", styles: [".progress-input{position:relative;padding:10px;background-color:#f5f5f545;border-top:1px solid #b1a8a8}.progress-input .input-container{display:flex;align-items:center;margin-bottom:5px}.progress-input .input-container textarea{flex:1;resize:none;margin:0 10px}.progress-input .input-container .send-button{background-color:#007bff;color:#fff;border:none;border-radius:4px;padding:8px 15px;cursor:pointer}.progress-input .input-container .send-button:disabled{background-color:#ccc;cursor:not-allowed}.progress-input .input-container .send-button:hover:not(:disabled){background-color:#0069d9}.progress-input .challenges-container{position:absolute;top:-20px;left:100px;border-radius:20px;padding:2px 10px;z-index:10;display:flex;gap:8px;justify-content:flex-start}.progress-input .challenges-container .challenge-emoji{font-size:1.2rem;transition:opacity .3s ease,transform .3s ease;cursor:help}.progress-input .challenges-container .challenge-emoji:hover{transform:scale(1.2)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ProgressBarModule }, { kind: "component", type: i2$2.ProgressBar, selector: "p-progressBar, p-progressbar, p-progress-bar", inputs: ["value", "showValue", "styleClass", "valueStyleClass", "unit", "mode", "color"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DCMicComponent, selector: "dc-mic", inputs: ["targetOrBase", "micSettings", "maxRecordingTime", "isDone"], outputs: ["onInterpretedText", "onFinishedRecognition", "onFinished"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ChatFooterComponent, isStandalone: true, selector: "dc-chat-footer", inputs: { isAIThinking: { classPropertyName: "isAIThinking", publicName: "isAIThinking", isSignal: true, isRequired: false, transformFunction: null }, micSettings: { classPropertyName: "micSettings", publicName: "micSettings", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sendMessage: "sendMessage", textInputChanged: "textInputChanged" }, viewQueries: [{ propertyName: "micComponent", first: true, predicate: DCMicComponent, descendants: true }], ngImport: i0, template: "<div class=\"progress-input\">\n  <div class=\"input-container\">\n    <dc-mic (onFinished)=\"handleAudioRecorded($event)\" (onCanceled)=\"handleAudioCanceled()\"></dc-mic>\n\n    <textarea pTextarea [formControl]=\"chatInputControl\" (keyup.enter)=\"prepareUserMsnAndSend()\" rows=\"1\"></textarea>\n\n    <p-button (click)=\"prepareUserMsnAndSend()\" [disabled]=\"isAIThinking() || !chatInputControl.value\" label=\"Enviar\" [rounded]=\"true\" />\n  </div>\n\n  @if(challenges().length > 0) {\n  <div class=\"challenges-container\">\n    @for(challenge of challenges(); track challenge.name) {\n    <span class=\"challenge-emoji\" [title]=\"challenge.description\" [style.opacity]=\"challenge.completed ? 1 : 0.3\">\n      {{ challenge.emoji }}\n    </span>\n    }\n  </div>\n  } @if(agentCardStateService.conversationFlow$()?.goal?.enabled) {\n\n  <p-progressbar showValue=\"false\" [value]=\"score()\" [style]=\"{ height: '6px' }\" />\n  }\n</div>\n", styles: [".progress-input{position:relative;padding:10px;background-color:#f5f5f545;border-top:1px solid #b1a8a8}.progress-input .input-container{display:flex;align-items:center;margin-bottom:5px}.progress-input .input-container textarea{flex:1;resize:none;margin:0 10px}.progress-input .input-container .send-button{background-color:#007bff;color:#fff;border:none;border-radius:4px;padding:8px 15px;cursor:pointer}.progress-input .input-container .send-button:disabled{background-color:#ccc;cursor:not-allowed}.progress-input .input-container .send-button:hover:not(:disabled){background-color:#0069d9}.progress-input .challenges-container{position:absolute;top:-20px;left:100px;border-radius:20px;padding:2px 10px;z-index:10;display:flex;gap:8px;justify-content:flex-start}.progress-input .challenges-container .challenge-emoji{font-size:1.2rem;transition:opacity .3s ease,transform .3s ease;cursor:help}.progress-input .challenges-container .challenge-emoji:hover{transform:scale(1.2)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ProgressBarModule }, { kind: "component", type: i2$2.ProgressBar, selector: "p-progressBar, p-progressbar, p-progress-bar", inputs: ["value", "showValue", "styleClass", "valueStyleClass", "unit", "mode", "color"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DCMicComponent, selector: "dc-mic", inputs: ["targetOrBase", "micSettings", "maxRecordingTime", "isDone"], outputs: ["onInterpretedText", "onFinishedRecognition", "onFinished", "onCanceled"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ChatFooterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-chat-footer', standalone: true, imports: [ReactiveFormsModule, ProgressBarModule, TextareaModule, ButtonModule, DCMicComponent], template: "<div class=\"progress-input\">\n  <div class=\"input-container\">\n    <dc-mic (onFinished)=\"handleAudioRecorded($event)\"></dc-mic>\n\n    <textarea pTextarea [formControl]=\"chatInputControl\" (keyup.enter)=\"prepareUserMsnAndSend()\" rows=\"1\"></textarea>\n\n    <p-button (click)=\"prepareUserMsnAndSend()\" [disabled]=\"isAIThinking() || !chatInputControl.value\" label=\"Enviar\" [rounded]=\"true\" />\n  </div>\n\n  @if(challenges().length > 0) {\n  <div class=\"challenges-container\">\n    @for(challenge of challenges(); track challenge.name) {\n    <span class=\"challenge-emoji\" [title]=\"challenge.description\" [style.opacity]=\"challenge.completed ? 1 : 0.3\">\n      {{ challenge.emoji }}\n    </span>\n    }\n  </div>\n  } @if(agentCardStateService.conversationFlow$()?.goal?.enabled) {\n\n  <p-progressbar showValue=\"false\" [value]=\"score()\" [style]=\"{ height: '6px' }\" />\n  }\n</div>\n", styles: [".progress-input{position:relative;padding:10px;background-color:#f5f5f545;border-top:1px solid #b1a8a8}.progress-input .input-container{display:flex;align-items:center;margin-bottom:5px}.progress-input .input-container textarea{flex:1;resize:none;margin:0 10px}.progress-input .input-container .send-button{background-color:#007bff;color:#fff;border:none;border-radius:4px;padding:8px 15px;cursor:pointer}.progress-input .input-container .send-button:disabled{background-color:#ccc;cursor:not-allowed}.progress-input .input-container .send-button:hover:not(:disabled){background-color:#0069d9}.progress-input .challenges-container{position:absolute;top:-20px;left:100px;border-radius:20px;padding:2px 10px;z-index:10;display:flex;gap:8px;justify-content:flex-start}.progress-input .challenges-container .challenge-emoji{font-size:1.2rem;transition:opacity .3s ease,transform .3s ease;cursor:help}.progress-input .challenges-container .challenge-emoji:hover{transform:scale(1.2)}\n"] }]
+            args: [{ selector: 'dc-chat-footer', standalone: true, imports: [ReactiveFormsModule, ProgressBarModule, TextareaModule, ButtonModule, DCMicComponent], template: "<div class=\"progress-input\">\n  <div class=\"input-container\">\n    <dc-mic (onFinished)=\"handleAudioRecorded($event)\" (onCanceled)=\"handleAudioCanceled()\"></dc-mic>\n\n    <textarea pTextarea [formControl]=\"chatInputControl\" (keyup.enter)=\"prepareUserMsnAndSend()\" rows=\"1\"></textarea>\n\n    <p-button (click)=\"prepareUserMsnAndSend()\" [disabled]=\"isAIThinking() || !chatInputControl.value\" label=\"Enviar\" [rounded]=\"true\" />\n  </div>\n\n  @if(challenges().length > 0) {\n  <div class=\"challenges-container\">\n    @for(challenge of challenges(); track challenge.name) {\n    <span class=\"challenge-emoji\" [title]=\"challenge.description\" [style.opacity]=\"challenge.completed ? 1 : 0.3\">\n      {{ challenge.emoji }}\n    </span>\n    }\n  </div>\n  } @if(agentCardStateService.conversationFlow$()?.goal?.enabled) {\n\n  <p-progressbar showValue=\"false\" [value]=\"score()\" [style]=\"{ height: '6px' }\" />\n  }\n</div>\n", styles: [".progress-input{position:relative;padding:10px;background-color:#f5f5f545;border-top:1px solid #b1a8a8}.progress-input .input-container{display:flex;align-items:center;margin-bottom:5px}.progress-input .input-container textarea{flex:1;resize:none;margin:0 10px}.progress-input .input-container .send-button{background-color:#007bff;color:#fff;border:none;border-radius:4px;padding:8px 15px;cursor:pointer}.progress-input .input-container .send-button:disabled{background-color:#ccc;cursor:not-allowed}.progress-input .input-container .send-button:hover:not(:disabled){background-color:#0069d9}.progress-input .challenges-container{position:absolute;top:-20px;left:100px;border-radius:20px;padding:2px 10px;z-index:10;display:flex;gap:8px;justify-content:flex-start}.progress-input .challenges-container .challenge-emoji{font-size:1.2rem;transition:opacity .3s ease,transform .3s ease;cursor:help}.progress-input .challenges-container .challenge-emoji:hover{transform:scale(1.2)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { micComponent: [{
                 type: ViewChild,
                 args: [DCMicComponent]
@@ -4810,8 +4853,14 @@ class ChatMessageComponent {
     printData() {
         console.log(this.chatMessage());
     }
-    getMoodLabel(emoji) {
-        return EMOJI_TO_LABEL.get(emoji) || emoji;
+    getMoodLabel(tag) {
+        // Check if it's a known emoji
+        if (EMOJI_TO_LABEL.has(tag)) {
+            return EMOJI_TO_LABEL.get(tag) || tag;
+        }
+        else {
+            return tag;
+        }
     }
     async generateImage() {
         const res = await this.aiGenerationService.generateImage(this.chatMessage(), 'test');
@@ -4960,11 +5009,11 @@ class ModelSelectorComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ModelSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ModelSelectorComponent, isStandalone: true, selector: "dc-model-selector", inputs: { modelForm: "modelForm", shortForm: "shortForm" }, ngImport: i0, template: "<div>\n  <b>Selecci\u00F3n de modelo</b>\n\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium text-gray-700\">Model Quality</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"modelQualityOptions\"\n      [formControl]=\"modelForm.controls.quality\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n\n  @if(!shortForm) {\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium text-gray-700\">Provider</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"providersOptions\"\n      [formControl]=\"modelForm.controls.provider\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n  }\n\n  <!-- <div style=\"display: flex; gap: 10px\" [formGroup]=\"modelForm\">\n    <div class=\"space\">\n      <p-radioButton value=\"groq\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Groq</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openai\" formControlName=\"provider\"></p-radioButton>\n      <label>Open AI</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"google\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Google</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openrouter\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Open Router</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"ollama\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Ollama</label>\n    </div>\n  </div> -->\n\n  <!-- <b>Modelo: </b>\n  <span pTooltip=\"Modelo Seleccionado\">{{ modelForm.controls.modelName.value }}</span>\n  @if (modelForm.controls.provider.value) { @if(isLoadingModels) {\n  <p-skeleton height=\"200px\" width=\"100%\"></p-skeleton>\n  } @else {\n  <p-table [value]=\"modelnames\" stripedRows [size]=\"'small'\" [paginator]=\"true\" [rows]=\"12\" [formGroup]=\"modelForm\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th></th>\n        <th>Name</th>\n        <th>$$Prompt M</th>\n        <th>$$Completion M</th>\n        <th>$$Cost 90/10 M</th>\n        <th>Created</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\" let-model>\n      <tr [pTooltip]=\"model.description | truncate : 200\" tooltipPosition=\"top\">\n        <td><p-radioButton [value]=\"model.id\" formControlName=\"modelName\"></p-radioButton></td>\n        <td>{{ model.name || model.id }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.completion * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 * 0.9 + +model.pricing?.completion * 1000000 * 0.1 | number : '1.2-2' }}</td>\n        <td>{{ model.created * 1000 | date : 'dd/MM/yyyy' }}</td>\n      </tr>\n    </ng-template>\n  </p-table>\n  } }\n</div> -->\n</div>\n", styles: [":host{display:block}.space{display:flex;gap:2px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ModelSelectorComponent, isStandalone: true, selector: "dc-model-selector", inputs: { modelForm: "modelForm", shortForm: "shortForm" }, ngImport: i0, template: "<div>\n  <b>Selecci\u00F3n de modelo</b>\n\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium \">Model Quality</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"modelQualityOptions\"\n      [formControl]=\"modelForm.controls.quality\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n\n  @if(!shortForm) {\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium \">Provider</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"providersOptions\"\n      [formControl]=\"modelForm.controls.provider\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n  }\n\n  <!-- <div style=\"display: flex; gap: 10px\" [formGroup]=\"modelForm\">\n    <div class=\"space\">\n      <p-radioButton value=\"groq\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Groq</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openai\" formControlName=\"provider\"></p-radioButton>\n      <label>Open AI</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"google\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Google</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openrouter\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Open Router</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"ollama\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Ollama</label>\n    </div>\n  </div> -->\n\n  <!-- <b>Modelo: </b>\n  <span pTooltip=\"Modelo Seleccionado\">{{ modelForm.controls.modelName.value }}</span>\n  @if (modelForm.controls.provider.value) { @if(isLoadingModels) {\n  <p-skeleton height=\"200px\" width=\"100%\"></p-skeleton>\n  } @else {\n  <p-table [value]=\"modelnames\" stripedRows [size]=\"'small'\" [paginator]=\"true\" [rows]=\"12\" [formGroup]=\"modelForm\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th></th>\n        <th>Name</th>\n        <th>$$Prompt M</th>\n        <th>$$Completion M</th>\n        <th>$$Cost 90/10 M</th>\n        <th>Created</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\" let-model>\n      <tr [pTooltip]=\"model.description | truncate : 200\" tooltipPosition=\"top\">\n        <td><p-radioButton [value]=\"model.id\" formControlName=\"modelName\"></p-radioButton></td>\n        <td>{{ model.name || model.id }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.completion * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 * 0.9 + +model.pricing?.completion * 1000000 * 0.1 | number : '1.2-2' }}</td>\n        <td>{{ model.created * 1000 | date : 'dd/MM/yyyy' }}</td>\n      </tr>\n    </ng-template>\n  </p-table>\n  } }\n</div> -->\n</div>\n", styles: [":host{display:block}.space{display:flex;gap:2px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ModelSelectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-model-selector', standalone: true, imports: [ReactiveFormsModule, RadioButtonModule, TableModule, SkeletonModule, TooltipModule, SelectModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div>\n  <b>Selecci\u00F3n de modelo</b>\n\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium text-gray-700\">Model Quality</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"modelQualityOptions\"\n      [formControl]=\"modelForm.controls.quality\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n\n  @if(!shortForm) {\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium text-gray-700\">Provider</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"providersOptions\"\n      [formControl]=\"modelForm.controls.provider\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n  }\n\n  <!-- <div style=\"display: flex; gap: 10px\" [formGroup]=\"modelForm\">\n    <div class=\"space\">\n      <p-radioButton value=\"groq\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Groq</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openai\" formControlName=\"provider\"></p-radioButton>\n      <label>Open AI</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"google\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Google</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openrouter\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Open Router</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"ollama\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Ollama</label>\n    </div>\n  </div> -->\n\n  <!-- <b>Modelo: </b>\n  <span pTooltip=\"Modelo Seleccionado\">{{ modelForm.controls.modelName.value }}</span>\n  @if (modelForm.controls.provider.value) { @if(isLoadingModels) {\n  <p-skeleton height=\"200px\" width=\"100%\"></p-skeleton>\n  } @else {\n  <p-table [value]=\"modelnames\" stripedRows [size]=\"'small'\" [paginator]=\"true\" [rows]=\"12\" [formGroup]=\"modelForm\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th></th>\n        <th>Name</th>\n        <th>$$Prompt M</th>\n        <th>$$Completion M</th>\n        <th>$$Cost 90/10 M</th>\n        <th>Created</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\" let-model>\n      <tr [pTooltip]=\"model.description | truncate : 200\" tooltipPosition=\"top\">\n        <td><p-radioButton [value]=\"model.id\" formControlName=\"modelName\"></p-radioButton></td>\n        <td>{{ model.name || model.id }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.completion * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 * 0.9 + +model.pricing?.completion * 1000000 * 0.1 | number : '1.2-2' }}</td>\n        <td>{{ model.created * 1000 | date : 'dd/MM/yyyy' }}</td>\n      </tr>\n    </ng-template>\n  </p-table>\n  } }\n</div> -->\n</div>\n", styles: [":host{display:block}.space{display:flex;gap:2px}\n"] }]
+            args: [{ selector: 'dc-model-selector', standalone: true, imports: [ReactiveFormsModule, RadioButtonModule, TableModule, SkeletonModule, TooltipModule, SelectModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div>\n  <b>Selecci\u00F3n de modelo</b>\n\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium \">Model Quality</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"modelQualityOptions\"\n      [formControl]=\"modelForm.controls.quality\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n\n  @if(!shortForm) {\n  <div class=\"form-field\">\n    <label for=\"modelQuality\" class=\"block text-sm font-medium \">Provider</label>\n    <p-select\n      id=\"modelQuality\"\n      [options]=\"providersOptions\"\n      [formControl]=\"modelForm.controls.provider\"\n      placeholder=\"Select a Quality\"\n      optionLabel=\"label\"\n      optionValue=\"value\"\n      class=\"w-full\"></p-select>\n  </div>\n  }\n\n  <!-- <div style=\"display: flex; gap: 10px\" [formGroup]=\"modelForm\">\n    <div class=\"space\">\n      <p-radioButton value=\"groq\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Groq</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openai\" formControlName=\"provider\"></p-radioButton>\n      <label>Open AI</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"google\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Google</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"openrouter\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Open Router</label>\n    </div>\n\n    <div class=\"space\">\n      <p-radioButton value=\"ollama\" formControlName=\"provider\"></p-radioButton>\n      <label class=\"space\">Ollama</label>\n    </div>\n  </div> -->\n\n  <!-- <b>Modelo: </b>\n  <span pTooltip=\"Modelo Seleccionado\">{{ modelForm.controls.modelName.value }}</span>\n  @if (modelForm.controls.provider.value) { @if(isLoadingModels) {\n  <p-skeleton height=\"200px\" width=\"100%\"></p-skeleton>\n  } @else {\n  <p-table [value]=\"modelnames\" stripedRows [size]=\"'small'\" [paginator]=\"true\" [rows]=\"12\" [formGroup]=\"modelForm\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th></th>\n        <th>Name</th>\n        <th>$$Prompt M</th>\n        <th>$$Completion M</th>\n        <th>$$Cost 90/10 M</th>\n        <th>Created</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\" let-model>\n      <tr [pTooltip]=\"model.description | truncate : 200\" tooltipPosition=\"top\">\n        <td><p-radioButton [value]=\"model.id\" formControlName=\"modelName\"></p-radioButton></td>\n        <td>{{ model.name || model.id }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.completion * 1000000 | number : '1.2-2' }}</td>\n        <td>${{ +model.pricing?.prompt * 1000000 * 0.9 + +model.pricing?.completion * 1000000 * 0.1 | number : '1.2-2' }}</td>\n        <td>{{ model.created * 1000 | date : 'dd/MM/yyyy' }}</td>\n      </tr>\n    </ng-template>\n  </p-table>\n  } }\n</div> -->\n</div>\n", styles: [":host{display:block}.space{display:flex;gap:2px}\n"] }]
         }], propDecorators: { modelForm: [{
                 type: Input
             }], shortForm: [{
@@ -5046,7 +5095,7 @@ class DCConversationUserChatSettingsComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DCConversationUserChatSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DCConversationUserChatSettingsComponent, isStandalone: true, selector: "dc-chat-settings-dialog", inputs: { showFeature: { classPropertyName: "showFeature", publicName: "showFeature", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSettingsChange: "onSettingsChange", closeClicked: "closeClicked", settingsApplied: "settingsApplied" }, viewQueries: [{ propertyName: "tooltipRef", first: true, predicate: ["tooltipRef"], descendants: true }], ngImport: i0, template: "<div class=\"dialog-container\">\n  <form [formGroup]=\"form\">\n    @if (showFeature().synthVoice) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"synthVoice\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.synthVoice.disabled\">Escuchar Voz</span>\n        <br />\n        <small>Desmarca si solo quieres leer texto</small>\n      </p>\n    </div>\n    } @if (showFeature().highlightWords) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"highlightWords\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Narraci\u00F3n de texto</span>\n        <br />\n        <small>Remarca las palabras como se van pronuncionando</small>\n      </p>\n    </div>\n    } @if (showFeature().speed) {\n    <div class=\"settings-section\">\n      <p>\n        Velocidad ({{ form.controls.speed.value | speedDisplay }})\n        <br />\n\n        <!-- <p-rating formControlName=\"speed\" iconOnClass=\"pi pi-step-forward\" iconOffClass=\"pi pi-minus\" /> -->\n\n        <p-select\n          id=\"speed\"\n          [options]=\"speedOptions\"\n          formControlName=\"speed\"\n          [placeholder]=\"'Select Language'\"\n          optionLabel=\"label\"\n          optionValue=\"value\"></p-select>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"realTime\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.realTime.disabled\">Tiempo real</span>\n        <br />\n        <small>No tienes que presionar el microphono, comenzar\u00E1 a grabar en cuanto la AI termine de hablar, cierra el chat para finalizar conversaci\u00F3n.</small>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"repeatRecording\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Reproducir mi grabaci\u00F3n</span>\n        <br />\n        <small>Escucha tu dialogo, despu\u00E9s de grabar, te ayudar\u00E1 a notar tus errores.</small>\n      </p>\n    </div>\n    } @if (showFeature().superHearing) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"superHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Super O\u00EDdo \uD83E\uDDBE</span>\n        <br />\n        <small>Tu audio se procesa en el servidor para mejor efectividad, si no usa el navegador.</small>\n      </p>\n    </div>\n    }\n\n    <!-- @if (showFeature().fixGrammar) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"fixGrammar\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.fixGrammar.disabled\">Corregir gram\u00E1tica</span>\n        <br />\n        <small>La ai corrige tu forma de hablar/escribir y te retrolimenta de tus errores</small>\n      </p>\n    </div>\n    }  -->\n\n    <!-- @if (showFeature().autoTranslate) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"autoTranslate\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.autoTranslate.disabled\">Mostrar Traducciones </span>\n        <br />\n        <small>Texto adicional con la traducci\u00F3n</small>\n      </p>\n    </div>\n    }  -->\n\n    @if (showFeature().autoTranslate) {\n    <div class=\"voice-selection\">\n      <span>Voz Preferencial:</span>\n      <br />\n      <p-radioButton value=\"random\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Aleatorio</label>\n      <p-radioButton value=\"randomMan\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Hombre</label>\n      <p-radioButton value=\"randomWoman\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Mujer</label>\n    </div>\n    }\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"userMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.userMessageTask.disabled\">Procesar mensajes de usuario</span>\n        <br />\n        <small>Correcciones, mejoras, retroalimentaci\u00F3n y sugerencias en el texto del usuario </small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"assistantMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.assistantMessageTask.disabled\">Procesar mensajes de asistente</span>\n        <br />\n        <small>Correcciones, traducciones, pensamientos adicionales y m\u00E1s ayuda en el texto del asistente </small>\n      </p>\n    </div>\n    \n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"saveConversations\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.saveConversations.disabled\">Guardar conversaciones</span>\n        <br />\n        <small>Si marcas esta casilla, las conversaciones se guardar\u00E1n en tu historial.</small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"multilingualHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.multilingualHearing.disabled\">Escuchar en varios idiomas</span>\n        <br />\n        <small>El asistente podr\u00E1 entender y responder en varios idiomas, pero puede confundir idiomas si no lo pronuncias claramente.</small>\n      </p>\n    </div>\n\n    @if(userService.isAdmin()) {\n    <div>\n      <hr />\n      <b> <i style=\"color: rgb(255, 149, 0)\" class=\"pi pi-key\"></i> Admin Section</b>\n      <br />\n\n      <b>Modelo:</b>\n\n      <dc-model-selector [modelForm]=\"form.controls.model\"></dc-model-selector>\n    </div>\n    }\n\n    <div class=\"button-group\">\n      <p-button (click)=\"saveSettings()\" label=\"Guardar cambios\"></p-button>\n      <p-button (click)=\"close()\" label=\"Cancelar\" styleClass=\"p-button-secondary\"></p-button>\n    </div>\n  </form>\n</div>\n", styles: [".dialog-container{padding:20px;background:#fff;border-radius:8px;min-width:300px;max-width:500px;max-height:80vh;overflow-y:auto}.dialog-content{margin:20px 0}.dialog-actions{display:flex;justify-content:flex-end}.settings-section{margin-bottom:20px}.settings-section label{display:block;margin-bottom:5px;font-weight:700}.settings-section small{display:block;color:#666;margin-top:2px}.voice-selection{margin:15px 0}.voice-selection label{margin-right:15px}.button-group{margin-top:20px;display:flex;gap:10px;justify-content:flex-end}button{padding:8px 16px;border-radius:4px;border:none;cursor:pointer}button:first-child{background-color:#007bff;color:#fff}button:last-child{background-color:#6c757d;color:#fff}.space{margin-left:3px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SliderModule }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i3$2.RadioButton, selector: "p-radioButton, p-radiobutton, p-radio-button", inputs: ["value", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "styleClass", "autofocus", "binary", "variant", "size"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: RatingModule }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: BadgeModule }, { kind: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "component", type: ModelSelectorComponent, selector: "dc-model-selector", inputs: ["modelForm", "shortForm"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "pipe", type: SpeedDescPipe, name: "speedDisplay" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DCConversationUserChatSettingsComponent, isStandalone: true, selector: "dc-chat-settings-dialog", inputs: { showFeature: { classPropertyName: "showFeature", publicName: "showFeature", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSettingsChange: "onSettingsChange", closeClicked: "closeClicked", settingsApplied: "settingsApplied" }, viewQueries: [{ propertyName: "tooltipRef", first: true, predicate: ["tooltipRef"], descendants: true }], ngImport: i0, template: "<div class=\"dialog-container\">\n  <form [formGroup]=\"form\">\n    @if (showFeature().synthVoice) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"synthVoice\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.synthVoice.disabled\">Escuchar Voz</span>\n        <br />\n        <small>Desmarca si solo quieres leer texto</small>\n      </p>\n    </div>\n    } @if (showFeature().highlightWords) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"highlightWords\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Narraci\u00F3n de texto</span>\n        <br />\n        <small>Remarca las palabras como se van pronuncionando</small>\n      </p>\n    </div>\n    } @if (showFeature().speed) {\n    <div class=\"settings-section\">\n      <p>\n        Velocidad ({{ form.controls.speed.value | speedDisplay }})\n        <br />\n\n        <!-- <p-rating formControlName=\"speed\" iconOnClass=\"pi pi-step-forward\" iconOffClass=\"pi pi-minus\" /> -->\n\n        <p-select\n          id=\"speed\"\n          [options]=\"speedOptions\"\n          formControlName=\"speed\"\n          [placeholder]=\"'Select Language'\"\n          optionLabel=\"label\"\n          optionValue=\"value\"></p-select>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"realTime\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.realTime.disabled\">Tiempo real</span>\n        <br />\n        <small>No tienes que presionar el microphono, comenzar\u00E1 a grabar en cuanto la AI termine de hablar, cierra el chat para finalizar conversaci\u00F3n.</small>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"repeatRecording\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Reproducir mi grabaci\u00F3n</span>\n        <br />\n        <small>Escucha tu dialogo, despu\u00E9s de grabar, te ayudar\u00E1 a notar tus errores.</small>\n      </p>\n    </div>\n    } @if (showFeature().superHearing) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"superHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Super O\u00EDdo \uD83E\uDDBE</span>\n        <br />\n        <small>Tu audio se procesa en el servidor para mejor efectividad, si no usa el navegador.</small>\n      </p>\n    </div>\n    }\n\n    <!-- @if (showFeature().fixGrammar) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"fixGrammar\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.fixGrammar.disabled\">Corregir gram\u00E1tica</span>\n        <br />\n        <small>La ai corrige tu forma de hablar/escribir y te retrolimenta de tus errores</small>\n      </p>\n    </div>\n    }  -->\n\n    <!-- @if (showFeature().autoTranslate) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"autoTranslate\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.autoTranslate.disabled\">Mostrar Traducciones </span>\n        <br />\n        <small>Texto adicional con la traducci\u00F3n</small>\n      </p>\n    </div>\n    }  -->\n\n    @if (showFeature().autoTranslate) {\n    <div class=\"voice-selection\">\n      <span>Voz Preferencial:</span>\n      <br />\n      <p-radioButton value=\"random\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Aleatorio</label>\n      <p-radioButton value=\"randomMan\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Hombre</label>\n      <p-radioButton value=\"randomWoman\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Mujer</label>\n    </div>\n    }\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"userMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.userMessageTask.disabled\">Procesar mensajes de usuario</span>\n        <br />\n        <small>Correcciones, mejoras, retroalimentaci\u00F3n y sugerencias en el texto del usuario </small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"assistantMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.assistantMessageTask.disabled\">Procesar mensajes de asistente</span>\n        <br />\n        <small>Correcciones, traducciones, pensamientos adicionales y m\u00E1s ayuda en el texto del asistente </small>\n      </p>\n    </div>\n    \n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"saveConversations\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.saveConversations.disabled\">Guardar conversaciones</span>\n        <br />\n        <small>Si marcas esta casilla, las conversaciones se guardar\u00E1n en tu historial.</small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"multilingualHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.multilingualHearing.disabled\">Escuchar en varios idiomas</span>\n        <br />\n        <small>El asistente podr\u00E1 entender y responder en varios idiomas, pero puede confundir idiomas si no lo pronuncias claramente.</small>\n      </p>\n    </div>\n\n    @if(userService.isAdmin()) {\n    <div>\n      <hr />\n      <b> <i style=\"color: rgb(255, 149, 0)\" class=\"pi pi-key\"></i> Admin Section</b>\n      <br />\n\n      <b>Modelo:</b>\n\n      <dc-model-selector [modelForm]=\"form.controls.model\"></dc-model-selector>\n    </div>\n    }\n\n    <div class=\"button-group\">\n      <p-button (click)=\"saveSettings()\" label=\"Guardar cambios\"></p-button>\n      <p-button (click)=\"close()\" label=\"Cancelar\" styleClass=\"p-button-secondary\"></p-button>\n    </div>\n  </form>\n</div>\n", styles: [".dialog-container{padding:20px;border-radius:8px;min-width:300px;max-width:500px;max-height:80vh;overflow-y:auto}.dialog-content{margin:20px 0}.dialog-actions{display:flex;justify-content:flex-end}.settings-section{margin-bottom:20px}.settings-section label{display:block;margin-bottom:5px;font-weight:700}.settings-section small{display:block;margin-top:2px}.voice-selection{margin:15px 0}.voice-selection label{margin-right:15px}.button-group{margin-top:20px;display:flex;gap:10px;justify-content:flex-end}button{padding:8px 16px;border-radius:4px;border:none;cursor:pointer}button:first-child{background-color:#007bff}button:last-child{background-color:#6c757d}.space{margin-left:3px}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SliderModule }, { kind: "ngmodule", type: RadioButtonModule }, { kind: "component", type: i3$2.RadioButton, selector: "p-radioButton, p-radiobutton, p-radio-button", inputs: ["value", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "styleClass", "autofocus", "binary", "variant", "size"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: RatingModule }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: BadgeModule }, { kind: "ngmodule", type: SkeletonModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "component", type: ModelSelectorComponent, selector: "dc-model-selector", inputs: ["modelForm", "shortForm"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "pipe", type: SpeedDescPipe, name: "speedDisplay" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DCConversationUserChatSettingsComponent, decorators: [{
             type: Component,
@@ -5064,7 +5113,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
                         TooltipModule,
                         ModelSelectorComponent,
                         SelectModule,
-                    ], template: "<div class=\"dialog-container\">\n  <form [formGroup]=\"form\">\n    @if (showFeature().synthVoice) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"synthVoice\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.synthVoice.disabled\">Escuchar Voz</span>\n        <br />\n        <small>Desmarca si solo quieres leer texto</small>\n      </p>\n    </div>\n    } @if (showFeature().highlightWords) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"highlightWords\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Narraci\u00F3n de texto</span>\n        <br />\n        <small>Remarca las palabras como se van pronuncionando</small>\n      </p>\n    </div>\n    } @if (showFeature().speed) {\n    <div class=\"settings-section\">\n      <p>\n        Velocidad ({{ form.controls.speed.value | speedDisplay }})\n        <br />\n\n        <!-- <p-rating formControlName=\"speed\" iconOnClass=\"pi pi-step-forward\" iconOffClass=\"pi pi-minus\" /> -->\n\n        <p-select\n          id=\"speed\"\n          [options]=\"speedOptions\"\n          formControlName=\"speed\"\n          [placeholder]=\"'Select Language'\"\n          optionLabel=\"label\"\n          optionValue=\"value\"></p-select>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"realTime\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.realTime.disabled\">Tiempo real</span>\n        <br />\n        <small>No tienes que presionar el microphono, comenzar\u00E1 a grabar en cuanto la AI termine de hablar, cierra el chat para finalizar conversaci\u00F3n.</small>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"repeatRecording\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Reproducir mi grabaci\u00F3n</span>\n        <br />\n        <small>Escucha tu dialogo, despu\u00E9s de grabar, te ayudar\u00E1 a notar tus errores.</small>\n      </p>\n    </div>\n    } @if (showFeature().superHearing) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"superHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Super O\u00EDdo \uD83E\uDDBE</span>\n        <br />\n        <small>Tu audio se procesa en el servidor para mejor efectividad, si no usa el navegador.</small>\n      </p>\n    </div>\n    }\n\n    <!-- @if (showFeature().fixGrammar) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"fixGrammar\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.fixGrammar.disabled\">Corregir gram\u00E1tica</span>\n        <br />\n        <small>La ai corrige tu forma de hablar/escribir y te retrolimenta de tus errores</small>\n      </p>\n    </div>\n    }  -->\n\n    <!-- @if (showFeature().autoTranslate) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"autoTranslate\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.autoTranslate.disabled\">Mostrar Traducciones </span>\n        <br />\n        <small>Texto adicional con la traducci\u00F3n</small>\n      </p>\n    </div>\n    }  -->\n\n    @if (showFeature().autoTranslate) {\n    <div class=\"voice-selection\">\n      <span>Voz Preferencial:</span>\n      <br />\n      <p-radioButton value=\"random\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Aleatorio</label>\n      <p-radioButton value=\"randomMan\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Hombre</label>\n      <p-radioButton value=\"randomWoman\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Mujer</label>\n    </div>\n    }\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"userMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.userMessageTask.disabled\">Procesar mensajes de usuario</span>\n        <br />\n        <small>Correcciones, mejoras, retroalimentaci\u00F3n y sugerencias en el texto del usuario </small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"assistantMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.assistantMessageTask.disabled\">Procesar mensajes de asistente</span>\n        <br />\n        <small>Correcciones, traducciones, pensamientos adicionales y m\u00E1s ayuda en el texto del asistente </small>\n      </p>\n    </div>\n    \n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"saveConversations\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.saveConversations.disabled\">Guardar conversaciones</span>\n        <br />\n        <small>Si marcas esta casilla, las conversaciones se guardar\u00E1n en tu historial.</small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"multilingualHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.multilingualHearing.disabled\">Escuchar en varios idiomas</span>\n        <br />\n        <small>El asistente podr\u00E1 entender y responder en varios idiomas, pero puede confundir idiomas si no lo pronuncias claramente.</small>\n      </p>\n    </div>\n\n    @if(userService.isAdmin()) {\n    <div>\n      <hr />\n      <b> <i style=\"color: rgb(255, 149, 0)\" class=\"pi pi-key\"></i> Admin Section</b>\n      <br />\n\n      <b>Modelo:</b>\n\n      <dc-model-selector [modelForm]=\"form.controls.model\"></dc-model-selector>\n    </div>\n    }\n\n    <div class=\"button-group\">\n      <p-button (click)=\"saveSettings()\" label=\"Guardar cambios\"></p-button>\n      <p-button (click)=\"close()\" label=\"Cancelar\" styleClass=\"p-button-secondary\"></p-button>\n    </div>\n  </form>\n</div>\n", styles: [".dialog-container{padding:20px;background:#fff;border-radius:8px;min-width:300px;max-width:500px;max-height:80vh;overflow-y:auto}.dialog-content{margin:20px 0}.dialog-actions{display:flex;justify-content:flex-end}.settings-section{margin-bottom:20px}.settings-section label{display:block;margin-bottom:5px;font-weight:700}.settings-section small{display:block;color:#666;margin-top:2px}.voice-selection{margin:15px 0}.voice-selection label{margin-right:15px}.button-group{margin-top:20px;display:flex;gap:10px;justify-content:flex-end}button{padding:8px 16px;border-radius:4px;border:none;cursor:pointer}button:first-child{background-color:#007bff;color:#fff}button:last-child{background-color:#6c757d;color:#fff}.space{margin-left:3px}\n"] }]
+                    ], template: "<div class=\"dialog-container\">\n  <form [formGroup]=\"form\">\n    @if (showFeature().synthVoice) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"synthVoice\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.synthVoice.disabled\">Escuchar Voz</span>\n        <br />\n        <small>Desmarca si solo quieres leer texto</small>\n      </p>\n    </div>\n    } @if (showFeature().highlightWords) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"highlightWords\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Narraci\u00F3n de texto</span>\n        <br />\n        <small>Remarca las palabras como se van pronuncionando</small>\n      </p>\n    </div>\n    } @if (showFeature().speed) {\n    <div class=\"settings-section\">\n      <p>\n        Velocidad ({{ form.controls.speed.value | speedDisplay }})\n        <br />\n\n        <!-- <p-rating formControlName=\"speed\" iconOnClass=\"pi pi-step-forward\" iconOffClass=\"pi pi-minus\" /> -->\n\n        <p-select\n          id=\"speed\"\n          [options]=\"speedOptions\"\n          formControlName=\"speed\"\n          [placeholder]=\"'Select Language'\"\n          optionLabel=\"label\"\n          optionValue=\"value\"></p-select>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"realTime\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.realTime.disabled\">Tiempo real</span>\n        <br />\n        <small>No tienes que presionar el microphono, comenzar\u00E1 a grabar en cuanto la AI termine de hablar, cierra el chat para finalizar conversaci\u00F3n.</small>\n      </p>\n    </div>\n    } @if (showFeature().realTime) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"repeatRecording\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Reproducir mi grabaci\u00F3n</span>\n        <br />\n        <small>Escucha tu dialogo, despu\u00E9s de grabar, te ayudar\u00E1 a notar tus errores.</small>\n      </p>\n    </div>\n    } @if (showFeature().superHearing) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"superHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span>Super O\u00EDdo \uD83E\uDDBE</span>\n        <br />\n        <small>Tu audio se procesa en el servidor para mejor efectividad, si no usa el navegador.</small>\n      </p>\n    </div>\n    }\n\n    <!-- @if (showFeature().fixGrammar) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"fixGrammar\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.fixGrammar.disabled\">Corregir gram\u00E1tica</span>\n        <br />\n        <small>La ai corrige tu forma de hablar/escribir y te retrolimenta de tus errores</small>\n      </p>\n    </div>\n    }  -->\n\n    <!-- @if (showFeature().autoTranslate) {\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"autoTranslate\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.autoTranslate.disabled\">Mostrar Traducciones </span>\n        <br />\n        <small>Texto adicional con la traducci\u00F3n</small>\n      </p>\n    </div>\n    }  -->\n\n    @if (showFeature().autoTranslate) {\n    <div class=\"voice-selection\">\n      <span>Voz Preferencial:</span>\n      <br />\n      <p-radioButton value=\"random\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Aleatorio</label>\n      <p-radioButton value=\"randomMan\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Hombre</label>\n      <p-radioButton value=\"randomWoman\" formControlName=\"voice\"></p-radioButton>\n      <label class=\"space\">Mujer</label>\n    </div>\n    }\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"userMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.userMessageTask.disabled\">Procesar mensajes de usuario</span>\n        <br />\n        <small>Correcciones, mejoras, retroalimentaci\u00F3n y sugerencias en el texto del usuario </small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"assistantMessageTask\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.assistantMessageTask.disabled\">Procesar mensajes de asistente</span>\n        <br />\n        <small>Correcciones, traducciones, pensamientos adicionales y m\u00E1s ayuda en el texto del asistente </small>\n      </p>\n    </div>\n    \n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"saveConversations\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.saveConversations.disabled\">Guardar conversaciones</span>\n        <br />\n        <small>Si marcas esta casilla, las conversaciones se guardar\u00E1n en tu historial.</small>\n      </p>\n    </div>\n\n    <div class=\"settings-section\">\n      <p>\n        <p-checkbox class=\"mr-2\" formControlName=\"multilingualHearing\" [binary]=\"true\" inputId=\"binary\"></p-checkbox>\n        <span [class.cross]=\"form.controls.multilingualHearing.disabled\">Escuchar en varios idiomas</span>\n        <br />\n        <small>El asistente podr\u00E1 entender y responder en varios idiomas, pero puede confundir idiomas si no lo pronuncias claramente.</small>\n      </p>\n    </div>\n\n    @if(userService.isAdmin()) {\n    <div>\n      <hr />\n      <b> <i style=\"color: rgb(255, 149, 0)\" class=\"pi pi-key\"></i> Admin Section</b>\n      <br />\n\n      <b>Modelo:</b>\n\n      <dc-model-selector [modelForm]=\"form.controls.model\"></dc-model-selector>\n    </div>\n    }\n\n    <div class=\"button-group\">\n      <p-button (click)=\"saveSettings()\" label=\"Guardar cambios\"></p-button>\n      <p-button (click)=\"close()\" label=\"Cancelar\" styleClass=\"p-button-secondary\"></p-button>\n    </div>\n  </form>\n</div>\n", styles: [".dialog-container{padding:20px;border-radius:8px;min-width:300px;max-width:500px;max-height:80vh;overflow-y:auto}.dialog-content{margin:20px 0}.dialog-actions{display:flex;justify-content:flex-end}.settings-section{margin-bottom:20px}.settings-section label{display:block;margin-bottom:5px;font-weight:700}.settings-section small{display:block;margin-top:2px}.voice-selection{margin:15px 0}.voice-selection label{margin-right:15px}.button-group{margin-top:20px;display:flex;gap:10px;justify-content:flex-end}button{padding:8px 16px;border-radius:4px;border:none;cursor:pointer}button:first-child{background-color:#007bff}button:last-child{background-color:#6c757d}.space{margin-left:3px}\n"] }]
         }], propDecorators: { showFeature: [{ type: i0.Input, args: [{ isSignal: true, alias: "showFeature", required: false }] }], onSettingsChange: [{ type: i0.Output, args: ["onSettingsChange"] }], closeClicked: [{ type: i0.Output, args: ["closeClicked"] }], settingsApplied: [{ type: i0.Output, args: ["settingsApplied"] }], tooltipRef: [{
                 type: ViewChild,
                 args: ['tooltipRef']
@@ -5325,7 +5374,7 @@ class DcImmersiveChatComponent {
         <dc-mic (onFinished)="handleMicFinished($event)"></dc-mic>
       </div>
     </div>
-  `, isInline: true, styles: [":host{height:100%}.immersive-container{display:flex;flex-direction:column;height:100%;width:100%;background:radial-gradient(circle at center,#1e1e2d33,#0a0a0f1a);padding:2rem;box-sizing:border-box;overflow:hidden}.hud-section{flex:1;display:flex;flex-direction:column;align-items:center;width:100%;overflow-y:auto;min-height:0;padding:1rem 1.5rem;scrollbar-width:none}.hud-section::-webkit-scrollbar{display:none}.hud-section>div{margin:auto 0;width:100%;display:flex;flex-direction:column}.mic-section{flex-shrink:0;position:relative;height:180px;display:flex;align-items:center;justify-content:center;margin-top:1rem;padding-bottom:2rem}.mic-ripple-glow{position:absolute;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(64,156,255,.2) 0%,transparent 70%);animation:breathe 4s ease-in-out infinite;z-index:0}.mic-section.is-talking .mic-ripple-glow{background:radial-gradient(circle,rgba(64,255,156,.3) 0%,transparent 70%);animation:pulse-active 1.5s ease-in-out infinite}.mic-section dc-mic{z-index:1;transform:scale(1.5);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.mic-section dc-mic:hover{transform:scale(1.6)}.active-sentence-hud{max-width:1000px;width:100%;transition:all .5s cubic-bezier(.4,0,.2,1);text-shadow:0 10px 30px rgba(0,0,0,.5);animation:fadeIn .8s ease-out}.active-sentence-hud ::ng-deep .audio-text-sync-container{background:transparent!important;padding:0!important;justify-content:center}.active-sentence-hud ::ng-deep .play-button{display:none!important}.active-sentence-hud ::ng-deep .text-content{font-size:clamp(1.8rem,6vw,3.5rem);font-weight:700;text-align:center;line-height:1.2;color:#ffffffe6;margin:0;letter-spacing:-.02em}.active-sentence-hud ::ng-deep .highlight{background:transparent!important;color:#fff;text-shadow:0 0 20px rgba(255,255,255,.8),0 0 40px rgba(64,156,255,.4);filter:brightness(1.2)}.user-talking-indicator,.idle-indicator,.last-message-hud,.thinking-indicator{font-size:1.8rem;color:#fff;opacity:.7;font-weight:300;text-align:center;max-width:800px;line-height:1.4}.thinking-indicator{animation:pulse-thinking 2s infinite ease-in-out}@keyframes pulse-thinking{0%,to{opacity:.5;transform:scale(.98)}50%{opacity:.9;transform:scale(1.02)}}.idle-indicator p{background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);padding:1rem 2rem;border-radius:50px}@keyframes breathe{0%,to{transform:scale(1);opacity:.2}50%{transform:scale(1.2);opacity:.4}}@keyframes pulse-active{0%{transform:scale(1);opacity:.5;box-shadow:0 0 #40ff9c66}70%{transform:scale(1.5);opacity:0;box-shadow:0 0 0 40px transparent}to{transform:scale(1);opacity:0}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DCMicComponent, selector: "dc-mic", inputs: ["targetOrBase", "micSettings", "maxRecordingTime", "isDone"], outputs: ["onInterpretedText", "onFinishedRecognition", "onFinished"] }, { kind: "component", type: MessageContentDisplayer, selector: "message-content-displayer", inputs: ["message", "markWord", "highlightColor"], outputs: ["playAudio", "audioCompleted", "audioStatusChanged", "wordClicked"] }] }); }
+  `, isInline: true, styles: [":host{height:100%}.immersive-container{display:flex;flex-direction:column;height:100%;width:100%;background:radial-gradient(circle at center,#1e1e2d33,#0a0a0f1a);padding:2rem;box-sizing:border-box;overflow:hidden}.hud-section{flex:1;display:flex;flex-direction:column;align-items:center;width:100%;overflow-y:auto;min-height:0;padding:1rem 1.5rem;scrollbar-width:none}.hud-section::-webkit-scrollbar{display:none}.hud-section>div{margin:auto 0;width:100%;display:flex;flex-direction:column}.mic-section{flex-shrink:0;position:relative;height:180px;display:flex;align-items:center;justify-content:center;margin-top:1rem;padding-bottom:2rem}.mic-ripple-glow{position:absolute;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(64,156,255,.2) 0%,transparent 70%);animation:breathe 4s ease-in-out infinite;z-index:0}.mic-section.is-talking .mic-ripple-glow{background:radial-gradient(circle,rgba(64,255,156,.3) 0%,transparent 70%);animation:pulse-active 1.5s ease-in-out infinite}.mic-section dc-mic{z-index:1;transform:scale(1.5);transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.mic-section dc-mic:hover{transform:scale(1.6)}.active-sentence-hud{max-width:1000px;width:100%;transition:all .5s cubic-bezier(.4,0,.2,1);text-shadow:0 10px 30px rgba(0,0,0,.5);animation:fadeIn .8s ease-out}.active-sentence-hud ::ng-deep .audio-text-sync-container{background:transparent!important;padding:0!important;justify-content:center}.active-sentence-hud ::ng-deep .play-button{display:none!important}.active-sentence-hud ::ng-deep .text-content{font-size:clamp(1.8rem,6vw,3.5rem);font-weight:700;text-align:center;line-height:1.2;color:#ffffffe6;margin:0;letter-spacing:-.02em}.active-sentence-hud ::ng-deep .highlight{background:transparent!important;color:#fff;text-shadow:0 0 20px rgba(255,255,255,.8),0 0 40px rgba(64,156,255,.4);filter:brightness(1.2)}.user-talking-indicator,.idle-indicator,.last-message-hud,.thinking-indicator{font-size:1.8rem;color:#fff;opacity:.7;font-weight:300;text-align:center;max-width:800px;line-height:1.4}.thinking-indicator{animation:pulse-thinking 2s infinite ease-in-out}@keyframes pulse-thinking{0%,to{opacity:.5;transform:scale(.98)}50%{opacity:.9;transform:scale(1.02)}}.idle-indicator p{background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);padding:1rem 2rem;border-radius:50px}@keyframes breathe{0%,to{transform:scale(1);opacity:.2}50%{transform:scale(1.2);opacity:.4}}@keyframes pulse-active{0%{transform:scale(1);opacity:.5;box-shadow:0 0 #40ff9c66}70%{transform:scale(1.5);opacity:0;box-shadow:0 0 0 40px transparent}to{transform:scale(1);opacity:0}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: DCMicComponent, selector: "dc-mic", inputs: ["targetOrBase", "micSettings", "maxRecordingTime", "isDone"], outputs: ["onInterpretedText", "onFinishedRecognition", "onFinished", "onCanceled"] }, { kind: "component", type: MessageContentDisplayer, selector: "message-content-displayer", inputs: ["message", "markWord", "highlightColor"], outputs: ["playAudio", "audioCompleted", "audioStatusChanged", "wordClicked"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DcImmersiveChatComponent, decorators: [{
             type: Component,
@@ -7082,11 +7131,11 @@ class DcDoActionFormComponent {
         this.removeItem.emit({ conditionIndex: this.conditionIndex, doItemIndex: this.doItemIndex });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DcDoActionFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DcDoActionFormComponent, isStandalone: true, selector: "dc-do-action-form", inputs: { formGroup: "formGroup", conditionIndex: "conditionIndex", doItemIndex: "doItemIndex", systemPromptTypeOptions: "systemPromptTypeOptions" }, outputs: { removeItem: "removeItem" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"shadow-md rounded-lg p-5 mb-4 border border-gray-200\">\n  <div class=\"flex justify-between items-center\">\n    <h5 class=\"text-lg font-semibold text-gray-700\">Task {{ doItemIndex + 1 }}</h5>\n    <button pButton type=\"button\" severity=\"danger\" icon=\"pi pi-trash\" (click)=\"onRemoveItem()\" class=\"p-button-sm p-button-text p-button-rounded\"></button>\n  </div>\n  <div class=\"space-y-4\">\n    <!-- Action Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'actionType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Action Type</label>\n      <p-select\n        [options]=\"doActionTypeOptions\"\n        formControlName=\"actionType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Action Type'\"\n        [id]=\"'actionType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    @switch (formGroup.get('actionType')?.value) { @case (EDoActionType.ChangePrompt) {\n    <!-- System Prompt Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">System Prompt Type</label>\n      <p-select\n        [options]=\"systemPromptTypeOptions\"\n        formControlName=\"systemPromptType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select System Prompt Type'\"\n        [id]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n    } @case (EDoActionType.ChangeDynamicFlowTask) {\n    <!-- Dynamic Flow Task Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\" class=\"mb-1 text-sm font-medium text-gray-600\">Dynamic Flow Task Type</label>\n      <p-select\n        [options]=\"dynamicFlowTaskTypeOptions\"\n        formControlName=\"dynamicFlowTaskType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Dynamic Flow Task Type'\"\n        [id]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n\n    <!-- Enabled -->\n    <div class=\"flex items-center\">\n      <p-checkbox [formControlName]=\"'enabled'\" [binary]=\"true\" [inputId]=\"'enabled_' + conditionIndex + '_' + doItemIndex\"></p-checkbox>\n      <label [for]=\"'enabled_' + conditionIndex + '_' + doItemIndex\" class=\"ml-2 text-sm font-medium text-gray-700\">Enabled</label>\n    </div>\n    } }\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DcDoActionFormComponent, isStandalone: true, selector: "dc-do-action-form", inputs: { formGroup: "formGroup", conditionIndex: "conditionIndex", doItemIndex: "doItemIndex", systemPromptTypeOptions: "systemPromptTypeOptions" }, outputs: { removeItem: "removeItem" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"shadow-md rounded-lg p-5 mb-4 border border-gray-200\">\n  <div class=\"flex justify-between items-center\">\n    <h5 class=\"text-lg font-semibold \">Task {{ doItemIndex + 1 }}</h5>\n    <button pButton type=\"button\" severity=\"danger\" icon=\"pi pi-trash\" (click)=\"onRemoveItem()\" class=\"p-button-sm p-button-text p-button-rounded\"></button>\n  </div>\n  <div class=\"space-y-4\">\n    <!-- Action Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'actionType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Action Type</label>\n      <p-select\n        [options]=\"doActionTypeOptions\"\n        formControlName=\"actionType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Action Type'\"\n        [id]=\"'actionType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    @switch (formGroup.get('actionType')?.value) { @case (EDoActionType.ChangePrompt) {\n    <!-- System Prompt Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">System Prompt Type</label>\n      <p-select\n        [options]=\"systemPromptTypeOptions\"\n        formControlName=\"systemPromptType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select System Prompt Type'\"\n        [id]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n    } @case (EDoActionType.ChangeDynamicFlowTask) {\n    <!-- Dynamic Flow Task Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\" class=\"mb-1 text-sm font-medium text-gray-600\">Dynamic Flow Task Type</label>\n      <p-select\n        [options]=\"dynamicFlowTaskTypeOptions\"\n        formControlName=\"dynamicFlowTaskType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Dynamic Flow Task Type'\"\n        [id]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n\n    <!-- Enabled -->\n    <div class=\"flex items-center\">\n      <p-checkbox [formControlName]=\"'enabled'\" [binary]=\"true\" [inputId]=\"'enabled_' + conditionIndex + '_' + doItemIndex\"></p-checkbox>\n      <label [for]=\"'enabled_' + conditionIndex + '_' + doItemIndex\" class=\"ml-2 text-sm font-medium \">Enabled</label>\n    </div>\n    } }\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["hostName", "value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DcDoActionFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-do-action-form', standalone: true, imports: [CommonModule, ReactiveFormsModule, ButtonModule, SelectModule, TextareaModule, TooltipModule, CheckboxModule], template: "<div [formGroup]=\"formGroup\" class=\"shadow-md rounded-lg p-5 mb-4 border border-gray-200\">\n  <div class=\"flex justify-between items-center\">\n    <h5 class=\"text-lg font-semibold text-gray-700\">Task {{ doItemIndex + 1 }}</h5>\n    <button pButton type=\"button\" severity=\"danger\" icon=\"pi pi-trash\" (click)=\"onRemoveItem()\" class=\"p-button-sm p-button-text p-button-rounded\"></button>\n  </div>\n  <div class=\"space-y-4\">\n    <!-- Action Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'actionType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Action Type</label>\n      <p-select\n        [options]=\"doActionTypeOptions\"\n        formControlName=\"actionType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Action Type'\"\n        [id]=\"'actionType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    @switch (formGroup.get('actionType')?.value) { @case (EDoActionType.ChangePrompt) {\n    <!-- System Prompt Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">System Prompt Type</label>\n      <p-select\n        [options]=\"systemPromptTypeOptions\"\n        formControlName=\"systemPromptType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select System Prompt Type'\"\n        [id]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n    } @case (EDoActionType.ChangeDynamicFlowTask) {\n    <!-- Dynamic Flow Task Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\" class=\"mb-1 text-sm font-medium text-gray-600\">Dynamic Flow Task Type</label>\n      <p-select\n        [options]=\"dynamicFlowTaskTypeOptions\"\n        formControlName=\"dynamicFlowTaskType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Dynamic Flow Task Type'\"\n        [id]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n\n    <!-- Enabled -->\n    <div class=\"flex items-center\">\n      <p-checkbox [formControlName]=\"'enabled'\" [binary]=\"true\" [inputId]=\"'enabled_' + conditionIndex + '_' + doItemIndex\"></p-checkbox>\n      <label [for]=\"'enabled_' + conditionIndex + '_' + doItemIndex\" class=\"ml-2 text-sm font-medium text-gray-700\">Enabled</label>\n    </div>\n    } }\n  </div>\n</div>\n" }]
+            args: [{ selector: 'dc-do-action-form', standalone: true, imports: [CommonModule, ReactiveFormsModule, ButtonModule, SelectModule, TextareaModule, TooltipModule, CheckboxModule], template: "<div [formGroup]=\"formGroup\" class=\"shadow-md rounded-lg p-5 mb-4 border border-gray-200\">\n  <div class=\"flex justify-between items-center\">\n    <h5 class=\"text-lg font-semibold \">Task {{ doItemIndex + 1 }}</h5>\n    <button pButton type=\"button\" severity=\"danger\" icon=\"pi pi-trash\" (click)=\"onRemoveItem()\" class=\"p-button-sm p-button-text p-button-rounded\"></button>\n  </div>\n  <div class=\"space-y-4\">\n    <!-- Action Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'actionType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Action Type</label>\n      <p-select\n        [options]=\"doActionTypeOptions\"\n        formControlName=\"actionType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Action Type'\"\n        [id]=\"'actionType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    @switch (formGroup.get('actionType')?.value) { @case (EDoActionType.ChangePrompt) {\n    <!-- System Prompt Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">System Prompt Type</label>\n      <p-select\n        [options]=\"systemPromptTypeOptions\"\n        formControlName=\"systemPromptType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select System Prompt Type'\"\n        [id]=\"'systemPromptType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n    } @case (EDoActionType.ChangeDynamicFlowTask) {\n    <!-- Dynamic Flow Task Type -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\" class=\"mb-1 text-sm font-medium text-gray-600\">Dynamic Flow Task Type</label>\n      <p-select\n        [options]=\"dynamicFlowTaskTypeOptions\"\n        formControlName=\"dynamicFlowTaskType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Dynamic Flow Task Type'\"\n        [id]=\"'dynamicFlowTaskType_' + conditionIndex + '_' + doItemIndex\"\n        styleClass=\"w-full\"\n        [panelStyle]=\"{ width: '100%' }\"></p-select>\n    </div>\n\n    <!-- Prompt -->\n    <div class=\"flex flex-col\">\n      <label [for]=\"'prompt_' + conditionIndex + '_' + doItemIndex\" class=\"text-sm font-medium text-gray-600\">Prompt</label>\n      <textarea\n        pTextarea\n        [autoResize]=\"true\"\n        [id]=\"'prompt_' + conditionIndex + '_' + doItemIndex\"\n        formControlName=\"prompt\"\n        rows=\"3\"\n        class=\"w-full p-inputtext p-component rounded-md border-gray-300 focus:border-primary-500 focus:ring focus:ring-primary-200 focus:ring-opacity-50\"></textarea>\n    </div>\n\n    <!-- Enabled -->\n    <div class=\"flex items-center\">\n      <p-checkbox [formControlName]=\"'enabled'\" [binary]=\"true\" [inputId]=\"'enabled_' + conditionIndex + '_' + doItemIndex\"></p-checkbox>\n      <label [for]=\"'enabled_' + conditionIndex + '_' + doItemIndex\" class=\"ml-2 text-sm font-medium \">Enabled</label>\n    </div>\n    } }\n  </div>\n</div>\n" }]
         }], propDecorators: { formGroup: [{
                 type: Input,
                 args: [{ required: true }]
@@ -7276,7 +7325,7 @@ class DCConversationFlowFormComponent {
         console.log(this.formGroup.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DCConversationFlowFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DCConversationFlowFormComponent, isStandalone: true, selector: "dc-conversation-flow-form", inputs: { formGroup: "formGroup" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"group\">\n  <h3>Conversation Flow <span pTooltip=\"Define the flow and logic of the conversation\">\u2139\uFE0F</span></h3>\n\n  <div formGroupName=\"moodState\" class=\"group\">\n    <h4>Mood State <span pTooltip=\"Configure mood detection settings\">\u2139\uFE0F</span></h4>\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"enabled\"></p-toggleswitch>\n\n      <label for=\"enabled\">Detectar estado de animo? \uD83D\uDE12 \uD83E\uDD22 \uD83D\uDE24 \uD83D\uDE08 \uD83D\uDE31 <span pTooltip=\"Enable mood state detection\">\u2139\uFE0F</span></label>\n    </div>\n\n    @if (formGroup.controls.moodState.controls.enabled.value) {\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"useAssetStatesOnly\"></p-toggleswitch>\n\n      <label for=\"useAssetStatesOnly\"\n        >Use Asset States Only <span pTooltip=\"Depends on the motion assets, if you tag with moods, those will be the only ones detected\">\u2139\uFE0F</span></label\n      >\n    </div>\n\n    <div class=\"form-field\">\n      <label for=\"detectableStates\">Detectable States <span pTooltip=\"List of detectable mood states\">\u2139\uFE0F</span></label>\n      <i>Pending for development</i>\n    </div>\n    }\n  </div>\n\n  <div class=\"form-field\">\n    <label for=\"flowGoal\"\n      >Goal\n      <span pTooltip=\"Aqu\u00ED se especifican las reglas de como se progresa en la conversaci\u00F3n , si esta desmarcada utiliza el prompt default\">\u2139\uFE0F</span></label\n    >\n\n    <agent-task-form [formGroup]=\"formGroup.controls.goal\" [shortForm]=\"true\"></agent-task-form>\n  </div>\n\n  <details>\n    <summary>Trigger Task (Tareas autom\u00E1ticas que se activan al conversar)</summary>\n\n    <div formGroupName=\"triggerTasks\" class=\"group\">\n      <h4\n        >Trigger Tasks\n        <span\n          (click)=\"showData()\"\n          pTooltip=\"Tareas que se ejecutan en eventos espec\u00EDficos de la conversaci\u00F3n como  cuando el usuario env\u00EDa un mensaje, cuando el agente responde, etc. se visualizan normalmente en la secci\u00F3n de retro\"\n          >\u2139\uFE0F</span\n        ></h4\n      >\n      @for (eventKey of objectKeys(formGroup.controls.triggerTasks.controls); track eventKey) {\n      <div class=\"form-field\">\n        <label [for]=\"eventKey\">\n          <b>{{ eventKey | formatKey }}</b>\n        </label>\n        <agent-task-form [formGroup]=\"formGroup.controls.triggerTasks.controls[eventKey]\" [shortForm]=\"true\"></agent-task-form>\n      </div>\n      }\n    </div>\n  </details>\n  <details>\n    <summary>Tools (Herramientas que usa la APP al ocurrir eventos)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.tools\" title=\"Tool\" mode=\"select\" [availableItems]=\"validTools\"> </dc-dynamic-criteria-form>\n  </details>\n  <details>\n    <summary>Challenges (Mini Desafios al conversar)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.challenges\" title=\"Challenge\" mode=\"free-text\"> </dc-dynamic-criteria-form>\n  </details>\n\n  <br />\n    <div class=\"form-field\">\n    <label for=\"maxTurns\"\n      >Max Turns (Assistant Role)\n      <span pTooltip=\"Maximum number of turns (assistant responses) before the conversation ends. Recommended: 10-30. Default: 20\">\u2139\uFE0F</span></label\n    >\n    <br />\n    <p-inputnumber formControlName=\"maxTurns\" [showButtons]=\"true\" [min]=\"0\" [max]=\"100\" placeholder=\"Set max turns...\"></p-inputnumber>\n  </div>\n\n  <hr />\n\n  <h4>Performance Analysis</h4>\n    <div class=\"form-field\">\n    <p-toggleswitch formControlName=\"enablePerformanceAnalysis\"></p-toggleswitch>\n    <label>\n      Retroalimentaci\u00F3n y Rendimiento Final\n      <span pTooltip=\"When enabled, an AI performance analysis is triggered when the conversation ends. Requires at least 5 messages.\">\u2139\uFE0F</span>\n    </label>\n  </div>\n\n\n\n\n\n  @if (formGroup.controls.enablePerformanceAnalysis.value) {\n  <div class=\"form-field\">\n    <label for=\"performancePrompt\"\n      >Prompt de Retroalimentaci\u00F3n\n      <span pTooltip=\"Custom prompt for the final performance analysis. If empty, the system uses the default template.\">\u2139\uFE0F</span></label\n    >\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" formControlName=\"performancePrompt\" placeholder=\"Enter custom performance prompt...\"></textarea>\n  </div>\n  }\n\n  <dc-dynamic-conditions-form\n    [dynamicConditionsArray]=\"formGroup.controls.dynamicConditions\"\n    [dynamicConditionsPath]=\"'formGroup.controls.dynamicConditions'\"\n    [entityWhatOptions]=\"entityWhatOptions\"\n    [entityWhenOptions]=\"entityWhenOptions\"\n    [systemPromptTypeOptions]=\"systemPromptTypeOptions\">\n  </dc-dynamic-conditions-form>\n</div>\n", styles: [".nested-group{border:1px solid #eee;padding:10px;margin-top:10px;border-radius:4px}.very-nested-group{border:1px dashed #ccc;padding:8px;margin-top:8px;border-radius:4px}.dynamic-condition-item{margin-bottom:15px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormArrayDirective, selector: "[formArray]", inputs: ["formArray"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: AgentTaskFormComponent, selector: "agent-task-form", inputs: ["formGroup", "shortForm"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: DcDynamicConditionsFormComponent, selector: "dc-dynamic-conditions-form", inputs: ["dynamicConditionsArray", "dynamicConditionsPath", "entityWhatOptions", "entityWhenOptions", "systemPromptTypeOptions"] }, { kind: "component", type: DcDynamicCriteriaFormComponent, selector: "dc-dynamic-criteria-form", inputs: ["formArray", "title", "mode", "availableItems"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i4$1.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i5$2.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "pipe", type: FormatKeyPipe, name: "formatKey" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DCConversationFlowFormComponent, isStandalone: true, selector: "dc-conversation-flow-form", inputs: { formGroup: "formGroup" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"group\">\n  <h3>Conversation Flow <span pTooltip=\"Define the flow and logic of the conversation\">\u2139\uFE0F</span></h3>\n\n  <div formGroupName=\"moodState\" class=\"group\">\n    <h4>Mood State <span pTooltip=\"Configure mood detection settings\">\u2139\uFE0F</span></h4>\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"enabled\"></p-toggleswitch>\n\n      <label for=\"enabled\"> Detectar estado de animo? \uD83D\uDE12 \uD83E\uDD22 \uD83D\uDE24 \uD83D\uDE08 \uD83D\uDE31 <span pTooltip=\"Enable mood state detection\">\u2139\uFE0F</span></label>\n    </div>\n\n    @if (formGroup.controls.moodState.controls.enabled.value) {\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"useAssetStatesOnly\"></p-toggleswitch>\n\n      <label for=\"useAssetStatesOnly\"\n        > Solo puede sentir emociones Etiquetadas <span pTooltip=\"Depends on the motion assets, if you tag with moods, those will be the only ones detected\">\u2139\uFE0F</span></label\n      >\n    </div>\n\n    <p-divider></p-divider>\n\n\n    }\n  </div>\n\n  <div class=\"form-field\">\n    <label for=\"flowGoal\"\n      >Goal\n      <span pTooltip=\"Aqu\u00ED se especifican las reglas de como se progresa en la conversaci\u00F3n , si esta desmarcada utiliza el prompt default\">\u2139\uFE0F</span></label\n    >\n\n    <agent-task-form [formGroup]=\"formGroup.controls.goal\" [shortForm]=\"true\"></agent-task-form>\n  </div>\n\n  <details>\n    <summary>Trigger Task (Tareas autom\u00E1ticas que se activan al conversar)</summary>\n\n    <div formGroupName=\"triggerTasks\" class=\"group\">\n      <h4\n        >Trigger Tasks\n        <span\n          (click)=\"showData()\"\n          pTooltip=\"Tareas que se ejecutan en eventos espec\u00EDficos de la conversaci\u00F3n como  cuando el usuario env\u00EDa un mensaje, cuando el agente responde, etc. se visualizan normalmente en la secci\u00F3n de retro\"\n          >\u2139\uFE0F</span\n        ></h4\n      >\n      @for (eventKey of objectKeys(formGroup.controls.triggerTasks.controls); track eventKey) {\n      <div class=\"form-field\">\n        <label [for]=\"eventKey\">\n          <b>{{ eventKey | formatKey }}</b>\n        </label>\n        <agent-task-form [formGroup]=\"formGroup.controls.triggerTasks.controls[eventKey]\" [shortForm]=\"true\"></agent-task-form>\n      </div>\n      }\n    </div>\n  </details>\n  <details>\n    <summary>Tools (Herramientas que usa la APP al ocurrir eventos)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.tools\" title=\"Tool\" mode=\"select\" [availableItems]=\"validTools\"> </dc-dynamic-criteria-form>\n  </details>\n  <details>\n    <summary>Challenges (Mini Desafios al conversar)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.challenges\" title=\"Challenge\" mode=\"free-text\"> </dc-dynamic-criteria-form>\n  </details>\n\n  <br />\n    <div class=\"form-field\">\n    <label for=\"maxTurns\"\n      >Max Turns (Assistant Role)\n      <span pTooltip=\"Maximum number of turns (assistant responses) before the conversation ends. Recommended: 10-30. Default: 20\">\u2139\uFE0F</span></label\n    >\n    <br />\n    <p-inputnumber formControlName=\"maxTurns\" [showButtons]=\"true\" [min]=\"0\" [max]=\"100\" placeholder=\"Set max turns...\"></p-inputnumber>\n  </div>\n\n  <hr />\n\n  <h4>Performance Analysis</h4>\n    <div class=\"form-field\">\n    <p-toggleswitch formControlName=\"enablePerformanceAnalysis\"></p-toggleswitch>\n    <label>\n      Retroalimentaci\u00F3n y Rendimiento Final\n      <span pTooltip=\"When enabled, an AI performance analysis is triggered when the conversation ends. Requires at least 5 messages.\">\u2139\uFE0F</span>\n    </label>\n  </div>\n\n\n\n\n\n  @if (formGroup.controls.enablePerformanceAnalysis.value) {\n  <div class=\"form-field\">\n    <label for=\"performancePrompt\"\n      >Prompt de Retroalimentaci\u00F3n\n      <span pTooltip=\"Custom prompt for the final performance analysis. If empty, the system uses the default template.\">\u2139\uFE0F</span></label\n    >\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" formControlName=\"performancePrompt\" placeholder=\"Enter custom performance prompt...\"></textarea>\n  </div>\n  }\n\n  <dc-dynamic-conditions-form\n    [dynamicConditionsArray]=\"formGroup.controls.dynamicConditions\"\n    [dynamicConditionsPath]=\"'formGroup.controls.dynamicConditions'\"\n    [entityWhatOptions]=\"entityWhatOptions\"\n    [entityWhenOptions]=\"entityWhenOptions\"\n    [systemPromptTypeOptions]=\"systemPromptTypeOptions\">\n  </dc-dynamic-conditions-form>\n</div>\n", styles: [".nested-group{border:1px solid #eee;padding:10px;margin-top:10px;border-radius:4px}.very-nested-group{border:1px dashed #ccc;padding:8px;margin-top:8px;border-radius:4px}.dynamic-condition-item{margin-bottom:15px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormArrayDirective, selector: "[formArray]", inputs: ["formArray"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: AgentTaskFormComponent, selector: "agent-task-form", inputs: ["formGroup", "shortForm"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: DcDynamicConditionsFormComponent, selector: "dc-dynamic-conditions-form", inputs: ["dynamicConditionsArray", "dynamicConditionsPath", "entityWhatOptions", "entityWhenOptions", "systemPromptTypeOptions"] }, { kind: "component", type: DcDynamicCriteriaFormComponent, selector: "dc-dynamic-criteria-form", inputs: ["formArray", "title", "mode", "availableItems"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i4$1.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i5$2.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i1$3.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "pipe", type: FormatKeyPipe, name: "formatKey" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DCConversationFlowFormComponent, decorators: [{
             type: Component,
@@ -7294,7 +7343,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
                         FormatKeyPipe,
                         ToggleSwitchModule,
                         InputNumberModule,
-                    ], template: "<div [formGroup]=\"formGroup\" class=\"group\">\n  <h3>Conversation Flow <span pTooltip=\"Define the flow and logic of the conversation\">\u2139\uFE0F</span></h3>\n\n  <div formGroupName=\"moodState\" class=\"group\">\n    <h4>Mood State <span pTooltip=\"Configure mood detection settings\">\u2139\uFE0F</span></h4>\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"enabled\"></p-toggleswitch>\n\n      <label for=\"enabled\">Detectar estado de animo? \uD83D\uDE12 \uD83E\uDD22 \uD83D\uDE24 \uD83D\uDE08 \uD83D\uDE31 <span pTooltip=\"Enable mood state detection\">\u2139\uFE0F</span></label>\n    </div>\n\n    @if (formGroup.controls.moodState.controls.enabled.value) {\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"useAssetStatesOnly\"></p-toggleswitch>\n\n      <label for=\"useAssetStatesOnly\"\n        >Use Asset States Only <span pTooltip=\"Depends on the motion assets, if you tag with moods, those will be the only ones detected\">\u2139\uFE0F</span></label\n      >\n    </div>\n\n    <div class=\"form-field\">\n      <label for=\"detectableStates\">Detectable States <span pTooltip=\"List of detectable mood states\">\u2139\uFE0F</span></label>\n      <i>Pending for development</i>\n    </div>\n    }\n  </div>\n\n  <div class=\"form-field\">\n    <label for=\"flowGoal\"\n      >Goal\n      <span pTooltip=\"Aqu\u00ED se especifican las reglas de como se progresa en la conversaci\u00F3n , si esta desmarcada utiliza el prompt default\">\u2139\uFE0F</span></label\n    >\n\n    <agent-task-form [formGroup]=\"formGroup.controls.goal\" [shortForm]=\"true\"></agent-task-form>\n  </div>\n\n  <details>\n    <summary>Trigger Task (Tareas autom\u00E1ticas que se activan al conversar)</summary>\n\n    <div formGroupName=\"triggerTasks\" class=\"group\">\n      <h4\n        >Trigger Tasks\n        <span\n          (click)=\"showData()\"\n          pTooltip=\"Tareas que se ejecutan en eventos espec\u00EDficos de la conversaci\u00F3n como  cuando el usuario env\u00EDa un mensaje, cuando el agente responde, etc. se visualizan normalmente en la secci\u00F3n de retro\"\n          >\u2139\uFE0F</span\n        ></h4\n      >\n      @for (eventKey of objectKeys(formGroup.controls.triggerTasks.controls); track eventKey) {\n      <div class=\"form-field\">\n        <label [for]=\"eventKey\">\n          <b>{{ eventKey | formatKey }}</b>\n        </label>\n        <agent-task-form [formGroup]=\"formGroup.controls.triggerTasks.controls[eventKey]\" [shortForm]=\"true\"></agent-task-form>\n      </div>\n      }\n    </div>\n  </details>\n  <details>\n    <summary>Tools (Herramientas que usa la APP al ocurrir eventos)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.tools\" title=\"Tool\" mode=\"select\" [availableItems]=\"validTools\"> </dc-dynamic-criteria-form>\n  </details>\n  <details>\n    <summary>Challenges (Mini Desafios al conversar)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.challenges\" title=\"Challenge\" mode=\"free-text\"> </dc-dynamic-criteria-form>\n  </details>\n\n  <br />\n    <div class=\"form-field\">\n    <label for=\"maxTurns\"\n      >Max Turns (Assistant Role)\n      <span pTooltip=\"Maximum number of turns (assistant responses) before the conversation ends. Recommended: 10-30. Default: 20\">\u2139\uFE0F</span></label\n    >\n    <br />\n    <p-inputnumber formControlName=\"maxTurns\" [showButtons]=\"true\" [min]=\"0\" [max]=\"100\" placeholder=\"Set max turns...\"></p-inputnumber>\n  </div>\n\n  <hr />\n\n  <h4>Performance Analysis</h4>\n    <div class=\"form-field\">\n    <p-toggleswitch formControlName=\"enablePerformanceAnalysis\"></p-toggleswitch>\n    <label>\n      Retroalimentaci\u00F3n y Rendimiento Final\n      <span pTooltip=\"When enabled, an AI performance analysis is triggered when the conversation ends. Requires at least 5 messages.\">\u2139\uFE0F</span>\n    </label>\n  </div>\n\n\n\n\n\n  @if (formGroup.controls.enablePerformanceAnalysis.value) {\n  <div class=\"form-field\">\n    <label for=\"performancePrompt\"\n      >Prompt de Retroalimentaci\u00F3n\n      <span pTooltip=\"Custom prompt for the final performance analysis. If empty, the system uses the default template.\">\u2139\uFE0F</span></label\n    >\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" formControlName=\"performancePrompt\" placeholder=\"Enter custom performance prompt...\"></textarea>\n  </div>\n  }\n\n  <dc-dynamic-conditions-form\n    [dynamicConditionsArray]=\"formGroup.controls.dynamicConditions\"\n    [dynamicConditionsPath]=\"'formGroup.controls.dynamicConditions'\"\n    [entityWhatOptions]=\"entityWhatOptions\"\n    [entityWhenOptions]=\"entityWhenOptions\"\n    [systemPromptTypeOptions]=\"systemPromptTypeOptions\">\n  </dc-dynamic-conditions-form>\n</div>\n", styles: [".nested-group{border:1px solid #eee;padding:10px;margin-top:10px;border-radius:4px}.very-nested-group{border:1px dashed #ccc;padding:8px;margin-top:8px;border-radius:4px}.dynamic-condition-item{margin-bottom:15px}\n"] }]
+                        DividerModule
+                    ], template: "<div [formGroup]=\"formGroup\" class=\"group\">\n  <h3>Conversation Flow <span pTooltip=\"Define the flow and logic of the conversation\">\u2139\uFE0F</span></h3>\n\n  <div formGroupName=\"moodState\" class=\"group\">\n    <h4>Mood State <span pTooltip=\"Configure mood detection settings\">\u2139\uFE0F</span></h4>\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"enabled\"></p-toggleswitch>\n\n      <label for=\"enabled\"> Detectar estado de animo? \uD83D\uDE12 \uD83E\uDD22 \uD83D\uDE24 \uD83D\uDE08 \uD83D\uDE31 <span pTooltip=\"Enable mood state detection\">\u2139\uFE0F</span></label>\n    </div>\n\n    @if (formGroup.controls.moodState.controls.enabled.value) {\n    <div class=\"form-field\">\n      <p-toggleswitch formControlName=\"useAssetStatesOnly\"></p-toggleswitch>\n\n      <label for=\"useAssetStatesOnly\"\n        > Solo puede sentir emociones Etiquetadas <span pTooltip=\"Depends on the motion assets, if you tag with moods, those will be the only ones detected\">\u2139\uFE0F</span></label\n      >\n    </div>\n\n    <p-divider></p-divider>\n\n\n    }\n  </div>\n\n  <div class=\"form-field\">\n    <label for=\"flowGoal\"\n      >Goal\n      <span pTooltip=\"Aqu\u00ED se especifican las reglas de como se progresa en la conversaci\u00F3n , si esta desmarcada utiliza el prompt default\">\u2139\uFE0F</span></label\n    >\n\n    <agent-task-form [formGroup]=\"formGroup.controls.goal\" [shortForm]=\"true\"></agent-task-form>\n  </div>\n\n  <details>\n    <summary>Trigger Task (Tareas autom\u00E1ticas que se activan al conversar)</summary>\n\n    <div formGroupName=\"triggerTasks\" class=\"group\">\n      <h4\n        >Trigger Tasks\n        <span\n          (click)=\"showData()\"\n          pTooltip=\"Tareas que se ejecutan en eventos espec\u00EDficos de la conversaci\u00F3n como  cuando el usuario env\u00EDa un mensaje, cuando el agente responde, etc. se visualizan normalmente en la secci\u00F3n de retro\"\n          >\u2139\uFE0F</span\n        ></h4\n      >\n      @for (eventKey of objectKeys(formGroup.controls.triggerTasks.controls); track eventKey) {\n      <div class=\"form-field\">\n        <label [for]=\"eventKey\">\n          <b>{{ eventKey | formatKey }}</b>\n        </label>\n        <agent-task-form [formGroup]=\"formGroup.controls.triggerTasks.controls[eventKey]\" [shortForm]=\"true\"></agent-task-form>\n      </div>\n      }\n    </div>\n  </details>\n  <details>\n    <summary>Tools (Herramientas que usa la APP al ocurrir eventos)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.tools\" title=\"Tool\" mode=\"select\" [availableItems]=\"validTools\"> </dc-dynamic-criteria-form>\n  </details>\n  <details>\n    <summary>Challenges (Mini Desafios al conversar)</summary>\n    <dc-dynamic-criteria-form [formArray]=\"formGroup.controls.challenges\" title=\"Challenge\" mode=\"free-text\"> </dc-dynamic-criteria-form>\n  </details>\n\n  <br />\n    <div class=\"form-field\">\n    <label for=\"maxTurns\"\n      >Max Turns (Assistant Role)\n      <span pTooltip=\"Maximum number of turns (assistant responses) before the conversation ends. Recommended: 10-30. Default: 20\">\u2139\uFE0F</span></label\n    >\n    <br />\n    <p-inputnumber formControlName=\"maxTurns\" [showButtons]=\"true\" [min]=\"0\" [max]=\"100\" placeholder=\"Set max turns...\"></p-inputnumber>\n  </div>\n\n  <hr />\n\n  <h4>Performance Analysis</h4>\n    <div class=\"form-field\">\n    <p-toggleswitch formControlName=\"enablePerformanceAnalysis\"></p-toggleswitch>\n    <label>\n      Retroalimentaci\u00F3n y Rendimiento Final\n      <span pTooltip=\"When enabled, an AI performance analysis is triggered when the conversation ends. Requires at least 5 messages.\">\u2139\uFE0F</span>\n    </label>\n  </div>\n\n\n\n\n\n  @if (formGroup.controls.enablePerformanceAnalysis.value) {\n  <div class=\"form-field\">\n    <label for=\"performancePrompt\"\n      >Prompt de Retroalimentaci\u00F3n\n      <span pTooltip=\"Custom prompt for the final performance analysis. If empty, the system uses the default template.\">\u2139\uFE0F</span></label\n    >\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" formControlName=\"performancePrompt\" placeholder=\"Enter custom performance prompt...\"></textarea>\n  </div>\n  }\n\n  <dc-dynamic-conditions-form\n    [dynamicConditionsArray]=\"formGroup.controls.dynamicConditions\"\n    [dynamicConditionsPath]=\"'formGroup.controls.dynamicConditions'\"\n    [entityWhatOptions]=\"entityWhatOptions\"\n    [entityWhenOptions]=\"entityWhenOptions\"\n    [systemPromptTypeOptions]=\"systemPromptTypeOptions\">\n  </dc-dynamic-conditions-form>\n</div>\n", styles: [".nested-group{border:1px solid #eee;padding:10px;margin-top:10px;border-radius:4px}.very-nested-group{border:1px dashed #ccc;padding:8px;margin-top:8px;border-radius:4px}.dynamic-condition-item{margin-bottom:15px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { formGroup: [{
                 type: Input
             }] } });
@@ -7316,11 +7366,11 @@ class DcCharacterCardTranslationFormComponent {
         console.log(this.formGroup);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DcCharacterCardTranslationFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DcCharacterCardTranslationFormComponent, isStandalone: true, selector: "dc-character-card-translation-form", inputs: { formGroup: "formGroup" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"form-container space-y-4\">\n  <div class=\"form-field\">\n    <label for=\"hook\" class=\"block text-sm font-medium text-gray-700\">Hook</label>\n    <textarea\n      pInputTextarea\n      id=\"hook\"\n      formControlName=\"hook\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"communication\" class=\"block text-sm font-medium text-gray-700\">Communication</label>\n    <textarea\n      pInputTextarea\n      id=\"communication\"\n      formControlName=\"communication\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"instructions\" class=\"block text-sm font-medium text-gray-700\">Instructions</label>\n    <textarea\n      pInputTextarea\n      id=\"instructions\"\n      formControlName=\"instructions\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label class=\"block text-sm font-medium text-gray-700\">Greetings</label>\n    <div formArrayName=\"greetings\" class=\"space-y-2\">\n      @for (greeting of greetings.controls; track greeting; let i = $index) {\n      <div class=\"flex items-center space-x-2\">\n        <input\n          pInputText\n          [formControlName]=\"i\"\n          class=\"flex-grow mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\" />\n        <button pButton type=\"button\" icon=\"pi pi-times\" (click)=\"removeGreeting(i)\" class=\"p-button-rounded p-button-danger p-button-sm\"></button>\n      </div>\n      }\n    </div>\n    <button pButton type=\"button\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addGreeting()\" class=\"p-button-sm mt-2\"></button>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: DcCharacterCardTranslationFormComponent, isStandalone: true, selector: "dc-character-card-translation-form", inputs: { formGroup: "formGroup" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"form-container space-y-4\">\n  <div class=\"form-field\">\n    <label for=\"hook\" class=\"block text-sm font-medium \">Hook</label>\n    <textarea\n      pInputTextarea\n      id=\"hook\"\n      formControlName=\"hook\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"communication\" class=\"block text-sm font-medium \">Communication</label>\n    <textarea\n      pInputTextarea\n      id=\"communication\"\n      formControlName=\"communication\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"instructions\" class=\"block text-sm font-medium \">Instructions</label>\n    <textarea\n      pInputTextarea\n      id=\"instructions\"\n      formControlName=\"instructions\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label class=\"block text-sm font-medium \">Greetings</label>\n    <div formArrayName=\"greetings\" class=\"space-y-2\">\n      @for (greeting of greetings.controls; track greeting; let i = $index) {\n      <div class=\"flex items-center space-x-2\">\n        <input\n          pInputText\n          [formControlName]=\"i\"\n          class=\"flex-grow mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\" />\n        <button pButton type=\"button\" icon=\"pi pi-times\" (click)=\"removeGreeting(i)\" class=\"p-button-rounded p-button-danger p-button-sm\"></button>\n      </div>\n      }\n    </div>\n    <button pButton type=\"button\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addGreeting()\" class=\"p-button-sm mt-2\"></button>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: DcCharacterCardTranslationFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-character-card-translation-form', standalone: true, imports: [ReactiveFormsModule, InputTextModule, TextareaModule, ButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [formGroup]=\"formGroup\" class=\"form-container space-y-4\">\n  <div class=\"form-field\">\n    <label for=\"hook\" class=\"block text-sm font-medium text-gray-700\">Hook</label>\n    <textarea\n      pInputTextarea\n      id=\"hook\"\n      formControlName=\"hook\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"communication\" class=\"block text-sm font-medium text-gray-700\">Communication</label>\n    <textarea\n      pInputTextarea\n      id=\"communication\"\n      formControlName=\"communication\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"instructions\" class=\"block text-sm font-medium text-gray-700\">Instructions</label>\n    <textarea\n      pInputTextarea\n      id=\"instructions\"\n      formControlName=\"instructions\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label class=\"block text-sm font-medium text-gray-700\">Greetings</label>\n    <div formArrayName=\"greetings\" class=\"space-y-2\">\n      @for (greeting of greetings.controls; track greeting; let i = $index) {\n      <div class=\"flex items-center space-x-2\">\n        <input\n          pInputText\n          [formControlName]=\"i\"\n          class=\"flex-grow mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\" />\n        <button pButton type=\"button\" icon=\"pi pi-times\" (click)=\"removeGreeting(i)\" class=\"p-button-rounded p-button-danger p-button-sm\"></button>\n      </div>\n      }\n    </div>\n    <button pButton type=\"button\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addGreeting()\" class=\"p-button-sm mt-2\"></button>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'dc-character-card-translation-form', standalone: true, imports: [ReactiveFormsModule, InputTextModule, TextareaModule, ButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [formGroup]=\"formGroup\" class=\"form-container space-y-4\">\n  <div class=\"form-field\">\n    <label for=\"hook\" class=\"block text-sm font-medium \">Hook</label>\n    <textarea\n      pInputTextarea\n      id=\"hook\"\n      formControlName=\"hook\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"communication\" class=\"block text-sm font-medium \">Communication</label>\n    <textarea\n      pInputTextarea\n      id=\"communication\"\n      formControlName=\"communication\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label for=\"instructions\" class=\"block text-sm font-medium \">Instructions</label>\n    <textarea\n      pInputTextarea\n      id=\"instructions\"\n      formControlName=\"instructions\"\n      class=\"mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\"></textarea>\n  </div>\n  <div class=\"form-field\">\n    <label class=\"block text-sm font-medium \">Greetings</label>\n    <div formArrayName=\"greetings\" class=\"space-y-2\">\n      @for (greeting of greetings.controls; track greeting; let i = $index) {\n      <div class=\"flex items-center space-x-2\">\n        <input\n          pInputText\n          [formControlName]=\"i\"\n          class=\"flex-grow mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm\" />\n        <button pButton type=\"button\" icon=\"pi pi-times\" (click)=\"removeGreeting(i)\" class=\"p-button-rounded p-button-danger p-button-sm\"></button>\n      </div>\n      }\n    </div>\n    <button pButton type=\"button\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addGreeting()\" class=\"p-button-sm mt-2\"></button>\n  </div>\n</div>\n" }]
         }], propDecorators: { formGroup: [{
                 type: Input
             }] } });
@@ -7792,7 +7842,7 @@ class DCAgentCardFormComponent extends EntityBaseFormComponent {
                         delete jsonData['_id'];
                         this.form.patchValue(jsonData);
                         this.entity.set(jsonData);
-                        this.entityCommunicationService.partialUpdate(this.entityId(), jsonData);
+                        this.entityCommunicationService.update(this.entityId(), { $set: jsonData });
                         if (this.toastService) {
                             this.toastService.success({
                                 title: 'Import Successful',
@@ -7859,7 +7909,7 @@ class DCAgentCardFormComponent extends EntityBaseFormComponent {
         this.entityCommunicationService.completeAgentCard(this.entityId());
     }
     onUpdateAsset(event) {
-        this.entityCommunicationService.partialUpdate(this.entityId(), { assets: event.assets });
+        this.entityCommunicationService.update(this.entityId(), { $set: { assets: event.assets } });
     }
     onAssetsChange(event) {
         this.entity.update((card) => ({ ...card, assets: event }));
@@ -8019,7 +8069,7 @@ class AgentCardListComponent extends EntityBaseListV2Component {
         this.entityCommunicationService = inject(CONVERSATION_AI_TOKEN, { optional: true }) ?? inject(DefaultAgentCardsService);
         this.columns = DefaultColumns;
         this.customFilters = [];
-        this.mongoState.options.sort = { randomValue: 1 };
+        this.mongoState.options.sort = { _id: -1 };
         this.mongoState.projection = {
             _id: 1,
             name: 1,
@@ -8043,7 +8093,8 @@ class AgentCardListComponent extends EntityBaseListV2Component {
     }
     async ngOnInit() {
         this.fixedQuery = this.entityCommunicationService.getFixedQuery();
-        this.customFilters = [
+        const email = this.userService.user()?.email;
+        const baseFilters = [
             {
                 name: 'Tipo de Agente',
                 field: 'agentType',
@@ -8067,6 +8118,8 @@ class AgentCardListComponent extends EntityBaseListV2Component {
                     { label: 'Otro', value: 'other' },
                 ],
             },
+        ];
+        const adminFilters = [
             {
                 name: 'Voz Única',
                 field: 'voiceCloning.sample',
@@ -8077,8 +8130,27 @@ class AgentCardListComponent extends EntityBaseListV2Component {
                     { label: 'Solo con Voz Única', value: true },
                 ],
             },
-            ...this.extraFilters,
+            {
+                name: 'Auditoría',
+                field: 'auditable._owner',
+                type: 'select',
+                operator: '$eq',
+                fieldMap: {
+                    createdBy: 'auditable.createdBy',
+                    updatedBy: 'auditable.updatedBy',
+                },
+                valueMap: {
+                    createdBy: email,
+                    updatedBy: email,
+                },
+                options: [
+                    { label: 'Todos', value: null },
+                    { label: 'Creado por mí', value: 'createdBy' },
+                    { label: 'Actualizado por mí', value: 'updatedBy' },
+                ],
+            },
         ];
+        this.customFilters = [...baseFilters, ...(this.userService.isAdmin() ? adminFilters : []), ...this.extraFilters];
         // this.viewType.set('table');
         super.ngOnInit();
         return null;
@@ -8503,24 +8575,24 @@ class ConversationRuleFormComponent extends EntityBaseSignalFormComponent {
     constructor() {
         super(...arguments);
         this.entityCommunicationService = inject(ConversationRuleService);
-        this.cardModel = signal(emptyConversationRule(), ...(ngDevMode ? [{ debugName: "cardModel" }] : /* istanbul ignore next */ []));
-        this.cardForm = form(this.cardModel, (s) => {
+        this.entityForm = signal(emptyConversationRule(), ...(ngDevMode ? [{ debugName: "entityForm" }] : /* istanbul ignore next */ []));
+        this.form = form(this.entityForm, (s) => {
             required(s.name, { message: 'Name is required' });
         });
-        this.isValid = computed(() => this.cardForm().valid(), ...(ngDevMode ? [{ debugName: "isValid" }] : /* istanbul ignore next */ []));
+        this.isValid = computed(() => this.form().valid(), ...(ngDevMode ? [{ debugName: "isValid" }] : /* istanbul ignore next */ []));
         this.isDialogVisible = false;
         this.relationPopupSelector = [];
     }
     loadEntity(entity) {
-        this.cardModel.set(entity);
+        this.entityForm.set(entity);
     }
     getFormValue() {
-        return this.cardModel();
+        return this.entityForm();
     }
     // submit() marks all fields touched so validation errors appear before calling the base save
     async save() {
         let result;
-        submit(this.cardForm, async () => {
+        submit(this.form, async () => {
             result = await super.save();
         });
         return result;
@@ -8533,7 +8605,7 @@ class ConversationRuleFormComponent extends EntityBaseSignalFormComponent {
         this.relationPopupSelector.push(relation);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ConversationRuleFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ConversationRuleFormComponent, isStandalone: true, selector: "app-conversation-rule-form", usesInheritance: true, ngImport: i0, template: "<h3>ConversationRules Form</h3>\n\n<div class=\"source-form-card\">\n  <p-card [header]=\"entityId() ? 'Edit Conversation Rule' : 'New Conversation Rule'\">\n    <div style=\"display: flex; gap: 10px\">\n      <div style=\"width: 100%\">\n\n        <div class=\"form-field\">\n          <label for=\"name\" class=\"block\">Name</label>\n          <input pInputText id=\"name\" type=\"text\"\n                 [formField]=\"cardForm.name\"\n                 placeholder=\"Enter rule name\" />\n          @if (cardForm.name().touched() && cardForm.name().invalid()) {\n            <small class=\"p-error\">{{ cardForm.name().errors()[0].message }}</small>\n          }\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"description\" class=\"block\">Description</label>\n          <textarea id=\"description\" pTextarea rows=\"1\" class=\"w-full\"\n                    [ngModel]=\"cardModel().description\"\n                    (ngModelChange)=\"cardModel.update(m => ({ ...m, description: $event }))\"\n                    placeholder=\"Enter description\"></textarea>\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"rule\" class=\"block\">Rule</label>\n          <textarea id=\"rule\" pTextarea rows=\"3\" class=\"w-full\"\n                    [ngModel]=\"cardModel().rule\"\n                    (ngModelChange)=\"cardModel.update(m => ({ ...m, rule: $event }))\"\n                    placeholder=\"Enter rule content\"></textarea>\n        </div>\n\n      </div>\n    </div>\n\n    <div style=\"display: flex; justify-content: flex-end\">\n      <p-button (click)=\"save()\" label=\"Save Rule\" [disabled]=\"!isValid()\" icon=\"pi pi-check\" iconPos=\"right\"></p-button>\n    </div>\n\n    <p-dialog header=\"Search for relation\" [(visible)]=\"isDialogVisible\" [modal]=\"true\" [style]=\"{ width: '50vw' }\" draggable=\"false\">\n      <app-conversationRule-list [onlyView]=\"true\" (onSelect)=\"handleRelationSelection($event)\"></app-conversationRule-list>\n    </p-dialog>\n  </p-card>\n</div>\n", styles: [":host{display:block;padding:1rem}.source-form-card{max-width:800px;margin:0 auto}.form-field{margin-bottom:1.5rem;display:flex;flex-direction:column}.form-field label{margin-bottom:.5rem;font-weight:500;color:#495057}.form-field input,.form-field textarea,.form-field ::ng-deep .p-element{margin-top:.25rem}:host ::ng-deep .p-card .p-card-content>div:last-child{margin-top:1.5rem;display:flex;justify-content:flex-end}:host ::ng-deep .p-card .p-card-header{background-color:#f8f9fa;padding:1rem;border-bottom:1px solid #dee2e6}h3{color:#495057;margin-bottom:1.5rem;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$6.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: ChipModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i5$1.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "maskMotionOptions", "motionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: ConversationRuleListComponent, selector: "app-conversationRule-list" }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: ConversationRuleFormComponent, isStandalone: true, selector: "app-conversation-rule-form", usesInheritance: true, ngImport: i0, template: "<h3>ConversationRules Form</h3>\n\n<div class=\"source-form-card\">\n  <p-card [header]=\"entityId() ? 'Edit Conversation Rule' : 'New Conversation Rule'\">\n    <div style=\"display: flex; gap: 10px\">\n      <div style=\"width: 100%\">\n\n        <div class=\"form-field\">\n          <label for=\"name\" class=\"block\">Name</label>\n          <input pInputText id=\"name\" type=\"text\"\n                 [formField]=\"form.name\"\n                 placeholder=\"Enter rule name\" />\n          @if (form.name().touched() && form.name().invalid()) {\n            <small class=\"p-error\">{{ form.name().errors()[0].message }}</small>\n          }\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"description\" class=\"block\">Description</label>\n          <textarea id=\"description\" pTextarea rows=\"1\" class=\"w-full\"\n                    [ngModel]=\"entityForm().description\"\n                    (ngModelChange)=\"entityForm.update(m => ({ ...m, description: $event }))\"\n                    placeholder=\"Enter description\"></textarea>\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"rule\" class=\"block\">Rule</label>\n          <textarea id=\"rule\" pTextarea rows=\"3\" class=\"w-full\"\n                    [ngModel]=\"entityForm().rule\"\n                    (ngModelChange)=\"entityForm.update(m => ({ ...m, rule: $event }))\"\n                    placeholder=\"Enter rule content\"></textarea>\n        </div>\n\n      </div>\n    </div>\n\n    <div style=\"display: flex; justify-content: flex-end\">\n      <p-button (click)=\"save()\" label=\"Save Rule\" [disabled]=\"!isValid()\" icon=\"pi pi-check\" iconPos=\"right\"></p-button>\n    </div>\n\n    <p-dialog header=\"Search for relation\" [(visible)]=\"isDialogVisible\" [modal]=\"true\" [style]=\"{ width: '50vw' }\" draggable=\"false\">\n      <app-conversationRule-list [onlyView]=\"true\" (onSelect)=\"handleRelationSelection($event)\"></app-conversationRule-list>\n    </p-dialog>\n  </p-card>\n</div>\n", styles: [":host{display:block;padding:1rem}.source-form-card{max-width:800px;margin:0 auto}.form-field{margin-bottom:1.5rem;display:flex;flex-direction:column}.form-field label{margin-bottom:.5rem;font-weight:500;color:#495057}.form-field input,.form-field textarea,.form-field ::ng-deep .p-element{margin-top:.25rem}:host ::ng-deep .p-card .p-card-content>div:last-child{margin-top:1.5rem;display:flex;justify-content:flex-end}:host ::ng-deep .p-card .p-card-header{background-color:#f8f9fa;padding:1rem;border-bottom:1px solid #dee2e6}h3{color:#495057;margin-bottom:1.5rem;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$6.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: ChipModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i5$1.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "maskMotionOptions", "motionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: ConversationRuleListComponent, selector: "app-conversationRule-list" }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: ConversationRuleFormComponent, decorators: [{
             type: Component,
@@ -8549,7 +8621,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
                         DialogModule,
                         ConversationRuleListComponent,
                         FormField,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<h3>ConversationRules Form</h3>\n\n<div class=\"source-form-card\">\n  <p-card [header]=\"entityId() ? 'Edit Conversation Rule' : 'New Conversation Rule'\">\n    <div style=\"display: flex; gap: 10px\">\n      <div style=\"width: 100%\">\n\n        <div class=\"form-field\">\n          <label for=\"name\" class=\"block\">Name</label>\n          <input pInputText id=\"name\" type=\"text\"\n                 [formField]=\"cardForm.name\"\n                 placeholder=\"Enter rule name\" />\n          @if (cardForm.name().touched() && cardForm.name().invalid()) {\n            <small class=\"p-error\">{{ cardForm.name().errors()[0].message }}</small>\n          }\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"description\" class=\"block\">Description</label>\n          <textarea id=\"description\" pTextarea rows=\"1\" class=\"w-full\"\n                    [ngModel]=\"cardModel().description\"\n                    (ngModelChange)=\"cardModel.update(m => ({ ...m, description: $event }))\"\n                    placeholder=\"Enter description\"></textarea>\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"rule\" class=\"block\">Rule</label>\n          <textarea id=\"rule\" pTextarea rows=\"3\" class=\"w-full\"\n                    [ngModel]=\"cardModel().rule\"\n                    (ngModelChange)=\"cardModel.update(m => ({ ...m, rule: $event }))\"\n                    placeholder=\"Enter rule content\"></textarea>\n        </div>\n\n      </div>\n    </div>\n\n    <div style=\"display: flex; justify-content: flex-end\">\n      <p-button (click)=\"save()\" label=\"Save Rule\" [disabled]=\"!isValid()\" icon=\"pi pi-check\" iconPos=\"right\"></p-button>\n    </div>\n\n    <p-dialog header=\"Search for relation\" [(visible)]=\"isDialogVisible\" [modal]=\"true\" [style]=\"{ width: '50vw' }\" draggable=\"false\">\n      <app-conversationRule-list [onlyView]=\"true\" (onSelect)=\"handleRelationSelection($event)\"></app-conversationRule-list>\n    </p-dialog>\n  </p-card>\n</div>\n", styles: [":host{display:block;padding:1rem}.source-form-card{max-width:800px;margin:0 auto}.form-field{margin-bottom:1.5rem;display:flex;flex-direction:column}.form-field label{margin-bottom:.5rem;font-weight:500;color:#495057}.form-field input,.form-field textarea,.form-field ::ng-deep .p-element{margin-top:.25rem}:host ::ng-deep .p-card .p-card-content>div:last-child{margin-top:1.5rem;display:flex;justify-content:flex-end}:host ::ng-deep .p-card .p-card-header{background-color:#f8f9fa;padding:1rem;border-bottom:1px solid #dee2e6}h3{color:#495057;margin-bottom:1.5rem;text-align:center}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<h3>ConversationRules Form</h3>\n\n<div class=\"source-form-card\">\n  <p-card [header]=\"entityId() ? 'Edit Conversation Rule' : 'New Conversation Rule'\">\n    <div style=\"display: flex; gap: 10px\">\n      <div style=\"width: 100%\">\n\n        <div class=\"form-field\">\n          <label for=\"name\" class=\"block\">Name</label>\n          <input pInputText id=\"name\" type=\"text\"\n                 [formField]=\"form.name\"\n                 placeholder=\"Enter rule name\" />\n          @if (form.name().touched() && form.name().invalid()) {\n            <small class=\"p-error\">{{ form.name().errors()[0].message }}</small>\n          }\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"description\" class=\"block\">Description</label>\n          <textarea id=\"description\" pTextarea rows=\"1\" class=\"w-full\"\n                    [ngModel]=\"entityForm().description\"\n                    (ngModelChange)=\"entityForm.update(m => ({ ...m, description: $event }))\"\n                    placeholder=\"Enter description\"></textarea>\n        </div>\n\n        <div class=\"form-field\">\n          <label for=\"rule\" class=\"block\">Rule</label>\n          <textarea id=\"rule\" pTextarea rows=\"3\" class=\"w-full\"\n                    [ngModel]=\"entityForm().rule\"\n                    (ngModelChange)=\"entityForm.update(m => ({ ...m, rule: $event }))\"\n                    placeholder=\"Enter rule content\"></textarea>\n        </div>\n\n      </div>\n    </div>\n\n    <div style=\"display: flex; justify-content: flex-end\">\n      <p-button (click)=\"save()\" label=\"Save Rule\" [disabled]=\"!isValid()\" icon=\"pi pi-check\" iconPos=\"right\"></p-button>\n    </div>\n\n    <p-dialog header=\"Search for relation\" [(visible)]=\"isDialogVisible\" [modal]=\"true\" [style]=\"{ width: '50vw' }\" draggable=\"false\">\n      <app-conversationRule-list [onlyView]=\"true\" (onSelect)=\"handleRelationSelection($event)\"></app-conversationRule-list>\n    </p-dialog>\n  </p-card>\n</div>\n", styles: [":host{display:block;padding:1rem}.source-form-card{max-width:800px;margin:0 auto}.form-field{margin-bottom:1.5rem;display:flex;flex-direction:column}.form-field label{margin-bottom:.5rem;font-weight:500;color:#495057}.form-field input,.form-field textarea,.form-field ::ng-deep .p-element{margin-top:.25rem}:host ::ng-deep .p-card .p-card-content>div:last-child{margin-top:1.5rem;display:flex;justify-content:flex-end}:host ::ng-deep .p-card .p-card-header{background-color:#f8f9fa;padding:1rem;border-bottom:1px solid #dee2e6}h3{color:#495057;margin-bottom:1.5rem;text-align:center}\n"] }]
         }] });
 
 const GENERICS_ROUTES = [
@@ -8743,8 +8815,8 @@ class CardRouteFormComponent extends EntityBaseSignalFormComponent {
     constructor() {
         super(...arguments);
         this.entityCommunicationService = inject(CardRouteService);
-        this.cardModel = signal(emptyCardRoute(), ...(ngDevMode ? [{ debugName: "cardModel" }] : /* istanbul ignore next */ []));
-        this.form = form(this.cardModel, (s) => {
+        this.entityForm = signal(emptyCardRoute(), ...(ngDevMode ? [{ debugName: "entityForm" }] : /* istanbul ignore next */ []));
+        this.form = form(this.entityForm, (s) => {
             required(s.name, { message: 'Name is required' });
         });
         this.isValid = computed(() => this.form().valid(), ...(ngDevMode ? [{ debugName: "isValid" }] : /* istanbul ignore next */ []));
@@ -8754,10 +8826,10 @@ class CardRouteFormComponent extends EntityBaseSignalFormComponent {
         };
     }
     loadEntity(entity) {
-        this.cardModel.set(entity);
+        this.entityForm.set(entity);
     }
     getFormValue() {
-        return this.cardModel();
+        return this.entityForm();
     }
     async save() {
         let result;
@@ -8767,12 +8839,12 @@ class CardRouteFormComponent extends EntityBaseSignalFormComponent {
         return result;
     }
     handleImageUpload(event) {
-        const current = this.cardModel();
-        this.cardModel.set({ ...current, assets: { ...current.assets, image: event } });
+        const current = this.entityForm();
+        this.entityForm.set({ ...current, assets: { ...current.assets, image: event } });
         this.save();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: CardRouteFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: CardRouteFormComponent, isStandalone: true, selector: "app-card-route-form", usesInheritance: true, ngImport: i0, template: "<p-card [header]=\"entityId() ? 'Edit Card Route' : 'New Card Route'\">\n  <div class=\"flex gap-2.5\">\n    <div class=\"mb-4\">\n      <label class=\"block font-medium mb-1\" pTooltip=\"Upload image after first save\">Image</label>\n      <img width=\"218px\" [src]=\"cardModel().assets?.image?.url || 'defaults/images/face-3.jpg'\" alt=\"route image\" />\n      <dc-cropper-modal [imgStorageSettings]=\"storageImgSettings\" (imageUploaded)=\"handleImageUpload($event)\"></dc-cropper-modal>\n    </div>\n\n    <div class=\"w-full\">\n      <div class=\"form-field\">\n        <label for=\"name\">Name *</label>\n        <input pInputText id=\"name\" type=\"text\"\n               [formField]=\"form.name\"\n               placeholder=\"Route name\" class=\"w-full\" />\n        @if (form.name().touched() && form.name().invalid()) {\n          <small class=\"p-error\">{{ form.name().errors()[0].message }}</small>\n        }\n      </div>\n\n      <div class=\"form-field mt-4\">\n        <label for=\"description\">Description</label>\n        <textarea pTextarea id=\"description\" rows=\"2\"\n                  [ngModel]=\"cardModel().description\"\n                  (ngModelChange)=\"cardModel.set({ ...cardModel(), description: $event })\"\n                  placeholder=\"Route description\" autoResize class=\"w-full\"></textarea>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"form-field-inline\">\n    <label for=\"isActive\">Active</label>\n    <p-toggleswitch id=\"isActive\"\n                    [ngModel]=\"cardModel().isActive\"\n                    (ngModelChange)=\"cardModel.set({ ...cardModel(), isActive: $event })\" />\n  </div>\n\n  <div class=\"form-field mt-4\">\n    <app-card-route-steps-form\n      [value]=\"cardModel().steps\"\n      (valueChange)=\"cardModel.set({ ...cardModel(), steps: $event })\">\n    </app-card-route-steps-form>\n  </div>\n\n  <div class=\"form-actions mt-4\">\n    <p-button label=\"Save\" (click)=\"save()\" [disabled]=\"!isValid()\" />\n  </div>\n</p-card>\n", styles: [".form-field{display:flex;flex-direction:column;gap:.25rem;margin-bottom:1rem}.form-field input,.form-field textarea{width:100%}.form-field-inline{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.form-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$6.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i4$1.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "component", type: CardRouteStepsFormComponent, selector: "app-card-route-steps-form", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: CropperComponentModal, selector: "dc-cropper-modal", inputs: ["imgStorageSettings", "buttonLabel", "currentStorage"], outputs: ["imageUploaded", "onImageCropped", "onFileSelected"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: CardRouteFormComponent, isStandalone: true, selector: "app-card-route-form", usesInheritance: true, ngImport: i0, template: "<p-card [header]=\"entityId() ? 'Edit Card Route' : 'New Card Route'\">\n  <div class=\"flex gap-2.5\">\n    <div class=\"mb-4\">\n      <label class=\"block font-medium mb-1\" pTooltip=\"Upload image after first save\">Image</label>\n      <img width=\"218px\" [src]=\"entityForm().assets?.image?.url || 'defaults/images/face-3.jpg'\" alt=\"route image\" />\n      <dc-cropper-modal [imgStorageSettings]=\"storageImgSettings\" (imageUploaded)=\"handleImageUpload($event)\"></dc-cropper-modal>\n    </div>\n\n    <div class=\"w-full\">\n      <div class=\"form-field\">\n        <label for=\"name\">Name *</label>\n        <input pInputText id=\"name\" type=\"text\"\n               [formField]=\"form.name\"\n               placeholder=\"Route name\" class=\"w-full\" />\n        @if (form.name().touched() && form.name().invalid()) {\n          <small class=\"p-error\">{{ form.name().errors()[0].message }}</small>\n        }\n      </div>\n\n      <div class=\"form-field mt-4\">\n        <label for=\"description\">Description</label>\n        <textarea pTextarea id=\"description\" rows=\"2\"\n                  [ngModel]=\"entityForm().description\"\n                  (ngModelChange)=\"entityForm.set({ ...entityForm(), description: $event })\"\n                  placeholder=\"Route description\" autoResize class=\"w-full\"></textarea>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"form-field-inline\">\n    <label for=\"isActive\">Active</label>\n    <p-toggleswitch id=\"isActive\"\n                    [ngModel]=\"entityForm().isActive\"\n                    (ngModelChange)=\"entityForm.set({ ...entityForm(), isActive: $event })\" />\n  </div>\n\n  <div class=\"form-field mt-4\">\n    <app-card-route-steps-form\n      [value]=\"entityForm().steps\"\n      (valueChange)=\"entityForm.set({ ...entityForm(), steps: $event })\">\n    </app-card-route-steps-form>\n  </div>\n\n  <div class=\"form-actions mt-4\">\n    <p-button label=\"Save\" (click)=\"save()\" [disabled]=\"!isValid()\" />\n  </div>\n</p-card>\n", styles: [".form-field{display:flex;flex-direction:column;gap:.25rem;margin-bottom:1rem}.form-field input,.form-field textarea{width:100%}.form-field-inline{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.form-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$6.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["pTextareaPT", "pTextareaUnstyled", "autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i4$1.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "component", type: CardRouteStepsFormComponent, selector: "app-card-route-steps-form", inputs: ["value"], outputs: ["valueChange"] }, { kind: "component", type: CropperComponentModal, selector: "dc-cropper-modal", inputs: ["imgStorageSettings", "buttonLabel", "currentStorage"], outputs: ["imageUploaded", "onImageCropped", "onFileSelected"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: CardRouteFormComponent, decorators: [{
             type: Component,
@@ -8787,7 +8859,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
                         CardRouteStepsFormComponent,
                         CropperComponentModal,
                         TooltipModule,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-card [header]=\"entityId() ? 'Edit Card Route' : 'New Card Route'\">\n  <div class=\"flex gap-2.5\">\n    <div class=\"mb-4\">\n      <label class=\"block font-medium mb-1\" pTooltip=\"Upload image after first save\">Image</label>\n      <img width=\"218px\" [src]=\"cardModel().assets?.image?.url || 'defaults/images/face-3.jpg'\" alt=\"route image\" />\n      <dc-cropper-modal [imgStorageSettings]=\"storageImgSettings\" (imageUploaded)=\"handleImageUpload($event)\"></dc-cropper-modal>\n    </div>\n\n    <div class=\"w-full\">\n      <div class=\"form-field\">\n        <label for=\"name\">Name *</label>\n        <input pInputText id=\"name\" type=\"text\"\n               [formField]=\"form.name\"\n               placeholder=\"Route name\" class=\"w-full\" />\n        @if (form.name().touched() && form.name().invalid()) {\n          <small class=\"p-error\">{{ form.name().errors()[0].message }}</small>\n        }\n      </div>\n\n      <div class=\"form-field mt-4\">\n        <label for=\"description\">Description</label>\n        <textarea pTextarea id=\"description\" rows=\"2\"\n                  [ngModel]=\"cardModel().description\"\n                  (ngModelChange)=\"cardModel.set({ ...cardModel(), description: $event })\"\n                  placeholder=\"Route description\" autoResize class=\"w-full\"></textarea>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"form-field-inline\">\n    <label for=\"isActive\">Active</label>\n    <p-toggleswitch id=\"isActive\"\n                    [ngModel]=\"cardModel().isActive\"\n                    (ngModelChange)=\"cardModel.set({ ...cardModel(), isActive: $event })\" />\n  </div>\n\n  <div class=\"form-field mt-4\">\n    <app-card-route-steps-form\n      [value]=\"cardModel().steps\"\n      (valueChange)=\"cardModel.set({ ...cardModel(), steps: $event })\">\n    </app-card-route-steps-form>\n  </div>\n\n  <div class=\"form-actions mt-4\">\n    <p-button label=\"Save\" (click)=\"save()\" [disabled]=\"!isValid()\" />\n  </div>\n</p-card>\n", styles: [".form-field{display:flex;flex-direction:column;gap:.25rem;margin-bottom:1rem}.form-field input,.form-field textarea{width:100%}.form-field-inline{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.form-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<p-card [header]=\"entityId() ? 'Edit Card Route' : 'New Card Route'\">\n  <div class=\"flex gap-2.5\">\n    <div class=\"mb-4\">\n      <label class=\"block font-medium mb-1\" pTooltip=\"Upload image after first save\">Image</label>\n      <img width=\"218px\" [src]=\"entityForm().assets?.image?.url || 'defaults/images/face-3.jpg'\" alt=\"route image\" />\n      <dc-cropper-modal [imgStorageSettings]=\"storageImgSettings\" (imageUploaded)=\"handleImageUpload($event)\"></dc-cropper-modal>\n    </div>\n\n    <div class=\"w-full\">\n      <div class=\"form-field\">\n        <label for=\"name\">Name *</label>\n        <input pInputText id=\"name\" type=\"text\"\n               [formField]=\"form.name\"\n               placeholder=\"Route name\" class=\"w-full\" />\n        @if (form.name().touched() && form.name().invalid()) {\n          <small class=\"p-error\">{{ form.name().errors()[0].message }}</small>\n        }\n      </div>\n\n      <div class=\"form-field mt-4\">\n        <label for=\"description\">Description</label>\n        <textarea pTextarea id=\"description\" rows=\"2\"\n                  [ngModel]=\"entityForm().description\"\n                  (ngModelChange)=\"entityForm.set({ ...entityForm(), description: $event })\"\n                  placeholder=\"Route description\" autoResize class=\"w-full\"></textarea>\n      </div>\n    </div>\n  </div>\n\n  <div class=\"form-field-inline\">\n    <label for=\"isActive\">Active</label>\n    <p-toggleswitch id=\"isActive\"\n                    [ngModel]=\"entityForm().isActive\"\n                    (ngModelChange)=\"entityForm.set({ ...entityForm(), isActive: $event })\" />\n  </div>\n\n  <div class=\"form-field mt-4\">\n    <app-card-route-steps-form\n      [value]=\"entityForm().steps\"\n      (valueChange)=\"entityForm.set({ ...entityForm(), steps: $event })\">\n    </app-card-route-steps-form>\n  </div>\n\n  <div class=\"form-actions mt-4\">\n    <p-button label=\"Save\" (click)=\"save()\" [disabled]=\"!isValid()\" />\n  </div>\n</p-card>\n", styles: [".form-field{display:flex;flex-direction:column;gap:.25rem;margin-bottom:1rem}.form-field input,.form-field textarea{width:100%}.form-field-inline{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem}.form-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}\n"] }]
         }] });
 
 const CARD_ROUTES = [