@dataclouder/ngx-agent-cards 0.1.91 → 0.1.93

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

@@ -11,6 +11,7 @@ import { Subject, fromEvent, filter } from 'rxjs';
 import { DynamicDialogRef, DynamicDialogConfig, DialogService, DynamicDialogModule } from 'primeng/dynamicdialog';
 import * as i2 from 'primeng/button';
 import { ButtonModule } from 'primeng/button';
+import { MarkdownComponent } from 'ngx-markdown';
 import * as Plyr from 'plyr';
 import * as i2$1 from 'primeng/progressbar';
 import { ProgressBarModule } from 'primeng/progressbar';
@@ -35,7 +36,7 @@ import { RatingModule } from 'primeng/rating';
 import * as i1$3 from 'primeng/table';
 import { TableModule } from 'primeng/table';
 import { BadgeModule } from 'primeng/badge';
-import * as i2$7 from 'primeng/tooltip';
+import * as i3$4 from 'primeng/tooltip';
 import { TooltipModule } from 'primeng/tooltip';
 import * as i5 from 'primeng/select';
 import { SelectModule } from 'primeng/select';
@@ -44,11 +45,10 @@ import { DividerModule } from 'primeng/divider';
 import * as i2$6 from 'primeng/tabs';
 import { TabsModule } from 'primeng/tabs';
 import { ChipModule } from 'primeng/chip';
-import { MarkdownComponent } from 'ngx-markdown';
 import * as i2$4 from 'primeng/tag';
 import { TagModule } from 'primeng/tag';
 import * as i2$5 from 'primeng/api';
-import * as i3$4 from 'primeng/inputtext';
+import * as i3$5 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
 import * as i3$3 from 'primeng/message';
 import { MessageModule } from 'primeng/message';
@@ -57,23 +57,22 @@ import { DialogModule } from 'primeng/dialog';
 import * as i7 from 'primeng/inputnumber';
 import { InputNumberModule } from 'primeng/inputnumber';
 import { FileUploadModule } from 'primeng/fileupload';
-import * as i2$8 from 'primeng/card';
+import * as i2$7 from 'primeng/card';
 import { CardModule } from 'primeng/card';
 import { AspectRatioOptions, SafeHtmlPipe, ResolutionType, AspectType, AssetsLoaderComponent, SimpleUploaderComponent, CropperComponentModal } from '@dataclouder/ngx-cloud-storage';
 import { AccordionModule } from 'primeng/accordion';
 import * as i1$6 from '@angular/router';
 import { ActivatedRoute, Router, RouterModule } from '@angular/router';
-import * as i3$5 from 'primeng/toggleswitch';
+import * as i4$1 from 'primeng/toggleswitch';
 import { ToggleSwitchModule } from 'primeng/toggleswitch';
-import * as i6 from 'primeng/togglebutton';
 import { ToggleButtonModule } from 'primeng/togglebutton';
 import * as i3$6 from 'primeng/inputgroup';
 import { InputGroupModule } from 'primeng/inputgroup';
-import * as i4$1 from 'primeng/inputgroupaddon';
+import * as i4$2 from 'primeng/inputgroupaddon';
 import { InputGroupAddonModule } from 'primeng/inputgroupaddon';
 import * as i1$5 from 'primeng/paginator';
 import { PaginatorModule } from 'primeng/paginator';
-import * as i2$9 from 'primeng/speeddial';
+import * as i2$8 from 'primeng/speeddial';
 import { SpeedDialModule } from 'primeng/speeddial';
 import { isEmpty } from 'es-toolkit/compat';
 import * as i3$7 from '@ngx-translate/core';
@@ -1898,7 +1897,35 @@ class DynamicFlowService {
      * @param aiResponse A partial `IConversationFlowState` object from the AI.
      */
     updateStateFromAI(aiResponse) {
-        this.conversationFlowStateService.updateState(aiResponse);
+        const currentState = this.flowState();
+        const updatedState = { ...aiResponse };
+        // Goal: Add deltaPoints to current value
+        if (aiResponse.goal && typeof aiResponse.goal.deltaPoints === 'number') {
+            const currentGoalValue = currentState.goal?.value || 0;
+            const deltaPoints = aiResponse.goal.deltaPoints;
+            const newGoalValue = Math.min(100, Math.max(0, currentGoalValue + deltaPoints));
+            updatedState.goal = {
+                ...currentState.goal,
+                value: newGoalValue,
+                deltaPoints: deltaPoints,
+                feedback: aiResponse.goal.feedback || '',
+            };
+        }
+        // Challenges: Merge new challenge states
+        if (aiResponse.challenges && Array.isArray(aiResponse.challenges)) {
+            const mergedChallenges = [...(currentState.challenges || [])];
+            aiResponse.challenges.forEach((newChallenge) => {
+                const index = mergedChallenges.findIndex((c) => c.name === newChallenge.name);
+                if (index > -1) {
+                    mergedChallenges[index] = { ...mergedChallenges[index], ...newChallenge };
+                }
+                else {
+                    mergedChallenges.push(newChallenge);
+                }
+            });
+            updatedState.challenges = mergedChallenges;
+        }
+        this.conversationFlowStateService.updateState(updatedState);
         this.syncMoodToLatestMessage();
     }
     syncMoodToLatestMessage(messageId) {
@@ -1952,17 +1979,18 @@ Instructions per Component:
         if (config.goal?.enabled) {
             prompt += `
 - Goal: ${config.goal.task}
-Evaluate the progress (0-100) based on the user's interaction.
+Evaluate the interaction and provide an integer value for "deltaPoints" representing points to ADD or SUBTRACT from the current goal value (usually 1-15 points), and "feedback" explaining why.
 `;
         }
         if (config.challenges && config.challenges.length > 0) {
-            // Filter only enabled challenges
-            const activeChallenges = config.challenges.filter((c) => c.enabled);
+            // Filter only enabled challenges that are NOT yet completed in the current state
+            const completedChallengeNames = new Set((currentState.challenges || []).filter((c) => c.value === true).map((c) => c.name));
+            const activeChallenges = config.challenges.filter((c) => c.enabled && !completedChallengeNames.has(c.name));
             if (activeChallenges.length > 0) {
                 prompt += `
-- Challenges:
+- Challenges (Only pending ones):
 ${activeChallenges.map((c) => `- ${c.name}: ${c.description}`).join('\n')}
-Mark challenges as completed (true) if the user has satisfied the condition.
+Mark challenges as completed (true) ONLY if the user has satisfied the condition in this interaction. Do not include challenges that are already completed.
 `;
             }
         }
@@ -1976,15 +2004,15 @@ Mark challenges as completed (true) if the user has satisfied the condition.
 Detectable states: ${detectableStates.join(', ')}
 `;
         }
-        const lastMessages = messages.slice(-2);
+        const lastMessages = messages.slice(-4);
         prompt += `
 
 Context (Last Messages):
 ${lastMessages.map((m) => `${m.role}: ${m.content}`).join('\n')}
 
 Instructions:
-1. Analyze the context.
-2. Update the goal progress if applicable.
+1. Analyze the context, that is a partial conversation, evaluate the last user interaction only.
+2. Update the goal state: provide "deltaPoints" and "feedback" (less than 80 words) inside the goal object.
 3. Mark challenges as completed if met.
 4. Update the mood state.
 5. Return ONLY a valid JSON object matching the IConversationFlowState structure with updated values.
@@ -2514,10 +2542,16 @@ class FeedbackEvaluationComponent {
     constructor() {
         this.ref = inject(DynamicDialogRef);
         this.config = inject(DynamicDialogConfig);
+        this.markdownContent = null;
     }
     ngOnInit() {
         if (this.config.data) {
-            this.evaluationData = this.config.data;
+            if (typeof this.config.data === 'string') {
+                this.markdownContent = this.config.data;
+            }
+            else {
+                this.evaluationData = this.config.data;
+            }
         }
         else {
             this.evaluationData = this.getDummyEvaluationData();
@@ -2575,11 +2609,11 @@ class FeedbackEvaluationComponent {
         this.ref.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: FeedbackEvaluationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: FeedbackEvaluationComponent, isStandalone: true, selector: "dc-feedback-evaluation", ngImport: i0, template: "<div class=\"feedback-container\">\n  @if (evaluationData) {\n  <h2 class=\"feedback-title\">Performance Evaluation</h2>\n\n  <div class=\"feedback-content\">\n    <div class=\"general-score\">\n      <h3>Overall Score</h3>\n      <p class=\"score\">{{ evaluationData.overall_score.rating }} / 100 (Level: {{ evaluationData.overall_score.level }})</p>\n    </div>\n\n    <div class=\"feedback-details\">\n      <h3>Detailed Assessments</h3>\n      @for (assessment of evaluationData.assessments | keyvalue; track assessment.key) {\n      <div>\n        <h4>{{ assessment.key.replace('_', ' ') | titlecase }}</h4>\n        <p>\n          <span class=\"score\">Score: {{ assessment.value.score }} / 100</span> |\n          <span class=\"level\">Level: {{ assessment.value.level }}</span>\n        </p>\n        <p class=\"comment\"><strong>Feedback:</strong> {{ assessment.value.feedback }}</p>\n        @if (assessment.value.suggestions?.length > 0) {\n        <div>\n          <strong>Suggestions:</strong>\n          <ul>\n            @for (suggestion of assessment.value.suggestions; track $index) {\n            <li>{{ suggestion }}</li>\n            }\n          </ul>\n        </div>\n        }\n      </div>\n      }\n    </div>\n\n    <div class=\"conversation-analysis\">\n      <h3>Conversation Analysis</h3>\n      <p><strong>Dominant Register:</strong> {{ evaluationData.conversation_analysis.dominant_register }}</p>\n      <p><strong>Conversation Type:</strong> {{ evaluationData.conversation_analysis.conversation_type }}</p>\n      @if (evaluationData.conversation_analysis.key_observations?.length > 0) {\n      <div>\n        <strong>Key Observations:</strong>\n        <ul>\n          @for (observation of evaluationData.conversation_analysis.key_observations; track $index) {\n          <li>{{ observation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.conversation_analysis.notable_patterns?.length > 0) {\n      <div>\n        <strong>Notable Patterns:</strong>\n        <ul>\n          @for (pattern of evaluationData.conversation_analysis.notable_patterns; track $index) {\n          <li>{{ pattern }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n\n    <div class=\"actionable-feedback\">\n      <h3>Actionable Feedback</h3>\n      @if (evaluationData.actionable_feedback.immediate_focus_areas?.length > 0) {\n      <div>\n        <strong>Immediate Focus Areas:</strong>\n        <ul>\n          @for (area of evaluationData.actionable_feedback.immediate_focus_areas; track $index) {\n          <li>{{ area }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.practice_recommendations?.length > 0) {\n      <div>\n        <strong>Practice Recommendations:</strong>\n        <ul>\n          @for (recommendation of evaluationData.actionable_feedback.practice_recommendations; track $index) {\n          <li>{{ recommendation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.next_steps?.length > 0) {\n      <div>\n        <strong>Next Steps:</strong>\n        <ul>\n          @for (step of evaluationData.actionable_feedback.next_steps; track $index) {\n          <li>{{ step }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n  </div>\n\n  <div>\n    <p-button label=\"Close\" (onClick)=\"closeDialog()\"></p-button>\n  </div>\n\n  } @else {\n  <div class=\"loading-container\">\n    <p>Loading feedback...</p>\n  </div>\n  }\n</div>\n", styles: [":host{display:block;width:100%;height:100%;max-height:85vh;overflow:auto}.feedback-container{display:flex;flex-direction:column;height:100%;background-color:#f9f9f9;border-radius:8px}.feedback-title{padding:1.5rem 1.5rem 0;font-size:1.5rem;font-weight:600;text-align:center;flex-shrink:0;color:#333}.feedback-content{flex:1 1 auto;overflow-y:auto;padding:1.5rem}.feedback-footer{flex-shrink:0;padding:1rem 1.5rem;text-align:right;border-top:1px solid #e9ecef;background-color:#fff;border-bottom-left-radius:8px;border-bottom-right-radius:8px}.general-score{text-align:center;margin-bottom:20px;background-color:#fff;padding:1rem;border-radius:6px;border:1px solid #e9ecef}.general-score .score{font-size:2em;font-weight:700;color:#4caf50}.feedback-details>div,.conversation-analysis>div,.actionable-feedback>div{margin-bottom:1rem}.feedback-details h4{margin-bottom:.75rem}.feedback-details p,.conversation-analysis p,.actionable-feedback ul{margin-bottom:.5rem}.comment{font-style:italic;color:#555}ul{list-style-position:inside;padding-left:0}h3{font-size:1.25rem;border-bottom:2px solid #eee;padding-bottom:.5rem;margin-top:1.5rem;margin-bottom:1rem;color:#333}h4{font-size:1.1rem;margin-top:1rem;margin-bottom:.5rem;color:#555}li{margin-bottom:.5rem}strong{color:#333}.loading-container{display:flex;justify-content:center;align-items:center;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: FeedbackEvaluationComponent, isStandalone: true, selector: "dc-feedback-evaluation", ngImport: i0, template: "<div class=\"feedback-container\">\n  @if (markdownContent) {\n  <h2 class=\"feedback-title\">Performance Evaluation MD</h2>\n  <div class=\"feedback-content\" style=\"white-space: pre-wrap; font-family: sans-serif; line-height: 1.6\">\n    <!-- {{ markdownContent }} -->\n\n    <markdown [data]=\"markdownContent\"></markdown>\n  </div>\n  } @else if (evaluationData) {\n  <h2 class=\"feedback-title\">Performance Evaluation</h2>\n\n  <div class=\"feedback-content\">\n    <div class=\"general-score\">\n      <h3>Overall Score</h3>\n      <p class=\"score\">{{ evaluationData.overall_score.rating }} / 100 (Level: {{ evaluationData.overall_score.level }})</p>\n    </div>\n\n    <div class=\"feedback-details\">\n      <h3>Detailed Assessments</h3>\n      @for (assessment of evaluationData.assessments | keyvalue; track assessment.key) {\n      <div>\n        <h4>{{ assessment.key.replace('_', ' ') | titlecase }}</h4>\n        <p>\n          <span class=\"score\">Score: {{ assessment.value.score }} / 100</span> |\n          <span class=\"level\">Level: {{ assessment.value.level }}</span>\n        </p>\n        <p class=\"comment\"><strong>Feedback:</strong> {{ assessment.value.feedback }}</p>\n        @if (assessment.value.suggestions?.length > 0) {\n        <div>\n          <strong>Suggestions:</strong>\n          <ul>\n            @for (suggestion of assessment.value.suggestions; track $index) {\n            <li>{{ suggestion }}</li>\n            }\n          </ul>\n        </div>\n        }\n      </div>\n      }\n    </div>\n\n    <div class=\"conversation-analysis\">\n      <h3>Conversation Analysis</h3>\n      <p><strong>Dominant Register:</strong> {{ evaluationData.conversation_analysis.dominant_register }}</p>\n      <p><strong>Conversation Type:</strong> {{ evaluationData.conversation_analysis.conversation_type }}</p>\n      @if (evaluationData.conversation_analysis.key_observations?.length > 0) {\n      <div>\n        <strong>Key Observations:</strong>\n        <ul>\n          @for (observation of evaluationData.conversation_analysis.key_observations; track $index) {\n          <li>{{ observation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.conversation_analysis.notable_patterns?.length > 0) {\n      <div>\n        <strong>Notable Patterns:</strong>\n        <ul>\n          @for (pattern of evaluationData.conversation_analysis.notable_patterns; track $index) {\n          <li>{{ pattern }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n\n    <div class=\"actionable-feedback\">\n      <h3>Actionable Feedback</h3>\n      @if (evaluationData.actionable_feedback.immediate_focus_areas?.length > 0) {\n      <div>\n        <strong>Immediate Focus Areas:</strong>\n        <ul>\n          @for (area of evaluationData.actionable_feedback.immediate_focus_areas; track $index) {\n          <li>{{ area }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.practice_recommendations?.length > 0) {\n      <div>\n        <strong>Practice Recommendations:</strong>\n        <ul>\n          @for (recommendation of evaluationData.actionable_feedback.practice_recommendations; track $index) {\n          <li>{{ recommendation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.next_steps?.length > 0) {\n      <div>\n        <strong>Next Steps:</strong>\n        <ul>\n          @for (step of evaluationData.actionable_feedback.next_steps; track $index) {\n          <li>{{ step }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n  </div>\n\n  <div>\n    <p-button label=\"Close\" (onClick)=\"closeDialog()\"></p-button>\n  </div>\n\n  } @else {\n  <div class=\"loading-container\">\n    <p>Loading feedback...</p>\n  </div>\n  }\n</div>\n", styles: [":host{display:block;width:100%;height:100%;max-height:85vh;overflow:auto}.feedback-container{display:flex;flex-direction:column;height:100%;background-color:#f9f9f9;border-radius:8px}.feedback-title{padding:1.5rem 1.5rem 0;font-size:1.5rem;font-weight:600;text-align:center;flex-shrink:0;color:#333}.feedback-content{flex:1 1 auto;overflow-y:auto;padding:1.5rem}.feedback-footer{flex-shrink:0;padding:1rem 1.5rem;text-align:right;border-top:1px solid #e9ecef;background-color:#fff;border-bottom-left-radius:8px;border-bottom-right-radius:8px}.general-score{text-align:center;margin-bottom:20px;background-color:#fff;padding:1rem;border-radius:6px;border:1px solid #e9ecef}.general-score .score{font-size:2em;font-weight:700;color:#4caf50}.feedback-details>div,.conversation-analysis>div,.actionable-feedback>div{margin-bottom:1rem}.feedback-details h4{margin-bottom:.75rem}.feedback-details p,.conversation-analysis p,.actionable-feedback ul{margin-bottom:.5rem}.comment{font-style:italic;color:#555}ul{list-style-position:inside;padding-left:0}h3{font-size:1.25rem;border-bottom:2px solid #eee;padding-bottom:.5rem;margin-top:1.5rem;margin-bottom:1rem;color:#333}h4{font-size:1.1rem;margin-top:1rem;margin-bottom:.5rem;color:#555}li{margin-bottom:.5rem}strong{color:#333}.loading-container{display:flex;justify-content:center;align-items:center;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: FeedbackEvaluationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-feedback-evaluation', standalone: true, imports: [CommonModule, ButtonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"feedback-container\">\n  @if (evaluationData) {\n  <h2 class=\"feedback-title\">Performance Evaluation</h2>\n\n  <div class=\"feedback-content\">\n    <div class=\"general-score\">\n      <h3>Overall Score</h3>\n      <p class=\"score\">{{ evaluationData.overall_score.rating }} / 100 (Level: {{ evaluationData.overall_score.level }})</p>\n    </div>\n\n    <div class=\"feedback-details\">\n      <h3>Detailed Assessments</h3>\n      @for (assessment of evaluationData.assessments | keyvalue; track assessment.key) {\n      <div>\n        <h4>{{ assessment.key.replace('_', ' ') | titlecase }}</h4>\n        <p>\n          <span class=\"score\">Score: {{ assessment.value.score }} / 100</span> |\n          <span class=\"level\">Level: {{ assessment.value.level }}</span>\n        </p>\n        <p class=\"comment\"><strong>Feedback:</strong> {{ assessment.value.feedback }}</p>\n        @if (assessment.value.suggestions?.length > 0) {\n        <div>\n          <strong>Suggestions:</strong>\n          <ul>\n            @for (suggestion of assessment.value.suggestions; track $index) {\n            <li>{{ suggestion }}</li>\n            }\n          </ul>\n        </div>\n        }\n      </div>\n      }\n    </div>\n\n    <div class=\"conversation-analysis\">\n      <h3>Conversation Analysis</h3>\n      <p><strong>Dominant Register:</strong> {{ evaluationData.conversation_analysis.dominant_register }}</p>\n      <p><strong>Conversation Type:</strong> {{ evaluationData.conversation_analysis.conversation_type }}</p>\n      @if (evaluationData.conversation_analysis.key_observations?.length > 0) {\n      <div>\n        <strong>Key Observations:</strong>\n        <ul>\n          @for (observation of evaluationData.conversation_analysis.key_observations; track $index) {\n          <li>{{ observation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.conversation_analysis.notable_patterns?.length > 0) {\n      <div>\n        <strong>Notable Patterns:</strong>\n        <ul>\n          @for (pattern of evaluationData.conversation_analysis.notable_patterns; track $index) {\n          <li>{{ pattern }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n\n    <div class=\"actionable-feedback\">\n      <h3>Actionable Feedback</h3>\n      @if (evaluationData.actionable_feedback.immediate_focus_areas?.length > 0) {\n      <div>\n        <strong>Immediate Focus Areas:</strong>\n        <ul>\n          @for (area of evaluationData.actionable_feedback.immediate_focus_areas; track $index) {\n          <li>{{ area }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.practice_recommendations?.length > 0) {\n      <div>\n        <strong>Practice Recommendations:</strong>\n        <ul>\n          @for (recommendation of evaluationData.actionable_feedback.practice_recommendations; track $index) {\n          <li>{{ recommendation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.next_steps?.length > 0) {\n      <div>\n        <strong>Next Steps:</strong>\n        <ul>\n          @for (step of evaluationData.actionable_feedback.next_steps; track $index) {\n          <li>{{ step }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n  </div>\n\n  <div>\n    <p-button label=\"Close\" (onClick)=\"closeDialog()\"></p-button>\n  </div>\n\n  } @else {\n  <div class=\"loading-container\">\n    <p>Loading feedback...</p>\n  </div>\n  }\n</div>\n", styles: [":host{display:block;width:100%;height:100%;max-height:85vh;overflow:auto}.feedback-container{display:flex;flex-direction:column;height:100%;background-color:#f9f9f9;border-radius:8px}.feedback-title{padding:1.5rem 1.5rem 0;font-size:1.5rem;font-weight:600;text-align:center;flex-shrink:0;color:#333}.feedback-content{flex:1 1 auto;overflow-y:auto;padding:1.5rem}.feedback-footer{flex-shrink:0;padding:1rem 1.5rem;text-align:right;border-top:1px solid #e9ecef;background-color:#fff;border-bottom-left-radius:8px;border-bottom-right-radius:8px}.general-score{text-align:center;margin-bottom:20px;background-color:#fff;padding:1rem;border-radius:6px;border:1px solid #e9ecef}.general-score .score{font-size:2em;font-weight:700;color:#4caf50}.feedback-details>div,.conversation-analysis>div,.actionable-feedback>div{margin-bottom:1rem}.feedback-details h4{margin-bottom:.75rem}.feedback-details p,.conversation-analysis p,.actionable-feedback ul{margin-bottom:.5rem}.comment{font-style:italic;color:#555}ul{list-style-position:inside;padding-left:0}h3{font-size:1.25rem;border-bottom:2px solid #eee;padding-bottom:.5rem;margin-top:1.5rem;margin-bottom:1rem;color:#333}h4{font-size:1.1rem;margin-top:1rem;margin-bottom:.5rem;color:#555}li{margin-bottom:.5rem}strong{color:#333}.loading-container{display:flex;justify-content:center;align-items:center;height:100%}\n"] }]
+            args: [{ selector: 'dc-feedback-evaluation', standalone: true, imports: [CommonModule, ButtonModule, MarkdownComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"feedback-container\">\n  @if (markdownContent) {\n  <h2 class=\"feedback-title\">Performance Evaluation MD</h2>\n  <div class=\"feedback-content\" style=\"white-space: pre-wrap; font-family: sans-serif; line-height: 1.6\">\n    <!-- {{ markdownContent }} -->\n\n    <markdown [data]=\"markdownContent\"></markdown>\n  </div>\n  } @else if (evaluationData) {\n  <h2 class=\"feedback-title\">Performance Evaluation</h2>\n\n  <div class=\"feedback-content\">\n    <div class=\"general-score\">\n      <h3>Overall Score</h3>\n      <p class=\"score\">{{ evaluationData.overall_score.rating }} / 100 (Level: {{ evaluationData.overall_score.level }})</p>\n    </div>\n\n    <div class=\"feedback-details\">\n      <h3>Detailed Assessments</h3>\n      @for (assessment of evaluationData.assessments | keyvalue; track assessment.key) {\n      <div>\n        <h4>{{ assessment.key.replace('_', ' ') | titlecase }}</h4>\n        <p>\n          <span class=\"score\">Score: {{ assessment.value.score }} / 100</span> |\n          <span class=\"level\">Level: {{ assessment.value.level }}</span>\n        </p>\n        <p class=\"comment\"><strong>Feedback:</strong> {{ assessment.value.feedback }}</p>\n        @if (assessment.value.suggestions?.length > 0) {\n        <div>\n          <strong>Suggestions:</strong>\n          <ul>\n            @for (suggestion of assessment.value.suggestions; track $index) {\n            <li>{{ suggestion }}</li>\n            }\n          </ul>\n        </div>\n        }\n      </div>\n      }\n    </div>\n\n    <div class=\"conversation-analysis\">\n      <h3>Conversation Analysis</h3>\n      <p><strong>Dominant Register:</strong> {{ evaluationData.conversation_analysis.dominant_register }}</p>\n      <p><strong>Conversation Type:</strong> {{ evaluationData.conversation_analysis.conversation_type }}</p>\n      @if (evaluationData.conversation_analysis.key_observations?.length > 0) {\n      <div>\n        <strong>Key Observations:</strong>\n        <ul>\n          @for (observation of evaluationData.conversation_analysis.key_observations; track $index) {\n          <li>{{ observation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.conversation_analysis.notable_patterns?.length > 0) {\n      <div>\n        <strong>Notable Patterns:</strong>\n        <ul>\n          @for (pattern of evaluationData.conversation_analysis.notable_patterns; track $index) {\n          <li>{{ pattern }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n\n    <div class=\"actionable-feedback\">\n      <h3>Actionable Feedback</h3>\n      @if (evaluationData.actionable_feedback.immediate_focus_areas?.length > 0) {\n      <div>\n        <strong>Immediate Focus Areas:</strong>\n        <ul>\n          @for (area of evaluationData.actionable_feedback.immediate_focus_areas; track $index) {\n          <li>{{ area }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.practice_recommendations?.length > 0) {\n      <div>\n        <strong>Practice Recommendations:</strong>\n        <ul>\n          @for (recommendation of evaluationData.actionable_feedback.practice_recommendations; track $index) {\n          <li>{{ recommendation }}</li>\n          }\n        </ul>\n      </div>\n      } @if (evaluationData.actionable_feedback.next_steps?.length > 0) {\n      <div>\n        <strong>Next Steps:</strong>\n        <ul>\n          @for (step of evaluationData.actionable_feedback.next_steps; track $index) {\n          <li>{{ step }}</li>\n          }\n        </ul>\n      </div>\n      }\n    </div>\n  </div>\n\n  <div>\n    <p-button label=\"Close\" (onClick)=\"closeDialog()\"></p-button>\n  </div>\n\n  } @else {\n  <div class=\"loading-container\">\n    <p>Loading feedback...</p>\n  </div>\n  }\n</div>\n", styles: [":host{display:block;width:100%;height:100%;max-height:85vh;overflow:auto}.feedback-container{display:flex;flex-direction:column;height:100%;background-color:#f9f9f9;border-radius:8px}.feedback-title{padding:1.5rem 1.5rem 0;font-size:1.5rem;font-weight:600;text-align:center;flex-shrink:0;color:#333}.feedback-content{flex:1 1 auto;overflow-y:auto;padding:1.5rem}.feedback-footer{flex-shrink:0;padding:1rem 1.5rem;text-align:right;border-top:1px solid #e9ecef;background-color:#fff;border-bottom-left-radius:8px;border-bottom-right-radius:8px}.general-score{text-align:center;margin-bottom:20px;background-color:#fff;padding:1rem;border-radius:6px;border:1px solid #e9ecef}.general-score .score{font-size:2em;font-weight:700;color:#4caf50}.feedback-details>div,.conversation-analysis>div,.actionable-feedback>div{margin-bottom:1rem}.feedback-details h4{margin-bottom:.75rem}.feedback-details p,.conversation-analysis p,.actionable-feedback ul{margin-bottom:.5rem}.comment{font-style:italic;color:#555}ul{list-style-position:inside;padding-left:0}h3{font-size:1.25rem;border-bottom:2px solid #eee;padding-bottom:.5rem;margin-top:1.5rem;margin-bottom:1rem;color:#333}h4{font-size:1.1rem;margin-top:1rem;margin-bottom:.5rem;color:#555}li{margin-bottom:.5rem}strong{color:#333}.loading-container{display:flex;justify-content:center;align-items:center;height:100%}\n"] }]
         }], ctorParameters: () => [] });
 
 const performanceAnalysisPromptTemplate = (baseLanguage, targetLanguage) => `
@@ -2746,32 +2780,6 @@ class EvaluationService {
         // Inner State to know when evaluation has finished.
         this.isGoalCompleted = signal(false, ...(ngDevMode ? [{ debugName: "isGoalCompleted" }] : []));
     }
-    //   async evaluateGoal(goalTask: IDynamicFlowTask): Promise<any> {
-    //     if (this.isGoalCompleted()) {
-    //       return;
-    //     }
-    //     if (!goalTask.task) {
-    //       // DEFAULT GOAL TASK if not provided... but should be provided.
-    //       goalTask.task =
-    //         'Evaluate this conversation the goal is to keep the conversation on topic consistency. give me from 0 to 25 points, 0 is bad user message and 25 is very good user message.';
-    //     }
-    //     const evaluator: SimpleAgentTask = {
-    //       task: goalTask.task,
-    //       expectedResponseType: `Response should be in next JSON format: {"score": number, "text": string},
-    // **score**: is a number it may be from 0 and 100, depending on user performance and instructions.
-    // **text**: is concrete feedback in less than 25 words.`,
-    //       model: goalTask.model || { quality: EModelQuality.FAST },
-    //     };
-    //     const evaluationResult = await this.evaluateConversation(evaluator, ContextType.LastMessage, 'goal-evaluation');
-    //     this.updateScore(evaluationResult.score || 0);
-    //     console.log(' ♦️ Goal Evaluation Result:', evaluationResult);
-    //     // Evaluation can return evything check i can standarize this.
-    //     this.toastService.info({
-    //       title: 'Score ' + evaluationResult?.text,
-    //       subtitle: `Added ${evaluationResult?.score} points`,
-    //     });
-    //     return evaluationResult;
-    //   }
     async evaluateConversation(task, contextType = ContextType.AllConversation, metaType = 'conversation-evaluation') {
         if (this.isGoalCompleted()) {
             return null;
@@ -2892,7 +2900,7 @@ ${task.task}
     resetScore() {
         this.conversationFlowStateService.updateGoalState({ value: 0 });
     }
-    async analylizePerformance() {
+    async analylizePerformance(customPrompt) {
         console.log('Analylizing performance...');
         const MIN_MESSAGES_EVALUATE = 6;
         const conversationMessages = this.contextEngineService.getContextMessages(ContextType.AllConversation);
@@ -2900,15 +2908,17 @@ ${task.task}
             return;
         }
         const conversationContext = this.contextEngineService.getConversationContext(ContextType.AllConversation);
-        // TODO change the english!
-        const baseLangDesc = getLangDesc(this.userService.user()?.settings?.baseLanguage, 'en');
-        const targetLangDesc = getLangDesc(this.userService.user()?.settings?.targetLanguage, 'en');
-        let prompt = performanceAnalysisPromptTemplate(baseLangDesc, targetLangDesc);
+        let prompt = customPrompt;
+        if (!prompt) {
+            const baseLangDesc = getLangDesc(this.userService.user()?.settings?.baseLanguage, 'en');
+            const targetLangDesc = getLangDesc(this.userService.user()?.settings?.targetLanguage, 'en');
+            prompt = performanceAnalysisPromptTemplate(baseLangDesc, targetLangDesc);
+        }
         prompt += `\n\nHere the user conversation: <Context>${conversationContext}</Context>`;
         this.loadingBarService.showIndeterminate();
         const response = await this.defaultAgentCardService.callChatCompletion({
             messages: [{ role: ChatRole.User, content: prompt }],
-            returnJson: true,
+            returnJson: !customPrompt, // Assume if regular prompt, we want JSON. If custom, let the model decide or return string.
         });
         this.loadingBarService.successAndHide();
         this.openFeedbackEvaluation(response.content);
@@ -3027,6 +3037,7 @@ class ConversationService {
         // State Signals
         this.isThinkingSignal = signal(false, ...(ngDevMode ? [{ debugName: "isThinkingSignal" }] : []));
         this.conversationSettingsState = signal(null, ...(ngDevMode ? [{ debugName: "conversationSettingsState" }] : []));
+        this.conversationSettings$ = this.conversationSettingsState.asReadonly();
         this.isDestroyedSignal = signal(false, ...(ngDevMode ? [{ debugName: "isDestroyedSignal" }] : []));
         this.micStatusSignal = signal('ready', ...(ngDevMode ? [{ debugName: "micStatusSignal" }] : []));
         this.currentAudioStatus = signal(null, ...(ngDevMode ? [{ debugName: "currentAudioStatus" }] : [])); // Orchestrator notifies about audio state
@@ -3087,6 +3098,14 @@ class ConversationService {
         mergedFlow.dynamicConditions = agentFlow?.dynamicConditions?.length > 0 ? agentFlow.dynamicConditions : defaultFlow.dynamicConditions;
         mergedFlow.challenges = agentFlow?.challenges?.length > 0 ? agentFlow.challenges : defaultFlow.challenges;
         mergedFlow.tools = agentFlow?.tools?.length > 0 ? agentFlow.tools : defaultFlow.tools;
+        mergedFlow.performancePrompt = agentFlow?.performancePrompt ? agentFlow.performancePrompt : defaultFlow.performancePrompt;
+        // Merge moodState
+        if (agentFlow?.moodState?.enabled) {
+            mergedFlow.moodState = agentFlow.moodState;
+        }
+        else if (defaultFlow?.moodState?.enabled) {
+            mergedFlow.moodState = defaultFlow.moodState;
+        }
         if (!mergedFlow.triggerTasks) {
             mergedFlow.triggerTasks = {};
         }
@@ -3759,6 +3778,20 @@ class ChatFooterComponent {
         this.lastUserMessageId = null;
         // Get score from conversation flow state service
         this.score = computed(() => this.conversationFlowStateService.flowState().goal.value, ...(ngDevMode ? [{ debugName: "score" }] : []));
+        // Map challenges with their emojis from config and completed status from state
+        this.challenges = computed(() => {
+            const config = this.dynamicFlowService.conversationFlowConfig();
+            const state = this.conversationFlowStateService.flowState();
+            if (!config?.challenges)
+                return [];
+            return config.challenges.map((challenge) => {
+                const stateChallenge = state.challenges.find((c) => c.name === challenge.name);
+                return {
+                    ...challenge,
+                    completed: stateChallenge?.value === true,
+                };
+            });
+        }, ...(ngDevMode ? [{ debugName: "challenges" }] : []));
         // Watch for audio completion and set the shouldResumeMic signal
         effect(() => {
             const audioStatus = this.conversationService.currentAudioStatus();
@@ -3867,11 +3900,11 @@ class ChatFooterComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ChatFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", 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: MicVadComponent, 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(dynamicFlowService.conversationFlowConfig()?.goal?.enabled) {\n  <p-progressbar showValue=\"false\" [value]=\"score()\" [style]=\"{ height: '6px' }\" />\n  }\n</div>\n", styles: [".progress-input{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}\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$1.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: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "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: "20.1.6", 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: MicVadComponent, 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(dynamicFlowService.conversationFlowConfig()?.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$1.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: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DCMicComponent, selector: "dc-mic", inputs: ["targetOrBase", "micSettings", "maxRecordingTime", "isDone"], outputs: ["onInterpretedText", "onFinishedRecognition", "onFinished"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ChatFooterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-chat-footer', standalone: true, imports: [ReactiveFormsModule, ProgressBarModule, TextareaModule, ButtonModule, MicVadComponent, 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(dynamicFlowService.conversationFlowConfig()?.goal?.enabled) {\n  <p-progressbar showValue=\"false\" [value]=\"score()\" [style]=\"{ height: '6px' }\" />\n  }\n</div>\n", styles: [".progress-input{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}\n"] }]
+            args: [{ selector: 'dc-chat-footer', standalone: true, imports: [ReactiveFormsModule, ProgressBarModule, TextareaModule, ButtonModule, MicVadComponent, 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(dynamicFlowService.conversationFlowConfig()?.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: [MicVadComponent]
@@ -4804,6 +4837,7 @@ class ConversationInspector {
         this.dynamicFlowService = parentInjector.get(DynamicFlowService);
         this.globalToolsService = parentInjector.get(GlobalToolsService);
         this.conversationFlowStateService = parentInjector.get(ConversationFlowStateService);
+        this.conversationService = parentInjector.get(ConversationService);
         console.log('ConversationInspector data assigned', this.agentCard, this.chatUserSettings);
     }
     setScore() {
@@ -4834,11 +4868,11 @@ class ConversationInspector {
         this.viewMode.set(this.viewMode() === 'markdown' ? 'regular' : 'markdown');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ConversationInspector, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ConversationInspector, isStandalone: true, selector: "dc-conversation-info", outputs: { completeEvent: "completeEvent" }, ngImport: i0, template: "<div class=\"info-content\">\n  <p-tabs value=\"0\">\n    <p-tablist>\n      <p-tab value=\"0\">Summary</p-tab>\n      <p-tab value=\"1\">Dynamic Flow</p-tab>\n      <p-tab value=\"5\">Conversation State</p-tab>\n      <p-tab value=\"2\">Messages</p-tab>\n      <p-tab value=\"3\">Pricing</p-tab>\n      <p-tab value=\"4\">More</p-tab>\n    </p-tablist>\n    <p-tabpanels>\n      <p-tabpanel value=\"0\">\n        <ng-template #content>\n          <div class=\"flex flex-wrap gap-2 mb-2\">\n            <p-button label=\"Call Agent\" (click)=\"callAgent()\" />\n            <p-button label=\"Feedback\" icon=\"pi pi-pencil\" (click)=\"openFeedback()\" />\n            <p-button label=\"Complete\" icon=\"pi pi-check\" (click)=\"complete()\" />\n          </div>\n\n          <!-- Summary -->\n          <p-divider>Score</p-divider>\n\n          <label for=\"slider\">Current Score : {{ conversationFlowStateService.flowState().goal.value }}</label>\n\n          <div class=\"flex flex gap-3\">\n            <p-slider [(ngModel)]=\"value\" [step]=\"10\" class=\"w-56\" />\n            <p-button label=\"Set Score to {{ value }}\" (onClick)=\"setScore()\" />\n          </div>\n          <!-- Summary ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"1\">\n        <ng-template #content>\n          <!-- Dynamic Flow -->\n\n          <p-divider>Conversation Flow</p-divider>\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.goal?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Goal</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.goal?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger User Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger Assistant Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <h3>Herramientas</h3>\n          @for (tool of dynamicFlowService.conversationFlowConfig()?.tools; track tool.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (tool.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">{{ tool.name }}</p>\n            </div>\n            @if(tool.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ tool.description }} </div>\n            }\n          </div>\n          }\n\n          <h3>Challenges Retos</h3>\n          @for (challenge of dynamicFlowService.conversationFlowConfig()?.challenges; track challenge.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (challenge.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n\n              <p class=\"font-semibold\"> {{ challenge.emoji }} {{ challenge.name }}</p>\n            </div>\n            @if(challenge.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ challenge.description }} </div>\n            }\n          </div>\n          }\n          <h5>Conditions</h5>\n\n          @for (condition of dynamicFlowService.conversationFlowConfig()?.dynamicConditions; track $index) {\n          <div class=\"pl-2 mt-1 text-sm text-gray-600 italic\"> When the {{ condition.what }} is {{ condition.when }} than {{ condition.value }} Do </div>\n          <ol>\n            @for (doAction of condition.do; track $index) {\n            <li class=\"pl-5 mt-1 text-sm text-gray-600 italic\">\n              {{ $index }})\n              <span style=\"color: brown\"> {{ doAction.actionType }}</span>\n              <span style=\"color: green\"> {{ doAction.systemPromptType }}</span>\n              <span style=\"color: green\"> {{ doAction.dynamicFlowTaskType }}</span>\n\n              to\n              <span style=\"color: rgb(49, 23, 177)\"> {{ doAction.enabled }}</span>\n              \"{{ doAction.prompt }}\"\n            </li>\n            }\n          </ol>\n          }\n\n          <p>Challenges</p>\n          <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n\n          <!-- Dynamic Flow ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"5\">\n        <ng-template #content>\n          <pre>{{ conversationFlowStateService.flowState() | safeJson }}</pre>\n          <details>\n            <summary>Current Prompt</summary>\n            <pre>{{ dynamicFlowService.generateSystemPromptForFlow(messageStateService.getMessagesSignal()()) }}</pre>\n          </details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"2\">\n        <ng-template #content>\n          <div>\n            <p-button label=\"Exportar todo\" (click)=\"exportChat('all')\" />\n            <p-button label=\"Exportar conversaci\u00F3n\" (click)=\"exportChat('conversation')\" />\n            <p-button [label]=\"'Vista ' + viewMode()\" (click)=\"toggleViewMode()\" />\n          </div>\n          <dc-prompt-preview [messages]=\"messageStateService.getMessagesSignal()()\" [view]=\"viewMode()\"></dc-prompt-preview>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"3\">\n        <ng-template #content>\n          <dc-cost-details></dc-cost-details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"4\">\n        <ng-template #content>\n          <!-- MORE INFO -->\n\n          <details>\n            <summary>Estado Global Conversation Flow</summary>\n            <p>Goal</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.goal | safeJson }}</pre>\n            <p>Trigger User Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage | safeJson }}</pre>\n            <p>Trigger Assistant Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage | safeJson }}</pre>\n            <p>Conditions</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.dynamicConditions | safeJson }}</pre>\n            <p>Tools</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.tools | safeJson }}</pre>\n            <p>Challenges</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>Agent Card</summary>\n            <pre>{{ agentCard | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>User Settings</summary>\n            <pre>{{ chatUserSettings | safeJson }}</pre>\n          </details>\n\n          <!-- MORE INFO ends Here -->\n        </ng-template>\n      </p-tabpanel>\n    </p-tabpanels>\n  </p-tabs>\n</div>\n", styles: [":host{overflow-y:scroll}.info-content{display:flex;flex-direction:column;gap:1rem;padding:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i1$4.Slider, selector: "p-slider", inputs: ["animate", "min", "max", "orientation", "step", "range", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { 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: DividerModule }, { kind: "component", type: i1$2.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: PromptPreviewComponent, selector: "dc-prompt-preview", inputs: ["messages", "jailBrake", "view"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i2$6.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i2$6.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i2$6.TabPanel, selector: "p-tabpanel", inputs: ["lazy", "value"], outputs: ["valueChange"] }, { kind: "component", type: i2$6.TabList, selector: "p-tablist" }, { kind: "component", type: i2$6.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: CostDetailsComponent, selector: "dc-cost-details" }, { kind: "pipe", type: SafeJsonPipe, name: "safeJson" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ConversationInspector, isStandalone: true, selector: "dc-conversation-info", outputs: { completeEvent: "completeEvent" }, ngImport: i0, template: "<div class=\"info-content\">\n  <p-tabs value=\"0\">\n    <p-tablist>\n      <p-tab value=\"0\">Summary</p-tab>\n      <p-tab value=\"1\">Dynamic Flow</p-tab>\n      <p-tab value=\"5\">Conversation State</p-tab>\n      <p-tab value=\"2\">Messages</p-tab>\n      <p-tab value=\"3\">Pricing</p-tab>\n      <p-tab value=\"4\">More</p-tab>\n    </p-tablist>\n    <p-tabpanels>\n      <p-tabpanel value=\"0\">\n        <ng-template #content>\n          <div class=\"flex flex-wrap gap-2 mb-2\">\n            <p-button label=\"Call Agent\" (click)=\"callAgent()\" />\n            <p-button label=\"Feedback\" icon=\"pi pi-pencil\" (click)=\"openFeedback()\" />\n            <p-button label=\"Complete\" icon=\"pi pi-check\" (click)=\"complete()\" />\n          </div>\n\n          <!-- Summary -->\n          <p-divider>Score</p-divider>\n\n          <label for=\"slider\">Current Score : {{ conversationFlowStateService.flowState().goal.value }}</label>\n\n          <div class=\"flex flex gap-3\">\n            <p-slider [(ngModel)]=\"value\" [step]=\"10\" class=\"w-56\" />\n            <p-button label=\"Set Score to {{ value }}\" (onClick)=\"setScore()\" />\n          </div>\n          <!-- Summary ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"1\">\n        <ng-template #content>\n          <!-- Dynamic Flow -->\n\n          <p-divider>Conversation Flow</p-divider>\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.goal?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Goal</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.goal?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger User Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger Assistant Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <h3>Herramientas</h3>\n          @for (tool of dynamicFlowService.conversationFlowConfig()?.tools; track tool.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (tool.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">{{ tool.name }}</p>\n            </div>\n            @if(tool.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ tool.description }} </div>\n            }\n          </div>\n          }\n\n          <h3>Challenges Retos</h3>\n          @for (challenge of dynamicFlowService.conversationFlowConfig()?.challenges; track challenge.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (challenge.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n\n              <p class=\"font-semibold\"> {{ challenge.emoji }} {{ challenge.name }}</p>\n            </div>\n            @if(challenge.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ challenge.description }} </div>\n            }\n          </div>\n          }\n          <h5>Conditions</h5>\n\n          @for (condition of dynamicFlowService.conversationFlowConfig()?.dynamicConditions; track $index) {\n          <div class=\"pl-2 mt-1 text-sm text-gray-600 italic\"> When the {{ condition.what }} is {{ condition.when }} than {{ condition.value }} Do </div>\n          <ol>\n            @for (doAction of condition.do; track $index) {\n            <li class=\"pl-5 mt-1 text-sm text-gray-600 italic\">\n              {{ $index }})\n              <span style=\"color: brown\"> {{ doAction.actionType }}</span>\n              <span style=\"color: green\"> {{ doAction.systemPromptType }}</span>\n              <span style=\"color: green\"> {{ doAction.dynamicFlowTaskType }}</span>\n\n              to\n              <span style=\"color: rgb(49, 23, 177)\"> {{ doAction.enabled }}</span>\n              \"{{ doAction.prompt }}\"\n            </li>\n            }\n          </ol>\n          }\n\n          <p>Challenges</p>\n          <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n\n          <p-divider>Performance Prompt</p-divider>\n          @if(dynamicFlowService.conversationFlowConfig()?.performancePrompt; as prompt) {\n          <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ prompt }} </div>\n          } @else {\n          <div class=\"pl-5 mt-1 text-sm text-gray-400 italic\"> No custom performance prompt defined (using default). </div>\n          }\n\n          <p-divider>System Evaluation Prompt</p-divider>\n          <details>\n            <summary>Show Prompt</summary>\n            <pre>{{ dynamicFlowService.generateSystemPromptForFlow(messageStateService.getMessagesSignal()()) }}</pre>\n          </details>\n\n          <!-- Dynamic Flow ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"5\">\n        <ng-template #content>\n          <pre>{{ conversationFlowStateService.flowState() | safeJson }}</pre>\n          <details>\n            <summary>Current Prompt</summary>\n            <pre>{{ dynamicFlowService.generateSystemPromptForFlow(messageStateService.getMessagesSignal()()) }}</pre>\n          </details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"2\">\n        <ng-template #content>\n          <div>\n            <p-button label=\"Exportar todo\" (click)=\"exportChat('all')\" />\n            <p-button label=\"Exportar conversaci\u00F3n\" (click)=\"exportChat('conversation')\" />\n            <p-button [label]=\"'Vista ' + viewMode()\" (click)=\"toggleViewMode()\" />\n          </div>\n          <dc-prompt-preview [messages]=\"messageStateService.getMessagesSignal()()\" [view]=\"viewMode()\"></dc-prompt-preview>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"3\">\n        <ng-template #content>\n          <dc-cost-details></dc-cost-details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"4\">\n        <ng-template #content>\n          <!-- MORE INFO -->\n\n          <details>\n            <summary>Estado Global Conversation Flow</summary>\n            <p>Goal</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.goal | safeJson }}</pre>\n            <p>Trigger User Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage | safeJson }}</pre>\n            <p>Trigger Assistant Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage | safeJson }}</pre>\n            <p>Conditions</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.dynamicConditions | safeJson }}</pre>\n            <p>Tools</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.tools | safeJson }}</pre>\n            <p>Challenges</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>Conversation Settings (Debug)</summary>\n            <pre>{{ conversationService.conversationSettings$() | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>Agent Card</summary>\n            <pre>{{ agentCard | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>User Settings</summary>\n            <pre>{{ chatUserSettings | safeJson }}</pre>\n          </details>\n\n          <!-- MORE INFO ends Here -->\n        </ng-template>\n      </p-tabpanel>\n    </p-tabpanels>\n  </p-tabs>\n</div>\n", styles: [":host{overflow-y:scroll}.info-content{display:flex;flex-direction:column;gap:1rem;padding:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: SliderModule }, { kind: "component", type: i1$4.Slider, selector: "p-slider", inputs: ["animate", "min", "max", "orientation", "step", "range", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { 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: DividerModule }, { kind: "component", type: i1$2.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: PromptPreviewComponent, selector: "dc-prompt-preview", inputs: ["messages", "jailBrake", "view"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i2$6.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i2$6.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i2$6.TabPanel, selector: "p-tabpanel", inputs: ["lazy", "value"], outputs: ["valueChange"] }, { kind: "component", type: i2$6.TabList, selector: "p-tablist" }, { kind: "component", type: i2$6.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: CostDetailsComponent, selector: "dc-cost-details" }, { kind: "pipe", type: SafeJsonPipe, name: "safeJson" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ConversationInspector, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-conversation-info', standalone: true, imports: [CommonModule, SafeJsonPipe, SliderModule, ButtonModule, FormsModule, DividerModule, PromptPreviewComponent, TabsModule, CostDetailsComponent], template: "<div class=\"info-content\">\n  <p-tabs value=\"0\">\n    <p-tablist>\n      <p-tab value=\"0\">Summary</p-tab>\n      <p-tab value=\"1\">Dynamic Flow</p-tab>\n      <p-tab value=\"5\">Conversation State</p-tab>\n      <p-tab value=\"2\">Messages</p-tab>\n      <p-tab value=\"3\">Pricing</p-tab>\n      <p-tab value=\"4\">More</p-tab>\n    </p-tablist>\n    <p-tabpanels>\n      <p-tabpanel value=\"0\">\n        <ng-template #content>\n          <div class=\"flex flex-wrap gap-2 mb-2\">\n            <p-button label=\"Call Agent\" (click)=\"callAgent()\" />\n            <p-button label=\"Feedback\" icon=\"pi pi-pencil\" (click)=\"openFeedback()\" />\n            <p-button label=\"Complete\" icon=\"pi pi-check\" (click)=\"complete()\" />\n          </div>\n\n          <!-- Summary -->\n          <p-divider>Score</p-divider>\n\n          <label for=\"slider\">Current Score : {{ conversationFlowStateService.flowState().goal.value }}</label>\n\n          <div class=\"flex flex gap-3\">\n            <p-slider [(ngModel)]=\"value\" [step]=\"10\" class=\"w-56\" />\n            <p-button label=\"Set Score to {{ value }}\" (onClick)=\"setScore()\" />\n          </div>\n          <!-- Summary ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"1\">\n        <ng-template #content>\n          <!-- Dynamic Flow -->\n\n          <p-divider>Conversation Flow</p-divider>\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.goal?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Goal</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.goal?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger User Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger Assistant Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <h3>Herramientas</h3>\n          @for (tool of dynamicFlowService.conversationFlowConfig()?.tools; track tool.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (tool.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">{{ tool.name }}</p>\n            </div>\n            @if(tool.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ tool.description }} </div>\n            }\n          </div>\n          }\n\n          <h3>Challenges Retos</h3>\n          @for (challenge of dynamicFlowService.conversationFlowConfig()?.challenges; track challenge.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (challenge.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n\n              <p class=\"font-semibold\"> {{ challenge.emoji }} {{ challenge.name }}</p>\n            </div>\n            @if(challenge.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ challenge.description }} </div>\n            }\n          </div>\n          }\n          <h5>Conditions</h5>\n\n          @for (condition of dynamicFlowService.conversationFlowConfig()?.dynamicConditions; track $index) {\n          <div class=\"pl-2 mt-1 text-sm text-gray-600 italic\"> When the {{ condition.what }} is {{ condition.when }} than {{ condition.value }} Do </div>\n          <ol>\n            @for (doAction of condition.do; track $index) {\n            <li class=\"pl-5 mt-1 text-sm text-gray-600 italic\">\n              {{ $index }})\n              <span style=\"color: brown\"> {{ doAction.actionType }}</span>\n              <span style=\"color: green\"> {{ doAction.systemPromptType }}</span>\n              <span style=\"color: green\"> {{ doAction.dynamicFlowTaskType }}</span>\n\n              to\n              <span style=\"color: rgb(49, 23, 177)\"> {{ doAction.enabled }}</span>\n              \"{{ doAction.prompt }}\"\n            </li>\n            }\n          </ol>\n          }\n\n          <p>Challenges</p>\n          <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n\n          <!-- Dynamic Flow ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"5\">\n        <ng-template #content>\n          <pre>{{ conversationFlowStateService.flowState() | safeJson }}</pre>\n          <details>\n            <summary>Current Prompt</summary>\n            <pre>{{ dynamicFlowService.generateSystemPromptForFlow(messageStateService.getMessagesSignal()()) }}</pre>\n          </details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"2\">\n        <ng-template #content>\n          <div>\n            <p-button label=\"Exportar todo\" (click)=\"exportChat('all')\" />\n            <p-button label=\"Exportar conversaci\u00F3n\" (click)=\"exportChat('conversation')\" />\n            <p-button [label]=\"'Vista ' + viewMode()\" (click)=\"toggleViewMode()\" />\n          </div>\n          <dc-prompt-preview [messages]=\"messageStateService.getMessagesSignal()()\" [view]=\"viewMode()\"></dc-prompt-preview>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"3\">\n        <ng-template #content>\n          <dc-cost-details></dc-cost-details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"4\">\n        <ng-template #content>\n          <!-- MORE INFO -->\n\n          <details>\n            <summary>Estado Global Conversation Flow</summary>\n            <p>Goal</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.goal | safeJson }}</pre>\n            <p>Trigger User Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage | safeJson }}</pre>\n            <p>Trigger Assistant Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage | safeJson }}</pre>\n            <p>Conditions</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.dynamicConditions | safeJson }}</pre>\n            <p>Tools</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.tools | safeJson }}</pre>\n            <p>Challenges</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>Agent Card</summary>\n            <pre>{{ agentCard | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>User Settings</summary>\n            <pre>{{ chatUserSettings | safeJson }}</pre>\n          </details>\n\n          <!-- MORE INFO ends Here -->\n        </ng-template>\n      </p-tabpanel>\n    </p-tabpanels>\n  </p-tabs>\n</div>\n", styles: [":host{overflow-y:scroll}.info-content{display:flex;flex-direction:column;gap:1rem;padding:1rem}\n"] }]
+            args: [{ selector: 'dc-conversation-info', standalone: true, imports: [CommonModule, SafeJsonPipe, SliderModule, ButtonModule, FormsModule, DividerModule, PromptPreviewComponent, TabsModule, CostDetailsComponent], template: "<div class=\"info-content\">\n  <p-tabs value=\"0\">\n    <p-tablist>\n      <p-tab value=\"0\">Summary</p-tab>\n      <p-tab value=\"1\">Dynamic Flow</p-tab>\n      <p-tab value=\"5\">Conversation State</p-tab>\n      <p-tab value=\"2\">Messages</p-tab>\n      <p-tab value=\"3\">Pricing</p-tab>\n      <p-tab value=\"4\">More</p-tab>\n    </p-tablist>\n    <p-tabpanels>\n      <p-tabpanel value=\"0\">\n        <ng-template #content>\n          <div class=\"flex flex-wrap gap-2 mb-2\">\n            <p-button label=\"Call Agent\" (click)=\"callAgent()\" />\n            <p-button label=\"Feedback\" icon=\"pi pi-pencil\" (click)=\"openFeedback()\" />\n            <p-button label=\"Complete\" icon=\"pi pi-check\" (click)=\"complete()\" />\n          </div>\n\n          <!-- Summary -->\n          <p-divider>Score</p-divider>\n\n          <label for=\"slider\">Current Score : {{ conversationFlowStateService.flowState().goal.value }}</label>\n\n          <div class=\"flex flex gap-3\">\n            <p-slider [(ngModel)]=\"value\" [step]=\"10\" class=\"w-56\" />\n            <p-button label=\"Set Score to {{ value }}\" (onClick)=\"setScore()\" />\n          </div>\n          <!-- Summary ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"1\">\n        <ng-template #content>\n          <!-- Dynamic Flow -->\n\n          <p-divider>Conversation Flow</p-divider>\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.goal?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Goal</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.goal?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger User Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">Trigger Assistant Message</p>\n            </div>\n            @if(dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage?.task; as task) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ task }} </div>\n            }\n          </div>\n\n          <h3>Herramientas</h3>\n          @for (tool of dynamicFlowService.conversationFlowConfig()?.tools; track tool.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (tool.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n              <p class=\"font-semibold\">{{ tool.name }}</p>\n            </div>\n            @if(tool.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ tool.description }} </div>\n            }\n          </div>\n          }\n\n          <h3>Challenges Retos</h3>\n          @for (challenge of dynamicFlowService.conversationFlowConfig()?.challenges; track challenge.name) {\n          <div class=\"mb-2\">\n            <div class=\"flex items-center gap-2\">\n              @if (challenge.enabled) {\n              <div class=\"w-3 h-3 bg-green-500 rounded-full\" pTooltip=\"Active\"></div>\n              } @else {\n              <div class=\"w-3 h-3 bg-red-500 rounded-full\" pTooltip=\"Inactive\"></div>\n              }\n\n              <p class=\"font-semibold\"> {{ challenge.emoji }} {{ challenge.name }}</p>\n            </div>\n            @if(challenge.description) {\n            <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ challenge.description }} </div>\n            }\n          </div>\n          }\n          <h5>Conditions</h5>\n\n          @for (condition of dynamicFlowService.conversationFlowConfig()?.dynamicConditions; track $index) {\n          <div class=\"pl-2 mt-1 text-sm text-gray-600 italic\"> When the {{ condition.what }} is {{ condition.when }} than {{ condition.value }} Do </div>\n          <ol>\n            @for (doAction of condition.do; track $index) {\n            <li class=\"pl-5 mt-1 text-sm text-gray-600 italic\">\n              {{ $index }})\n              <span style=\"color: brown\"> {{ doAction.actionType }}</span>\n              <span style=\"color: green\"> {{ doAction.systemPromptType }}</span>\n              <span style=\"color: green\"> {{ doAction.dynamicFlowTaskType }}</span>\n\n              to\n              <span style=\"color: rgb(49, 23, 177)\"> {{ doAction.enabled }}</span>\n              \"{{ doAction.prompt }}\"\n            </li>\n            }\n          </ol>\n          }\n\n          <p>Challenges</p>\n          <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n\n          <p-divider>Performance Prompt</p-divider>\n          @if(dynamicFlowService.conversationFlowConfig()?.performancePrompt; as prompt) {\n          <div class=\"pl-5 mt-1 text-sm text-gray-600 italic\"> {{ prompt }} </div>\n          } @else {\n          <div class=\"pl-5 mt-1 text-sm text-gray-400 italic\"> No custom performance prompt defined (using default). </div>\n          }\n\n          <p-divider>System Evaluation Prompt</p-divider>\n          <details>\n            <summary>Show Prompt</summary>\n            <pre>{{ dynamicFlowService.generateSystemPromptForFlow(messageStateService.getMessagesSignal()()) }}</pre>\n          </details>\n\n          <!-- Dynamic Flow ends Here -->\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"5\">\n        <ng-template #content>\n          <pre>{{ conversationFlowStateService.flowState() | safeJson }}</pre>\n          <details>\n            <summary>Current Prompt</summary>\n            <pre>{{ dynamicFlowService.generateSystemPromptForFlow(messageStateService.getMessagesSignal()()) }}</pre>\n          </details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"2\">\n        <ng-template #content>\n          <div>\n            <p-button label=\"Exportar todo\" (click)=\"exportChat('all')\" />\n            <p-button label=\"Exportar conversaci\u00F3n\" (click)=\"exportChat('conversation')\" />\n            <p-button [label]=\"'Vista ' + viewMode()\" (click)=\"toggleViewMode()\" />\n          </div>\n          <dc-prompt-preview [messages]=\"messageStateService.getMessagesSignal()()\" [view]=\"viewMode()\"></dc-prompt-preview>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"3\">\n        <ng-template #content>\n          <dc-cost-details></dc-cost-details>\n        </ng-template>\n      </p-tabpanel>\n      <p-tabpanel value=\"4\">\n        <ng-template #content>\n          <!-- MORE INFO -->\n\n          <details>\n            <summary>Estado Global Conversation Flow</summary>\n            <p>Goal</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.goal | safeJson }}</pre>\n            <p>Trigger User Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onUserMessage | safeJson }}</pre>\n            <p>Trigger Assistant Message</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.triggerTasks?.onAssistantMessage | safeJson }}</pre>\n            <p>Conditions</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.dynamicConditions | safeJson }}</pre>\n            <p>Tools</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.tools | safeJson }}</pre>\n            <p>Challenges</p>\n            <pre>{{ dynamicFlowService.conversationFlowConfig()?.challenges | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>Conversation Settings (Debug)</summary>\n            <pre>{{ conversationService.conversationSettings$() | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>Agent Card</summary>\n            <pre>{{ agentCard | safeJson }}</pre>\n          </details>\n\n          <details>\n            <summary>User Settings</summary>\n            <pre>{{ chatUserSettings | safeJson }}</pre>\n          </details>\n\n          <!-- MORE INFO ends Here -->\n        </ng-template>\n      </p-tabpanel>\n    </p-tabpanels>\n  </p-tabs>\n</div>\n", styles: [":host{overflow-y:scroll}.info-content{display:flex;flex-direction:column;gap:1rem;padding:1rem}\n"] }]
         }], ctorParameters: () => [] });
 
 class ConversationInfoService {
@@ -4948,7 +4982,8 @@ class DCChatComponent {
         this.moodSubscription?.unsubscribe();
         // Ensure the microphone is stopped when the chat component is destroyed
         this.chatFooterComponent?.stopMic();
-        this.evaluationService.analylizePerformance();
+        // this.conversationFlow?.performancePrompt;
+        this.evaluationService.analylizePerformance(this.conversationFlow?.performancePrompt);
         this.evaluationService.resetEvaluation();
         // this.conversationService.resetConversation(); // Not sure if i need this? last update not even exits the line and was working.
     }
@@ -5337,7 +5372,6 @@ class ACCMotionGenerationComponent {
             alert('Please select a resolution');
             return;
         }
-        debugger;
         const emptyAsset = {
             name: 'Character Video',
             type: 'video',
@@ -5580,7 +5614,7 @@ ${prompt_user}
         return Object.keys(obj);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ACCTranslationGenerationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ACCTranslationGenerationComponent, isStandalone: true, selector: "dc-acc-translation-generation", inputs: { agentCard: "agentCard" }, outputs: { cardImprovementsChange: "cardImprovementsChange" }, ngImport: i0, template: "<div>\n  @switch (generationStep()) { @case ('idea') {\n\n  <p-message severity=\"warn\"\n    >Antes de traducir, aseg\u00FArate de que los campos de Saludos (Greetings), Gancho (Hook), Instrucciones (Instructions) y Comunicaci\u00F3n (Communication) est\u00E9n\n    completados.</p-message\n  >\n\n  <!-- Todos los Inicios de conversaci\u00F3n -->\n  <h5 pTooltip=\"Todos los inicios de conversaci\u00F3n\" tooltipPosition=\"left\"> Inicios de conversaci\u00F3n </h5>\n\n  @for (greeting of greetings(); track $index) {\n  <li> {{ greeting }} </li>\n  }\n\n  <!-- Ejemplo de mensaje -->\n  <h5 pTooltip=\"Ejemplo de mensaje\" tooltipPosition=\"left\"> Ejemplo de mensaje </h5>\n  <p> {{ agentCard.characterCard.data.mes_example }} </p>\n\n  <!-- Notas del creador -->\n  <h5 pTooltip=\"Texto corto para incitar a la interacci\u00F3n\" tooltipPosition=\"left\"> Gancho para Interacci\u00F3n </h5>\n  @if (agentCard.characterCard.data.hook) {\n  <p> {{ agentCard.characterCard.data.hook }} </p>\n  } @else {\n  <p-message severity=\"error\">No hay gancho para interacci\u00F3n </p-message>\n  }\n\n  <div class=\"flex justify-end gap-2\">\n    <p-button label=\"Traducir a los 10 idiomas m\u00E1s importantes\" (click)=\"generateTop10Prompt()\"></p-button>\n    <p-button label=\"Traducir a Ingl\u00E9s y Espa\u00F1ol\" (click)=\"generateEnEsPrompt()\"></p-button>\n    <p-button label=\"Traducir a todos los idiomas\" (click)=\"generatePrompt()\"></p-button>\n  </div>\n  } @case ('prompt') {\n  <div>\n    <h3>Final Prompt:</h3>\n    <pre class=\"surface-100 p-2 border-round-sm\">{{ prompt() }}</pre>\n  </div>\n  <div class=\"flex justify-end\">\n    <p-button label=\"Generar\" (click)=\"generate()\" [loading]=\"loading()\"></p-button>\n  </div>\n  } @case ('result') {\n  <div>\n    <h3>Traducciones generadas para el personaje:</h3>\n    @if (cardImprovements(); as card) {\n    <div>\n      @for (lang of objectKeys(card); track lang) {\n      <div class=\"mb-3\">\n        <h4>{{ lang }}</h4>\n        <div class=\"grid\">\n          <div class=\"col-12\">\n            <strong>Greetings:</strong>\n            <ul>\n              @for (greeting of card[lang].greetings; track $index) {\n              <li>{{ greeting }}</li>\n              }\n            </ul>\n          </div>\n          <div class=\"col-12\">\n            <strong>Hook:</strong>\n            <p>{{ card[lang]?.hook }}</p>\n          </div>\n          <div class=\"col-12\">\n            <strong>Communication:</strong>\n            <p>{{ card[lang]?.communication }}</p>\n          </div>\n        </div>\n        <div class=\"col-12\">\n          <strong>Instrucciones:</strong>\n          <p>{{ card[lang]?.instructions }}</p>\n        </div>\n      </div>\n      }\n    </div>\n    }\n  </div>\n  } }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AccordionModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i3$3.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ACCTranslationGenerationComponent, isStandalone: true, selector: "dc-acc-translation-generation", inputs: { agentCard: "agentCard" }, outputs: { cardImprovementsChange: "cardImprovementsChange" }, ngImport: i0, template: "<div>\n  @switch (generationStep()) { @case ('idea') {\n\n  <p-message severity=\"warn\"\n    >Antes de traducir, aseg\u00FArate de que los campos de Saludos (Greetings), Gancho (Hook), Instrucciones (Instructions) y Comunicaci\u00F3n (Communication) est\u00E9n\n    completados.</p-message\n  >\n\n  <!-- Todos los Inicios de conversaci\u00F3n -->\n  <h5 pTooltip=\"Todos los inicios de conversaci\u00F3n\" tooltipPosition=\"left\"> Inicios de conversaci\u00F3n </h5>\n\n  @for (greeting of greetings(); track $index) {\n  <li> {{ greeting }} </li>\n  }\n\n  <!-- Ejemplo de mensaje -->\n  <h5 pTooltip=\"Ejemplo de mensaje\" tooltipPosition=\"left\"> Ejemplo de mensaje </h5>\n  <p> {{ agentCard.characterCard.data.mes_example }} </p>\n\n  <!-- Notas del creador -->\n  <h5 pTooltip=\"Texto corto para incitar a la interacci\u00F3n\" tooltipPosition=\"left\"> Gancho para Interacci\u00F3n </h5>\n  @if (agentCard.characterCard.data.hook) {\n  <p> {{ agentCard.characterCard.data.hook }} </p>\n  } @else {\n  <p-message severity=\"error\">No hay gancho para interacci\u00F3n </p-message>\n  }\n\n  <div class=\"flex justify-end gap-2\">\n    <p-button label=\"Traducir a los 10 idiomas m\u00E1s importantes\" (click)=\"generateTop10Prompt()\"></p-button>\n    <p-button label=\"Traducir a Ingl\u00E9s y Espa\u00F1ol\" (click)=\"generateEnEsPrompt()\"></p-button>\n    <p-button label=\"Traducir a todos los idiomas\" (click)=\"generatePrompt()\"></p-button>\n  </div>\n  } @case ('prompt') {\n  <div>\n    <h3>Final Prompt:</h3>\n    <pre class=\"surface-100 p-2 border-round-sm\">{{ prompt() }}</pre>\n  </div>\n  <div class=\"flex justify-end\">\n    <p-button label=\"Generar\" (click)=\"generate()\" [loading]=\"loading()\"></p-button>\n  </div>\n  } @case ('result') {\n  <div>\n    <h3>Traducciones generadas para el personaje:</h3>\n    @if (cardImprovements(); as card) {\n    <div>\n      @for (lang of objectKeys(card); track lang) {\n      <div class=\"mb-3\">\n        <h4>{{ lang }}</h4>\n        <div class=\"grid\">\n          <div class=\"col-12\">\n            <strong>Greetings:</strong>\n            <ul>\n              @for (greeting of card[lang].greetings; track $index) {\n              <li>{{ greeting }}</li>\n              }\n            </ul>\n          </div>\n          <div class=\"col-12\">\n            <strong>Hook:</strong>\n            <p>{{ card[lang]?.hook }}</p>\n          </div>\n          <div class=\"col-12\">\n            <strong>Communication:</strong>\n            <p>{{ card[lang]?.communication }}</p>\n          </div>\n        </div>\n        <div class=\"col-12\">\n          <strong>Instrucciones:</strong>\n          <p>{{ card[lang]?.instructions }}</p>\n        </div>\n      </div>\n      }\n    </div>\n    }\n  </div>\n  } }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: AccordionModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i3$3.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ACCTranslationGenerationComponent, decorators: [{
             type: Component,
@@ -5921,7 +5955,7 @@ class AccountPlatformForm {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AccountPlatformForm, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AccountPlatformForm, isStandalone: true, selector: "account-platform-form", inputs: { formArray: "formArray" }, ngImport: i0, template: "<div class=\"source-form-card\">\n  <p-card header=\"Cuenta\">\n    @for (formAccount of formArray.controls; track formAccount) {\n    <form [formGroup]=\"$any(formAccount)\">\n      <div class=\"form-field\">\n        <label class=\"block\">Platform</label>\n        <p-select [options]=\"platformOptions\" formControlName=\"platform\" optionLabel=\"label\" optionValue=\"value\" placeholder=\"Select a platform\"></p-select>\n      </div>\n\n      <div class=\"form-field\">\n        <label for=\"name\" class=\"block\">Username</label>\n        <input pInputText id=\"name\" type=\"text\" formControlName=\"name\" placeholder=\"Enter name\" class=\"w-full\" />\n      </div>\n\n      <div class=\"form-field\">\n        <label class=\"block\">Email</label>\n        <input pInputText type=\"text\" formControlName=\"email\" placeholder=\"Enter name\" class=\"w-full\" />\n      </div>\n    </form>\n    }\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: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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],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: CardModule }, { kind: "component", type: i2$8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: ButtonModule }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: ChipModule }, { kind: "ngmodule", type: TooltipModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AccountPlatformForm, isStandalone: true, selector: "account-platform-form", inputs: { formArray: "formArray" }, ngImport: i0, template: "<div class=\"source-form-card\">\n  <p-card header=\"Cuenta\">\n    @for (formAccount of formArray.controls; track formAccount) {\n    <form [formGroup]=\"$any(formAccount)\">\n      <div class=\"form-field\">\n        <label class=\"block\">Platform</label>\n        <p-select [options]=\"platformOptions\" formControlName=\"platform\" optionLabel=\"label\" optionValue=\"value\" placeholder=\"Select a platform\"></p-select>\n      </div>\n\n      <div class=\"form-field\">\n        <label for=\"name\" class=\"block\">Username</label>\n        <input pInputText id=\"name\" type=\"text\" formControlName=\"name\" placeholder=\"Enter name\" class=\"w-full\" />\n      </div>\n\n      <div class=\"form-field\">\n        <label class=\"block\">Email</label>\n        <input pInputText type=\"text\" formControlName=\"email\" placeholder=\"Enter name\" class=\"w-full\" />\n      </div>\n    </form>\n    }\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: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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],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: CardModule }, { kind: "component", type: i2$7.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: ButtonModule }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: ChipModule }, { kind: "ngmodule", type: TooltipModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AccountPlatformForm, decorators: [{
             type: Component,
@@ -6149,6 +6183,7 @@ class CharacterFormGroupService {
             tools: this.fb.array([]),
             dynamicConditions: this.fb.array([]),
             moodState: this.createMoodStateFormGroup(),
+            performancePrompt: [''],
         });
     }
     createMoodStateFormGroup() {
@@ -6283,11 +6318,11 @@ class AgentTaskFormComponent {
         this.shortForm = false; // is short means AITask else SimpleAgentTask AiTaks is shorter
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AgentTaskFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AgentTaskFormComponent, isStandalone: true, selector: "agent-task-form", inputs: { formGroup: "formGroup", shortForm: "shortForm" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"space-y-6 p-4\">\n  @if(formGroup.controls?.task) {\n  <div class=\"form-field\">\n    <div class=\"flex space-x-4\">\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.enabled\" binary=\"true\" /> Activada </div>\n\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.disableFeature\" binary=\"true\" /> Disable Feature </div>\n    </div>\n\n    <label for=\"task\" class=\"block text-sm font-medium text-gray-700\">Descripci\u00F3n de la evaluaci\u00F3n para el objetivo</label>\n\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" [formControl]=\"formGroup.controls?.task\"></textarea>\n  </div>\n  } @if(!shortForm && formGroup.controls?.expectedResponseType) {\n  <div class=\"form-field\">\n    <label for=\"expectedResponseType\" class=\"block text-sm font-medium text-gray-700\">Expected Response Type</label>\n    <input pInputText id=\"expectedResponseType\" type=\"text\" [formControl]=\"formGroup.controls?.expectedResponseType\" class=\"w-full\" />\n  </div>\n  } @if (formGroup.controls?.model) {\n\n  <dc-model-selector [modelForm]=\"formGroup.controls.model\" [shortForm]=\"shortForm\"></dc-model-selector>\n  } @if (!shortForm && formGroup.controls?.systemPrompt) {\n  <div class=\"form-field\">\n    <label for=\"systemPrompt\" class=\"block text-sm font-medium text-gray-700 mb-1\">System Prompt</label>\n    <input pInputText id=\"systemPrompt\" [formControl]=\"formGroup.controls?.systemPrompt\" class=\"w-full\" />\n  </div>\n  }\n</div>\n", styles: [":host{display:block}.form-field{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { 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],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: ModelSelectorComponent, selector: "dc-model-selector", inputs: ["modelForm", "shortForm"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AgentTaskFormComponent, isStandalone: true, selector: "agent-task-form", inputs: { formGroup: "formGroup", shortForm: "shortForm" }, ngImport: i0, template: "<div [formGroup]=\"formGroup\" class=\"space-y-6 p-4\">\n  @if(formGroup.controls?.task) {\n  <div class=\"form-field\">\n    <div class=\"flex space-x-4\">\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.enabled\" binary=\"true\" /> Activada </div>\n\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.disableFeature\" binary=\"true\" /> Disable Feature </div>\n    </div>\n\n    <label for=\"task\" class=\"block text-sm font-medium text-gray-700\">Descripci\u00F3n de la evaluaci\u00F3n y asignaci\u00F3n de puntaje por turno</label>\n\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" [formControl]=\"formGroup.controls?.task\"></textarea>\n  </div>\n  } @if(!shortForm && formGroup.controls?.expectedResponseType) {\n  <div class=\"form-field\">\n    <label for=\"expectedResponseType\" class=\"block text-sm font-medium text-gray-700\">Expected Response Type</label>\n    <input pInputText id=\"expectedResponseType\" type=\"text\" [formControl]=\"formGroup.controls?.expectedResponseType\" class=\"w-full\" />\n  </div>\n  } @if (formGroup.controls?.model) {\n\n  <dc-model-selector [modelForm]=\"formGroup.controls.model\" [shortForm]=\"shortForm\"></dc-model-selector>\n  } @if (!shortForm && formGroup.controls?.systemPrompt) {\n  <div class=\"form-field\">\n    <label for=\"systemPrompt\" class=\"block text-sm font-medium text-gray-700 mb-1\">System Prompt</label>\n    <input pInputText id=\"systemPrompt\" [formControl]=\"formGroup.controls?.systemPrompt\" class=\"w-full\" />\n  </div>\n  }\n</div>\n", styles: [":host{display:block}.form-field{margin:0}\n"], dependencies: [{ kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { 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],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: ModelSelectorComponent, selector: "dc-model-selector", inputs: ["modelForm", "shortForm"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "inputStyle", "styleClass", "inputClass", "indeterminate", "formControl", "checkboxIcon", "readonly", "autofocus", "trueValue", "falseValue", "variant", "size"], outputs: ["onChange", "onFocus", "onBlur"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AgentTaskFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'agent-task-form', imports: [TextareaModule, InputTextModule, ReactiveFormsModule, SelectModule, ModelSelectorComponent, ModelSelectorComponent, CheckboxModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [formGroup]=\"formGroup\" class=\"space-y-6 p-4\">\n  @if(formGroup.controls?.task) {\n  <div class=\"form-field\">\n    <div class=\"flex space-x-4\">\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.enabled\" binary=\"true\" /> Activada </div>\n\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.disableFeature\" binary=\"true\" /> Disable Feature </div>\n    </div>\n\n    <label for=\"task\" class=\"block text-sm font-medium text-gray-700\">Descripci\u00F3n de la evaluaci\u00F3n para el objetivo</label>\n\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" [formControl]=\"formGroup.controls?.task\"></textarea>\n  </div>\n  } @if(!shortForm && formGroup.controls?.expectedResponseType) {\n  <div class=\"form-field\">\n    <label for=\"expectedResponseType\" class=\"block text-sm font-medium text-gray-700\">Expected Response Type</label>\n    <input pInputText id=\"expectedResponseType\" type=\"text\" [formControl]=\"formGroup.controls?.expectedResponseType\" class=\"w-full\" />\n  </div>\n  } @if (formGroup.controls?.model) {\n\n  <dc-model-selector [modelForm]=\"formGroup.controls.model\" [shortForm]=\"shortForm\"></dc-model-selector>\n  } @if (!shortForm && formGroup.controls?.systemPrompt) {\n  <div class=\"form-field\">\n    <label for=\"systemPrompt\" class=\"block text-sm font-medium text-gray-700 mb-1\">System Prompt</label>\n    <input pInputText id=\"systemPrompt\" [formControl]=\"formGroup.controls?.systemPrompt\" class=\"w-full\" />\n  </div>\n  }\n</div>\n", styles: [":host{display:block}.form-field{margin:0}\n"] }]
+            args: [{ selector: 'agent-task-form', imports: [TextareaModule, InputTextModule, ReactiveFormsModule, SelectModule, ModelSelectorComponent, ModelSelectorComponent, CheckboxModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [formGroup]=\"formGroup\" class=\"space-y-6 p-4\">\n  @if(formGroup.controls?.task) {\n  <div class=\"form-field\">\n    <div class=\"flex space-x-4\">\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.enabled\" binary=\"true\" /> Activada </div>\n\n      <div> <p-checkbox id=\"enabled\" [formControl]=\"formGroup.controls.disableFeature\" binary=\"true\" /> Disable Feature </div>\n    </div>\n\n    <label for=\"task\" class=\"block text-sm font-medium text-gray-700\">Descripci\u00F3n de la evaluaci\u00F3n y asignaci\u00F3n de puntaje por turno</label>\n\n    <textarea pTextarea [autoResize]=\"true\" class=\"w-full\" [formControl]=\"formGroup.controls?.task\"></textarea>\n  </div>\n  } @if(!shortForm && formGroup.controls?.expectedResponseType) {\n  <div class=\"form-field\">\n    <label for=\"expectedResponseType\" class=\"block text-sm font-medium text-gray-700\">Expected Response Type</label>\n    <input pInputText id=\"expectedResponseType\" type=\"text\" [formControl]=\"formGroup.controls?.expectedResponseType\" class=\"w-full\" />\n  </div>\n  } @if (formGroup.controls?.model) {\n\n  <dc-model-selector [modelForm]=\"formGroup.controls.model\" [shortForm]=\"shortForm\"></dc-model-selector>\n  } @if (!shortForm && formGroup.controls?.systemPrompt) {\n  <div class=\"form-field\">\n    <label for=\"systemPrompt\" class=\"block text-sm font-medium text-gray-700 mb-1\">System Prompt</label>\n    <input pInputText id=\"systemPrompt\" [formControl]=\"formGroup.controls?.systemPrompt\" class=\"w-full\" />\n  </div>\n  }\n</div>\n", styles: [":host{display:block}.form-field{margin:0}\n"] }]
         }], propDecorators: { formGroup: [{
                 type: Input
             }], shortForm: [{
@@ -6366,7 +6401,7 @@ class DcDynamicConditionsFormComponent {
         return control;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcDynamicConditionsFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcDynamicConditionsFormComponent, isStandalone: true, selector: "dc-dynamic-conditions-form", inputs: { dynamicConditionsArray: "dynamicConditionsArray", dynamicConditionsPath: "dynamicConditionsPath", entityWhatOptions: "entityWhatOptions", entityWhenOptions: "entityWhenOptions", systemPromptTypeOptions: "systemPromptTypeOptions" }, ngImport: i0, template: "<div class=\"group\">\n  <h4>Dynamic Conditions <span pTooltip=\"Conditions that trigger tasks based on conversation state\">\u2139\uFE0F</span></h4>\n  @for (conditionControl of dynamicConditionsArray.controls; track conditionControl; let i = $index) {\n  <div class=\"group nested-group dynamic-condition-item\">\n    <div class=\"flex justify-between items-center mb-4\">\n      <h5>Condition {{ i + 1 }}</h5>\n      <button\n        pTooltip=\"Remove Condition\"\n        variant=\"outlined\"\n        [raised]=\"true\"\n        pButton\n        severity=\"danger\"\n        icon=\"pi pi-trash\"\n        (click)=\"removeDynamicCondition(i)\"></button>\n    </div>\n\n    <div class=\"form-field\">\n      <label [for]=\"'conditionWhat' + i\">What <span pTooltip=\"Identifier for this condition (optional)\">\u2139\uFE0F</span></label>\n      <p-select\n        [id]=\"'conditionWhat' + i\"\n        [options]=\"entityWhatOptions\"\n        [formControl]=\"conditionControl.controls.what\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select What'\"></p-select>\n    </div>\n\n    <div class=\"form-field\">\n      <label [for]=\"'conditionWhen' + i\">When <span pTooltip=\"Field or variable to check\">\u2139\uFE0F</span></label>\n      <p-select\n        [id]=\"'conditionWhen' + i\"\n        [options]=\"entityWhenOptions\"\n        [formControl]=\"conditionControl.controls.when\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select When'\"></p-select>\n    </div>\n    <div class=\"form-field\">\n      <label [for]=\"'conditionValue' + i\">Value <span pTooltip=\"Value to compare against\">\u2139\uFE0F</span></label>\n      <input pInputText [id]=\"'conditionValue' + i\" type=\"text\" [formControl]=\"conditionControl.controls.value\" />\n    </div>\n\n    <div class=\"group very-nested-group\">\n      <h6>DO THIS <span pTooltip=\"Tasks to execute if this condition is met\">\u2139\uFE0F</span></h6>\n      @for (doControl of conditionControl.controls.do.controls; track doControl; let j = $index) {\n      <dc-do-action-form\n        [formGroup]=\"doControl\"\n        [conditionIndex]=\"i\"\n        [doItemIndex]=\"j\"\n        [systemPromptTypeOptions]=\"systemPromptTypeOptions\"\n        (removeItem)=\"removeDoItem(i, j)\">\n      </dc-do-action-form>\n      }\n      <button\n        pButton\n        type=\"button\"\n        label=\"Add 'Do' Task\"\n        icon=\"pi pi-plus\"\n        (click)=\"addDoControl(conditionControl.controls.do)\"\n        class=\"p-button-outlined p-button-sm\"\n        style=\"margin-top: 10px\"></button>\n    </div>\n  </div>\n  }\n  <button pButton type=\"button\" severity=\"info\" label=\"Add Dynamic Condition\" (click)=\"addDynamicCondition()\"></button>\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],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "component", type: DcDoActionFormComponent, selector: "dc-do-action-form", inputs: ["formGroup", "conditionIndex", "doItemIndex", "systemPromptTypeOptions"], outputs: ["removeItem"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcDynamicConditionsFormComponent, isStandalone: true, selector: "dc-dynamic-conditions-form", inputs: { dynamicConditionsArray: "dynamicConditionsArray", dynamicConditionsPath: "dynamicConditionsPath", entityWhatOptions: "entityWhatOptions", entityWhenOptions: "entityWhenOptions", systemPromptTypeOptions: "systemPromptTypeOptions" }, ngImport: i0, template: "<div class=\"group\">\n  <h4>Dynamic Conditions <span pTooltip=\"Conditions that trigger tasks based on conversation state\">\u2139\uFE0F</span></h4>\n  @for (conditionControl of dynamicConditionsArray.controls; track conditionControl; let i = $index) {\n  <div class=\"group nested-group dynamic-condition-item\">\n    <div class=\"flex justify-between items-center mb-4\">\n      <h5>Condition {{ i + 1 }}</h5>\n      <button\n        pTooltip=\"Remove Condition\"\n        variant=\"outlined\"\n        [raised]=\"true\"\n        pButton\n        severity=\"danger\"\n        icon=\"pi pi-trash\"\n        (click)=\"removeDynamicCondition(i)\"></button>\n    </div>\n\n    <div class=\"form-field\">\n      <label [for]=\"'conditionWhat' + i\">What <span pTooltip=\"Identifier for this condition (optional)\">\u2139\uFE0F</span></label>\n      <p-select\n        [id]=\"'conditionWhat' + i\"\n        [options]=\"entityWhatOptions\"\n        [formControl]=\"conditionControl.controls.what\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select What'\"></p-select>\n    </div>\n\n    <div class=\"form-field\">\n      <label [for]=\"'conditionWhen' + i\">When <span pTooltip=\"Field or variable to check\">\u2139\uFE0F</span></label>\n      <p-select\n        [id]=\"'conditionWhen' + i\"\n        [options]=\"entityWhenOptions\"\n        [formControl]=\"conditionControl.controls.when\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select When'\"></p-select>\n    </div>\n    <div class=\"form-field\">\n      <label [for]=\"'conditionValue' + i\">Value <span pTooltip=\"Value to compare against\">\u2139\uFE0F</span></label>\n      <input pInputText [id]=\"'conditionValue' + i\" type=\"text\" [formControl]=\"conditionControl.controls.value\" />\n    </div>\n\n    <div class=\"group very-nested-group\">\n      <h6>DO THIS <span pTooltip=\"Tasks to execute if this condition is met\">\u2139\uFE0F</span></h6>\n      @for (doControl of conditionControl.controls.do.controls; track doControl; let j = $index) {\n      <dc-do-action-form\n        [formGroup]=\"doControl\"\n        [conditionIndex]=\"i\"\n        [doItemIndex]=\"j\"\n        [systemPromptTypeOptions]=\"systemPromptTypeOptions\"\n        (removeItem)=\"removeDoItem(i, j)\">\n      </dc-do-action-form>\n      }\n      <button\n        pButton\n        type=\"button\"\n        label=\"Add 'Do' Task\"\n        icon=\"pi pi-plus\"\n        (click)=\"addDoControl(conditionControl.controls.do)\"\n        class=\"p-button-outlined p-button-sm\"\n        style=\"margin-top: 10px\"></button>\n    </div>\n  </div>\n  }\n  <button pButton type=\"button\" severity=\"info\" label=\"Add Dynamic Condition\" (click)=\"addDynamicCondition()\"></button>\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],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "component", type: DcDoActionFormComponent, selector: "dc-do-action-form", inputs: ["formGroup", "conditionIndex", "doItemIndex", "systemPromptTypeOptions"], outputs: ["removeItem"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcDynamicConditionsFormComponent, decorators: [{
             type: Component,
@@ -6424,7 +6459,7 @@ class DcDynamicCriteriaFormComponent {
         return control;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcDynamicCriteriaFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcDynamicCriteriaFormComponent, isStandalone: true, selector: "dc-dynamic-criteria-form", inputs: { formArray: "formArray", title: "title", mode: "mode", availableItems: "availableItems" }, ngImport: i0, template: "<div class=\"\">\n  <div class=\"flex justify-content-between align-items-center mb-4\">\n    <h4 class=\"m-0 text-xl font-semibold\">{{ title }}</h4>\n    <button pButton type=\"button\" (click)=\"openDialog()\" [label]=\"'Add ' + title\" class=\"p-button-sm\"></button>\n  </div>\n\n  @for (item of formArray.controls; track $index) {\n\n  <div [formGroup]=\"getItemFormGroup($index)\" class=\"criteria-item\">\n    <button pButton type=\"button\" icon=\"pi pi-trash\" (click)=\"removeItem($index)\" class=\"p-button-danger p-button-sm remove-button\"></button>\n\n    <div class=\"criteria-form-grid\">\n      <div class=\"field-enabled\">\n        <label for=\"enabled-{{ $index }}\" class=\"block mb-2\">Enabled</label>\n        <p-checkbox formControlName=\"enabled\" [binary]=\"true\" inputId=\"enabled-{{ $index }}\"></p-checkbox>\n      </div>\n\n      <div class=\"field-name\">\n        <label for=\"name-{{ $index }}\" class=\"block mb-2\">Name</label>\n        <input id=\"name-{{ $index }}\" type=\"text\" pInputText formControlName=\"name\" class=\"w-full\" />\n      </div>\n\n      <div class=\"field-emoji\">\n        <label for=\"emoji-{{ $index }}\" class=\"block mb-2\">Emoji</label>\n        <input id=\"emoji-{{ $index }}\" type=\"text\" pInputText formControlName=\"emoji\" class=\"w-full\" />\n      </div>\n\n      <div class=\"field-description\">\n        <label for=\"description-{{ $index }}\" class=\"block mb-2\">Description</label>\n        <input id=\"description-{{ $index }}\" type=\"text\" pInputText formControlName=\"description\" class=\"w-full\" />\n      </div>\n    </div>\n  </div>\n  <hr />\n  }\n\n  <p-dialog [header]=\"'Select ' + title\" [(visible)]=\"displayDialog\" [modal]=\"true\" [style]=\"{ width: '50vw' }\">\n    <div class=\"flex flex-col gap-3\">\n      @for (item of availableItems; track $index) {\n      <div class=\"flex justify-content-between align-items-center py-2 border-bottom-1 surface-border\">\n        <div>\n          <span class=\"font-semibold\">{{ item.emoji }} {{ item.name }}:</span>\n          {{ item.description }}\n        </div>\n        <button pButton type=\"button\" label=\"Add\" (click)=\"addItem(item)\" class=\"p-button-sm\"></button>\n      </div>\n      }\n    </div>\n  </p-dialog>\n</div>\n", styles: [".criteria-item{position:relative;border:1px solid var(--surface-d);border-radius:var(--border-radius);padding:1.5rem;margin-bottom:1rem}.remove-button{position:absolute;top:.5rem;right:.5rem}.criteria-form-grid{display:grid;grid-template-columns:auto 1fr 1fr;gap:1rem;align-items:center}.criteria-form-grid .field-description{grid-column:1/-1}\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],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: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["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: DialogModule }, { kind: "component", type: i5$1.Dialog, selector: "p-dialog", inputs: ["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", "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"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcDynamicCriteriaFormComponent, isStandalone: true, selector: "dc-dynamic-criteria-form", inputs: { formArray: "formArray", title: "title", mode: "mode", availableItems: "availableItems" }, ngImport: i0, template: "<div class=\"\">\n  <div class=\"flex justify-content-between align-items-center mb-4\">\n    <h4 class=\"m-0 text-xl font-semibold\">{{ title }}</h4>\n    <button pButton type=\"button\" (click)=\"openDialog()\" [label]=\"'Add ' + title\" class=\"p-button-sm\"></button>\n  </div>\n\n  @for (item of formArray.controls; track $index) {\n\n  <div [formGroup]=\"getItemFormGroup($index)\" class=\"criteria-item\">\n    <button pButton type=\"button\" icon=\"pi pi-trash\" (click)=\"removeItem($index)\" class=\"p-button-danger p-button-sm remove-button\"></button>\n\n    <div class=\"criteria-form-grid\">\n      <div class=\"field-enabled\">\n        <label for=\"enabled-{{ $index }}\" class=\"block mb-2\">Enabled</label>\n        <p-checkbox formControlName=\"enabled\" [binary]=\"true\" inputId=\"enabled-{{ $index }}\"></p-checkbox>\n      </div>\n\n      <div class=\"field-name\">\n        <label for=\"name-{{ $index }}\" class=\"block mb-2\">Name</label>\n        <input id=\"name-{{ $index }}\" type=\"text\" pInputText formControlName=\"name\" class=\"w-full\" />\n      </div>\n\n      <div class=\"field-emoji\">\n        <label for=\"emoji-{{ $index }}\" class=\"block mb-2\">Emoji</label>\n        <input id=\"emoji-{{ $index }}\" type=\"text\" pInputText formControlName=\"emoji\" class=\"w-full\" />\n      </div>\n\n      <div class=\"field-description\">\n        <label for=\"description-{{ $index }}\" class=\"block mb-2\">Description</label>\n        <input id=\"description-{{ $index }}\" type=\"text\" pInputText formControlName=\"description\" class=\"w-full\" />\n      </div>\n    </div>\n  </div>\n  <hr />\n  }\n\n  <p-dialog [header]=\"'Select ' + title\" [(visible)]=\"displayDialog\" [modal]=\"true\" [style]=\"{ width: '50vw' }\">\n    <div class=\"flex flex-col gap-3\">\n      @for (item of availableItems; track $index) {\n      <div class=\"flex justify-content-between align-items-center py-2 border-bottom-1 surface-border\">\n        <div>\n          <span class=\"font-semibold\">{{ item.emoji }} {{ item.name }}:</span>\n          {{ item.description }}\n        </div>\n        <button pButton type=\"button\" label=\"Add\" (click)=\"addItem(item)\" class=\"p-button-sm\"></button>\n      </div>\n      }\n    </div>\n  </p-dialog>\n</div>\n", styles: [".criteria-item{position:relative;border:1px solid var(--surface-d);border-radius:var(--border-radius);padding:1.5rem;margin-bottom:1rem}.remove-button{position:absolute;top:.5rem;right:.5rem}.criteria-form-grid{display:grid;grid-template-columns:auto 1fr 1fr;gap:1rem;align-items:center}.criteria-form-grid .field-description{grid-column:1/-1}\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],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: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i4.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["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: DialogModule }, { kind: "component", type: i5$1.Dialog, selector: "p-dialog", inputs: ["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", "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"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcDynamicCriteriaFormComponent, decorators: [{
             type: Component,
@@ -6499,7 +6534,7 @@ class DCConversationFlowFormComponent {
         console.log(this.formGroup.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DCConversationFlowFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", 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  <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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { 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: i3$5.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "pipe", type: FormatKeyPipe, name: "formatKey" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", 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\n  <div class=\"form-field\">\n    <label for=\"performancePrompt\"\n      >Prompt de Retroalimentaci\u00F3n y Rendimiento\n      <span pTooltip=\"Custom prompt for AI-driven performance analysis at the end of the conversation. 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  <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],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.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: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { 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: "pipe", type: FormatKeyPipe, name: "formatKey" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DCConversationFlowFormComponent, decorators: [{
             type: Component,
@@ -6516,7 +6551,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
                         DcDynamicCriteriaFormComponent,
                         FormatKeyPipe,
                         ToggleSwitchModule,
-                    ], 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  <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"] }]
+                    ], 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\n  <div class=\"form-field\">\n    <label for=\"performancePrompt\"\n      >Prompt de Retroalimentaci\u00F3n y Rendimiento\n      <span pTooltip=\"Custom prompt for AI-driven performance analysis at the end of the conversation. 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  <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
             }] } });
@@ -6597,7 +6632,7 @@ class DcCharacterCardTranslationFormComponent {
         console.log(this.formGroup);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcCharacterCardTranslationFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", 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],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$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", 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],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: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcCharacterCardTranslationFormComponent, decorators: [{
             type: Component,
@@ -6644,7 +6679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
 
 class DcPersonaFormComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcPersonaFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: DcPersonaFormComponent, isStandalone: true, selector: "dc-persona-form", inputs: { personaForm: "personaForm" }, ngImport: i0, template: "<div [formGroup]=\"personaForm\" class=\"space-y-6\">\n  <h3 class=\"text-xl font-semibold text-gray-700\">\n    Persona Details <span pTooltip=\"Detailed information about the character's persona\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span>\n  </h3>\n\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"identity\" class=\"block text-sm font-medium text-gray-700\"\n      >Identity <span pTooltip=\"Name, Age, Gender, Species, Sexuality, Role, Appearance\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"identity\"\n      formControlName=\"identity\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"physical\" class=\"block text-sm font-medium text-gray-700\"\n      >Physical\n      <span\n        pTooltip=\"physical description including height, build, hairColor, hairStyle, eyeColor, skinTone, distinctiveMarks, clothing style, currentOutfit\"\n        class=\"text-blue-500 cursor-pointer\"\n        >\u2139\uFE0F</span\n      ></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"physical\"\n      formControlName=\"physical\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"personality\" class=\"block text-sm font-medium text-gray-700\"\n      >Personality\n      <span pTooltip=\"personality description surface traits, Temperament, Values, Beliefs, Observable traits\" class=\"text-blue-500 cursor-pointer\"\n        >\u2139\uFE0F</span\n      ></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"personality\"\n      formControlName=\"personality\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"communication\" class=\"block text-sm font-medium text-gray-700\"\n      >Communication\n      <span pTooltip=\"(How They Express) Speech Pattern, Style Common Phrases, Language Habits\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"psychology\" class=\"block text-sm font-medium text-gray-700\"\n      >Psychology <span pTooltip=\"Motivations, Desires, Goals, Traumas, Conflicts, Weaknesses\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"psychology\"\n      formControlName=\"psychology\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"background\" class=\"block text-sm font-medium text-gray-700\"\n      >Background <span pTooltip=\"Background, History, origin, formative, secrets\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"background\"\n      formControlName=\"background\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"capabilities\" class=\"block text-sm font-medium text-gray-700\"\n      >Capabilities\n      <span pTooltip=\"skills, knowledge, abilities, expertise, limitations, Tools, Strengths\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"capabilities\"\n      formControlName=\"capabilities\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"social\" class=\"block text-sm font-medium text-gray-700\"\n      >Social <span pTooltip=\"Relationships, reputation, allies, enemies, social role\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"social\"\n      formControlName=\"social\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"preferences\" class=\"block text-sm font-medium text-gray-700\"\n      >Preferences <span pTooltip=\"likes, dislikes, hobbies, interests, hates\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"preferences\"\n      formControlName=\"preferences\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"situation\" class=\"block text-sm font-medium text-gray-700\"\n      >Situation\n      <span pTooltip=\"Current context for the character, immediate goal or challenge and constraints\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"situation\"\n      formControlName=\"situation\"\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>\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],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: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", type: DcPersonaFormComponent, isStandalone: true, selector: "dc-persona-form", inputs: { personaForm: "personaForm" }, ngImport: i0, template: "<div [formGroup]=\"personaForm\" class=\"space-y-6\">\n  <h3 class=\"text-xl font-semibold text-gray-700\">\n    Persona Details <span pTooltip=\"Detailed information about the character's persona\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span>\n  </h3>\n\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"identity\" class=\"block text-sm font-medium text-gray-700\"\n      >Identity <span pTooltip=\"Name, Age, Gender, Species, Sexuality, Role, Appearance\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"identity\"\n      formControlName=\"identity\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"physical\" class=\"block text-sm font-medium text-gray-700\"\n      >Physical\n      <span\n        pTooltip=\"physical description including height, build, hairColor, hairStyle, eyeColor, skinTone, distinctiveMarks, clothing style, currentOutfit\"\n        class=\"text-blue-500 cursor-pointer\"\n        >\u2139\uFE0F</span\n      ></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"physical\"\n      formControlName=\"physical\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"personality\" class=\"block text-sm font-medium text-gray-700\"\n      >Personality\n      <span pTooltip=\"personality description surface traits, Temperament, Values, Beliefs, Observable traits\" class=\"text-blue-500 cursor-pointer\"\n        >\u2139\uFE0F</span\n      ></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"personality\"\n      formControlName=\"personality\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"communication\" class=\"block text-sm font-medium text-gray-700\"\n      >Communication\n      <span pTooltip=\"(How They Express) Speech Pattern, Style Common Phrases, Language Habits\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"psychology\" class=\"block text-sm font-medium text-gray-700\"\n      >Psychology <span pTooltip=\"Motivations, Desires, Goals, Traumas, Conflicts, Weaknesses\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"psychology\"\n      formControlName=\"psychology\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"background\" class=\"block text-sm font-medium text-gray-700\"\n      >Background <span pTooltip=\"Background, History, origin, formative, secrets\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"background\"\n      formControlName=\"background\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"capabilities\" class=\"block text-sm font-medium text-gray-700\"\n      >Capabilities\n      <span pTooltip=\"skills, knowledge, abilities, expertise, limitations, Tools, Strengths\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"capabilities\"\n      formControlName=\"capabilities\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"social\" class=\"block text-sm font-medium text-gray-700\"\n      >Social <span pTooltip=\"Relationships, reputation, allies, enemies, social role\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"social\"\n      formControlName=\"social\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"preferences\" class=\"block text-sm font-medium text-gray-700\"\n      >Preferences <span pTooltip=\"likes, dislikes, hobbies, interests, hates\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"preferences\"\n      formControlName=\"preferences\"\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\n  <div class=\"form-field grid grid-cols-1 gap-2\">\n    <label for=\"situation\" class=\"block text-sm font-medium text-gray-700\"\n      >Situation\n      <span pTooltip=\"Current context for the character, immediate goal or challenge and constraints\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n    >\n    <textarea\n      rows=\"2\"\n      pTextarea\n      [autoResize]=\"true\"\n      id=\"situation\"\n      formControlName=\"situation\"\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>\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],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: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcPersonaFormComponent, decorators: [{
             type: Component,
@@ -6769,7 +6804,7 @@ Improve the following first message:`;
         return control;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcCharacterCardFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcCharacterCardFormComponent, isStandalone: true, selector: "dc-character-card-form", inputs: { characterCardForm: "characterCardForm" }, outputs: { generateMissingDataRequest: "generateMissingDataRequest" }, ngImport: i0, template: "<div [formGroup]=\"characterCardForm\">\n  <div formGroupName=\"data\" class=\"card-group space-y-6 bg-white p-8 rounded-lg shadow-md\">\n    <div class=\"flex justify-end\">\n      <p-button\n        (click)=\"generateMissingDataRequest.emit()\"\n        icon=\"pi pi-sparkles\"\n        [rounded]=\"true\"\n        severity=\"info\"\n        label=\"Arreglar Campos\"\n        styleClass=\"p-button-sm\" />\n    </div>\n\n    <h3 class=\"text-2xl font-semibold text-gray-700 mb-6\"\n      >Character Card <span pTooltip=\"Informaci\u00F3n de la ficha del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></h3\n    >\n\n    <div class=\"grid grid-cols-2 gap-6\">\n      <div class=\"form-field\">\n        <label for=\"cardName\" class=\"block text-sm font-medium text-gray-700\"\n          >Character Name <span pTooltip=\"El nombre del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <input\n          pInputText\n          id=\"cardName\"\n          type=\"text\"\n          formControlName=\"name\"\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\" />\n        @if (dataGroup.controls['name']?.errors?.['required'] && dataGroup.controls['name']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Name is required </div>\n        }\n      </div>\n\n      <div class=\"form-field\">\n        <label for=\"gender\" class=\"block text-sm font-medium text-gray-700\"\n          >Gender <span pTooltip=\"El genero del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <p-select\n          class=\"w-full\"\n          id=\"gender\"\n          [options]=\"genderOptions\"\n          formControlName=\"gender\"\n          optionLabel=\"label\"\n          optionValue=\"value\"\n          [placeholder]=\"'Select Gender'\"></p-select>\n        @if (dataGroup.controls['gender']?.errors?.['required'] && dataGroup.controls['gender']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Gender is required </div>\n        }\n      </div>\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardDescription\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u26A0\uFE0FChanged) Description\n        <span pTooltip=\"Descripci\u00F3n detallada del personaje, este campo es ignorado si existe una PERSONA\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        class=\"textmin 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        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardDescription\"\n        formControlName=\"description\"></textarea>\n      @if (dataGroup.controls['description']?.errors?.['required'] && dataGroup.controls['description']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> Description is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardFirstMessage\" class=\"flex flex-col text-sm font-medium text-gray-700\">\n        <div class=\"flex justify-between items-center\">\n          <span\n            >(\u2757\uFE0FObsoleto) First Message\n            <span pTooltip=\"Mensaje para iniciar la historia, OBSOLETO utilizar Greetings en su lugar, poner uno o varios.\" class=\"text-blue-500 cursor-pointer\"\n              >\u2139\uFE0F</span\n            ></span\n          >\n          <div class=\"flex items-center space-x-2\">\n            <p-togglebutton\n              [formControl]=\"markdownForm.controls.seeMarkdown\"\n              [onLabel]=\"'Editar'\"\n              [offLabel]=\"'Ver Markdown'\"\n              size=\"small\"\n              styleClass=\"min-w-16 p-button-sm\"\n              (onChange)=\"checkCdr()\" />\n            <p-button icon=\"pi pi-refresh\" (click)=\"improveFirstMessage()\" label=\"Mejorar\" styleClass=\"p-button-sm p-button-outlined\"></p-button>\n          </div>\n        </div>\n      </label>\n\n      @if(markdownForm.controls.seeMarkdown.value){\n      <div [innerHTML]=\"dataGroup.controls['first_mes'].value | mdToHtmlArray\" class=\"prose mt-1 p-3 border border-gray-200 rounded-md\"></div>\n      }@else{\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardFirstMessage\"\n        formControlName=\"first_mes\"\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\">\n      </textarea>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"mes_example\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u2757\uFE0FObsoleto) Mensajes de Ejemplo\n        <span pTooltip=\"Importante para el estilo de la conversaci\u00F3n, agregar esta info dentro de comunication\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"mes_example\"\n        formControlName=\"mes_example\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Hook <span pTooltip=\"Texto gancho para atraer al usuario a interactuar con esta tarjeta\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardHook\"\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 grid grid-cols-1 gap-2\">\n      <label for=\"cardInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >Instructions <span pTooltip=\"Instrucciones para el usuario, sepa que tiene que hacer.\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardInstructions\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardScenario\" class=\"block text-sm font-medium text-gray-700\"\n        >Scenario <span pTooltip=\"Describe the context or setting for the conversation\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardScenario\"\n        formControlName=\"scenario\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardAlternateGreetings\" class=\"block text-sm font-medium text-gray-700\"\n        >Greetings (Saludos Iniciales)<span pTooltip=\"Saludos alternativos para comenzar una historia diferente\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <div class=\"array-field space-y-2\">\n        @for (greeting of alternateGreetingsArray.controls; track greeting; let i = $index) {\n        <div class=\"array-item flex items-center space-x-2\" style=\"position: relative\">\n          <textarea\n            pTextarea\n            rows=\"1\"\n            [autoResize]=\"true\"\n            [id]=\"'cardAlternateGreeting' + i\"\n            [formControl]=\"asFormControl(greeting)\"\n            (input)=\"updateArrayField('greetings', i, $event)\"\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 flex-grow\">\n          </textarea>\n          <button\n            pButton\n            severity=\"danger\"\n            icon=\"pi pi-times\"\n            class=\"remove-button p-button-sm p-button-rounded p-button-danger\"\n            (click)=\"removeArrayItem('greetings', i)\"></button>\n        </div>\n        }\n        <button pButton severity=\"info\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addArrayItem('greetings')\" class=\"p-button-sm\"></button>\n      </div>\n    </div>\n\n    <p-divider> Persona </p-divider>\n\n    <dc-persona-form [personaForm]=\"personaGroup\" />\n\n    <p-divider> Avanzado </p-divider>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardPostHistoryInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u2757\uFE0FObsoleto) Post-History Instructions\n        <span\n          pTooltip=\"Dejar en blanco, al menos que se sepa como funciona, esto se llama jailbreak, es para darle instrucciones finales y m\u00E1s importantes al modelo\"\n          class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        formControlName=\"post_history_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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardSystemPrompt\" class=\"block text-sm font-medium text-gray-700\">\n        (\u26A0\uFE0F Cuidado) System Prompt <span pTooltip=\"Instrucciones del sistema para la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span>\n      </label>\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardSystemPrompt\"\n        formControlName=\"system_prompt\"\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      @if (dataGroup.controls['system_prompt']?.errors?.['required'] && dataGroup.controls['system_prompt']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> System prompt is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Creator Notes <span pTooltip=\"son solo notas del creador, no afecta nada a la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardCreatorNotes\"\n        formControlName=\"creator_notes\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label pTooltip=\"Agrega las categorias\" for=\"cardTags\" class=\"block text-sm font-medium text-gray-700\">Tags \u2139\uFE0F</label>\n      <dc-tags-form [form]=\"dataGroup\" />\n    </div>\n\n    <p-divider align=\"center\" type=\"dotted\">\n      <b>Traducciones a otros idiomas</b>\n    </p-divider>\n\n    @if(langTranslationGroup){\n    <dc-character-card-translations-tabs-form [formGroup]=\"langTranslationGroup\" />\n    }\n  </div>\n</div>\n", styles: [".textmin{min-height:40px}.array-field{display:flex;flex-direction:column;gap:8px}.array-item{display:flex;align-items:center;gap:8px;position:relative}.array-item textarea,.array-item input[type=text]{flex-grow:1}.remove-button{position:absolute;right:5px;top:5px;min-width:auto!important;width:2rem;height:2rem}\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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["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.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: ToggleButtonModule }, { kind: "component", type: i6.ToggleButton, selector: "p-toggleButton, p-togglebutton, p-toggle-button", inputs: ["onLabel", "offLabel", "onIcon", "offIcon", "ariaLabel", "ariaLabelledBy", "styleClass", "inputId", "tabindex", "iconPos", "autofocus", "size", "allowEmpty", "fluid"], outputs: ["onChange"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i1$2.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: DcCharacterCardTranslationsTabsFormComponent, selector: "dc-character-card-translations-tabs-form", inputs: ["formGroup"] }, { kind: "component", type: DcPersonaFormComponent, selector: "dc-persona-form", inputs: ["personaForm"] }, { kind: "component", type: DcTagsFormComponent, selector: "dc-tags-form", inputs: ["form"] }, { kind: "pipe", type: MdToHtmlArrayPipe, name: "mdToHtmlArray" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcCharacterCardFormComponent, isStandalone: true, selector: "dc-character-card-form", inputs: { characterCardForm: "characterCardForm" }, outputs: { generateMissingDataRequest: "generateMissingDataRequest" }, ngImport: i0, template: "<div [formGroup]=\"characterCardForm\">\n  <div formGroupName=\"data\" class=\"card-group space-y-6 bg-white p-8 rounded-lg shadow-md\">\n    <div class=\"flex justify-end\">\n      <p-button\n        (click)=\"generateMissingDataRequest.emit()\"\n        icon=\"pi pi-sparkles\"\n        [rounded]=\"true\"\n        severity=\"info\"\n        label=\"Arreglar Campos\"\n        styleClass=\"p-button-sm\" />\n    </div>\n\n    <h3 class=\"text-2xl font-semibold text-gray-700 mb-6\"\n      >Character Card <span pTooltip=\"Informaci\u00F3n de la ficha del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></h3\n    >\n\n    <div class=\"grid grid-cols-2 gap-6\">\n      <div class=\"form-field\">\n        <label for=\"cardName\" class=\"block text-sm font-medium text-gray-700\"\n          >Character Name <span pTooltip=\"El nombre del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <input\n          pInputText\n          id=\"cardName\"\n          type=\"text\"\n          formControlName=\"name\"\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\" />\n        @if (dataGroup.controls['name']?.errors?.['required'] && dataGroup.controls['name']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Name is required </div>\n        }\n      </div>\n\n      <div class=\"form-field\">\n        <label for=\"gender\" class=\"block text-sm font-medium text-gray-700\"\n          >Gender <span pTooltip=\"El genero del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <p-select\n          class=\"w-full\"\n          id=\"gender\"\n          [options]=\"genderOptions\"\n          formControlName=\"gender\"\n          optionLabel=\"label\"\n          optionValue=\"value\"\n          [placeholder]=\"'Select Gender'\"></p-select>\n        @if (dataGroup.controls['gender']?.errors?.['required'] && dataGroup.controls['gender']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Gender is required </div>\n        }\n      </div>\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardDescription\" class=\"block text-sm font-medium text-gray-700\"\n        >Description\n        <span pTooltip=\"Descripci\u00F3n de la tarjeta, si es una tarjeta compleja utiliza los campos de  PERSONA\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        class=\"textmin 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        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardDescription\"\n        formControlName=\"description\"></textarea>\n      @if (dataGroup.controls['description']?.errors?.['required'] && dataGroup.controls['description']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> Description is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Hook <span pTooltip=\"Texto gancho para atraer al usuario a interactuar con esta tarjeta\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardHook\"\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 grid grid-cols-1 gap-2\">\n      <label for=\"cardInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >Instructions <span pTooltip=\"Instrucciones para el usuario, sepa que tiene que hacer.\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardInstructions\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardScenario\" class=\"block text-sm font-medium text-gray-700\"\n        >Scenario <span pTooltip=\"Describe the context or setting for the conversation\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardScenario\"\n        formControlName=\"scenario\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardAlternateGreetings\" class=\"block text-sm font-medium text-gray-700\"\n        >Greetings (Saludos Iniciales)<span pTooltip=\"Saludos alternativos para comenzar una historia diferente\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <div class=\"array-field space-y-2\">\n        @for (greeting of alternateGreetingsArray.controls; track greeting; let i = $index) {\n        <div class=\"array-item flex items-center space-x-2\" style=\"position: relative\">\n          <textarea\n            pTextarea\n            rows=\"1\"\n            [autoResize]=\"true\"\n            [id]=\"'cardAlternateGreeting' + i\"\n            [formControl]=\"asFormControl(greeting)\"\n            (input)=\"updateArrayField('greetings', i, $event)\"\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 flex-grow\">\n          </textarea>\n          <button\n            pButton\n            severity=\"danger\"\n            icon=\"pi pi-times\"\n            class=\"remove-button p-button-sm p-button-rounded p-button-danger\"\n            (click)=\"removeArrayItem('greetings', i)\"></button>\n        </div>\n        }\n        <button pButton severity=\"info\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addArrayItem('greetings')\" class=\"p-button-sm\"></button>\n      </div>\n    </div>\n\n    <p-divider> Persona </p-divider>\n\n    <dc-persona-form [personaForm]=\"personaGroup\" />\n\n    <p-divider> Avanzado </p-divider>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardPostHistoryInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u2757\uFE0FObsoleto) Post-History Instructions\n        <span\n          pTooltip=\"Dejar en blanco, al menos que se sepa como funciona, esto se llama jailbreak, es para darle instrucciones finales y m\u00E1s importantes al modelo\"\n          class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        formControlName=\"post_history_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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardSystemPrompt\" class=\"block text-sm font-medium text-gray-700\">\n        (\u26A0\uFE0F Cuidado) System Prompt <span pTooltip=\"Instrucciones del sistema para la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span>\n      </label>\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardSystemPrompt\"\n        formControlName=\"system_prompt\"\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      @if (dataGroup.controls['system_prompt']?.errors?.['required'] && dataGroup.controls['system_prompt']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> System prompt is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Creator Notes <span pTooltip=\"son solo notas del creador, no afecta nada a la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardCreatorNotes\"\n        formControlName=\"creator_notes\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label pTooltip=\"Agrega las categorias\" for=\"cardTags\" class=\"block text-sm font-medium text-gray-700\">Tags \u2139\uFE0F</label>\n      <dc-tags-form [form]=\"dataGroup\" />\n    </div>\n\n    <p-divider align=\"center\" type=\"dotted\">\n      <b>Traducciones a otros idiomas</b>\n    </p-divider>\n\n    @if(langTranslationGroup){\n    <dc-character-card-translations-tabs-form [formGroup]=\"langTranslationGroup\" />\n    }\n  </div>\n</div>\n", styles: [".textmin{min-height:40px}.array-field{display:flex;flex-direction:column;gap:8px}.array-item{display:flex;align-items:center;gap:8px;position:relative}.array-item textarea,.array-item input[type=text]{flex-grow:1}.remove-button{position:absolute;right:5px;top:5px;min-width:auto!important;width:2rem;height:2rem}\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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["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.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: ToggleButtonModule }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i1$2.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "component", type: DcCharacterCardTranslationsTabsFormComponent, selector: "dc-character-card-translations-tabs-form", inputs: ["formGroup"] }, { kind: "component", type: DcPersonaFormComponent, selector: "dc-persona-form", inputs: ["personaForm"] }, { kind: "component", type: DcTagsFormComponent, selector: "dc-tags-form", inputs: ["form"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcCharacterCardFormComponent, decorators: [{
             type: Component,
@@ -6787,7 +6822,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
                         DcCharacterCardTranslationsTabsFormComponent,
                         DcPersonaFormComponent,
                         DcTagsFormComponent,
-                    ], template: "<div [formGroup]=\"characterCardForm\">\n  <div formGroupName=\"data\" class=\"card-group space-y-6 bg-white p-8 rounded-lg shadow-md\">\n    <div class=\"flex justify-end\">\n      <p-button\n        (click)=\"generateMissingDataRequest.emit()\"\n        icon=\"pi pi-sparkles\"\n        [rounded]=\"true\"\n        severity=\"info\"\n        label=\"Arreglar Campos\"\n        styleClass=\"p-button-sm\" />\n    </div>\n\n    <h3 class=\"text-2xl font-semibold text-gray-700 mb-6\"\n      >Character Card <span pTooltip=\"Informaci\u00F3n de la ficha del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></h3\n    >\n\n    <div class=\"grid grid-cols-2 gap-6\">\n      <div class=\"form-field\">\n        <label for=\"cardName\" class=\"block text-sm font-medium text-gray-700\"\n          >Character Name <span pTooltip=\"El nombre del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <input\n          pInputText\n          id=\"cardName\"\n          type=\"text\"\n          formControlName=\"name\"\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\" />\n        @if (dataGroup.controls['name']?.errors?.['required'] && dataGroup.controls['name']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Name is required </div>\n        }\n      </div>\n\n      <div class=\"form-field\">\n        <label for=\"gender\" class=\"block text-sm font-medium text-gray-700\"\n          >Gender <span pTooltip=\"El genero del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <p-select\n          class=\"w-full\"\n          id=\"gender\"\n          [options]=\"genderOptions\"\n          formControlName=\"gender\"\n          optionLabel=\"label\"\n          optionValue=\"value\"\n          [placeholder]=\"'Select Gender'\"></p-select>\n        @if (dataGroup.controls['gender']?.errors?.['required'] && dataGroup.controls['gender']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Gender is required </div>\n        }\n      </div>\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardDescription\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u26A0\uFE0FChanged) Description\n        <span pTooltip=\"Descripci\u00F3n detallada del personaje, este campo es ignorado si existe una PERSONA\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        class=\"textmin 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        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardDescription\"\n        formControlName=\"description\"></textarea>\n      @if (dataGroup.controls['description']?.errors?.['required'] && dataGroup.controls['description']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> Description is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardFirstMessage\" class=\"flex flex-col text-sm font-medium text-gray-700\">\n        <div class=\"flex justify-between items-center\">\n          <span\n            >(\u2757\uFE0FObsoleto) First Message\n            <span pTooltip=\"Mensaje para iniciar la historia, OBSOLETO utilizar Greetings en su lugar, poner uno o varios.\" class=\"text-blue-500 cursor-pointer\"\n              >\u2139\uFE0F</span\n            ></span\n          >\n          <div class=\"flex items-center space-x-2\">\n            <p-togglebutton\n              [formControl]=\"markdownForm.controls.seeMarkdown\"\n              [onLabel]=\"'Editar'\"\n              [offLabel]=\"'Ver Markdown'\"\n              size=\"small\"\n              styleClass=\"min-w-16 p-button-sm\"\n              (onChange)=\"checkCdr()\" />\n            <p-button icon=\"pi pi-refresh\" (click)=\"improveFirstMessage()\" label=\"Mejorar\" styleClass=\"p-button-sm p-button-outlined\"></p-button>\n          </div>\n        </div>\n      </label>\n\n      @if(markdownForm.controls.seeMarkdown.value){\n      <div [innerHTML]=\"dataGroup.controls['first_mes'].value | mdToHtmlArray\" class=\"prose mt-1 p-3 border border-gray-200 rounded-md\"></div>\n      }@else{\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardFirstMessage\"\n        formControlName=\"first_mes\"\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\">\n      </textarea>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"mes_example\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u2757\uFE0FObsoleto) Mensajes de Ejemplo\n        <span pTooltip=\"Importante para el estilo de la conversaci\u00F3n, agregar esta info dentro de comunication\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"mes_example\"\n        formControlName=\"mes_example\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Hook <span pTooltip=\"Texto gancho para atraer al usuario a interactuar con esta tarjeta\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardHook\"\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 grid grid-cols-1 gap-2\">\n      <label for=\"cardInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >Instructions <span pTooltip=\"Instrucciones para el usuario, sepa que tiene que hacer.\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardInstructions\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardScenario\" class=\"block text-sm font-medium text-gray-700\"\n        >Scenario <span pTooltip=\"Describe the context or setting for the conversation\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardScenario\"\n        formControlName=\"scenario\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardAlternateGreetings\" class=\"block text-sm font-medium text-gray-700\"\n        >Greetings (Saludos Iniciales)<span pTooltip=\"Saludos alternativos para comenzar una historia diferente\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <div class=\"array-field space-y-2\">\n        @for (greeting of alternateGreetingsArray.controls; track greeting; let i = $index) {\n        <div class=\"array-item flex items-center space-x-2\" style=\"position: relative\">\n          <textarea\n            pTextarea\n            rows=\"1\"\n            [autoResize]=\"true\"\n            [id]=\"'cardAlternateGreeting' + i\"\n            [formControl]=\"asFormControl(greeting)\"\n            (input)=\"updateArrayField('greetings', i, $event)\"\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 flex-grow\">\n          </textarea>\n          <button\n            pButton\n            severity=\"danger\"\n            icon=\"pi pi-times\"\n            class=\"remove-button p-button-sm p-button-rounded p-button-danger\"\n            (click)=\"removeArrayItem('greetings', i)\"></button>\n        </div>\n        }\n        <button pButton severity=\"info\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addArrayItem('greetings')\" class=\"p-button-sm\"></button>\n      </div>\n    </div>\n\n    <p-divider> Persona </p-divider>\n\n    <dc-persona-form [personaForm]=\"personaGroup\" />\n\n    <p-divider> Avanzado </p-divider>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardPostHistoryInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u2757\uFE0FObsoleto) Post-History Instructions\n        <span\n          pTooltip=\"Dejar en blanco, al menos que se sepa como funciona, esto se llama jailbreak, es para darle instrucciones finales y m\u00E1s importantes al modelo\"\n          class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        formControlName=\"post_history_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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardSystemPrompt\" class=\"block text-sm font-medium text-gray-700\">\n        (\u26A0\uFE0F Cuidado) System Prompt <span pTooltip=\"Instrucciones del sistema para la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span>\n      </label>\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardSystemPrompt\"\n        formControlName=\"system_prompt\"\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      @if (dataGroup.controls['system_prompt']?.errors?.['required'] && dataGroup.controls['system_prompt']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> System prompt is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Creator Notes <span pTooltip=\"son solo notas del creador, no afecta nada a la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardCreatorNotes\"\n        formControlName=\"creator_notes\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label pTooltip=\"Agrega las categorias\" for=\"cardTags\" class=\"block text-sm font-medium text-gray-700\">Tags \u2139\uFE0F</label>\n      <dc-tags-form [form]=\"dataGroup\" />\n    </div>\n\n    <p-divider align=\"center\" type=\"dotted\">\n      <b>Traducciones a otros idiomas</b>\n    </p-divider>\n\n    @if(langTranslationGroup){\n    <dc-character-card-translations-tabs-form [formGroup]=\"langTranslationGroup\" />\n    }\n  </div>\n</div>\n", styles: [".textmin{min-height:40px}.array-field{display:flex;flex-direction:column;gap:8px}.array-item{display:flex;align-items:center;gap:8px;position:relative}.array-item textarea,.array-item input[type=text]{flex-grow:1}.remove-button{position:absolute;right:5px;top:5px;min-width:auto!important;width:2rem;height:2rem}\n"] }]
+                    ], template: "<div [formGroup]=\"characterCardForm\">\n  <div formGroupName=\"data\" class=\"card-group space-y-6 bg-white p-8 rounded-lg shadow-md\">\n    <div class=\"flex justify-end\">\n      <p-button\n        (click)=\"generateMissingDataRequest.emit()\"\n        icon=\"pi pi-sparkles\"\n        [rounded]=\"true\"\n        severity=\"info\"\n        label=\"Arreglar Campos\"\n        styleClass=\"p-button-sm\" />\n    </div>\n\n    <h3 class=\"text-2xl font-semibold text-gray-700 mb-6\"\n      >Character Card <span pTooltip=\"Informaci\u00F3n de la ficha del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></h3\n    >\n\n    <div class=\"grid grid-cols-2 gap-6\">\n      <div class=\"form-field\">\n        <label for=\"cardName\" class=\"block text-sm font-medium text-gray-700\"\n          >Character Name <span pTooltip=\"El nombre del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <input\n          pInputText\n          id=\"cardName\"\n          type=\"text\"\n          formControlName=\"name\"\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\" />\n        @if (dataGroup.controls['name']?.errors?.['required'] && dataGroup.controls['name']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Name is required </div>\n        }\n      </div>\n\n      <div class=\"form-field\">\n        <label for=\"gender\" class=\"block text-sm font-medium text-gray-700\"\n          >Gender <span pTooltip=\"El genero del personaje\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n        >\n        <p-select\n          class=\"w-full\"\n          id=\"gender\"\n          [options]=\"genderOptions\"\n          formControlName=\"gender\"\n          optionLabel=\"label\"\n          optionValue=\"value\"\n          [placeholder]=\"'Select Gender'\"></p-select>\n        @if (dataGroup.controls['gender']?.errors?.['required'] && dataGroup.controls['gender']?.touched) {\n        <div class=\"error text-red-500 text-xs mt-1\"> Gender is required </div>\n        }\n      </div>\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardDescription\" class=\"block text-sm font-medium text-gray-700\"\n        >Description\n        <span pTooltip=\"Descripci\u00F3n de la tarjeta, si es una tarjeta compleja utiliza los campos de  PERSONA\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        class=\"textmin 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        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardDescription\"\n        formControlName=\"description\"></textarea>\n      @if (dataGroup.controls['description']?.errors?.['required'] && dataGroup.controls['description']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> Description is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Hook <span pTooltip=\"Texto gancho para atraer al usuario a interactuar con esta tarjeta\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardHook\"\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 grid grid-cols-1 gap-2\">\n      <label for=\"cardInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >Instructions <span pTooltip=\"Instrucciones para el usuario, sepa que tiene que hacer.\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardInstructions\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardScenario\" class=\"block text-sm font-medium text-gray-700\"\n        >Scenario <span pTooltip=\"Describe the context or setting for the conversation\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"2\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardScenario\"\n        formControlName=\"scenario\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardAlternateGreetings\" class=\"block text-sm font-medium text-gray-700\"\n        >Greetings (Saludos Iniciales)<span pTooltip=\"Saludos alternativos para comenzar una historia diferente\" class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <div class=\"array-field space-y-2\">\n        @for (greeting of alternateGreetingsArray.controls; track greeting; let i = $index) {\n        <div class=\"array-item flex items-center space-x-2\" style=\"position: relative\">\n          <textarea\n            pTextarea\n            rows=\"1\"\n            [autoResize]=\"true\"\n            [id]=\"'cardAlternateGreeting' + i\"\n            [formControl]=\"asFormControl(greeting)\"\n            (input)=\"updateArrayField('greetings', i, $event)\"\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 flex-grow\">\n          </textarea>\n          <button\n            pButton\n            severity=\"danger\"\n            icon=\"pi pi-times\"\n            class=\"remove-button p-button-sm p-button-rounded p-button-danger\"\n            (click)=\"removeArrayItem('greetings', i)\"></button>\n        </div>\n        }\n        <button pButton severity=\"info\" label=\"Add Greeting\" icon=\"pi pi-plus\" (click)=\"addArrayItem('greetings')\" class=\"p-button-sm\"></button>\n      </div>\n    </div>\n\n    <p-divider> Persona </p-divider>\n\n    <dc-persona-form [personaForm]=\"personaGroup\" />\n\n    <p-divider> Avanzado </p-divider>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardPostHistoryInstructions\" class=\"block text-sm font-medium text-gray-700\"\n        >(\u2757\uFE0FObsoleto) Post-History Instructions\n        <span\n          pTooltip=\"Dejar en blanco, al menos que se sepa como funciona, esto se llama jailbreak, es para darle instrucciones finales y m\u00E1s importantes al modelo\"\n          class=\"text-blue-500 cursor-pointer\"\n          >\u2139\uFE0F</span\n        ></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        formControlName=\"post_history_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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardSystemPrompt\" class=\"block text-sm font-medium text-gray-700\">\n        (\u26A0\uFE0F Cuidado) System Prompt <span pTooltip=\"Instrucciones del sistema para la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span>\n      </label>\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardSystemPrompt\"\n        formControlName=\"system_prompt\"\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      @if (dataGroup.controls['system_prompt']?.errors?.['required'] && dataGroup.controls['system_prompt']?.touched) {\n      <div class=\"error text-red-500 text-xs mt-1\"> System prompt is required </div>\n      }\n    </div>\n\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label for=\"cardCreatorNotes\" class=\"block text-sm font-medium text-gray-700\"\n        >Creator Notes <span pTooltip=\"son solo notas del creador, no afecta nada a la conversaci\u00F3n\" class=\"text-blue-500 cursor-pointer\">\u2139\uFE0F</span></label\n      >\n      <textarea\n        rows=\"1\"\n        pTextarea\n        [autoResize]=\"true\"\n        id=\"cardCreatorNotes\"\n        formControlName=\"creator_notes\"\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\n    <div class=\"form-field grid grid-cols-1 gap-2\">\n      <label pTooltip=\"Agrega las categorias\" for=\"cardTags\" class=\"block text-sm font-medium text-gray-700\">Tags \u2139\uFE0F</label>\n      <dc-tags-form [form]=\"dataGroup\" />\n    </div>\n\n    <p-divider align=\"center\" type=\"dotted\">\n      <b>Traducciones a otros idiomas</b>\n    </p-divider>\n\n    @if(langTranslationGroup){\n    <dc-character-card-translations-tabs-form [formGroup]=\"langTranslationGroup\" />\n    }\n  </div>\n</div>\n", styles: [".textmin{min-height:40px}.array-field{display:flex;flex-direction:column;gap:8px}.array-item{display:flex;align-items:center;gap:8px;position:relative}.array-item textarea,.array-item input[type=text]{flex-grow:1}.remove-button{position:absolute;right:5px;top:5px;min-width:auto!important;width:2rem;height:2rem}\n"] }]
         }], propDecorators: { characterCardForm: [{
                 type: Input,
                 args: [{ required: true }]
@@ -6824,7 +6859,7 @@ class DcVoiceTtsFormComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcVoiceTtsFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.6", type: DcVoiceTtsFormComponent, isStandalone: true, selector: "dc-voice-tts-form", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, voiceTTSOptions: { classPropertyName: "voiceTTSOptions", publicName: "voiceTTSOptions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [DialogService], ngImport: i0, template: "<h3> {{ title() }}</h3>\n<div [formGroup]=\"form()\" class=\"form-grid\">\n  <div class=\"form-field\">\n    <label for=\"voice\">Voice <span pTooltip=\"Select the voice for text-to-speech\">\u2139\uFE0F</span></label>\n    <p-inputgroup>\n      <p-inputgroup-addon>\n        <p-button [rounded]=\"true\" [text]=\"true\" icon=\"pi pi-exclamation-circle\" (click)=\"openVoiceSelector()\" />\n      </p-inputgroup-addon>\n      <p-select\n        id=\"voice\"\n        [editable]=\"true\"\n        [options]=\"voiceTTSOptions()\"\n        formControlName=\"voice\"\n        optionLabel=\"name\"\n        optionValue=\"id\"\n        [placeholder]=\"'Select Voice'\" />\n    </p-inputgroup>\n  </div>\n\n  <div class=\"form-field\">\n    <label for=\"speedRate\">Speed Rate <span pTooltip=\"Adjust the rate of speech delivery\">\u2139\uFE0F</span></label>\n    <br />\n    <input pInputText id=\"speedRate\" type=\"number\" formControlName=\"speedRate\" step=\"0.1\" />\n  </div>\n</div>\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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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: DynamicDialogModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i3$6.InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "ngmodule", type: InputGroupAddonModule }, { kind: "component", type: i4$1.InputGroupAddon, selector: "p-inputgroup-addon, p-inputGroupAddon", inputs: ["style", "styleClass"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: CardModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.6", type: DcVoiceTtsFormComponent, isStandalone: true, selector: "dc-voice-tts-form", inputs: { form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, voiceTTSOptions: { classPropertyName: "voiceTTSOptions", publicName: "voiceTTSOptions", isSignal: true, isRequired: false, transformFunction: null } }, providers: [DialogService], ngImport: i0, template: "<h3> {{ title() }}</h3>\n<div [formGroup]=\"form()\" class=\"form-grid\">\n  <div class=\"form-field\">\n    <label for=\"voice\">Voice <span pTooltip=\"Select the voice for text-to-speech\">\u2139\uFE0F</span></label>\n    <p-inputgroup>\n      <p-inputgroup-addon>\n        <p-button [rounded]=\"true\" [text]=\"true\" icon=\"pi pi-exclamation-circle\" (click)=\"openVoiceSelector()\" />\n      </p-inputgroup-addon>\n      <p-select\n        id=\"voice\"\n        [editable]=\"true\"\n        [options]=\"voiceTTSOptions()\"\n        formControlName=\"voice\"\n        optionLabel=\"name\"\n        optionValue=\"id\"\n        [placeholder]=\"'Select Voice'\" />\n    </p-inputgroup>\n  </div>\n\n  <div class=\"form-field\">\n    <label for=\"speedRate\">Speed Rate <span pTooltip=\"Adjust the rate of speech delivery\">\u2139\uFE0F</span></label>\n    <br />\n    <input pInputText id=\"speedRate\" type=\"number\" formControlName=\"speedRate\" step=\"0.1\" />\n  </div>\n</div>\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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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: DynamicDialogModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputGroupModule }, { kind: "component", type: i3$6.InputGroup, selector: "p-inputgroup, p-inputGroup, p-input-group", inputs: ["styleClass"] }, { kind: "ngmodule", type: InputGroupAddonModule }, { kind: "component", type: i4$2.InputGroupAddon, selector: "p-inputgroup-addon, p-inputGroupAddon", inputs: ["style", "styleClass"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: CardModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcVoiceTtsFormComponent, decorators: [{
             type: Component,
@@ -6923,7 +6958,7 @@ class DcConversationSettingsFormComponent {
         this.getRules();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcConversationSettingsFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcConversationSettingsFormComponent, isStandalone: true, selector: "dc-conversation-settings-form", inputs: { form: "form", textEngineOptions: "textEngineOptions", conversationOptions: "conversationOptions", voiceTTSOptions: "voiceTTSOptions" }, providers: [DialogService], ngImport: i0, template: "<div [formGroup]=\"form\" class=\"p-6 bg-white rounded-lg shadow-md space-y-6\">\n  <h3 class=\"text-xl font-bold text-gray-900 border-b pb-2\">\n    Chat Conversation Settings\n    <span pTooltip=\"Additional information about the conversation use in the chat\" class=\"text-blue-500 cursor-help text-sm\">\u2139\uFE0F</span>\n  </h3>\n\n  <div>\n    <label for=\"rules\" class=\"block text-sm font-medium text-gray-700\">\n      Conversation Rules\n      <span pTooltip=\"Add rules to the conversation\" class=\"text-blue-500 cursor-help\">\u2139\uFE0F</span>\n    </label>\n    <p-select id=\"rules\" [options]=\"rules\" (onChange)=\"addRule($event.value)\" placeholder=\"Select a Rule\" optionLabel=\"name\" class=\"w-full\"></p-select>\n\n    <div formArrayName=\"rules\" class=\"mt-4 space-y-2\">\n      @for (rule of rulesFormArray.controls; track rule; let i = $index) {\n      <div [formGroupName]=\"i\" class=\"flex items-center justify-between p-2 border rounded-md\">\n        <span>{{ rule.value.name }}</span>\n        <button pButton type=\"button\" icon=\"pi pi-trash\" class=\"p-button-danger p-button-text\" (click)=\"removeRule(i)\"></button>\n      </div>\n      }\n    </div>\n  </div>\n\n  <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n    <div>\n      <label for=\"conversationType\" class=\"block text-sm font-medium text-gray-700\">\n        Conversation Type\n        <span class=\"cursor-pointer text-blue-500\" (click)=\"openConversationTypeDialog()\" pTooltip=\"Choose the type of conversation interaction\">\u2139\uFE0F</span>\n      </label>\n      <p-select\n        id=\"conversationType\"\n        [options]=\"conversationOptions\"\n        formControlName=\"conversationType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Conversation Type'\"\n        class=\"w-full mt-1\"></p-select>\n    </div>\n\n    <div>\n      <label for=\"textEngine\" class=\"block text-sm font-medium text-gray-700\">\n        Text Engine\n        <span\n          class=\"cursor-pointer text-blue-500\"\n          (click)=\"textEngineDialog.toggle($event)\"\n          pTooltip=\"Sistema de generaci\u00F3n de texto y audios. Client: el cliente llama al servidor en cada dialogo de voz/personaje, es optimo para historias,  Server SSML: se sintetiza todo el audio en uno solo con los distintos cambios de voz/personaje, util para la reflexi\u00F3n porque es bilingue, utiliza dialogos en ingles y espa\u00F1ol en el mismo dialogo/audio\"\n          >\u2139\uFE0F</span\n        >\n      </label>\n      <p-select\n        id=\"textEngine\"\n        [options]=\"textEngineOptions\"\n        formControlName=\"textEngine\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Text Engine'\"\n        class=\"w-full mt-1\"></p-select>\n    </div>\n\n    <div class=\"flex items-center justify-between md:col-span-2\">\n      <label class=\"text-sm font-medium text-gray-700\">\n        Auto Start\n        <span pTooltip=\"Start conversation automatically\" class=\"text-blue-500 cursor-help\">\u2139\uFE0F</span>\n      </label>\n      <p-toggleSwitch formControlName=\"autoStart\"></p-toggleSwitch>\n    </div>\n\n    <div class=\"flex items-center justify-between md:col-span-2\">\n      <label class=\"text-sm font-medium text-gray-700\">\n        User Must Start\n        <span pTooltip=\"If true the user must start the conversation, ignoring first message if any.\" class=\"text-blue-500 cursor-help\">\u2139\uFE0F</span>\n      </label>\n      <p-toggleSwitch formControlName=\"userMustStart\"></p-toggleSwitch>\n    </div>\n  </div>\n\n  <hr />\n\n  <dc-voice-tts-form [form]=\"mainVoiceFormGroup\" [title]=\"'Main Voice TTS Settings'\" [voiceTTSOptions]=\"voiceTTSOptions\"></dc-voice-tts-form>\n\n  <dc-voice-tts-form [form]=\"secondaryVoiceFormGroup\" [title]=\"'Secondary Voice TTS Settings'\" [voiceTTSOptions]=\"voiceTTSOptions\"></dc-voice-tts-form>\n\n  <hr />\n\n  <dc-model-selector [modelForm]=\"modelFormGroup\" [shortForm]=\"true\"></dc-model-selector>\n  <hr />\n</div>\n\n<p-popover #textEngineDialog [style]=\"{ width: '350px' }\" header=\"Text Engine Information\">\n  <ng-template pTemplate=\"content\">\n    <div class=\"p-4\">\n      <h3 class=\"text-md font-semibold mb-3 text-gray-800\">Text Engine Types</h3>\n      <ul class=\"space-y-3 text-sm text-gray-600\">\n        <li>\n          <strong class=\"font-semibold text-gray-900\">Texto Simple:</strong>\n          La conversaci\u00F3n es como chatgpt, preguntas y responde, es la m\u00E1s b\u00E1sica.\n        </li>\n        <li>\n          <strong class=\"font-semibold text-gray-900\">Multi Mensajes:</strong>\n          Utiliza markdown (recomendable entenderlo), para dar formato al texto. El sistema puede partir dialogos con distinto formato (normal, cursiva,\n          negritas) para generar distintas voces y estilos para el narrador y personaje.\n        </li>\n        <li>\n          <strong class=\"font-semibold text-gray-900\">MD SSML:</strong>\n          Markdown con SSML. Similar a Multi Mensajes, pero se presenta en un solo mensaje y la voz se genera para toda la linea. \u00DAtil para conversaciones\n          biling\u00FCes.\n        </li>\n      </ul>\n    </div>\n  </ng-template>\n</p-popover>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i3$5.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: TooltipModule }, { kind: "directive", type: i2$7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i2$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: DynamicDialogModule }, { kind: "component", type: ModelSelectorComponent, selector: "dc-model-selector", inputs: ["modelForm", "shortForm"] }, { kind: "component", type: DcVoiceTtsFormComponent, selector: "dc-voice-tts-form", inputs: ["form", "title", "voiceTTSOptions"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcConversationSettingsFormComponent, isStandalone: true, selector: "dc-conversation-settings-form", inputs: { form: "form", textEngineOptions: "textEngineOptions", conversationOptions: "conversationOptions", voiceTTSOptions: "voiceTTSOptions" }, providers: [DialogService], ngImport: i0, template: "<div [formGroup]=\"form\" class=\"p-6 bg-white rounded-lg shadow-md space-y-6\">\n  <h3 class=\"text-xl font-bold text-gray-900 border-b pb-2\">\n    Chat Conversation Settings\n    <span pTooltip=\"Additional information about the conversation use in the chat\" class=\"text-blue-500 cursor-help text-sm\">\u2139\uFE0F</span>\n  </h3>\n\n  <div>\n    <label for=\"rules\" class=\"block text-sm font-medium text-gray-700\">\n      Conversation Rules\n      <span pTooltip=\"Add rules to the conversation\" class=\"text-blue-500 cursor-help\">\u2139\uFE0F</span>\n    </label>\n    <p-select id=\"rules\" [options]=\"rules\" (onChange)=\"addRule($event.value)\" placeholder=\"Select a Rule\" optionLabel=\"name\" class=\"w-full\"></p-select>\n\n    <div formArrayName=\"rules\" class=\"mt-4 space-y-2\">\n      @for (rule of rulesFormArray.controls; track rule; let i = $index) {\n      <div [formGroupName]=\"i\" class=\"flex items-center justify-between p-2 border rounded-md\">\n        <span>{{ rule.value.name }}</span>\n        <button pButton type=\"button\" icon=\"pi pi-trash\" class=\"p-button-danger p-button-text\" (click)=\"removeRule(i)\"></button>\n      </div>\n      }\n    </div>\n  </div>\n\n  <div class=\"grid grid-cols-1 md:grid-cols-2 gap-6\">\n    <div>\n      <label for=\"conversationType\" class=\"block text-sm font-medium text-gray-700\">\n        Conversation Type\n        <span class=\"cursor-pointer text-blue-500\" (click)=\"openConversationTypeDialog()\" pTooltip=\"Choose the type of conversation interaction\">\u2139\uFE0F</span>\n      </label>\n      <p-select\n        id=\"conversationType\"\n        [options]=\"conversationOptions\"\n        formControlName=\"conversationType\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Conversation Type'\"\n        class=\"w-full mt-1\"></p-select>\n    </div>\n\n    <div>\n      <label for=\"textEngine\" class=\"block text-sm font-medium text-gray-700\">\n        Text Engine\n        <span\n          class=\"cursor-pointer text-blue-500\"\n          (click)=\"textEngineDialog.toggle($event)\"\n          pTooltip=\"Sistema de generaci\u00F3n de texto y audios. Client: el cliente llama al servidor en cada dialogo de voz/personaje, es optimo para historias,  Server SSML: se sintetiza todo el audio en uno solo con los distintos cambios de voz/personaje, util para la reflexi\u00F3n porque es bilingue, utiliza dialogos en ingles y espa\u00F1ol en el mismo dialogo/audio\"\n          >\u2139\uFE0F</span\n        >\n      </label>\n      <p-select\n        id=\"textEngine\"\n        [options]=\"textEngineOptions\"\n        formControlName=\"textEngine\"\n        optionLabel=\"label\"\n        optionValue=\"value\"\n        [placeholder]=\"'Select Text Engine'\"\n        class=\"w-full mt-1\"></p-select>\n    </div>\n\n    <div class=\"flex items-center justify-between md:col-span-2\">\n      <label class=\"text-sm font-medium text-gray-700\">\n        Auto Start\n        <span pTooltip=\"Start conversation automatically\" class=\"text-blue-500 cursor-help\">\u2139\uFE0F</span>\n      </label>\n      <p-toggleSwitch formControlName=\"autoStart\"></p-toggleSwitch>\n    </div>\n\n    <div class=\"flex items-center justify-between md:col-span-2\">\n      <label class=\"text-sm font-medium text-gray-700\">\n        User Must Start\n        <span pTooltip=\"If true the user must start the conversation, ignoring first message if any.\" class=\"text-blue-500 cursor-help\">\u2139\uFE0F</span>\n      </label>\n      <p-toggleSwitch formControlName=\"userMustStart\"></p-toggleSwitch>\n    </div>\n  </div>\n\n  <hr />\n\n  <dc-voice-tts-form [form]=\"mainVoiceFormGroup\" [title]=\"'Main Voice TTS Settings'\" [voiceTTSOptions]=\"voiceTTSOptions\"></dc-voice-tts-form>\n\n  <dc-voice-tts-form [form]=\"secondaryVoiceFormGroup\" [title]=\"'Secondary Voice TTS Settings'\" [voiceTTSOptions]=\"voiceTTSOptions\"></dc-voice-tts-form>\n\n  <hr />\n\n  <dc-model-selector [modelForm]=\"modelFormGroup\" [shortForm]=\"true\"></dc-model-selector>\n  <hr />\n</div>\n\n<p-popover #textEngineDialog [style]=\"{ width: '350px' }\" header=\"Text Engine Information\">\n  <ng-template pTemplate=\"content\">\n    <div class=\"p-4\">\n      <h3 class=\"text-md font-semibold mb-3 text-gray-800\">Text Engine Types</h3>\n      <ul class=\"space-y-3 text-sm text-gray-600\">\n        <li>\n          <strong class=\"font-semibold text-gray-900\">Texto Simple:</strong>\n          La conversaci\u00F3n es como chatgpt, preguntas y responde, es la m\u00E1s b\u00E1sica.\n        </li>\n        <li>\n          <strong class=\"font-semibold text-gray-900\">Multi Mensajes:</strong>\n          Utiliza markdown (recomendable entenderlo), para dar formato al texto. El sistema puede partir dialogos con distinto formato (normal, cursiva,\n          negritas) para generar distintas voces y estilos para el narrador y personaje.\n        </li>\n        <li>\n          <strong class=\"font-semibold text-gray-900\">MD SSML:</strong>\n          Markdown con SSML. Similar a Multi Mensajes, pero se presenta en un solo mensaje y la voz se genera para toda la linea. \u00DAtil para conversaciones\n          biling\u00FCes.\n        </li>\n      </ul>\n    </div>\n  </ng-template>\n</p-popover>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { 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: TooltipModule }, { kind: "directive", type: i3$4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i2$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: DynamicDialogModule }, { kind: "component", type: ModelSelectorComponent, selector: "dc-model-selector", inputs: ["modelForm", "shortForm"] }, { kind: "component", type: DcVoiceTtsFormComponent, selector: "dc-voice-tts-form", inputs: ["form", "title", "voiceTTSOptions"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcConversationSettingsFormComponent, decorators: [{
             type: Component,
@@ -7171,7 +7206,7 @@ class DCAgentCardFormComponent extends EntityBaseFormComponent {
         this.router.navigate(['../../cards-creator'], { relativeTo: this.route });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DCAgentCardFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DCAgentCardFormComponent, isStandalone: true, selector: "dc-agent-form", inputs: { storageSettings: { classPropertyName: "storageSettings", publicName: "storageSettings", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSave: "onSave", onGoDetails: "onGoDetails" }, providers: [DialogService], usesInheritance: true, ngImport: i0, template: "<p-card>\n  <div class=\"top-buttons\">\n    <button pButton severity=\"info\" (click)=\"checkPrompt()\" label=\"\uD83D\uDC41\uFE0F Ver instrucciones finales \uD83D\uDCD3\"></button>\n\n    <button pButton severity=\"info\" (click)=\"goToDetails()\" label=\"\uD83D\uDCAC Conversar\"></button>\n    <button pButton severity=\"primary\" (click)=\"save()\" label=\"\uD83D\uDCBE Guardar cambios\"></button>\n  </div>\n\n  <div class=\"top-buttons\">\n    <p-button [loading]=\"isGenerating()\" severity=\"help\" (click)=\"generateCharacter()\" label=\"Generar \uD83E\uDDBE\"></p-button>\n    <p-button severity=\"help\" (click)=\"goToCardsCreator()\" label=\" Creador masivo \"></p-button>\n\n    <p-button severity=\"info\" (click)=\"downloadConversation()\" label=\"\uD83D\uDCC1 Exportar \u2B07\uFE0F\"></p-button>\n    <p-button severity=\"info\" (click)=\"importConversation()\" label=\"\uD83C\uDCCF Importar \u2B06\uFE0F\"></p-button>\n    <p-button severity=\"danger\" (click)=\"deleteCard()\" icon=\"pi pi-trash\"></p-button>\n  </div>\n\n  <br />\n  <br />\n  <form [formGroup]=\"form\" class=\"conversation-form\">\n    <div class=\"form-grid\">\n      <div class=\"left-column\">\n        <div title=\"Main data\" style=\"border: 1px dashed #0c138e1f; padding: 4px; border-radius: 15px\">\n          <div style=\"display: flex; gap: 15px\">\n            <div class=\"form-field\">\n              <label for=\"version\">Version: {{ form.get('version').value }} <span pTooltip=\"Version number of the conversation\">\u2139\uFE0F</span></label>\n            </div>\n\n            <div class=\"form-field\">\n              <label for=\"id\"\n                >ID: <span pTooltip=\"Unique identifier for this conversation\"> {{ form.get('id').value }} \u2139\uFE0F</span></label\n              >\n            </div>\n          </div>\n          <dc-manageable-form [form]=\"form.controls.manageable\"></dc-manageable-form>\n          <dc-learnable-form [form]=\"form.controls.learnable\"></dc-learnable-form>\n\n          <div class=\"form-field\">\n            <label for=\"name\">Card Name <span pTooltip=\"Name of the Agent Card\">\u2139\uFE0F</span></label>\n            <input pInputText id=\"name\" type=\"text\" formControlName=\"name\" />\n            @if(form.get('name').errors?.['required'] && form.get('name').touched){\n            <div class=\"error\"> Name is required </div>\n            }\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"description\"> Description <span pTooltip=\"Description of the conversation\">\u2139\uFE0F</span></label>\n            <input pInputText id=\"description\" type=\"text\" formControlName=\"description\" />\n            @if(form.get('description').errors?.['required'] && form.get('description').touched){\n            <div class=\"error\"> Description is required </div>\n            }\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"lang\">Language <span pTooltip=\"Select the primary language for the conversation\">\u2139\uFE0F</span></label>\n            <p-select\n              id=\"lang\"\n              [options]=\"languageOptions\"\n              [filter]=\"true\"\n              formControlName=\"lang\"\n              optionLabel=\"label\"\n              optionValue=\"value\"\n              [placeholder]=\"'Select Language'\"></p-select>\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"agentType\">Agent Type <span pTooltip=\"Select the type of agent\">\u2139\uFE0F</span></label>\n            <p-select id=\"agentType\" [options]=\"agentTypeOptions\" formControlName=\"agentType\" [placeholder]=\"'Select Agent Type'\"></p-select>\n          </div>\n        </div>\n\n        <dc-conversation-settings-form\n          [form]=\"form.controls.conversationSettings\"\n          [textEngineOptions]=\"textEngineOptions\"\n          [conversationOptions]=\"conversationOptions\"\n          [voiceTTSOptions]=\"voiceTTSOptions\">\n        </dc-conversation-settings-form>\n\n        <details>\n          <summary>Meta Information</summary>\n          <div formGroupName=\"metaApp\" class=\"group\">\n            <h3>Meta Information <span pTooltip=\"Additional information about the conversation\">\u2139\uFE0F</span></h3>\n            <div class=\"form-field\">\n              <label for=\"authorId\">Author ID <span pTooltip=\"Unique identifier for the conversation author\">\u2139\uFE0F</span></label>\n              <input pInputText id=\"authorId\" type=\"text\" formControlName=\"authorId\" />\n            </div>\n\n            <div class=\"form-field\">\n              <label for=\"authorEmail\">Author Email \u2139\uFE0F</label>\n              <input pInputText id=\"authorEmail\" type=\"email\" formControlName=\"authorEmail\" />\n              @if (form.get('metaApp.authorEmail')?.errors?.['email'] && form.get('metaApp.authorEmail')?.touched) {\n              <div class=\"error\"> Please enter a valid email address </div>\n              }\n            </div>\n\n            <div class=\"form-field\">\n              <label for=\"takenCount\"\n                >Taken Count <span pTooltip=\"Es el contador de cuantas veces se ha tomado esta conversaci\u00F3n, no sirve por ahora\"> \u2139\uFE0F</span></label\n              >\n              <input pInputText id=\"takenCount\" type=\"number\" formControlName=\"takenCount\" />\n            </div>\n\n            <div class=\"form-field checkbox\">\n              <label>\n                <p-inputnumber formControlName=\"level\" [showButtons]=\"true\" [min]=\"0\" [max]=\"5\" />\n                Nivel Recomendado\n              </label>\n            </div>\n          </div>\n        </details>\n\n        <details>\n          <summary>Gestion de cuentas</summary>\n          <div class=\"group\">\n            <h4>Gestion de cuentas</h4>\n            @if(form.controls.accounts) {\n            <account-platform-form [formArray]=\"form.controls.accounts\"></account-platform-form>\n            }\n          </div>\n        </details>\n\n        <details>\n          <summary>Clonaci\u00F3n de voz</summary>\n          <div class=\"group\" formGroupName=\"voiceCloning\">\n            <h4>Clonaci\u00F3n de voz de herramientas</h4>\n            <div class=\"form-field\">\n              <label for=\"transcription\">Transcription</label>\n              <textarea pTextarea id=\"transcription\" formControlName=\"transcription\" rows=\"3\"></textarea>\n            </div>\n            <div class=\"form-field\">\n              <!-- <p-button label=\"Upload Audio Sample\" icon=\"pi pi-upload\" (onClick)=\"uploadAudioSample()\"></p-button> -->\n              <!-- Display audio sample info if available -->\n              <dc-simple-uploader\n                buttonLabel=\"Subir audio\"\n                [storagePath]=\"'conversation-cards/' + entityId()\"\n                (fileUploaded)=\"onFileUploaded($event)\"></dc-simple-uploader>\n              @if(form.get('voiceCloning.sample').value?.url){\n              <audio controls [src]=\"form.get('voiceCloning.sample').value.url\"></audio>\n              }\n            </div>\n          </div>\n        </details>\n\n        @if(form.controls.conversationFlow){\n        <div class=\"group rounded-lg shadow-lg\">\n          <dc-conversation-flow-form [formGroup]=\"form.controls.conversationFlow\"></dc-conversation-flow-form>\n        </div>\n        }\n      </div>\n\n      <div class=\"right-column\">\n        @if(entity() && entityId()){\n        <assets-loader\n          [assets]=\"entity().assets\"\n          [storagePath]=\"'conversation-cards/' + entityId()\"\n          (assetsChange)=\"onAssetsChange($event)\"\n          (assetUpdate)=\"onUpdateAsset($event)\"\n          (onFileSelected)=\"onImageSelected($event)\"></assets-loader>\n        } @if(form.controls.characterCard){\n\n        <br />\n        <dc-character-card-form [characterCardForm]=\"form.controls.characterCard\" (generateMissingDataRequest)=\"generateMissingData()\">\n        </dc-character-card-form>\n        }\n      </div>\n    </div>\n  </form>\n\n  <div class=\"float-button\">\n    <p-button icon=\"pi pi-eye\" (click)=\"inspect()\" severity=\"secondary\" [rounded]=\"true\" [raised]=\"true\" pTooltip=\"Inspeccionar\"> </p-button>\n\n    <p-button icon=\"pi pi-save\" (click)=\"save()\" severity=\"primary\" [rounded]=\"true\" [raised]=\"true\" pTooltip=\"Guardar (Ctrl + S)\"> </p-button>\n  </div>\n</p-card>\n", styles: [".conversation-form{max-width:100%;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.conversation-form .card-group{padding:20px;border-radius:6px;margin-bottom:24px}.conversation-form .card-group h3{margin:0 0 20px;color:#2c3e50;font-size:1.25rem}.conversation-form .form-grid{display:flex;flex-wrap:wrap;gap:2rem;width:100%}.conversation-form .form-field{margin-bottom:1.5rem;display:flex;flex-direction:column;gap:.5rem}.conversation-form .form-field label{font-weight:500}.conversation-form .form-field.checkbox{flex-direction:row;align-items:center;gap:.5rem}.conversation-form .form-field.checkbox input[type=checkbox]{width:auto}.conversation-form .form-field .error{color:#dc3545;font-size:.875rem;margin-top:.25rem}.conversation-form .form-field .remove-button{position:absolute;border:none;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;top:-10px;right:-10px}.conversation-form .left-column,.conversation-form .right-column{display:flex;flex-direction:column;flex:1 1 calc(50% - 1rem);min-width:300px}@media (max-width: 768px){.conversation-form .left-column,.conversation-form .right-column{flex:1 1 100%}}.conversation-form .group,.conversation-form .meta-group,.conversation-form .card-group{padding:1rem;margin-bottom:1.5rem}.conversation-form .group h3,.conversation-form .meta-group h3,.conversation-form .card-group h3{margin-top:0;margin-bottom:1rem}.top-buttons{display:flex;justify-content:space-between;margin-bottom:2rem;gap:1rem}.top-buttons button{flex:1}::ng-deep em{font-weight:900;color:#014a93}.float-button{position:fixed;bottom:4rem;right:2rem;z-index:1000;display:flex;gap:1px}.float-button :host ::ng-deep .p-button{width:4rem;height:4rem;border-radius:50%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: AssetsLoaderComponent, selector: "assets-loader", inputs: ["assets", "storagePath"], outputs: ["assetsChange", "assetUpdate", "onFileSelected"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i2$7.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: DynamicDialogModule }, { kind: "component", type: AccountPlatformForm, selector: "account-platform-form", inputs: ["formArray"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: DCConversationFlowFormComponent, selector: "dc-conversation-flow-form", inputs: ["formGroup"] }, { kind: "component", type: DcCharacterCardFormComponent, selector: "dc-character-card-form", inputs: ["characterCardForm"], outputs: ["generateMissingDataRequest"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i7.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: FileUploadModule }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: DcConversationSettingsFormComponent, selector: "dc-conversation-settings-form", inputs: ["form", "textEngineOptions", "conversationOptions", "voiceTTSOptions"] }, { kind: "component", type: DcManageableFormComponent, selector: "dc-manageable-form", inputs: ["form"] }, { kind: "component", type: DcLearnableFormComponent, selector: "dc-learnable-form", inputs: ["form"] }, { kind: "component", type: SimpleUploaderComponent, selector: "dc-simple-uploader", inputs: ["storagePath", "buttonLabel", "accept", "disabled", "metadata"], outputs: ["fileUploaded", "uploadError"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DCAgentCardFormComponent, isStandalone: true, selector: "dc-agent-form", inputs: { storageSettings: { classPropertyName: "storageSettings", publicName: "storageSettings", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSave: "onSave", onGoDetails: "onGoDetails" }, providers: [DialogService], usesInheritance: true, ngImport: i0, template: "<p-card>\n  <div class=\"top-buttons\">\n    <button pButton severity=\"info\" (click)=\"checkPrompt()\" label=\"\uD83D\uDC41\uFE0F Ver instrucciones finales \uD83D\uDCD3\"></button>\n\n    <button pButton severity=\"info\" (click)=\"goToDetails()\" label=\"\uD83D\uDCAC Conversar\"></button>\n    <button pButton severity=\"primary\" (click)=\"save()\" label=\"\uD83D\uDCBE Guardar cambios\"></button>\n  </div>\n\n  <div class=\"top-buttons\">\n    <p-button [loading]=\"isGenerating()\" severity=\"help\" (click)=\"generateCharacter()\" label=\"Generar \uD83E\uDDBE\"></p-button>\n    <p-button severity=\"help\" (click)=\"goToCardsCreator()\" label=\" Creador masivo \"></p-button>\n\n    <p-button severity=\"info\" (click)=\"downloadConversation()\" label=\"\uD83D\uDCC1 Exportar \u2B07\uFE0F\"></p-button>\n    <p-button severity=\"info\" (click)=\"importConversation()\" label=\"\uD83C\uDCCF Importar \u2B06\uFE0F\"></p-button>\n    <p-button severity=\"danger\" (click)=\"deleteCard()\" icon=\"pi pi-trash\"></p-button>\n  </div>\n\n  <br />\n  <br />\n  <form [formGroup]=\"form\" class=\"conversation-form\">\n    <div class=\"form-grid\">\n      <div class=\"left-column\">\n        <div title=\"Main data\" style=\"border: 1px dashed #0c138e1f; padding: 4px; border-radius: 15px\">\n          <div style=\"display: flex; gap: 15px\">\n            <div class=\"form-field\">\n              <label for=\"version\">Version: {{ form.get('version').value }} <span pTooltip=\"Version number of the conversation\">\u2139\uFE0F</span></label>\n            </div>\n\n            <div class=\"form-field\">\n              <label for=\"id\"\n                >ID: <span pTooltip=\"Unique identifier for this conversation\"> {{ form.get('id').value }} \u2139\uFE0F</span></label\n              >\n            </div>\n          </div>\n          <dc-manageable-form [form]=\"form.controls.manageable\"></dc-manageable-form>\n          <dc-learnable-form [form]=\"form.controls.learnable\"></dc-learnable-form>\n\n          <div class=\"form-field\">\n            <label for=\"name\">Card Name <span pTooltip=\"Name of the Agent Card\">\u2139\uFE0F</span></label>\n            <input pInputText id=\"name\" type=\"text\" formControlName=\"name\" />\n            @if(form.get('name').errors?.['required'] && form.get('name').touched){\n            <div class=\"error\"> Name is required </div>\n            }\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"description\"> Description <span pTooltip=\"Description of the conversation\">\u2139\uFE0F</span></label>\n            <input pInputText id=\"description\" type=\"text\" formControlName=\"description\" />\n            @if(form.get('description').errors?.['required'] && form.get('description').touched){\n            <div class=\"error\"> Description is required </div>\n            }\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"lang\">Language <span pTooltip=\"Select the primary language for the conversation\">\u2139\uFE0F</span></label>\n            <p-select\n              id=\"lang\"\n              [options]=\"languageOptions\"\n              [filter]=\"true\"\n              formControlName=\"lang\"\n              optionLabel=\"label\"\n              optionValue=\"value\"\n              [placeholder]=\"'Select Language'\"></p-select>\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"agentType\">Agent Type <span pTooltip=\"Select the type of agent\">\u2139\uFE0F</span></label>\n            <p-select id=\"agentType\" [options]=\"agentTypeOptions\" formControlName=\"agentType\" [placeholder]=\"'Select Agent Type'\"></p-select>\n          </div>\n        </div>\n\n        <dc-conversation-settings-form\n          [form]=\"form.controls.conversationSettings\"\n          [textEngineOptions]=\"textEngineOptions\"\n          [conversationOptions]=\"conversationOptions\"\n          [voiceTTSOptions]=\"voiceTTSOptions\">\n        </dc-conversation-settings-form>\n\n        <details>\n          <summary>Meta Information</summary>\n          <div formGroupName=\"metaApp\" class=\"group\">\n            <h3>Meta Information <span pTooltip=\"Additional information about the conversation\">\u2139\uFE0F</span></h3>\n            <div class=\"form-field\">\n              <label for=\"authorId\">Author ID <span pTooltip=\"Unique identifier for the conversation author\">\u2139\uFE0F</span></label>\n              <input pInputText id=\"authorId\" type=\"text\" formControlName=\"authorId\" />\n            </div>\n\n            <div class=\"form-field\">\n              <label for=\"authorEmail\">Author Email \u2139\uFE0F</label>\n              <input pInputText id=\"authorEmail\" type=\"email\" formControlName=\"authorEmail\" />\n              @if (form.get('metaApp.authorEmail')?.errors?.['email'] && form.get('metaApp.authorEmail')?.touched) {\n              <div class=\"error\"> Please enter a valid email address </div>\n              }\n            </div>\n\n            <div class=\"form-field\">\n              <label for=\"takenCount\"\n                >Taken Count <span pTooltip=\"Es el contador de cuantas veces se ha tomado esta conversaci\u00F3n, no sirve por ahora\"> \u2139\uFE0F</span></label\n              >\n              <input pInputText id=\"takenCount\" type=\"number\" formControlName=\"takenCount\" />\n            </div>\n\n            <div class=\"form-field checkbox\">\n              <label>\n                <p-inputnumber formControlName=\"level\" [showButtons]=\"true\" [min]=\"0\" [max]=\"5\" />\n                Nivel Recomendado\n              </label>\n            </div>\n          </div>\n        </details>\n\n        <details>\n          <summary>Gestion de cuentas</summary>\n          <div class=\"group\">\n            <h4>Gestion de cuentas</h4>\n            @if(form.controls.accounts) {\n            <account-platform-form [formArray]=\"form.controls.accounts\"></account-platform-form>\n            }\n          </div>\n        </details>\n\n        <details>\n          <summary>Clonaci\u00F3n de voz</summary>\n          <div class=\"group\" formGroupName=\"voiceCloning\">\n            <h4>Clonaci\u00F3n de voz de herramientas</h4>\n            <div class=\"form-field\">\n              <label for=\"transcription\">Transcription</label>\n              <textarea pTextarea id=\"transcription\" formControlName=\"transcription\" rows=\"3\"></textarea>\n            </div>\n            <div class=\"form-field\">\n              <!-- <p-button label=\"Upload Audio Sample\" icon=\"pi pi-upload\" (onClick)=\"uploadAudioSample()\"></p-button> -->\n              <!-- Display audio sample info if available -->\n              <dc-simple-uploader\n                buttonLabel=\"Subir audio\"\n                [storagePath]=\"'conversation-cards/' + entityId()\"\n                (fileUploaded)=\"onFileUploaded($event)\"></dc-simple-uploader>\n              @if(form.get('voiceCloning.sample').value?.url){\n              <audio controls [src]=\"form.get('voiceCloning.sample').value.url\"></audio>\n              }\n            </div>\n          </div>\n        </details>\n\n        @if(form.controls.conversationFlow){\n        <div class=\"group rounded-lg shadow-lg\">\n          <dc-conversation-flow-form [formGroup]=\"form.controls.conversationFlow\"></dc-conversation-flow-form>\n        </div>\n        }\n      </div>\n\n      <div class=\"right-column\">\n        @if(entity() && entityId()){\n        <assets-loader\n          [assets]=\"entity().assets\"\n          [storagePath]=\"'conversation-cards/' + entityId()\"\n          (assetsChange)=\"onAssetsChange($event)\"\n          (assetUpdate)=\"onUpdateAsset($event)\"\n          (onFileSelected)=\"onImageSelected($event)\"></assets-loader>\n        } @if(form.controls.characterCard){\n\n        <br />\n        <dc-character-card-form [characterCardForm]=\"form.controls.characterCard\" (generateMissingDataRequest)=\"generateMissingData()\">\n        </dc-character-card-form>\n        }\n      </div>\n    </div>\n  </form>\n\n  <div class=\"float-button\">\n    <p-button icon=\"pi pi-eye\" (click)=\"inspect()\" severity=\"secondary\" [rounded]=\"true\" [raised]=\"true\" pTooltip=\"Inspeccionar\"> </p-button>\n\n    <p-button icon=\"pi pi-save\" (click)=\"save()\" severity=\"primary\" [rounded]=\"true\" [raised]=\"true\" pTooltip=\"Guardar (Ctrl + S)\"> </p-button>\n  </div>\n</p-card>\n", styles: [".conversation-form{max-width:100%;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.conversation-form .card-group{padding:20px;border-radius:6px;margin-bottom:24px}.conversation-form .card-group h3{margin:0 0 20px;color:#2c3e50;font-size:1.25rem}.conversation-form .form-grid{display:flex;flex-wrap:wrap;gap:2rem;width:100%}.conversation-form .form-field{margin-bottom:1.5rem;display:flex;flex-direction:column;gap:.5rem}.conversation-form .form-field label{font-weight:500}.conversation-form .form-field.checkbox{flex-direction:row;align-items:center;gap:.5rem}.conversation-form .form-field.checkbox input[type=checkbox]{width:auto}.conversation-form .form-field .error{color:#dc3545;font-size:.875rem;margin-top:.25rem}.conversation-form .form-field .remove-button{position:absolute;border:none;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;top:-10px;right:-10px}.conversation-form .left-column,.conversation-form .right-column{display:flex;flex-direction:column;flex:1 1 calc(50% - 1rem);min-width:300px}@media (max-width: 768px){.conversation-form .left-column,.conversation-form .right-column{flex:1 1 100%}}.conversation-form .group,.conversation-form .meta-group,.conversation-form .card-group{padding:1rem;margin-bottom:1.5rem}.conversation-form .group h3,.conversation-form .meta-group h3,.conversation-form .card-group h3{margin-top:0;margin-bottom:1rem}.top-buttons{display:flex;justify-content:space-between;margin-bottom:2rem;gap:1rem}.top-buttons button{flex:1}::ng-deep em{font-weight:900;color:#014a93}.float-button{position:fixed;bottom:4rem;right:2rem;z-index:1000;display:flex;gap:1px}.float-button :host ::ng-deep .p-button{width:4rem;height:4rem;border-radius:50%}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: AssetsLoaderComponent, selector: "assets-loader", inputs: ["assets", "storagePath"], outputs: ["assetsChange", "assetUpdate", "onFileSelected"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i3$4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: DynamicDialogModule }, { kind: "component", type: AccountPlatformForm, selector: "account-platform-form", inputs: ["formArray"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$7.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "component", type: DCConversationFlowFormComponent, selector: "dc-conversation-flow-form", inputs: ["formGroup"] }, { kind: "component", type: DcCharacterCardFormComponent, selector: "dc-character-card-form", inputs: ["characterCardForm"], outputs: ["generateMissingDataRequest"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i7.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: FileUploadModule }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: DcConversationSettingsFormComponent, selector: "dc-conversation-settings-form", inputs: ["form", "textEngineOptions", "conversationOptions", "voiceTTSOptions"] }, { kind: "component", type: DcManageableFormComponent, selector: "dc-manageable-form", inputs: ["form"] }, { kind: "component", type: DcLearnableFormComponent, selector: "dc-learnable-form", inputs: ["form"] }, { kind: "component", type: SimpleUploaderComponent, selector: "dc-simple-uploader", inputs: ["storagePath", "buttonLabel", "accept", "disabled", "metadata"], outputs: ["fileUploaded", "uploadError"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DCAgentCardFormComponent, decorators: [{
             type: Component,
@@ -7278,7 +7313,7 @@ class AgentCardUI {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AgentCardUI, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AgentCardUI, isStandalone: true, selector: "dc-agent-card-ui", inputs: { card: { classPropertyName: "card", publicName: "card", isSignal: true, isRequired: false, transformFunction: null }, showOptions: { classPropertyName: "showOptions", publicName: "showOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onAction: "onAction" }, ngImport: i0, template: "<p-card class=\"card-image\">\n  @if(this.userService.isAdmin()) {\n  <div style=\"position: absolute; top: 5px; right: 5px; z-index: 1000\">\n    <p-speeddial\n      [model]=\"speedDialModel\"\n      [radius]=\"70\"\n      type=\"quarter-circle\"\n      direction=\"down-left\"\n      [tooltipOptions]=\"{ tooltipPosition: 'top' }\"\n      [buttonProps]=\"{ severity: 'primary', rounded: true, outlined: true, raised: true }\" />\n  </div>\n  }\n\n  <img [src]=\"card()?.assets?.image?.url || 'assets/defaults/images/default_conversation_card.webp'\" alt=\"\" />\n\n  <div (click)=\"eventCard(eventType.Select)\" class=\"content\">\n    <p class=\"text-xl font-bold text-shadow-lg/30\">{{ name() }}</p>\n\n    <p style=\"margin-top: 40px\">\n      <span class=\"title text-shadow-lg/30\" [innerHTML]=\"finalDescription() | truncate : 200\"></span>\n    </p>\n\n    <div style=\"position: absolute; bottom: 10px; left: 10px\">\n      @if(isTaken()){\n      <p-tag icon=\"pi pi-check-circle\" severity=\"success\" value=\"Tomada\" [rounded]=\"true\" />\n      } @if(userService.isAdmin()){\n\n      <p-tag icon=\"pi pi-eye\" severity=\"secondary\" [value]=\"card()?.manageable?.status || 'Sin estado'\" [rounded]=\"true\" />\n      }\n    </div>\n\n    <p-button\n      (click)=\"eventCard(eventType.Select); $event.stopPropagation()\"\n      [style]=\"{ position: 'absolute', bottom: '10px', right: '10px' }\"\n      icon=\"pi pi-comment\"\n      [rounded]=\"true\"\n      severity=\"info\"\n      [outlined]=\"true\"\n      [raised]=\"true\" />\n  </div>\n</p-card>\n", styles: [":host{display:block}:host ::ng-deep .p-card{height:100%}:host ::ng-deep .p-card-body{height:100%;padding:0!important}.card-image{width:280px;height:380px;position:relative;align-items:center;display:block;padding:-10px}.card-image img{position:absolute;z-index:3;width:100%;height:100%;opacity:.75;object-fit:cover;transition:opacity .5s}.content{position:absolute;inset:0;z-index:4;padding:1rem;color:#fff;background:linear-gradient(to bottom,#0003,#0000001a);height:100%;display:flex;flex-direction:column;justify-content:space-between}.content:hover{background:linear-gradient(to bottom,color-mix(in srgb,var(--p-primary-color) 20%,transparent),color-mix(in srgb,black 10%,transparent));cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: PopoverModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SpeedDialModule }, { kind: "component", type: i2$9.SpeedDial, selector: "p-speeddial, p-speedDial, p-speed-dial", inputs: ["id", "model", "visible", "style", "className", "direction", "transitionDelay", "type", "radius", "mask", "disabled", "hideOnClickOutside", "buttonStyle", "buttonClassName", "maskStyle", "maskClassName", "showIcon", "hideIcon", "rotateAnimation", "ariaLabel", "ariaLabelledBy", "tooltipOptions", "buttonProps"], outputs: ["onVisibleChange", "visibleChange", "onClick", "onShow", "onHide"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$4.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "pipe", type: TruncatePipe, name: "truncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AgentCardUI, isStandalone: true, selector: "dc-agent-card-ui", inputs: { card: { classPropertyName: "card", publicName: "card", isSignal: true, isRequired: false, transformFunction: null }, showOptions: { classPropertyName: "showOptions", publicName: "showOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onAction: "onAction" }, ngImport: i0, template: "<p-card class=\"card-image\">\n  @if(this.userService.isAdmin()) {\n  <div style=\"position: absolute; top: 5px; right: 5px; z-index: 1000\">\n    <p-speeddial\n      [model]=\"speedDialModel\"\n      [radius]=\"70\"\n      type=\"quarter-circle\"\n      direction=\"down-left\"\n      [tooltipOptions]=\"{ tooltipPosition: 'top' }\"\n      [buttonProps]=\"{ severity: 'primary', rounded: true, outlined: true, raised: true }\" />\n  </div>\n  }\n\n  <img [src]=\"card()?.assets?.image?.url || 'assets/defaults/images/default_conversation_card.webp'\" alt=\"\" />\n\n  <div (click)=\"eventCard(eventType.Select)\" class=\"content\">\n    <p class=\"text-xl font-bold text-shadow-lg/30\">{{ name() }}</p>\n\n    <p style=\"margin-top: 40px\">\n      <span class=\"title text-shadow-lg/30\" [innerHTML]=\"finalDescription() | truncate : 200\"></span>\n    </p>\n\n    <div style=\"position: absolute; bottom: 10px; left: 10px\">\n      @if(isTaken()){\n      <p-tag icon=\"pi pi-check-circle\" severity=\"success\" value=\"Tomada\" [rounded]=\"true\" />\n      } @if(userService.isAdmin()){\n\n      <p-tag icon=\"pi pi-eye\" severity=\"secondary\" [value]=\"card()?.manageable?.status || 'Sin estado'\" [rounded]=\"true\" />\n      }\n    </div>\n\n    <p-button\n      (click)=\"eventCard(eventType.Select); $event.stopPropagation()\"\n      [style]=\"{ position: 'absolute', bottom: '10px', right: '10px' }\"\n      icon=\"pi pi-comment\"\n      [rounded]=\"true\"\n      severity=\"info\"\n      [outlined]=\"true\"\n      [raised]=\"true\" />\n  </div>\n</p-card>\n", styles: [":host{display:block}:host ::ng-deep .p-card{height:100%}:host ::ng-deep .p-card-body{height:100%;padding:0!important}.card-image{width:280px;height:380px;position:relative;align-items:center;display:block;padding:-10px}.card-image img{position:absolute;z-index:3;width:100%;height:100%;opacity:.75;object-fit:cover;transition:opacity .5s}.content{position:absolute;inset:0;z-index:4;padding:1rem;color:#fff;background:linear-gradient(to bottom,#0003,#0000001a);height:100%;display:flex;flex-direction:column;justify-content:space-between}.content:hover{background:linear-gradient(to bottom,color-mix(in srgb,var(--p-primary-color) 20%,transparent),color-mix(in srgb,black 10%,transparent));cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: PopoverModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SpeedDialModule }, { kind: "component", type: i2$8.SpeedDial, selector: "p-speeddial, p-speedDial, p-speed-dial", inputs: ["id", "model", "visible", "style", "className", "direction", "transitionDelay", "type", "radius", "mask", "disabled", "hideOnClickOutside", "buttonStyle", "buttonClassName", "maskStyle", "maskClassName", "showIcon", "hideIcon", "rotateAnimation", "ariaLabel", "ariaLabelledBy", "tooltipOptions", "buttonProps"], outputs: ["onVisibleChange", "visibleChange", "onClick", "onShow", "onHide"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$7.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$4.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "pipe", type: TruncatePipe, name: "truncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AgentCardUI, decorators: [{
             type: Component,
@@ -7355,6 +7390,16 @@ class AgentCardListComponent extends EntityBaseListV2Component {
                     { label: 'Otro', value: 'other' },
                 ],
             },
+            {
+                name: 'Voz Única',
+                field: 'voiceCloning.sample',
+                type: 'select',
+                operator: '$not_null',
+                options: [
+                    { label: 'Todos', value: null },
+                    { label: 'Solo con Voz Única', value: true },
+                ],
+            },
             ...this.extraFilters,
         ];
         // this.viewType.set('table');
@@ -7528,11 +7573,11 @@ class DcAgentCardDetailsComponent {
         this.showInfoLayer.update((value) => !value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcAgentCardDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcAgentCardDetailsComponent, isStandalone: true, selector: "dc-agent-card-details", inputs: { agentCardId: "agentCardId", useNativePlayer: "useNativePlayer" }, outputs: { onStartConversation: "onStartConversation" }, viewQueries: [{ propertyName: "videoPlayer", first: true, predicate: ["videoPlayer"], descendants: true }], ngImport: i0, template: "<div style=\"display: flex; justify-content: center; align-items: center\">\n  <p-card>\n    <div class=\"card-container\">\n      <img class=\"card-image\" [src]=\"agentCard()?.assets?.image?.url\" alt=\"\" />\n      <!-- This video is affected by Plyr i set by default background transparent -->\n      <video #videoPlayer class=\"card-image\"></video>\n\n      <div class=\"info-button\" (click)=\"toggleInfoLayer()\">\n        <p-button icon=\"pi pi-arrow-down-left\" [rounded]=\"true\" [raised]=\"true\" severity=\"primary\" [outlined]=\"true\" />\n      </div>\n\n      @if(!chatMonitorService.isConversationActive()) {\n      <div style=\"position: absolute; bottom: 20px; right: 50%; transform: translateX(50%); z-index: 3\">\n        <p-button\n          size=\"large\"\n          [label]=\"'dataclouder.agentCards.dcAgentCardDetails.startConversation' | translate\"\n          [rounded]=\"true\"\n          (click)=\"startConversation()\" />\n      </div>\n      }\n\n      <div class=\"info-layer\" [class.active]=\"showInfoLayer()\">\n        <div class=\"info-content\">\n          <h1\n            ><strong>{{ agentCard()?.name }}</strong></h1\n          >\n          <p>{{ agentCard()?.characterCard?.data?.name }}</p>\n\n          @if (agentCard()?.characterCard?.data?.scenario) {\n          <div class=\"scenario\">\n            <h4>{{ 'dataclouder.agentCards.dcAgentCardDetails.scenario' | translate }}</h4>\n            <p>{{ agentCard()?.characterCard?.data?.scenario | parseCard : agentCard() }}</p>\n          </div>\n          }\n        </div>\n      </div>\n    </div>\n  </p-card>\n</div>\n", styles: ["::ng-deep .p-card{width:420px;height:700px}::ng-deep .p-card .p-card-body{width:100%;height:100%}.card-image{height:100%;width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}::ng-deep .plyr--full-ui{width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}.info-button{position:absolute;top:15px;right:15px;z-index:3}.info-button:hover{transform:scale(1.1)}.info-layer{height:100%;width:100%;position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;z-index:2;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background-color:#ed122833;color:#fff;opacity:1;clip-path:circle(0% at top right);transition:clip-path .5s cubic-bezier(.25,1,.5,1);pointer-events:none}.info-layer.active{clip-path:circle(150% at top right);pointer-events:auto}.info-content{padding:15px;text-align:center;max-width:90%}.info-content h1{margin-top:0;font-size:18px;margin-bottom:10px}.info-content p{font-size:12px;margin:0}::ng-deep .info-button .p-button{background-color:#ffffff47}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: ParseCardPipe, name: "parseCard" }, { kind: "pipe", type: i3$7.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: DcAgentCardDetailsComponent, isStandalone: true, selector: "dc-agent-card-details", inputs: { agentCardId: "agentCardId", useNativePlayer: "useNativePlayer" }, outputs: { onStartConversation: "onStartConversation" }, viewQueries: [{ propertyName: "videoPlayer", first: true, predicate: ["videoPlayer"], descendants: true }], ngImport: i0, template: "<div style=\"display: flex; justify-content: center; align-items: center\">\n  <p-card>\n    <div class=\"card-container\">\n      <img class=\"card-image\" [src]=\"agentCard()?.assets?.image?.url\" alt=\"\" />\n      <!-- This video is affected by Plyr i set by default background transparent -->\n      <video #videoPlayer class=\"card-image\"></video>\n\n      <div class=\"info-button\" (click)=\"toggleInfoLayer()\">\n        <p-button icon=\"pi pi-arrow-down-left\" [rounded]=\"true\" [raised]=\"true\" severity=\"primary\" [outlined]=\"true\" />\n      </div>\n\n      @if(!chatMonitorService.isConversationActive()) {\n      <div style=\"position: absolute; bottom: 20px; right: 50%; transform: translateX(50%); z-index: 3\">\n        <p-button\n          size=\"large\"\n          [label]=\"'dataclouder.agentCards.dcAgentCardDetails.startConversation' | translate\"\n          [rounded]=\"true\"\n          (click)=\"startConversation()\" />\n      </div>\n      }\n\n      <div class=\"info-layer\" [class.active]=\"showInfoLayer()\">\n        <div class=\"info-content\">\n          <h1\n            ><strong>{{ agentCard()?.name || agentCard()?.characterCard?.data?.name }}</strong></h1\n          >\n\n          @if (agentCard()?.characterCard?.data?.instructions) {\n          <div class=\"scenario\">\n            <h4>{{ 'dataclouder.agentCards.dcAgentCardDetails.instructions' | translate }}</h4>\n            <p>{{ agentCard()?.characterCard?.data?.instructions | parseCard : agentCard() }}</p>\n          </div>\n          }\n        </div>\n      </div>\n    </div>\n  </p-card>\n</div>\n", styles: ["::ng-deep .p-card{width:420px;height:700px}::ng-deep .p-card .p-card-body{width:100%;height:100%}.card-image{height:100%;width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}::ng-deep .plyr--full-ui{width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}.info-button{position:absolute;top:15px;right:15px;z-index:3}.info-button:hover{transform:scale(1.1)}.info-layer{height:100%;width:100%;position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;z-index:2;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background-color:var(--chat-user-message-bg);color:#fff;opacity:1;clip-path:circle(0% at top right);transition:clip-path .5s cubic-bezier(.25,1,.5,1);pointer-events:none}.info-layer.active{clip-path:circle(150% at top right);pointer-events:auto}.info-content{padding:15px;text-align:center;max-width:90%}.info-content h1{margin-top:0;font-size:18px;margin-bottom:10px}.info-content p{font-size:12px;margin:0}::ng-deep .info-button .p-button{background-color:#ffffff47}\n"], dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$7.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: ParseCardPipe, name: "parseCard" }, { kind: "pipe", type: i3$7.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: DcAgentCardDetailsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dc-agent-card-details', standalone: true, imports: [ButtonModule, CardModule, ParseCardPipe, TranslateModule], template: "<div style=\"display: flex; justify-content: center; align-items: center\">\n  <p-card>\n    <div class=\"card-container\">\n      <img class=\"card-image\" [src]=\"agentCard()?.assets?.image?.url\" alt=\"\" />\n      <!-- This video is affected by Plyr i set by default background transparent -->\n      <video #videoPlayer class=\"card-image\"></video>\n\n      <div class=\"info-button\" (click)=\"toggleInfoLayer()\">\n        <p-button icon=\"pi pi-arrow-down-left\" [rounded]=\"true\" [raised]=\"true\" severity=\"primary\" [outlined]=\"true\" />\n      </div>\n\n      @if(!chatMonitorService.isConversationActive()) {\n      <div style=\"position: absolute; bottom: 20px; right: 50%; transform: translateX(50%); z-index: 3\">\n        <p-button\n          size=\"large\"\n          [label]=\"'dataclouder.agentCards.dcAgentCardDetails.startConversation' | translate\"\n          [rounded]=\"true\"\n          (click)=\"startConversation()\" />\n      </div>\n      }\n\n      <div class=\"info-layer\" [class.active]=\"showInfoLayer()\">\n        <div class=\"info-content\">\n          <h1\n            ><strong>{{ agentCard()?.name }}</strong></h1\n          >\n          <p>{{ agentCard()?.characterCard?.data?.name }}</p>\n\n          @if (agentCard()?.characterCard?.data?.scenario) {\n          <div class=\"scenario\">\n            <h4>{{ 'dataclouder.agentCards.dcAgentCardDetails.scenario' | translate }}</h4>\n            <p>{{ agentCard()?.characterCard?.data?.scenario | parseCard : agentCard() }}</p>\n          </div>\n          }\n        </div>\n      </div>\n    </div>\n  </p-card>\n</div>\n", styles: ["::ng-deep .p-card{width:420px;height:700px}::ng-deep .p-card .p-card-body{width:100%;height:100%}.card-image{height:100%;width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}::ng-deep .plyr--full-ui{width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}.info-button{position:absolute;top:15px;right:15px;z-index:3}.info-button:hover{transform:scale(1.1)}.info-layer{height:100%;width:100%;position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;z-index:2;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background-color:#ed122833;color:#fff;opacity:1;clip-path:circle(0% at top right);transition:clip-path .5s cubic-bezier(.25,1,.5,1);pointer-events:none}.info-layer.active{clip-path:circle(150% at top right);pointer-events:auto}.info-content{padding:15px;text-align:center;max-width:90%}.info-content h1{margin-top:0;font-size:18px;margin-bottom:10px}.info-content p{font-size:12px;margin:0}::ng-deep .info-button .p-button{background-color:#ffffff47}\n"] }]
+            args: [{ selector: 'dc-agent-card-details', standalone: true, imports: [ButtonModule, CardModule, ParseCardPipe, TranslateModule], template: "<div style=\"display: flex; justify-content: center; align-items: center\">\n  <p-card>\n    <div class=\"card-container\">\n      <img class=\"card-image\" [src]=\"agentCard()?.assets?.image?.url\" alt=\"\" />\n      <!-- This video is affected by Plyr i set by default background transparent -->\n      <video #videoPlayer class=\"card-image\"></video>\n\n      <div class=\"info-button\" (click)=\"toggleInfoLayer()\">\n        <p-button icon=\"pi pi-arrow-down-left\" [rounded]=\"true\" [raised]=\"true\" severity=\"primary\" [outlined]=\"true\" />\n      </div>\n\n      @if(!chatMonitorService.isConversationActive()) {\n      <div style=\"position: absolute; bottom: 20px; right: 50%; transform: translateX(50%); z-index: 3\">\n        <p-button\n          size=\"large\"\n          [label]=\"'dataclouder.agentCards.dcAgentCardDetails.startConversation' | translate\"\n          [rounded]=\"true\"\n          (click)=\"startConversation()\" />\n      </div>\n      }\n\n      <div class=\"info-layer\" [class.active]=\"showInfoLayer()\">\n        <div class=\"info-content\">\n          <h1\n            ><strong>{{ agentCard()?.name || agentCard()?.characterCard?.data?.name }}</strong></h1\n          >\n\n          @if (agentCard()?.characterCard?.data?.instructions) {\n          <div class=\"scenario\">\n            <h4>{{ 'dataclouder.agentCards.dcAgentCardDetails.instructions' | translate }}</h4>\n            <p>{{ agentCard()?.characterCard?.data?.instructions | parseCard : agentCard() }}</p>\n          </div>\n          }\n        </div>\n      </div>\n    </div>\n  </p-card>\n</div>\n", styles: ["::ng-deep .p-card{width:420px;height:700px}::ng-deep .p-card .p-card-body{width:100%;height:100%}.card-image{height:100%;width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}::ng-deep .plyr--full-ui{width:100%;object-fit:cover;object-position:center;position:absolute;top:0;left:0;transition:filter .3s ease}.info-button{position:absolute;top:15px;right:15px;z-index:3}.info-button:hover{transform:scale(1.1)}.info-layer{height:100%;width:100%;position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;z-index:2;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background-color:var(--chat-user-message-bg);color:#fff;opacity:1;clip-path:circle(0% at top right);transition:clip-path .5s cubic-bezier(.25,1,.5,1);pointer-events:none}.info-layer.active{clip-path:circle(150% at top right);pointer-events:auto}.info-content{padding:15px;text-align:center;max-width:90%}.info-content h1{margin-top:0;font-size:18px;margin-bottom:10px}.info-content p{font-size:12px;margin:0}::ng-deep .info-button .p-button{background-color:#ffffff47}\n"] }]
         }], ctorParameters: () => [], propDecorators: { agentCardId: [{
                 type: Input
             }], useNativePlayer: [{
@@ -7717,7 +7762,7 @@ class CardsCreatorComponent {
         this.notPublishedResults.set(res);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: CardsCreatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: CardsCreatorComponent, isStandalone: true, selector: "app-cards-creator", ngImport: i0, template: "<div>\n  <h2 class=\"text-2xl font-bold mb-4\">Card Generation</h2>\n  <p-message severity=\"secondary\"\n    >Paso 1: Genearar una o varias tarjetas vacias con solo la idea, estas tiene estatus de pending. no lo cambies ser\u00E1 necesario en el paso 2.\n  </p-message>\n\n  <div class=\"grid\">\n    <div class=\"col-12\">\n      <form [formGroup]=\"cardsForm\" (ngSubmit)=\"generateCards()\">\n        <div class=\"p-panel p-4\">\n          <h3 class=\"text-xl font-semibold mb-3\">Generate Cards</h3>\n          <p-message severity=\"info\">Generate one or more cards with an idea. Cards will be created with a 'pending' status.</p-message>\n\n          <div class=\"field mt-4\">\n            <label for=\"idea\">Idea</label>\n            <input id=\"idea\" type=\"text\" pInputText formControlName=\"idea\" placeholder=\"e.g., 'Ordering food at a restaurant'\" class=\"w-full\" />\n          </div>\n\n          <div class=\"form-field mt-4\">\n            <label for=\"lang\">Language <span pTooltip=\"Select the primary language for the conversation\">\u2139\uFE0F</span></label>\n            <p-select\n              id=\"lang\"\n              [options]=\"languageOptions\"\n              [filter]=\"true\"\n              formControlName=\"langCode\"\n              optionLabel=\"label\"\n              optionValue=\"value\"\n              [placeholder]=\"'Select Language'\"\n              styleClass=\"w-full\"></p-select>\n          </div>\n\n          <div class=\"field mt-4\">\n            <label for=\"num-cards\">Number of Cards</label>\n            <input id=\"num-cards\" type=\"number\" pInputText formControlName=\"numCards\" placeholder=\"e.g., '10'\" class=\"w-full\" />\n          </div>\n\n          <div class=\"flex flex-wrap gap-4 mt-4\">\n            <div class=\"flex align-items-center\">\n              <p-toggleSwitch formControlName=\"autosave\" inputId=\"autosave-switch\"></p-toggleSwitch>\n              <label for=\"autosave-switch\" class=\"ml-2\"> Auto-save?</label>\n            </div>\n            <div class=\"flex align-items-center\">\n              <p-toggleSwitch formControlName=\"doNotRepeat\" inputId=\"repeat-switch\"></p-toggleSwitch>\n              <label for=\"repeat-switch\" class=\"ml-2\"> Do not repeat topics?</label>\n            </div>\n          </div>\n\n          <div class=\"mt-4\">\n            <p-button label=\"Generate Cards\" icon=\"pi pi-bolt\" type=\"submit\" [loading]=\"loading()\" [disabled]=\"cardsForm.invalid\"></p-button>\n          </div>\n        </div>\n      </form>\n    </div>\n  </div>\n\n  <p-divider align=\"center\" styleClass=\"my-5\">\n    <span class=\"p-tag\">Maintenance</span>\n  </p-divider>\n\n  <!-- Maintenance Section -->\n  <div class=\"grid\">\n    <!-- Card Specific Maintenance -->\n    <div class=\"col-12 md:col-6\">\n      <div class=\"p-panel p-4\">\n        <h3 class=\"text-xl font-semibold mb-3\">Card Specific Maintenance</h3>\n        <div class=\"field\">\n          <label for=\"cardId\">Card ID</label>\n          <input\n            id=\"cardId\"\n            type=\"text\"\n            pInputText\n            [value]=\"cardId()\"\n            (input)=\"cardId.set($any($event.target).value)\"\n            placeholder=\"Enter Card ID\"\n            class=\"w-full\" />\n        </div>\n        <div class=\"mt-4 flex gap-2\">\n          <p-button label=\"Generate Image\" icon=\"pi pi-image\" (onClick)=\"generateImageForCard()\" [loading]=\"loading()\"></p-button>\n          <p-button\n            label=\"Generate Missing Data\"\n            icon=\"pi pi-database\"\n            (onClick)=\"generateMissingData()\"\n            [loading]=\"loading()\"\n            styleClass=\"p-button-secondary\"></p-button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Batch Operations -->\n    <div class=\"col-12 md:col-6\">\n      <div class=\"p-panel p-4\">\n        <h3 class=\"text-xl font-semibold mb-3\">Batch Operations</h3>\n        <p>Run maintenance tasks on all pending cards.</p>\n        <div class=\"mt-4 flex gap-2\">\n          <p-button label=\"Complete Pending Cards\" icon=\"pi pi-check-square\" (onClick)=\"completePendingCards()\" [loading]=\"loading()\"></p-button>\n          <p-button\n            label=\"Generate Pending Images\"\n            icon=\"pi pi-images\"\n            (onClick)=\"generatePendingImages()\"\n            [loading]=\"loading()\"\n            styleClass=\"p-button-secondary\"></p-button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Result Section -->\n  @if (result()) {\n  <div class=\"col-12 mt-4\">\n    <div class=\"p-panel p-4\">\n      <h3 class=\"text-xl font-semibold mb-3\">Result</h3>\n      <pre>{{ result() | json }}</pre>\n    </div>\n  </div>\n  }\n\n  <p-divider align=\"center\" styleClass=\"my-5\"> Busquedas pendientes </p-divider>\n\n  <p-button label=\"Buscar No publicadas\" icon=\"pi pi-database\" (onClick)=\"searchNotPublic()\" [loading]=\"loading()\" severity=\"secondary\"></p-button>\n  <p-button label=\"Buscar no publicadas (new)\" icon=\"pi pi-database\" (onClick)=\"searchNotpublished()\" [loading]=\"loading()\" severity=\"secondary\"></p-button>\n  <br />\n\n  <br />\n\n  @if (notPublishedResults()) {\n  <div class=\"mt-4\">\n    <p-table [value]=\"notPublishedResults().rows\" [tableStyle]=\"{ 'min-width': '50rem' }\">\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th>ID</th>\n          <th>Name</th>\n          <th>Language</th>\n          <th>Status</th>\n          <th>Character Name</th>\n          <th>Actions</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-row>\n        <tr>\n          <td>{{ row?._id }}</td>\n          <td>{{ row?.name }}</td>\n          <td>{{ row?.lang }}</td>\n          <td>{{ row?.manageable?.status }}</td>\n          <td>{{ row?.characterCard?.data?.name }}</td>\n          <td>\n            <a [href]=\"'/app/conversations/edit/' + row._id\" target=\"_blank\">\n              <p-button icon=\"pi pi-pencil\" styleClass=\"p-button-rounded p-button-text\"></p-button>\n            </a>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n\n    <br />\n    <br />\n  </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i1$2.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i3$3.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i3$5.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: TableModule }, { kind: "component", type: i1$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "pipe", type: i3.JsonPipe, name: "json" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: CardsCreatorComponent, isStandalone: true, selector: "app-cards-creator", ngImport: i0, template: "<div>\n  <h2 class=\"text-2xl font-bold mb-4\">Card Generation</h2>\n  <p-message severity=\"secondary\"\n    >Paso 1: Genearar una o varias tarjetas vacias con solo la idea, estas tiene estatus de pending. no lo cambies ser\u00E1 necesario en el paso 2.\n  </p-message>\n\n  <div class=\"grid\">\n    <div class=\"col-12\">\n      <form [formGroup]=\"cardsForm\" (ngSubmit)=\"generateCards()\">\n        <div class=\"p-panel p-4\">\n          <h3 class=\"text-xl font-semibold mb-3\">Generate Cards</h3>\n          <p-message severity=\"info\">Generate one or more cards with an idea. Cards will be created with a 'pending' status.</p-message>\n\n          <div class=\"field mt-4\">\n            <label for=\"idea\">Idea</label>\n            <input id=\"idea\" type=\"text\" pInputText formControlName=\"idea\" placeholder=\"e.g., 'Ordering food at a restaurant'\" class=\"w-full\" />\n          </div>\n\n          <div class=\"form-field mt-4\">\n            <label for=\"lang\">Language <span pTooltip=\"Select the primary language for the conversation\">\u2139\uFE0F</span></label>\n            <p-select\n              id=\"lang\"\n              [options]=\"languageOptions\"\n              [filter]=\"true\"\n              formControlName=\"langCode\"\n              optionLabel=\"label\"\n              optionValue=\"value\"\n              [placeholder]=\"'Select Language'\"\n              styleClass=\"w-full\"></p-select>\n          </div>\n\n          <div class=\"field mt-4\">\n            <label for=\"num-cards\">Number of Cards</label>\n            <input id=\"num-cards\" type=\"number\" pInputText formControlName=\"numCards\" placeholder=\"e.g., '10'\" class=\"w-full\" />\n          </div>\n\n          <div class=\"flex flex-wrap gap-4 mt-4\">\n            <div class=\"flex align-items-center\">\n              <p-toggleSwitch formControlName=\"autosave\" inputId=\"autosave-switch\"></p-toggleSwitch>\n              <label for=\"autosave-switch\" class=\"ml-2\"> Auto-save?</label>\n            </div>\n            <div class=\"flex align-items-center\">\n              <p-toggleSwitch formControlName=\"doNotRepeat\" inputId=\"repeat-switch\"></p-toggleSwitch>\n              <label for=\"repeat-switch\" class=\"ml-2\"> Do not repeat topics?</label>\n            </div>\n          </div>\n\n          <div class=\"mt-4\">\n            <p-button label=\"Generate Cards\" icon=\"pi pi-bolt\" type=\"submit\" [loading]=\"loading()\" [disabled]=\"cardsForm.invalid\"></p-button>\n          </div>\n        </div>\n      </form>\n    </div>\n  </div>\n\n  <p-divider align=\"center\" styleClass=\"my-5\">\n    <span class=\"p-tag\">Maintenance</span>\n  </p-divider>\n\n  <!-- Maintenance Section -->\n  <div class=\"grid\">\n    <!-- Card Specific Maintenance -->\n    <div class=\"col-12 md:col-6\">\n      <div class=\"p-panel p-4\">\n        <h3 class=\"text-xl font-semibold mb-3\">Card Specific Maintenance</h3>\n        <div class=\"field\">\n          <label for=\"cardId\">Card ID</label>\n          <input\n            id=\"cardId\"\n            type=\"text\"\n            pInputText\n            [value]=\"cardId()\"\n            (input)=\"cardId.set($any($event.target).value)\"\n            placeholder=\"Enter Card ID\"\n            class=\"w-full\" />\n        </div>\n        <div class=\"mt-4 flex gap-2\">\n          <p-button label=\"Generate Image\" icon=\"pi pi-image\" (onClick)=\"generateImageForCard()\" [loading]=\"loading()\"></p-button>\n          <p-button\n            label=\"Generate Missing Data\"\n            icon=\"pi pi-database\"\n            (onClick)=\"generateMissingData()\"\n            [loading]=\"loading()\"\n            styleClass=\"p-button-secondary\"></p-button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Batch Operations -->\n    <div class=\"col-12 md:col-6\">\n      <div class=\"p-panel p-4\">\n        <h3 class=\"text-xl font-semibold mb-3\">Batch Operations</h3>\n        <p>Run maintenance tasks on all pending cards.</p>\n        <div class=\"mt-4 flex gap-2\">\n          <p-button label=\"Complete Pending Cards\" icon=\"pi pi-check-square\" (onClick)=\"completePendingCards()\" [loading]=\"loading()\"></p-button>\n          <p-button\n            label=\"Generate Pending Images\"\n            icon=\"pi pi-images\"\n            (onClick)=\"generatePendingImages()\"\n            [loading]=\"loading()\"\n            styleClass=\"p-button-secondary\"></p-button>\n        </div>\n      </div>\n    </div>\n  </div>\n\n  <!-- Result Section -->\n  @if (result()) {\n  <div class=\"col-12 mt-4\">\n    <div class=\"p-panel p-4\">\n      <h3 class=\"text-xl font-semibold mb-3\">Result</h3>\n      <pre>{{ result() | json }}</pre>\n    </div>\n  </div>\n  }\n\n  <p-divider align=\"center\" styleClass=\"my-5\"> Busquedas pendientes </p-divider>\n\n  <p-button label=\"Buscar No publicadas\" icon=\"pi pi-database\" (onClick)=\"searchNotPublic()\" [loading]=\"loading()\" severity=\"secondary\"></p-button>\n  <p-button label=\"Buscar no publicadas (new)\" icon=\"pi pi-database\" (onClick)=\"searchNotpublished()\" [loading]=\"loading()\" severity=\"secondary\"></p-button>\n  <br />\n\n  <br />\n\n  @if (notPublishedResults()) {\n  <div class=\"mt-4\">\n    <p-table [value]=\"notPublishedResults().rows\" [tableStyle]=\"{ 'min-width': '50rem' }\">\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th>ID</th>\n          <th>Name</th>\n          <th>Language</th>\n          <th>Status</th>\n          <th>Character Name</th>\n          <th>Actions</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-row>\n        <tr>\n          <td>{{ row?._id }}</td>\n          <td>{{ row?.name }}</td>\n          <td>{{ row?.lang }}</td>\n          <td>{{ row?.manageable?.status }}</td>\n          <td>{{ row?.characterCard?.data?.name }}</td>\n          <td>\n            <a [href]=\"'/app/conversations/edit/' + row._id\" target=\"_blank\">\n              <p-button icon=\"pi pi-pencil\" styleClass=\"p-button-rounded p-button-text\"></p-button>\n            </a>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n\n    <br />\n    <br />\n  </div>\n  }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],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: CommonModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i2$5.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: DividerModule }, { kind: "component", type: i1$2.Divider, selector: "p-divider", inputs: ["styleClass", "layout", "type", "align"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i3$3.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant"], outputs: ["onClose"] }, { 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"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { 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: TableModule }, { kind: "component", type: i1$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "pipe", type: i3.JsonPipe, name: "json" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: CardsCreatorComponent, decorators: [{
             type: Component,
@@ -7750,7 +7795,7 @@ class ConversationRuleListComponent extends EntityBaseListComponent {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ConversationRuleListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ConversationRuleListComponent, isStandalone: true, selector: "app-conversationRule-list", usesInheritance: true, ngImport: i0, template: "@if (!onlyView()) {\n<p-button [icon]=\"viewType() === 'card' ? 'pi pi-table' : 'pi pi-list'\" label=\"Change View\" [link]=\"true\" (click)=\"toggleView()\" />\n}\n<div class=\"conversationRule-list-container\">\n  <dc-filter-bar [isAdmin]=\"userService.isAdmin()\" [options]=\"filterBarOptions\" (onNew)=\"onNew()\" (onFilterAction)=\"doAction($event)\"></dc-filter-bar>\n\n  @if (viewType() === 'card') {\n  <div class=\"conversationRule-list-content\">\n    @for (conversationRule of items(); track conversationRule.id) {\n    <div class=\"card-source\">\n      <div style=\"position: absolute; top: 4px; right: 4px; z-index: 1000\">\n        <p-speeddial\n          [model]=\"getCustomButtons(conversationRule)\"\n          [radius]=\"70\"\n          type=\"quarter-circle\"\n          direction=\"down-left\"\n          [buttonProps]=\"{ severity: 'primary', rounded: true, outlined: true }\" />\n      </div>\n      <p-card [header]=\"conversationRule.name\">\n        <p class=\"m-0\">{{ conversationRule.description | slice : 0 : 250 }}...</p>\n        <span>{{ conversationRule?.auditable?.updatedAt | date : 'dd/MM/yyyy HH:mm' }}</span>\n      </p-card>\n    </div>\n    } @if (items().length === 0) {\n    <p-card>\n      <p>No conversationRules found</p>\n    </p-card>\n    }\n  </div>\n  } @else if ( viewType() === 'table'){\n\n  <app-quick-table [tableData]=\"items()\"></app-quick-table>\n\n  }\n\n  <div class=\"paginator-container\">\n    <p-paginator\n      currentPageReportTemplate=\"{{ totalRecords }} conversations\"\n      [showCurrentPageReport]=\"true\"\n      (onPageChange)=\"onPageChange($event)\"\n      [first]=\"first\"\n      [rows]=\"rows\"\n      [totalRecords]=\"totalRecords\"\n      [rowsPerPageOptions]=\"[10, 20, 30]\">\n    </p-paginator>\n  </div>\n</div>\n", styles: [":host{display:block;height:100%}.conversationRule-list-container{display:flex;flex-direction:column;height:100%}.conversationRule-list-content{margin-top:10px;flex:1;overflow-y:auto;padding-bottom:10px}.card-source{margin-bottom:10px;position:relative}.paginator-container{margin-top:auto;padding-top:10px}\n"], dependencies: [{ kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DCFilterBarComponent, selector: "dc-filter-bar", inputs: ["items", "options", "customFilters", "customSortOptions", "isAdmin", "persistenceKey"], outputs: ["onFilterAction", "onNew"] }, { kind: "ngmodule", type: SpeedDialModule }, { kind: "component", type: i2$9.SpeedDial, selector: "p-speeddial, p-speedDial, p-speed-dial", inputs: ["id", "model", "visible", "style", "className", "direction", "transitionDelay", "type", "radius", "mask", "disabled", "hideOnClickOutside", "buttonStyle", "buttonClassName", "maskStyle", "maskClassName", "showIcon", "hideIcon", "rotateAnimation", "ariaLabel", "ariaLabelledBy", "tooltipOptions", "buttonProps"], outputs: ["onVisibleChange", "visibleChange", "onClick", "onShow", "onHide"] }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i1$5.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first", "appendTo"], outputs: ["onPageChange"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: QuickTableComponent, selector: "app-quick-table", inputs: ["columns", "tableData", "actions"], outputs: ["onAction"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: SlicePipe, name: "slice" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: ConversationRuleListComponent, isStandalone: true, selector: "app-conversationRule-list", usesInheritance: true, ngImport: i0, template: "@if (!onlyView()) {\n<p-button [icon]=\"viewType() === 'card' ? 'pi pi-table' : 'pi pi-list'\" label=\"Change View\" [link]=\"true\" (click)=\"toggleView()\" />\n}\n<div class=\"conversationRule-list-container\">\n  <dc-filter-bar [isAdmin]=\"userService.isAdmin()\" [options]=\"filterBarOptions\" (onNew)=\"onNew()\" (onFilterAction)=\"doAction($event)\"></dc-filter-bar>\n\n  @if (viewType() === 'card') {\n  <div class=\"conversationRule-list-content\">\n    @for (conversationRule of items(); track conversationRule.id) {\n    <div class=\"card-source\">\n      <div style=\"position: absolute; top: 4px; right: 4px; z-index: 1000\">\n        <p-speeddial\n          [model]=\"getCustomButtons(conversationRule)\"\n          [radius]=\"70\"\n          type=\"quarter-circle\"\n          direction=\"down-left\"\n          [buttonProps]=\"{ severity: 'primary', rounded: true, outlined: true }\" />\n      </div>\n      <p-card [header]=\"conversationRule.name\">\n        <p class=\"m-0\">{{ conversationRule.description | slice : 0 : 250 }}...</p>\n        <span>{{ conversationRule?.auditable?.updatedAt | date : 'dd/MM/yyyy HH:mm' }}</span>\n      </p-card>\n    </div>\n    } @if (items().length === 0) {\n    <p-card>\n      <p>No conversationRules found</p>\n    </p-card>\n    }\n  </div>\n  } @else if ( viewType() === 'table'){\n\n  <app-quick-table [tableData]=\"items()\"></app-quick-table>\n\n  }\n\n  <div class=\"paginator-container\">\n    <p-paginator\n      currentPageReportTemplate=\"{{ totalRecords }} conversations\"\n      [showCurrentPageReport]=\"true\"\n      (onPageChange)=\"onPageChange($event)\"\n      [first]=\"first\"\n      [rows]=\"rows\"\n      [totalRecords]=\"totalRecords\"\n      [rowsPerPageOptions]=\"[10, 20, 30]\">\n    </p-paginator>\n  </div>\n</div>\n", styles: [":host{display:block;height:100%}.conversationRule-list-container{display:flex;flex-direction:column;height:100%}.conversationRule-list-content{margin-top:10px;flex:1;overflow-y:auto;padding-bottom:10px}.card-source{margin-bottom:10px;position:relative}.paginator-container{margin-top:auto;padding-top:10px}\n"], dependencies: [{ kind: "ngmodule", type: CardModule }, { kind: "component", type: i2$7.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: DCFilterBarComponent, selector: "dc-filter-bar", inputs: ["items", "options", "customFilters", "customSortOptions", "isAdmin", "persistenceKey"], outputs: ["onFilterAction", "onNew"] }, { kind: "ngmodule", type: SpeedDialModule }, { kind: "component", type: i2$8.SpeedDial, selector: "p-speeddial, p-speedDial, p-speed-dial", inputs: ["id", "model", "visible", "style", "className", "direction", "transitionDelay", "type", "radius", "mask", "disabled", "hideOnClickOutside", "buttonStyle", "buttonClassName", "maskStyle", "maskClassName", "showIcon", "hideIcon", "rotateAnimation", "ariaLabel", "ariaLabelledBy", "tooltipOptions", "buttonProps"], outputs: ["onVisibleChange", "visibleChange", "onClick", "onShow", "onHide"] }, { kind: "ngmodule", type: PaginatorModule }, { kind: "component", type: i1$5.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "styleClass", "alwaysShow", "dropdownAppendTo", "templateLeft", "templateRight", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "jumpToPageItemTemplate", "showPageLinks", "locale", "dropdownItemTemplate", "first", "appendTo"], outputs: ["onPageChange"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: QuickTableComponent, selector: "app-quick-table", inputs: ["columns", "tableData", "actions"], outputs: ["onAction"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: SlicePipe, name: "slice" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ConversationRuleListComponent, decorators: [{
             type: Component,
@@ -7826,7 +7871,7 @@ class ConversationRuleFormComponent extends EntityBaseFormComponent {
         alert('Relation selected');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ConversationRuleFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", 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    <form [formGroup]=\"form\">\n      <div style=\"display: flex; gap: 10px\">\n        <div style=\"width: 100%\">\n          <div class=\"form-field\">\n            <label for=\"name\" class=\"block\">Name</label>\n            <input pInputText id=\"name\" type=\"text\" formControlName=\"name\" placeholder=\"Enter source name\" />\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"description\" class=\"block\">Description</label>\n            <textarea id=\"description\" pTextarea formControlName=\"description\" rows=\"1\" class=\"w-full\" placeholder=\"Enter source content\"> </textarea>\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"rule\" class=\"block\">Rule</label>\n            <textarea id=\"rule\" pTextarea formControlName=\"rule\" rows=\"3\" class=\"w-full\" placeholder=\"Enter source content\"> </textarea>\n          </div>\n        </div>\n      </div>\n    </form>\n\n    <div style=\"display: flex; justify-content: flex-end\">\n      <p-button (click)=\"save()\" label=\"Save Rule\" [disabled]=\"!form.valid\" 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: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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],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: CardModule }, { kind: "component", type: i2$8.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$4.InputText, selector: "[pInputText]", inputs: ["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: ["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", "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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.6", 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    <form [formGroup]=\"form\">\n      <div style=\"display: flex; gap: 10px\">\n        <div style=\"width: 100%\">\n          <div class=\"form-field\">\n            <label for=\"name\" class=\"block\">Name</label>\n            <input pInputText id=\"name\" type=\"text\" formControlName=\"name\" placeholder=\"Enter source name\" />\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"description\" class=\"block\">Description</label>\n            <textarea id=\"description\" pTextarea formControlName=\"description\" rows=\"1\" class=\"w-full\" placeholder=\"Enter source content\"> </textarea>\n          </div>\n\n          <div class=\"form-field\">\n            <label for=\"rule\" class=\"block\">Rule</label>\n            <textarea id=\"rule\" pTextarea formControlName=\"rule\" rows=\"3\" class=\"w-full\" placeholder=\"Enter source content\"> </textarea>\n          </div>\n        </div>\n      </div>\n    </form>\n\n    <div style=\"display: flex; justify-content: flex-end\">\n      <p-button (click)=\"save()\" label=\"Save Rule\" [disabled]=\"!form.valid\" 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: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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],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: CardModule }, { kind: "component", type: i2$7.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }, { kind: "ngmodule", type: TextareaModule }, { kind: "directive", type: i3$1.Textarea, selector: "[pTextarea], [pInputTextarea]", inputs: ["autoResize", "pSize", "variant", "fluid", "invalid"], outputs: ["onResize"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$5.InputText, selector: "[pInputText]", inputs: ["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: ["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", "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" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: ConversationRuleFormComponent, decorators: [{
             type: Component,