npm - @memberjunction/ng-core-entity-forms - Versions diffs - 5.43.0 → 5.44.0 - Mend

@memberjunction/ng-core-entity-forms 5.43.0 → 5.44.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (259) hide show

package/dist/lib/custom/AIAgents/new-agent-dialog.component.js CHANGED Viewed

@@ -10,43 +10,41 @@ import * as i2 from "@memberjunction/ng-shared";
 import * as i3 from "@memberjunction/ng-ui-components";
 import * as i4 from "@angular/common";
 function NewAgentDialogComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 2);
-    i0.ɵɵelement(1, "i", 28);
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3, "Creating sub-agent for: ");
-    i0.ɵɵelementStart(4, "strong");
-    i0.ɵɵtext(5);
-    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(0, "mj-alert", 2);
+    i0.ɵɵtext(1, " Creating sub-agent for: ");
+    i0.ɵɵelementStart(2, "strong");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(5);
+    i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(ctx_r0.config.parentAgentName || "Parent Agent");
 } }
 function NewAgentDialogComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 3)(1, "div", 29);
+    i0.ɵɵelementStart(0, "div", 3)(1, "div", 28);
     i0.ɵɵtext(2, "Loading...");
     i0.ɵɵelementEnd()();
 } }
 function NewAgentDialogComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 8);
-    i0.ɵɵelement(1, "i", 30);
+    i0.ɵɵelement(1, "i", 29);
     i0.ɵɵtext(2, " Agent name is required ");
     i0.ɵɵelementEnd();
 } }
 function NewAgentDialogComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 8);
-    i0.ɵɵelement(1, "i", 30);
+    i0.ɵɵelement(1, "i", 29);
     i0.ɵɵtext(2, " Please select an AI model ");
     i0.ɵɵelementEnd();
 } }
 function NewAgentDialogComponent_Conditional_59_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 31);
+    i0.ɵɵelement(0, "span", 30);
     i0.ɵɵelementStart(1, "span");
     i0.ɵɵtext(2, "Creating...");
     i0.ɵɵelementEnd();
 } }
 function NewAgentDialogComponent_Conditional_60_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 32);
+    i0.ɵɵelement(0, "i", 31);
     i0.ɵɵelementStart(1, "span");
     i0.ɵɵtext(2, "Create Agent");
     i0.ɵɵelementEnd();
@@ -160,10 +158,10 @@ export class NewAgentDialogComponent extends BaseAngularComponent {
         this.dialogRef?.Close({ action: 'cancelled' });
     }
     static { this.ɵfac = function NewAgentDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewAgentDialogComponent)(i0.ɵɵdirectiveInject(i1.FormBuilder), i0.ɵɵdirectiveInject(i2.NavigationService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewAgentDialogComponent, selectors: [["mj-new-agent-dialog"]], inputs: { config: "config" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 61, vars: 17, consts: [[1, "new-agent-dialog"], [3, "ngSubmit", "formGroup"], [1, "parent-info"], [1, "loading-overlay"], [1, "form-fields"], [1, "form-group"], [1, "required"], ["formControlName", "name", "placeholder", "Enter a descriptive name for your agent", 1, "mj-input", "full-width"], [1, "error-message"], ["formControlName", "description", "placeholder", "Describe what this agent does...", "rows", "3", 1, "mj-textarea", "full-width"], ["formControlName", "modelId", "TextField", "Name", "ValueField", "ID", "Placeholder", "Select an AI model...", 1, "full-width", 3, "Data"], ["formControlName", "systemPrompt", "placeholder", "Define the agent's behavior and personality...", "rows", "4", 1, "mj-textarea", "full-width"], [1, "field-hint"], [1, "fa-solid", "fa-info-circle"], [1, "advanced-settings"], [1, "section-header"], [1, "fa-solid", "fa-cog"], [1, "advanced-grid"], [1, "setting-group"], [1, "slider-container"], ["type", "range", "formControlName", "temperature", "min", "0", "max", "2", "step", "0.1", 1, "mj-input", "temperature-slider"], [1, "slider-value"], ["formControlName", "maxTokens", "Format", "n0", 1, "full-width", 3, "Min", "Max", "Step"], [1, "setting-group", "checkbox-group"], ["type", "checkbox", "formControlName", "enableStreaming", 1, "mj-checkbox"], [1, "dialog-actions"], ["type", "button", "mjButton", "", 3, "click", "disabled"], ["type", "submit", "mjButton", "", "variant", "primary", 3, "disabled"], [1, "fa-solid", "fa-robot"], [1, "spinner"], [1, "fa-solid", "fa-exclamation-circle"], [1, "spinner-small"], [1, "fa-solid", "fa-plus-circle"]], template: function NewAgentDialogComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewAgentDialogComponent, selectors: [["mj-new-agent-dialog"]], inputs: { config: "config" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 61, vars: 17, consts: [[1, "new-agent-dialog"], [3, "ngSubmit", "formGroup"], ["Variant", "info", "Icon", "fa-solid fa-robot", 1, "new-agent-alert-pos"], [1, "loading-overlay"], [1, "form-fields"], [1, "form-group"], [1, "required"], ["formControlName", "name", "placeholder", "Enter a descriptive name for your agent", 1, "mj-input", "full-width"], [1, "error-message"], ["formControlName", "description", "placeholder", "Describe what this agent does...", "rows", "3", 1, "mj-textarea", "full-width"], ["formControlName", "modelId", "TextField", "Name", "ValueField", "ID", "Placeholder", "Select an AI model...", 1, "full-width", 3, "Data"], ["formControlName", "systemPrompt", "placeholder", "Define the agent's behavior and personality...", "rows", "4", 1, "mj-textarea", "full-width"], [1, "field-hint"], [1, "fa-solid", "fa-info-circle"], [1, "advanced-settings"], [1, "section-header"], [1, "fa-solid", "fa-cog"], [1, "advanced-grid"], [1, "setting-group"], [1, "slider-container"], ["type", "range", "formControlName", "temperature", "min", "0", "max", "2", "step", "0.1", 1, "mj-input", "temperature-slider"], [1, "slider-value"], ["formControlName", "maxTokens", "Format", "n0", 1, "full-width", 3, "Min", "Max", "Step"], [1, "setting-group", "checkbox-group"], ["type", "checkbox", "formControlName", "enableStreaming", 1, "mj-checkbox"], [1, "dialog-actions"], ["type", "button", "mjButton", "", 3, "click", "disabled"], ["type", "submit", "mjButton", "", "variant", "primary", 3, "disabled"], [1, "spinner"], [1, "fa-solid", "fa-exclamation-circle"], [1, "spinner-small"], [1, "fa-solid", "fa-plus-circle"]], template: function NewAgentDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "form", 1);
             i0.ɵɵlistener("ngSubmit", function NewAgentDialogComponent_Template_form_ngSubmit_1_listener() { return ctx.onSubmit(); });
-            i0.ɵɵconditionalCreate(2, NewAgentDialogComponent_Conditional_2_Template, 6, 1, "div", 2);
+            i0.ɵɵconditionalCreate(2, NewAgentDialogComponent_Conditional_2_Template, 4, 1, "mj-alert", 2);
             i0.ɵɵconditionalCreate(3, NewAgentDialogComponent_Conditional_3_Template, 3, 0, "div", 3);
             i0.ɵɵpipe(4, "async");
             i0.ɵɵelementStart(5, "div", 4)(6, "div", 5)(7, "label", 6);
@@ -255,11 +253,11 @@ export class NewAgentDialogComponent extends BaseAngularComponent {
             i0.ɵɵproperty("disabled", ctx.form.invalid || ctx.isSubmitting);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.isSubmitting ? 59 : 60);
-        } }, dependencies: [i1.ɵNgNoValidate, i1.DefaultValueAccessor, i1.RangeValueAccessor, i1.CheckboxControlValueAccessor, i1.NgControlStatus, i1.NgControlStatusGroup, i1.FormGroupDirective, i1.FormControlName, i3.MJButtonDirective, i3.MJDropdownComponent, i3.MJNumericInputComponent, i4.AsyncPipe], styles: [".new-agent-dialog[_ngcontent-%COMP%] {\n  padding: 1.5rem;\n  min-width: 500px;\n  position: relative;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .parent-info[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n  border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 25%, var(--mj-bg-surface));\n  border-radius: 8px;\n  padding: 0.75rem 1rem;\n  margin-bottom: 1.5rem;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .parent-info[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  font-size: 1.1rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .parent-info[_ngcontent-%COMP%]   strong[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .loading-overlay[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-bg-surface) 90%, transparent);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  border-radius: 8px;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%] {\n  margin-bottom: 1.5rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   label.required[_ngcontent-%COMP%]::after {\n  content: ' *';\n  color: var(--mj-status-error);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .full-width[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .error-message[_ngcontent-%COMP%] {\n  color: var(--mj-status-error);\n  font-size: 0.875rem;\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .error-message[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .field-hint[_ngcontent-%COMP%] {\n  font-size: 0.875rem;\n  color: var(--mj-text-muted);\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .field-hint[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  padding: 0.5rem 0;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-icon[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border-radius: 6px;\n  background: var(--mj-brand-primary);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 1rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-details[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-details[_ngcontent-%COMP%]   .model-name[_ngcontent-%COMP%] {\n  font-weight: 500;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-details[_ngcontent-%COMP%]   .model-vendor[_ngcontent-%COMP%] {\n  font-size: 0.75rem;\n  color: var(--mj-text-muted);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-textbox[_ngcontent-%COMP%], \n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-textarea[_ngcontent-%COMP%], \n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-dropdown[_ngcontent-%COMP%], \n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-numerictextbox[_ngcontent-%COMP%] {\n  border-radius: 6px;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%] {\n  margin-top: 1.5rem;\n  border-radius: 8px;\n  overflow: hidden;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .k-expander-header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  padding: 1rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .k-expander-header[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0.5rem;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%] {\n  padding: 1rem;\n  display: grid;\n  gap: 1.5rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   .slider-container[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   .slider-container[_ngcontent-%COMP%]   .temperature-slider[_ngcontent-%COMP%] {\n  flex: 1;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   .slider-container[_ngcontent-%COMP%]   .slider-value[_ngcontent-%COMP%] {\n  min-width: 3rem;\n  text-align: right;\n  font-weight: 600;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group.checkbox-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  cursor: pointer;\n  font-weight: normal;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group.checkbox-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .dialog-actions[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .dialog-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  min-width: 120px;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .dialog-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0.5rem;\n}"] }); }
+        } }, dependencies: [i1.ɵNgNoValidate, i1.DefaultValueAccessor, i1.RangeValueAccessor, i1.CheckboxControlValueAccessor, i1.NgControlStatus, i1.NgControlStatusGroup, i1.FormGroupDirective, i1.FormControlName, i3.MJAlertComponent, i3.MJButtonDirective, i3.MJDropdownComponent, i3.MJNumericInputComponent, i4.AsyncPipe], styles: [".new-agent-dialog[_ngcontent-%COMP%] {\n  padding: 1.5rem;\n  min-width: 500px;\n  position: relative;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .new-agent-alert-pos[_ngcontent-%COMP%] {\n  margin-bottom: 1.5rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .loading-overlay[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-bg-surface) 90%, transparent);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  border-radius: 8px;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%] {\n  margin-bottom: 1.5rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   label.required[_ngcontent-%COMP%]::after {\n  content: ' *';\n  color: var(--mj-status-error);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .full-width[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .error-message[_ngcontent-%COMP%] {\n  color: var(--mj-status-error);\n  font-size: 0.875rem;\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .error-message[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .field-hint[_ngcontent-%COMP%] {\n  font-size: 0.875rem;\n  color: var(--mj-text-muted);\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .form-group[_ngcontent-%COMP%]   .field-hint[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  padding: 0.5rem 0;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-icon[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  border-radius: 6px;\n  background: var(--mj-brand-primary);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 1rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-details[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-details[_ngcontent-%COMP%]   .model-name[_ngcontent-%COMP%] {\n  font-weight: 500;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .model-item[_ngcontent-%COMP%]   .model-details[_ngcontent-%COMP%]   .model-vendor[_ngcontent-%COMP%] {\n  font-size: 0.75rem;\n  color: var(--mj-text-muted);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-textbox[_ngcontent-%COMP%], \n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-textarea[_ngcontent-%COMP%], \n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-dropdown[_ngcontent-%COMP%], \n.new-agent-dialog[_ngcontent-%COMP%]   .form-fields[_ngcontent-%COMP%]   .k-numerictextbox[_ngcontent-%COMP%] {\n  border-radius: 6px;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%] {\n  margin-top: 1.5rem;\n  border-radius: 8px;\n  overflow: hidden;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .k-expander-header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  padding: 1rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .k-expander-header[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0.5rem;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%] {\n  padding: 1rem;\n  display: grid;\n  gap: 1.5rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   .slider-container[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   .slider-container[_ngcontent-%COMP%]   .temperature-slider[_ngcontent-%COMP%] {\n  flex: 1;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group[_ngcontent-%COMP%]   .slider-container[_ngcontent-%COMP%]   .slider-value[_ngcontent-%COMP%] {\n  min-width: 3rem;\n  text-align: right;\n  font-weight: 600;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group.checkbox-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  cursor: pointer;\n  font-weight: normal;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .advanced-settings[_ngcontent-%COMP%]   .advanced-grid[_ngcontent-%COMP%]   .setting-group.checkbox-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n  cursor: pointer;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .dialog-actions[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .dialog-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  min-width: 120px;\n}\n\n.new-agent-dialog[_ngcontent-%COMP%]   .dialog-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0.5rem;\n}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewAgentDialogComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-new-agent-dialog', template: "<div class=\"new-agent-dialog\">\n  <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n    <!-- Parent Agent Info (if creating sub-agent) -->\n    @if (config.parentAgentId) {\n      <div class=\"parent-info\">\n        <i class=\"fa-solid fa-robot\"></i>\n        <span>Creating sub-agent for: <strong>{{ config.parentAgentName || 'Parent Agent' }}</strong></span>\n      </div>\n    }\n    \n    <!-- Loading State -->\n    @if (isLoading$ | async) {\n      <div class=\"loading-overlay\">\n        <div class=\"spinner\">Loading...</div>\n      </div>\n    }\n    \n    <!-- Form Fields -->\n    <div class=\"form-fields\">\n      <!-- Agent Name -->\n      <div class=\"form-group\">\n        <label class=\"required\">Agent Name</label>\n        <input\n          class=\"mj-input full-width\"\n          formControlName=\"name\"\n          placeholder=\"Enter a descriptive name for your agent\">\n        @if (form.get('name')?.invalid && form.get('name')?.touched) {\n          <div class=\"error-message\">\n            <i class=\"fa-solid fa-exclamation-circle\"></i>\n            Agent name is required\n          </div>\n        }\n      </div>\n      \n      <!-- Description -->\n      <div class=\"form-group\">\n        <label>Description</label>\n        <textarea\n          class=\"mj-textarea full-width\"\n          formControlName=\"description\"\n          placeholder=\"Describe what this agent does...\"\n          rows=\"3\"></textarea>\n      </div>\n      \n      <!-- AI Model Selection -->\n      <div class=\"form-group\">\n        <label class=\"required\">AI Model</label>\n        <mj-dropdown\n          formControlName=\"modelId\"\n          [Data]=\"models$ | async\"\n          TextField=\"Name\"\n          ValueField=\"ID\"\n          Placeholder=\"Select an AI model...\"\n          class=\"full-width\">\n        </mj-dropdown>\n        @if (form.get('modelId')?.invalid && form.get('modelId')?.touched) {\n          <div class=\"error-message\">\n            <i class=\"fa-solid fa-exclamation-circle\"></i>\n            Please select an AI model\n          </div>\n        }\n      </div>\n      \n      <!-- System Prompt -->\n      <div class=\"form-group\">\n        <label>System Prompt</label>\n        <textarea\n          class=\"mj-textarea full-width\"\n          formControlName=\"systemPrompt\"\n          placeholder=\"Define the agent's behavior and personality...\"\n          rows=\"4\"></textarea>\n        <div class=\"field-hint\">\n          <i class=\"fa-solid fa-info-circle\"></i>\n          This sets the agent's context and behavior\n        </div>\n      </div>\n      \n      <!-- Advanced Settings -->\n      <div class=\"advanced-settings\">\n        <div class=\"section-header\">\n          <i class=\"fa-solid fa-cog\"></i>\n          Advanced Settings\n        </div>\n        \n        <div class=\"advanced-grid\">\n          <!-- Temperature -->\n          <div class=\"setting-group\">\n            <label>Temperature</label>\n            <div class=\"slider-container\">\n              <input\n                type=\"range\"\n                class=\"mj-input temperature-slider\"\n                formControlName=\"temperature\"\n                min=\"0\"\n                max=\"2\"\n                step=\"0.1\">\n              <span class=\"slider-value\">{{ form.get('temperature')?.value }}</span>\n            </div>\n            <div class=\"field-hint\">Higher values make output more creative</div>\n          </div>\n          \n          <!-- Max Tokens -->\n          <div class=\"setting-group\">\n            <label>Max Tokens</label>\n            <mj-numeric-input\n              formControlName=\"maxTokens\"\n              [Min]=\"1\"\n              [Max]=\"8000\"\n              [Step]=\"100\"\n              Format=\"n0\"\n              class=\"full-width\">\n            </mj-numeric-input>\n            <div class=\"field-hint\">Maximum response length</div>\n          </div>\n          \n          <!-- Enable Streaming -->\n          <div class=\"setting-group checkbox-group\">\n            <label>\n              <input type=\"checkbox\" formControlName=\"enableStreaming\" class=\"mj-checkbox\" />\n              <span>Enable Response Streaming</span>\n            </label>\n            <div class=\"field-hint\">Stream responses in real-time</div>\n          </div>\n        </div>\n      </div>\n    </div>\n    \n    <!-- Dialog Actions -->\n    <div class=\"dialog-actions\">\n      <button\n        type=\"button\"\n        mjButton\n        (click)=\"onCancel()\"\n        [disabled]=\"isSubmitting\">\n        Cancel\n      </button>\n      <button\n        type=\"submit\"\n        mjButton\n        variant=\"primary\"\n        [disabled]=\"form.invalid || isSubmitting\">\n        @if (isSubmitting) {\n          <span class=\"spinner-small\"></span>\n          <span>Creating...</span>\n        } @else {\n          <i class=\"fa-solid fa-plus-circle\"></i>\n          <span>Create Agent</span>\n        }\n      </button>\n    </div>\n  </form>\n</div>", styles: [".new-agent-dialog {\n  padding: 1.5rem;\n  min-width: 500px;\n  position: relative;\n}\n\n.new-agent-dialog .parent-info {\n  background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n  border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 25%, var(--mj-bg-surface));\n  border-radius: 8px;\n  padding: 0.75rem 1rem;\n  margin-bottom: 1.5rem;\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n\n.new-agent-dialog .parent-info i {\n  color: var(--mj-brand-primary);\n  font-size: 1.1rem;\n}\n\n.new-agent-dialog .parent-info strong {\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog .loading-overlay {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-bg-surface) 90%, transparent);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  border-radius: 8px;\n}\n\n.new-agent-dialog .form-fields .form-group {\n  margin-bottom: 1.5rem;\n}\n\n.new-agent-dialog .form-fields .form-group label {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog .form-fields .form-group label.required::after {\n  content: ' *';\n  color: var(--mj-status-error);\n}\n\n.new-agent-dialog .form-fields .form-group .full-width {\n  width: 100%;\n}\n\n.new-agent-dialog .form-fields .form-group .error-message {\n  color: var(--mj-status-error);\n  font-size: 0.875rem;\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog .form-fields .form-group .error-message i {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog .form-fields .form-group .field-hint {\n  font-size: 0.875rem;\n  color: var(--mj-text-muted);\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog .form-fields .form-group .field-hint i {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog .form-fields .model-item {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  padding: 0.5rem 0;\n}\n\n.new-agent-dialog .form-fields .model-item .model-icon {\n  width: 36px;\n  height: 36px;\n  border-radius: 6px;\n  background: var(--mj-brand-primary);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n}\n\n.new-agent-dialog .form-fields .model-item .model-icon i {\n  font-size: 1rem;\n}\n\n.new-agent-dialog .form-fields .model-item .model-details {\n  display: flex;\n  flex-direction: column;\n}\n\n.new-agent-dialog .form-fields .model-item .model-details .model-name {\n  font-weight: 500;\n}\n\n.new-agent-dialog .form-fields .model-item .model-details .model-vendor {\n  font-size: 0.75rem;\n  color: var(--mj-text-muted);\n}\n\n.new-agent-dialog .form-fields .k-textbox,\n.new-agent-dialog .form-fields .k-textarea,\n.new-agent-dialog .form-fields .k-dropdown,\n.new-agent-dialog .form-fields .k-numerictextbox {\n  border-radius: 6px;\n}\n\n.new-agent-dialog .advanced-settings {\n  margin-top: 1.5rem;\n  border-radius: 8px;\n  overflow: hidden;\n}\n\n.new-agent-dialog .advanced-settings .k-expander-header {\n  background: var(--mj-bg-surface-card);\n  padding: 1rem;\n}\n\n.new-agent-dialog .advanced-settings .k-expander-header i {\n  margin-right: 0.5rem;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid {\n  padding: 1rem;\n  display: grid;\n  gap: 1.5rem;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group label {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group .slider-container {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group .slider-container .temperature-slider {\n  flex: 1;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group .slider-container .slider-value {\n  min-width: 3rem;\n  text-align: right;\n  font-weight: 600;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group.checkbox-group label {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  cursor: pointer;\n  font-weight: normal;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group.checkbox-group label input[type=\"checkbox\"] {\n  cursor: pointer;\n}\n\n.new-agent-dialog .dialog-actions {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.new-agent-dialog .dialog-actions button {\n  min-width: 120px;\n}\n\n.new-agent-dialog .dialog-actions button i {\n  margin-right: 0.5rem;\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-new-agent-dialog', template: "<div class=\"new-agent-dialog\">\n  <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n    <!-- Parent Agent Info (if creating sub-agent) -->\n    @if (config.parentAgentId) {\n      <mj-alert Variant=\"info\" Icon=\"fa-solid fa-robot\" class=\"new-agent-alert-pos\">\n        Creating sub-agent for: <strong>{{ config.parentAgentName || 'Parent Agent' }}</strong>\n      </mj-alert>\n    }\n    \n    <!-- Loading State -->\n    @if (isLoading$ | async) {\n      <div class=\"loading-overlay\">\n        <div class=\"spinner\">Loading...</div>\n      </div>\n    }\n    \n    <!-- Form Fields -->\n    <div class=\"form-fields\">\n      <!-- Agent Name -->\n      <div class=\"form-group\">\n        <label class=\"required\">Agent Name</label>\n        <input\n          class=\"mj-input full-width\"\n          formControlName=\"name\"\n          placeholder=\"Enter a descriptive name for your agent\">\n        @if (form.get('name')?.invalid && form.get('name')?.touched) {\n          <div class=\"error-message\">\n            <i class=\"fa-solid fa-exclamation-circle\"></i>\n            Agent name is required\n          </div>\n        }\n      </div>\n      \n      <!-- Description -->\n      <div class=\"form-group\">\n        <label>Description</label>\n        <textarea\n          class=\"mj-textarea full-width\"\n          formControlName=\"description\"\n          placeholder=\"Describe what this agent does...\"\n          rows=\"3\"></textarea>\n      </div>\n      \n      <!-- AI Model Selection -->\n      <div class=\"form-group\">\n        <label class=\"required\">AI Model</label>\n        <mj-dropdown\n          formControlName=\"modelId\"\n          [Data]=\"models$ | async\"\n          TextField=\"Name\"\n          ValueField=\"ID\"\n          Placeholder=\"Select an AI model...\"\n          class=\"full-width\">\n        </mj-dropdown>\n        @if (form.get('modelId')?.invalid && form.get('modelId')?.touched) {\n          <div class=\"error-message\">\n            <i class=\"fa-solid fa-exclamation-circle\"></i>\n            Please select an AI model\n          </div>\n        }\n      </div>\n      \n      <!-- System Prompt -->\n      <div class=\"form-group\">\n        <label>System Prompt</label>\n        <textarea\n          class=\"mj-textarea full-width\"\n          formControlName=\"systemPrompt\"\n          placeholder=\"Define the agent's behavior and personality...\"\n          rows=\"4\"></textarea>\n        <div class=\"field-hint\">\n          <i class=\"fa-solid fa-info-circle\"></i>\n          This sets the agent's context and behavior\n        </div>\n      </div>\n      \n      <!-- Advanced Settings -->\n      <div class=\"advanced-settings\">\n        <div class=\"section-header\">\n          <i class=\"fa-solid fa-cog\"></i>\n          Advanced Settings\n        </div>\n        \n        <div class=\"advanced-grid\">\n          <!-- Temperature -->\n          <div class=\"setting-group\">\n            <label>Temperature</label>\n            <div class=\"slider-container\">\n              <input\n                type=\"range\"\n                class=\"mj-input temperature-slider\"\n                formControlName=\"temperature\"\n                min=\"0\"\n                max=\"2\"\n                step=\"0.1\">\n              <span class=\"slider-value\">{{ form.get('temperature')?.value }}</span>\n            </div>\n            <div class=\"field-hint\">Higher values make output more creative</div>\n          </div>\n          \n          <!-- Max Tokens -->\n          <div class=\"setting-group\">\n            <label>Max Tokens</label>\n            <mj-numeric-input\n              formControlName=\"maxTokens\"\n              [Min]=\"1\"\n              [Max]=\"8000\"\n              [Step]=\"100\"\n              Format=\"n0\"\n              class=\"full-width\">\n            </mj-numeric-input>\n            <div class=\"field-hint\">Maximum response length</div>\n          </div>\n          \n          <!-- Enable Streaming -->\n          <div class=\"setting-group checkbox-group\">\n            <label>\n              <input type=\"checkbox\" formControlName=\"enableStreaming\" class=\"mj-checkbox\" />\n              <span>Enable Response Streaming</span>\n            </label>\n            <div class=\"field-hint\">Stream responses in real-time</div>\n          </div>\n        </div>\n      </div>\n    </div>\n    \n    <!-- Dialog Actions -->\n    <div class=\"dialog-actions\">\n      <button\n        type=\"button\"\n        mjButton\n        (click)=\"onCancel()\"\n        [disabled]=\"isSubmitting\">\n        Cancel\n      </button>\n      <button\n        type=\"submit\"\n        mjButton\n        variant=\"primary\"\n        [disabled]=\"form.invalid || isSubmitting\">\n        @if (isSubmitting) {\n          <span class=\"spinner-small\"></span>\n          <span>Creating...</span>\n        } @else {\n          <i class=\"fa-solid fa-plus-circle\"></i>\n          <span>Create Agent</span>\n        }\n      </button>\n    </div>\n  </form>\n</div>", styles: [".new-agent-dialog {\n  padding: 1.5rem;\n  min-width: 500px;\n  position: relative;\n}\n\n.new-agent-dialog .new-agent-alert-pos {\n  margin-bottom: 1.5rem;\n}\n\n.new-agent-dialog .loading-overlay {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: color-mix(in srgb, var(--mj-bg-surface) 90%, transparent);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 100;\n  border-radius: 8px;\n}\n\n.new-agent-dialog .form-fields .form-group {\n  margin-bottom: 1.5rem;\n}\n\n.new-agent-dialog .form-fields .form-group label {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog .form-fields .form-group label.required::after {\n  content: ' *';\n  color: var(--mj-status-error);\n}\n\n.new-agent-dialog .form-fields .form-group .full-width {\n  width: 100%;\n}\n\n.new-agent-dialog .form-fields .form-group .error-message {\n  color: var(--mj-status-error);\n  font-size: 0.875rem;\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog .form-fields .form-group .error-message i {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog .form-fields .form-group .field-hint {\n  font-size: 0.875rem;\n  color: var(--mj-text-muted);\n  margin-top: 0.25rem;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.new-agent-dialog .form-fields .form-group .field-hint i {\n  font-size: 0.75rem;\n}\n\n.new-agent-dialog .form-fields .model-item {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  padding: 0.5rem 0;\n}\n\n.new-agent-dialog .form-fields .model-item .model-icon {\n  width: 36px;\n  height: 36px;\n  border-radius: 6px;\n  background: var(--mj-brand-primary);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n}\n\n.new-agent-dialog .form-fields .model-item .model-icon i {\n  font-size: 1rem;\n}\n\n.new-agent-dialog .form-fields .model-item .model-details {\n  display: flex;\n  flex-direction: column;\n}\n\n.new-agent-dialog .form-fields .model-item .model-details .model-name {\n  font-weight: 500;\n}\n\n.new-agent-dialog .form-fields .model-item .model-details .model-vendor {\n  font-size: 0.75rem;\n  color: var(--mj-text-muted);\n}\n\n.new-agent-dialog .form-fields .k-textbox,\n.new-agent-dialog .form-fields .k-textarea,\n.new-agent-dialog .form-fields .k-dropdown,\n.new-agent-dialog .form-fields .k-numerictextbox {\n  border-radius: 6px;\n}\n\n.new-agent-dialog .advanced-settings {\n  margin-top: 1.5rem;\n  border-radius: 8px;\n  overflow: hidden;\n}\n\n.new-agent-dialog .advanced-settings .k-expander-header {\n  background: var(--mj-bg-surface-card);\n  padding: 1rem;\n}\n\n.new-agent-dialog .advanced-settings .k-expander-header i {\n  margin-right: 0.5rem;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid {\n  padding: 1rem;\n  display: grid;\n  gap: 1.5rem;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group label {\n  display: block;\n  font-weight: 500;\n  margin-bottom: 0.5rem;\n  color: var(--mj-text-secondary);\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group .slider-container {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group .slider-container .temperature-slider {\n  flex: 1;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group .slider-container .slider-value {\n  min-width: 3rem;\n  text-align: right;\n  font-weight: 600;\n  color: var(--mj-brand-primary);\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group.checkbox-group label {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  cursor: pointer;\n  font-weight: normal;\n}\n\n.new-agent-dialog .advanced-settings .advanced-grid .setting-group.checkbox-group label input[type=\"checkbox\"] {\n  cursor: pointer;\n}\n\n.new-agent-dialog .dialog-actions {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.new-agent-dialog .dialog-actions button {\n  min-width: 120px;\n}\n\n.new-agent-dialog .dialog-actions button i {\n  margin-right: 0.5rem;\n}\n"] }]
     }], () => [{ type: i1.FormBuilder }, { type: i2.NavigationService }], { config: [{
             type: Input
         }] }); })();

package/dist/lib/custom/AIAgents/new-agent-dialog.component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"new-agent-dialog.component.js","sourceRoot":"","sources":["../../../../src/lib/custom/AIAgents/new-agent-dialog.component.ts","../../../../src/lib/custom/AIAgents/new-agent-dialog.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { FormBuilder, FormGroup, Validators } from '@angular/forms';\nimport { Metadata } from '@memberjunction/core';\nimport { MJAIAgentTypeEntity } from '@memberjunction/core-entities';\nimport { MJAIAgentEntityExtended, MJAIModelEntityExtended } from \"@memberjunction/ai-core-plus\";\nimport { NavigationService } from '@memberjunction/ng-shared';\nimport { MJNotificationService } from '@memberjunction/ng-notifications';\nimport { MJDialogRef } from '@memberjunction/ng-ui-components';\nimport { BehaviorSubject } from 'rxjs';\nimport { AIEngineBase } from '@memberjunction/ai-engine-base';\n\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nexport interface NewAgentConfig {\n parentAgentId?: string;\n parentAgentName?: string;\n redirectToForm?: boolean;\n}\n\n@Component({\n standalone: false,\n selector: 'mj-new-agent-dialog',\n templateUrl: './new-agent-dialog.component.html',\n styleUrls: ['./new-agent-dialog.component.css']\n})\nexport class NewAgentDialogComponent extends BaseAngularComponent implements OnInit {\n @Input() config: NewAgentConfig = {\n redirectToForm: true\n };\n \n form!: FormGroup;\n isLoading$ = new BehaviorSubject<boolean>(false);\n models$ = new BehaviorSubject<MJAIModelEntityExtended[]>([]);\n agentTypes$ = new BehaviorSubject<MJAIAgentTypeEntity[]>([]);\n isSubmitting = false;\n \n /** Set by NewAgentDialogService after creation */\n public dialogRef: MJDialogRef \| null = null;\n\n constructor(\n private fb: FormBuilder,\n private navigationService: NavigationService\n ) {\n super();}\n \n ngOnInit() {\n this.initializeForm();\n this.loadData();\n }\n \n private initializeForm() {\n this.form = this.fb.group({\n name: ['', [Validators.required, Validators.maxLength(255)]],\n description: [''],\n modelId: ['', Validators.required],\n agentType: ['standard', Validators.required],\n systemPrompt: ['You are a helpful AI assistant.'],\n enableStreaming: [true],\n temperature: [0.7, [Validators.min(0), Validators.max(2)]],\n maxTokens: [2000, [Validators.min(1), Validators.max(8000)]]\n });\n }\n \n private async loadData() {\n this.isLoading$.next(true);\n \n try {\n const engine = AIEngineBase.Instance;\n await engine.Config(false);\n const models = engine.Models;\n models.sort ((a, b) => { \n return a.Name.localeCompare(b.Name);\n });\n \n this.models$.next(models \|\| []);\n \n // Pre-select first model if available\n if (models && models.length > 0) {\n this.form.patchValue({ modelId: models[0].ID });\n }\n \n const agentTypes = engine.AgentTypes;\n this.agentTypes$.next(agentTypes as MJAIAgentTypeEntity[] \|\| []);\n } catch (error) {\n console.error('Error loading data:', error);\n console.error('Failed to load required data');\n } finally {\n this.isLoading$.next(false);\n }\n }\n \n async onSubmit() {\n if (this.form.invalid \|\| this.isSubmitting) {\n return;\n }\n \n this.isSubmitting = true;\n \n try {\n const md = this.ProviderToUse;\n const agent = await md.GetEntityObject<MJAIAgentEntityExtended>('MJ: AI Agents');\n \n if (!agent) {\n throw new Error('Failed to create agent entity');\n }\n \n // Set agent properties\n agent.Name = this.form.value.name;\n agent.Description = this.form.value.description;\n \n // Set parent agent if provided\n if (this.config.parentAgentId) {\n agent.ParentID = this.config.parentAgentId;\n }\n \n // Set execution mode\n agent.ExecutionMode = 'Sequential';\n agent.ExecutionOrder = 0;\n agent.ExposeAsAction = false;\n \n // Save the agent\n const saveResult = await agent.Save();\n \n if (saveResult) {\n MJNotificationService.Instance.CreateSimpleNotification('Agent created successfully!', 'success', 3000);\n\n // Close dialog with the new agent\n this.dialogRef?.Close({ agent, action: 'created' });\n\n // Redirect to form if configured\n if (this.config.redirectToForm && !this.config.parentAgentId) {\n // Only redirect for top-level agents - use NavigationService to open the record\n setTimeout(() => {\n this.navigationService.OpenEntityRecord('MJ: AI Agents', agent.PrimaryKey);\n }, 100);\n }\n } else {\n throw new Error('Failed to save agent');\n }\n } catch (error: unknown) {\n const errorMessage = error instanceof Error ? error.message : 'Unknown error';\n console.error('Error creating agent:', error);\n MJNotificationService.Instance.CreateSimpleNotification('Failed to create agent: ' + errorMessage, 'error', 5000);\n } finally {\n this.isSubmitting = false;\n }\n }\n\n onCancel() {\n this.dialogRef?.Close({ action: 'cancelled' });\n }\n}","<div class=\"new-agent-dialog\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n <!-- Parent Agent Info (if creating sub-agent) -->\n @if (config.parentAgentId) {\n <div class=\"parent-info\">\n <i class=\"fa-solid fa-robot\"></i>\n <span>Creating sub-agent for: <strong>{{ config.parentAgentName \|\| 'Parent Agent' }}</strong></span>\n </div>\n }\n \n <!-- Loading State -->\n @if (isLoading$ \| async) {\n <div class=\"loading-overlay\">\n <div class=\"spinner\">Loading...</div>\n </div>\n }\n \n <!-- Form Fields -->\n <div class=\"form-fields\">\n <!-- Agent Name -->\n <div class=\"form-group\">\n <label class=\"required\">Agent Name</label>\n <input\n class=\"mj-input full-width\"\n formControlName=\"name\"\n placeholder=\"Enter a descriptive name for your agent\">\n @if (form.get('name')?.invalid && form.get('name')?.touched) {\n <div class=\"error-message\">\n <i class=\"fa-solid fa-exclamation-circle\"></i>\n Agent name is required\n </div>\n }\n </div>\n \n <!-- Description -->\n <div class=\"form-group\">\n <label>Description</label>\n <textarea\n class=\"mj-textarea full-width\"\n formControlName=\"description\"\n placeholder=\"Describe what this agent does...\"\n rows=\"3\"></textarea>\n </div>\n \n <!-- AI Model Selection -->\n <div class=\"form-group\">\n <label class=\"required\">AI Model</label>\n <mj-dropdown\n formControlName=\"modelId\"\n [Data]=\"models$ \| async\"\n TextField=\"Name\"\n ValueField=\"ID\"\n Placeholder=\"Select an AI model...\"\n class=\"full-width\">\n </mj-dropdown>\n @if (form.get('modelId')?.invalid && form.get('modelId')?.touched) {\n <div class=\"error-message\">\n <i class=\"fa-solid fa-exclamation-circle\"></i>\n Please select an AI model\n </div>\n }\n </div>\n \n <!-- System Prompt -->\n <div class=\"form-group\">\n <label>System Prompt</label>\n <textarea\n class=\"mj-textarea full-width\"\n formControlName=\"systemPrompt\"\n placeholder=\"Define the agent's behavior and personality...\"\n rows=\"4\"></textarea>\n <div class=\"field-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n This sets the agent's context and behavior\n </div>\n </div>\n \n <!-- Advanced Settings -->\n <div class=\"advanced-settings\">\n <div class=\"section-header\">\n <i class=\"fa-solid fa-cog\"></i>\n Advanced Settings\n </div>\n \n <div class=\"advanced-grid\">\n <!-- Temperature -->\n <div class=\"setting-group\">\n <label>Temperature</label>\n <div class=\"slider-container\">\n <input\n type=\"range\"\n class=\"mj-input temperature-slider\"\n formControlName=\"temperature\"\n min=\"0\"\n max=\"2\"\n step=\"0.1\">\n <span class=\"slider-value\">{{ form.get('temperature')?.value }}</span>\n </div>\n <div class=\"field-hint\">Higher values make output more creative</div>\n </div>\n \n <!-- Max Tokens -->\n <div class=\"setting-group\">\n <label>Max Tokens</label>\n <mj-numeric-input\n formControlName=\"maxTokens\"\n [Min]=\"1\"\n [Max]=\"8000\"\n [Step]=\"100\"\n Format=\"n0\"\n class=\"full-width\">\n </mj-numeric-input>\n <div class=\"field-hint\">Maximum response length</div>\n </div>\n \n <!-- Enable Streaming -->\n <div class=\"setting-group checkbox-group\">\n <label>\n <input type=\"checkbox\" formControlName=\"enableStreaming\" class=\"mj-checkbox\" />\n <span>Enable Response Streaming</span>\n </label>\n <div class=\"field-hint\">Stream responses in real-time</div>\n </div>\n </div>\n </div>\n </div>\n \n <!-- Dialog Actions -->\n <div class=\"dialog-actions\">\n <button\n type=\"button\"\n mjButton\n (click)=\"onCancel()\"\n [disabled]=\"isSubmitting\">\n Cancel\n </button>\n <button\n type=\"submit\"\n mjButton\n variant=\"primary\"\n [disabled]=\"form.invalid \|\| isSubmitting\">\n @if (isSubmitting) {\n <span class=\"spinner-small\"></span>\n <span>Creating...</span>\n } @else {\n <i class=\"fa-solid fa-plus-circle\"></i>\n <span>Create Agent</span>\n }\n </button>\n </div>\n </form>\n</div>"]}
1	+ {"version":3,"file":"new-agent-dialog.component.js","sourceRoot":"","sources":["../../../../src/lib/custom/AIAgents/new-agent-dialog.component.ts","../../../../src/lib/custom/AIAgents/new-agent-dialog.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { FormBuilder, FormGroup, Validators } from '@angular/forms';\nimport { Metadata } from '@memberjunction/core';\nimport { MJAIAgentTypeEntity } from '@memberjunction/core-entities';\nimport { MJAIAgentEntityExtended, MJAIModelEntityExtended } from \"@memberjunction/ai-core-plus\";\nimport { NavigationService } from '@memberjunction/ng-shared';\nimport { MJNotificationService } from '@memberjunction/ng-notifications';\nimport { MJDialogRef } from '@memberjunction/ng-ui-components';\nimport { BehaviorSubject } from 'rxjs';\nimport { AIEngineBase } from '@memberjunction/ai-engine-base';\n\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nexport interface NewAgentConfig {\n parentAgentId?: string;\n parentAgentName?: string;\n redirectToForm?: boolean;\n}\n\n@Component({\n standalone: false,\n selector: 'mj-new-agent-dialog',\n templateUrl: './new-agent-dialog.component.html',\n styleUrls: ['./new-agent-dialog.component.css']\n})\nexport class NewAgentDialogComponent extends BaseAngularComponent implements OnInit {\n @Input() config: NewAgentConfig = {\n redirectToForm: true\n };\n \n form!: FormGroup;\n isLoading$ = new BehaviorSubject<boolean>(false);\n models$ = new BehaviorSubject<MJAIModelEntityExtended[]>([]);\n agentTypes$ = new BehaviorSubject<MJAIAgentTypeEntity[]>([]);\n isSubmitting = false;\n \n /** Set by NewAgentDialogService after creation */\n public dialogRef: MJDialogRef \| null = null;\n\n constructor(\n private fb: FormBuilder,\n private navigationService: NavigationService\n ) {\n super();}\n \n ngOnInit() {\n this.initializeForm();\n this.loadData();\n }\n \n private initializeForm() {\n this.form = this.fb.group({\n name: ['', [Validators.required, Validators.maxLength(255)]],\n description: [''],\n modelId: ['', Validators.required],\n agentType: ['standard', Validators.required],\n systemPrompt: ['You are a helpful AI assistant.'],\n enableStreaming: [true],\n temperature: [0.7, [Validators.min(0), Validators.max(2)]],\n maxTokens: [2000, [Validators.min(1), Validators.max(8000)]]\n });\n }\n \n private async loadData() {\n this.isLoading$.next(true);\n \n try {\n const engine = AIEngineBase.Instance;\n await engine.Config(false);\n const models = engine.Models;\n models.sort ((a, b) => { \n return a.Name.localeCompare(b.Name);\n });\n \n this.models$.next(models \|\| []);\n \n // Pre-select first model if available\n if (models && models.length > 0) {\n this.form.patchValue({ modelId: models[0].ID });\n }\n \n const agentTypes = engine.AgentTypes;\n this.agentTypes$.next(agentTypes as MJAIAgentTypeEntity[] \|\| []);\n } catch (error) {\n console.error('Error loading data:', error);\n console.error('Failed to load required data');\n } finally {\n this.isLoading$.next(false);\n }\n }\n \n async onSubmit() {\n if (this.form.invalid \|\| this.isSubmitting) {\n return;\n }\n \n this.isSubmitting = true;\n \n try {\n const md = this.ProviderToUse;\n const agent = await md.GetEntityObject<MJAIAgentEntityExtended>('MJ: AI Agents');\n \n if (!agent) {\n throw new Error('Failed to create agent entity');\n }\n \n // Set agent properties\n agent.Name = this.form.value.name;\n agent.Description = this.form.value.description;\n \n // Set parent agent if provided\n if (this.config.parentAgentId) {\n agent.ParentID = this.config.parentAgentId;\n }\n \n // Set execution mode\n agent.ExecutionMode = 'Sequential';\n agent.ExecutionOrder = 0;\n agent.ExposeAsAction = false;\n \n // Save the agent\n const saveResult = await agent.Save();\n \n if (saveResult) {\n MJNotificationService.Instance.CreateSimpleNotification('Agent created successfully!', 'success', 3000);\n\n // Close dialog with the new agent\n this.dialogRef?.Close({ agent, action: 'created' });\n\n // Redirect to form if configured\n if (this.config.redirectToForm && !this.config.parentAgentId) {\n // Only redirect for top-level agents - use NavigationService to open the record\n setTimeout(() => {\n this.navigationService.OpenEntityRecord('MJ: AI Agents', agent.PrimaryKey);\n }, 100);\n }\n } else {\n throw new Error('Failed to save agent');\n }\n } catch (error: unknown) {\n const errorMessage = error instanceof Error ? error.message : 'Unknown error';\n console.error('Error creating agent:', error);\n MJNotificationService.Instance.CreateSimpleNotification('Failed to create agent: ' + errorMessage, 'error', 5000);\n } finally {\n this.isSubmitting = false;\n }\n }\n\n onCancel() {\n this.dialogRef?.Close({ action: 'cancelled' });\n }\n}","<div class=\"new-agent-dialog\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onSubmit()\">\n <!-- Parent Agent Info (if creating sub-agent) -->\n @if (config.parentAgentId) {\n <mj-alert Variant=\"info\" Icon=\"fa-solid fa-robot\" class=\"new-agent-alert-pos\">\n Creating sub-agent for: <strong>{{ config.parentAgentName \|\| 'Parent Agent' }}</strong>\n </mj-alert>\n }\n \n <!-- Loading State -->\n @if (isLoading$ \| async) {\n <div class=\"loading-overlay\">\n <div class=\"spinner\">Loading...</div>\n </div>\n }\n \n <!-- Form Fields -->\n <div class=\"form-fields\">\n <!-- Agent Name -->\n <div class=\"form-group\">\n <label class=\"required\">Agent Name</label>\n <input\n class=\"mj-input full-width\"\n formControlName=\"name\"\n placeholder=\"Enter a descriptive name for your agent\">\n @if (form.get('name')?.invalid && form.get('name')?.touched) {\n <div class=\"error-message\">\n <i class=\"fa-solid fa-exclamation-circle\"></i>\n Agent name is required\n </div>\n }\n </div>\n \n <!-- Description -->\n <div class=\"form-group\">\n <label>Description</label>\n <textarea\n class=\"mj-textarea full-width\"\n formControlName=\"description\"\n placeholder=\"Describe what this agent does...\"\n rows=\"3\"></textarea>\n </div>\n \n <!-- AI Model Selection -->\n <div class=\"form-group\">\n <label class=\"required\">AI Model</label>\n <mj-dropdown\n formControlName=\"modelId\"\n [Data]=\"models$ \| async\"\n TextField=\"Name\"\n ValueField=\"ID\"\n Placeholder=\"Select an AI model...\"\n class=\"full-width\">\n </mj-dropdown>\n @if (form.get('modelId')?.invalid && form.get('modelId')?.touched) {\n <div class=\"error-message\">\n <i class=\"fa-solid fa-exclamation-circle\"></i>\n Please select an AI model\n </div>\n }\n </div>\n \n <!-- System Prompt -->\n <div class=\"form-group\">\n <label>System Prompt</label>\n <textarea\n class=\"mj-textarea full-width\"\n formControlName=\"systemPrompt\"\n placeholder=\"Define the agent's behavior and personality...\"\n rows=\"4\"></textarea>\n <div class=\"field-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n This sets the agent's context and behavior\n </div>\n </div>\n \n <!-- Advanced Settings -->\n <div class=\"advanced-settings\">\n <div class=\"section-header\">\n <i class=\"fa-solid fa-cog\"></i>\n Advanced Settings\n </div>\n \n <div class=\"advanced-grid\">\n <!-- Temperature -->\n <div class=\"setting-group\">\n <label>Temperature</label>\n <div class=\"slider-container\">\n <input\n type=\"range\"\n class=\"mj-input temperature-slider\"\n formControlName=\"temperature\"\n min=\"0\"\n max=\"2\"\n step=\"0.1\">\n <span class=\"slider-value\">{{ form.get('temperature')?.value }}</span>\n </div>\n <div class=\"field-hint\">Higher values make output more creative</div>\n </div>\n \n <!-- Max Tokens -->\n <div class=\"setting-group\">\n <label>Max Tokens</label>\n <mj-numeric-input\n formControlName=\"maxTokens\"\n [Min]=\"1\"\n [Max]=\"8000\"\n [Step]=\"100\"\n Format=\"n0\"\n class=\"full-width\">\n </mj-numeric-input>\n <div class=\"field-hint\">Maximum response length</div>\n </div>\n \n <!-- Enable Streaming -->\n <div class=\"setting-group checkbox-group\">\n <label>\n <input type=\"checkbox\" formControlName=\"enableStreaming\" class=\"mj-checkbox\" />\n <span>Enable Response Streaming</span>\n </label>\n <div class=\"field-hint\">Stream responses in real-time</div>\n </div>\n </div>\n </div>\n </div>\n \n <!-- Dialog Actions -->\n <div class=\"dialog-actions\">\n <button\n type=\"button\"\n mjButton\n (click)=\"onCancel()\"\n [disabled]=\"isSubmitting\">\n Cancel\n </button>\n <button\n type=\"submit\"\n mjButton\n variant=\"primary\"\n [disabled]=\"form.invalid \|\| isSubmitting\">\n @if (isSubmitting) {\n <span class=\"spinner-small\"></span>\n <span>Creating...</span>\n } @else {\n <i class=\"fa-solid fa-plus-circle\"></i>\n <span>Create Agent</span>\n }\n </button>\n </div>\n </form>\n</div>"]}

package/dist/lib/custom/AIAgents/prompt-selector-dialog.component.js CHANGED Viewed

@@ -28,32 +28,25 @@ function PromptSelectorDialogComponent_Conditional_3_Conditional_13_Template(rf,
     i0.ɵɵtextInterpolate1(" ", ctx_r1.selectedPrompts.size, " selected ");
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 23);
-    i0.ɵɵelement(1, "i", 25);
-    i0.ɵɵelementStart(2, "h4");
-    i0.ɵɵtext(3, "No prompts found");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "p");
-    i0.ɵɵtext(5, "Try adjusting your search criteria or check that prompts are properly configured.");
-    i0.ɵɵelementEnd()();
+    i0.ɵɵelement(0, "mj-empty-state", 23);
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 29);
+    i0.ɵɵelement(0, "i", 28);
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 30);
+    i0.ɵɵelement(0, "i", 29);
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 31);
+    i0.ɵɵelement(0, "i", 30);
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 36);
-    i0.ɵɵelement(1, "i", 41);
+    i0.ɵɵelementStart(0, "span", 35);
+    i0.ɵɵelement(1, "i", 40);
     i0.ɵɵtext(2, " Linked ");
     i0.ɵɵelementEnd();
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 38);
+    i0.ɵɵelementStart(0, "p", 37);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -62,8 +55,8 @@ function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Condit
     i0.ɵɵtextInterpolate(prompt_r4.Description);
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 40);
-    i0.ɵɵelement(1, "i", 42);
+    i0.ɵɵelementStart(0, "span", 39);
+    i0.ɵɵelement(1, "i", 41);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "date");
     i0.ɵɵelementEnd();
@@ -74,22 +67,22 @@ function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Condit
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 27);
+    i0.ɵɵelementStart(0, "div", 26);
     i0.ɵɵlistener("click", function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Template_div_click_0_listener() { const prompt_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.togglePromptSelection(prompt_r4)); });
-    i0.ɵɵelementStart(1, "div", 28);
-    i0.ɵɵconditionalCreate(2, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_2_Template, 1, 0, "i", 29)(3, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_3_Template, 1, 0, "i", 30)(4, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_4_Template, 1, 0, "i", 31);
+    i0.ɵɵelementStart(1, "div", 27);
+    i0.ɵɵconditionalCreate(2, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_2_Template, 1, 0, "i", 28)(3, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_3_Template, 1, 0, "i", 29)(4, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_4_Template, 1, 0, "i", 30);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 32)(6, "div", 33)(7, "h4", 34);
+    i0.ɵɵelementStart(5, "div", 31)(6, "div", 32)(7, "h4", 33);
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "div", 35);
-    i0.ɵɵconditionalCreate(10, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_10_Template, 3, 0, "span", 36);
-    i0.ɵɵelementStart(11, "span", 37);
+    i0.ɵɵelementStart(9, "div", 34);
+    i0.ɵɵconditionalCreate(10, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_10_Template, 3, 0, "span", 35);
+    i0.ɵɵelementStart(11, "span", 36);
     i0.ɵɵtext(12);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵconditionalCreate(13, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_13_Template, 2, 1, "p", 38);
-    i0.ɵɵelementStart(14, "div", 39);
-    i0.ɵɵconditionalCreate(15, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_15_Template, 4, 4, "span", 40);
+    i0.ɵɵconditionalCreate(13, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_13_Template, 2, 1, "p", 37);
+    i0.ɵɵelementStart(14, "div", 38);
+    i0.ɵɵconditionalCreate(15, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Conditional_15_Template, 4, 4, "span", 39);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const prompt_r4 = ctx.$implicit;
@@ -111,7 +104,7 @@ function PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Templa
     i0.ɵɵconditional(prompt_r4.__mj_CreatedAt ? 15 : -1);
 } }
 function PromptSelectorDialogComponent_Conditional_3_Conditional_17_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵrepeaterCreate(0, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Template, 16, 12, "div", 26, _forTrack0);
+    i0.ɵɵrepeaterCreate(0, PromptSelectorDialogComponent_Conditional_3_Conditional_17_For_1_Template, 16, 12, "div", 25, _forTrack0);
     i0.ɵɵpipe(2, "async");
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -134,7 +127,7 @@ function PromptSelectorDialogComponent_Conditional_3_Template(rf, ctx) { if (rf
     i0.ɵɵconditionalCreate(13, PromptSelectorDialogComponent_Conditional_3_Conditional_13_Template, 3, 1, "span", 21);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(14, "div", 22);
-    i0.ɵɵconditionalCreate(15, PromptSelectorDialogComponent_Conditional_3_Conditional_15_Template, 6, 0, "div", 23);
+    i0.ɵɵconditionalCreate(15, PromptSelectorDialogComponent_Conditional_3_Conditional_15_Template, 1, 0, "mj-empty-state", 23);
     i0.ɵɵpipe(16, "async");
     i0.ɵɵconditionalBranchCreate(17, PromptSelectorDialogComponent_Conditional_3_Conditional_17_Template, 3, 2);
     i0.ɵɵelementEnd();
@@ -161,12 +154,12 @@ function PromptSelectorDialogComponent_Conditional_6_Template(rf, ctx) { if (rf
     const _r5 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "button", 6);
     i0.ɵɵlistener("click", function PromptSelectorDialogComponent_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.createNew()); });
-    i0.ɵɵelement(1, "i", 43);
+    i0.ɵɵelement(1, "i", 42);
     i0.ɵɵtext(2, " Create New Prompt ");
     i0.ɵɵelementEnd();
 } }
 function PromptSelectorDialogComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 44);
+    i0.ɵɵelement(0, "i", 43);
     i0.ɵɵtext(1);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -174,7 +167,7 @@ function PromptSelectorDialogComponent_Conditional_11_Template(rf, ctx) { if (rf
     i0.ɵɵtextInterpolate2(" Add ", ctx_r1.selectedPrompts.size, " Prompt", ctx_r1.selectedPrompts.size === 1 ? "" : "s", " ");
 } }
 function PromptSelectorDialogComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 44);
+    i0.ɵɵelement(0, "i", 43);
     i0.ɵɵtext(1, " Select Prompt ");
 } }
 /**
@@ -344,7 +337,7 @@ export class PromptSelectorDialogComponent extends BaseAngularComponent {
         this.DialogClose.emit();
     }
     static { this.ɵfac = function PromptSelectorDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PromptSelectorDialogComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PromptSelectorDialogComponent, selectors: [["mj-prompt-selector-dialog"]], outputs: { DialogClose: "DialogClose" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 13, vars: 6, consts: [[1, "prompt-selector-dialog"], [1, "loading-state"], [1, "dialog-footer"], [1, "footer-left"], ["mjButton", "", "variant", "flat"], [1, "footer-right"], ["mjButton", "", "variant", "flat", 3, "click"], ["mjButton", "", "variant", "primary", 3, "click", "disabled"], [1, "loading-spinner"], [1, "fa-solid", "fa-spinner", "fa-spin", "fa-2x"], [1, "dialog-header"], [1, "search-section"], [1, "search-box"], [1, "fa-solid", "fa-search", "search-icon"], ["placeholder", "Search prompts by name or description...", 1, "mj-input", "search-input", 3, "formControl"], [1, "view-controls"], ["mjButton", "", "variant", "flat", "title", "Toggle between list and grid view", 3, "click"], [1, "fa-solid"], [1, "results-summary"], [1, "results-count"], [1, "fa-solid", "fa-comment-dots"], [1, "selected-count"], [1, "prompts-container"], [1, "no-results"], [1, "fa-solid", "fa-check-circle"], [1, "fa-solid", "fa-search", "fa-2x"], [1, "prompt-card", 3, "selected", "linked"], [1, "prompt-card", 3, "click"], [1, "selection-indicator"], ["title", "Already linked to this agent", 1, "fa-solid", "fa-link", "linked-icon"], [1, "fa-solid", "fa-check-circle", "selected-icon"], [1, "fa-regular", "fa-circle", "unselected-icon"], [1, "prompt-content"], [1, "prompt-header"], [1, "prompt-name"], [1, "prompt-badges"], [1, "linked-badge"], [1, "status-badge"], [1, "prompt-description"], [1, "prompt-metadata"], [1, "metadata-item"], [1, "fa-solid", "fa-link"], [1, "fa-solid", "fa-calendar"], [1, "fa-solid", "fa-plus"], [1, "fa-solid", "fa-check"]], template: function PromptSelectorDialogComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PromptSelectorDialogComponent, selectors: [["mj-prompt-selector-dialog"]], outputs: { DialogClose: "DialogClose" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 13, vars: 6, consts: [[1, "prompt-selector-dialog"], [1, "loading-state"], [1, "dialog-footer"], [1, "footer-left"], ["mjButton", "", "variant", "flat"], [1, "footer-right"], ["mjButton", "", "variant", "flat", 3, "click"], ["mjButton", "", "variant", "primary", 3, "click", "disabled"], [1, "loading-spinner"], [1, "fa-solid", "fa-spinner", "fa-spin", "fa-2x"], [1, "dialog-header"], [1, "search-section"], [1, "search-box"], [1, "fa-solid", "fa-search", "search-icon"], ["placeholder", "Search prompts by name or description...", 1, "mj-input", "search-input", 3, "formControl"], [1, "view-controls"], ["mjButton", "", "variant", "flat", "title", "Toggle between list and grid view", 3, "click"], [1, "fa-solid"], [1, "results-summary"], [1, "results-count"], [1, "fa-solid", "fa-comment-dots"], [1, "selected-count"], [1, "prompts-container"], ["Variant", "no-results", "Title", "No prompts found", "Message", "Try adjusting your search criteria or check that prompts are properly configured.", "Size", "compact"], [1, "fa-solid", "fa-check-circle"], [1, "prompt-card", 3, "selected", "linked"], [1, "prompt-card", 3, "click"], [1, "selection-indicator"], ["title", "Already linked to this agent", 1, "fa-solid", "fa-link", "linked-icon"], [1, "fa-solid", "fa-check-circle", "selected-icon"], [1, "fa-regular", "fa-circle", "unselected-icon"], [1, "prompt-content"], [1, "prompt-header"], [1, "prompt-name"], [1, "prompt-badges"], [1, "linked-badge"], [1, "status-badge"], [1, "prompt-description"], [1, "prompt-metadata"], [1, "metadata-item"], [1, "fa-solid", "fa-link"], [1, "fa-solid", "fa-calendar"], [1, "fa-solid", "fa-plus"], [1, "fa-solid", "fa-check"]], template: function PromptSelectorDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵconditionalCreate(1, PromptSelectorDialogComponent_Conditional_1_Template, 5, 0, "div", 1);
             i0.ɵɵpipe(2, "async");
@@ -369,11 +362,11 @@ export class PromptSelectorDialogComponent extends BaseAngularComponent {
             i0.ɵɵproperty("disabled", ctx.selectedPrompts.size === 0);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.config.multiSelect ? 11 : 12);
-        } }, dependencies: [i1.DefaultValueAccessor, i1.NgControlStatus, i1.FormControlDirective, i2.MJButtonDirective, i3.AsyncPipe, i3.DatePipe], styles: [".prompt-selector-dialog[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  max-height: 70vh;\n}\n\n\n\n[_nghost-%COMP%]     .k-dialog, \n[_nghost-%COMP%]     .k-window {\n  z-index: 10000 !important;\n}\n\n[_nghost-%COMP%]     .k-overlay {\n  z-index: 9999 !important;\n}\n\n\n\n.loading-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 300px;\n  color: var(--mj-text-secondary);\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n  margin-bottom: 16px;\n}\n\n\n\n.dialog-header[_ngcontent-%COMP%] {\n  padding: 16px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.search-section[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.search-box[_ngcontent-%COMP%] {\n  flex: 1;\n  position: relative;\n}\n\n.search-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 12px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: var(--mj-text-secondary);\n  z-index: 2;\n}\n\n.search-input[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n.search-input[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n  padding-left: 36px !important;\n}\n\n.view-controls[_ngcontent-%COMP%]   button.active[_ngcontent-%COMP%] {\n  background-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n\n\n.results-summary[_ngcontent-%COMP%] {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.results-count[_ngcontent-%COMP%], .selected-count[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.selected-count[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  font-weight: 500;\n}\n\n\n\n.prompts-container[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n}\n\n\n\n.prompts-container.list-view[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n\n\n.prompts-container.grid-view[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 16px;\n}\n\n\n\n.prompt-card[_ngcontent-%COMP%] {\n  border: 2px solid var(--mj-border-default);\n  border-radius: 8px;\n  padding: 16px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  background: var(--mj-bg-surface);\n  display: flex;\n  gap: 12px;\n  position: relative;\n}\n\n.prompt-card[_ngcontent-%COMP%]:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n.prompt-card.selected[_ngcontent-%COMP%] {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 25%, transparent);\n}\n\n.prompt-card.linked[_ngcontent-%COMP%] {\n  border-color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-card);\n  opacity: 0.7;\n  cursor: not-allowed;\n}\n\n.prompt-card.linked[_ngcontent-%COMP%]:hover {\n  border-color: var(--mj-text-muted);\n  box-shadow: none;\n}\n\n\n\n.selection-indicator[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  margin-top: 2px;\n}\n\n.selected-icon[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  font-size: 18px;\n}\n\n.unselected-icon[_ngcontent-%COMP%] {\n  color: var(--mj-border-strong);\n  font-size: 18px;\n}\n\n.linked-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  font-size: 18px;\n}\n\n\n\n.prompt-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.prompt-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 12px;\n  margin-bottom: 8px;\n}\n\n.prompt-name[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  line-height: 1.4;\n  flex: 1;\n}\n\n.prompt-badges[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 6px;\n  align-items: center;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n}\n\n.linked-badge[_ngcontent-%COMP%] {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  background: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.prompt-description[_ngcontent-%COMP%] {\n  margin: 0 0 12px 0;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n\n\n.prompt-metadata[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 16px;\n  font-size: 12px;\n  color: var(--mj-text-disabled);\n  flex-wrap: wrap;\n}\n\n.metadata-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.metadata-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  width: 12px;\n  font-size: 10px;\n}\n\n\n\n.no-results[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 200px;\n  color: var(--mj-text-secondary);\n  text-align: center;\n}\n\n.no-results[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-bottom: 16px;\n  color: var(--mj-border-strong);\n}\n\n.no-results[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n  margin: 0 0 8px 0;\n  color: var(--mj-text-primary);\n}\n\n.no-results[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  color: var(--mj-text-disabled);\n  max-width: 300px;\n}\n\n\n\n.dialog-footer[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px;\n  border-top: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.footer-left[_ngcontent-%COMP%] {\n  display: flex;\n}\n\n.footer-right[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n}\n\n\n\n@media (max-width: 768px) {\n  .prompts-container.grid-view[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .prompt-header[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .search-section[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .view-controls[_ngcontent-%COMP%] {\n    align-self: flex-end;\n  }\n}"] }); }
+        } }, dependencies: [i1.DefaultValueAccessor, i1.NgControlStatus, i1.FormControlDirective, i2.MJEmptyStateComponent, i2.MJButtonDirective, i3.AsyncPipe, i3.DatePipe], styles: [".prompt-selector-dialog[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  max-height: 70vh;\n}\n\n\n\n[_nghost-%COMP%]     .k-dialog, \n[_nghost-%COMP%]     .k-window {\n  z-index: 10000 !important;\n}\n\n[_nghost-%COMP%]     .k-overlay {\n  z-index: 9999 !important;\n}\n\n\n\n.loading-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 300px;\n  color: var(--mj-text-secondary);\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n  margin-bottom: 16px;\n}\n\n\n\n.dialog-header[_ngcontent-%COMP%] {\n  padding: 16px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.search-section[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.search-box[_ngcontent-%COMP%] {\n  flex: 1;\n  position: relative;\n}\n\n.search-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 12px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: var(--mj-text-secondary);\n  z-index: 2;\n}\n\n.search-input[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n.search-input[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n  padding-left: 36px !important;\n}\n\n.view-controls[_ngcontent-%COMP%]   button.active[_ngcontent-%COMP%] {\n  background-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n\n\n.results-summary[_ngcontent-%COMP%] {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.results-count[_ngcontent-%COMP%], .selected-count[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.selected-count[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  font-weight: 500;\n}\n\n\n\n.prompts-container[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n}\n\n\n\n.prompts-container.list-view[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n\n\n.prompts-container.grid-view[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 16px;\n}\n\n\n\n.prompt-card[_ngcontent-%COMP%] {\n  border: 2px solid var(--mj-border-default);\n  border-radius: 8px;\n  padding: 16px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  background: var(--mj-bg-surface);\n  display: flex;\n  gap: 12px;\n  position: relative;\n}\n\n.prompt-card[_ngcontent-%COMP%]:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n.prompt-card.selected[_ngcontent-%COMP%] {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 25%, transparent);\n}\n\n.prompt-card.linked[_ngcontent-%COMP%] {\n  border-color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-card);\n  opacity: 0.7;\n  cursor: not-allowed;\n}\n\n.prompt-card.linked[_ngcontent-%COMP%]:hover {\n  border-color: var(--mj-text-muted);\n  box-shadow: none;\n}\n\n\n\n.selection-indicator[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  margin-top: 2px;\n}\n\n.selected-icon[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  font-size: 18px;\n}\n\n.unselected-icon[_ngcontent-%COMP%] {\n  color: var(--mj-border-strong);\n  font-size: 18px;\n}\n\n.linked-icon[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  font-size: 18px;\n}\n\n\n\n.prompt-content[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.prompt-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 12px;\n  margin-bottom: 8px;\n}\n\n.prompt-name[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  line-height: 1.4;\n  flex: 1;\n}\n\n.prompt-badges[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 6px;\n  align-items: center;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n}\n\n.linked-badge[_ngcontent-%COMP%] {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  background: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.prompt-description[_ngcontent-%COMP%] {\n  margin: 0 0 12px 0;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n\n\n.prompt-metadata[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 16px;\n  font-size: 12px;\n  color: var(--mj-text-disabled);\n  flex-wrap: wrap;\n}\n\n.metadata-item[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.metadata-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  width: 12px;\n  font-size: 10px;\n}\n\n\n\n.prompts-container[_ngcontent-%COMP%]   mj-empty-state[_ngcontent-%COMP%] {\n  grid-column: 1 / -1;\n  width: 100%;\n}\n\n\n\n.dialog-footer[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px;\n  border-top: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.footer-left[_ngcontent-%COMP%] {\n  display: flex;\n}\n\n.footer-right[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n}\n\n\n\n@media (max-width: 768px) {\n  .prompts-container.grid-view[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .prompt-header[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .search-section[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .view-controls[_ngcontent-%COMP%] {\n    align-self: flex-end;\n  }\n}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PromptSelectorDialogComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-prompt-selector-dialog', template: "<!-- Prompt Selector Dialog -->\n<div class=\"prompt-selector-dialog\">\n  \n  <!-- Loading State -->\n  @if (isLoading$ | async) {\n    <div class=\"loading-state\">\n      <div class=\"loading-spinner\">\n        <i class=\"fa-solid fa-spinner fa-spin fa-2x\"></i>\n      </div>\n      <p>Loading prompts...</p>\n    </div>\n  } @else {\n    \n    <!-- Search and Controls Header -->\n    <div class=\"dialog-header\">\n      <div class=\"search-section\">\n        <div class=\"search-box\">\n          <i class=\"fa-solid fa-search search-icon\"></i>\n          <input\n            class=\"mj-input search-input\"\n            [formControl]=\"searchControl\"\n            placeholder=\"Search prompts by name or description...\">\n        </div>\n        \n        <div class=\"view-controls\">\n          <button mjButton\n                  variant=\"flat\"\n                  [class.active]=\"viewMode === 'list'\"\n                  (click)=\"toggleViewMode()\"\n                  title=\"Toggle between list and grid view\">\n            <i class=\"fa-solid\" [class.fa-list]=\"viewMode === 'grid'\" [class.fa-th]=\"viewMode === 'list'\"></i>\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Results Summary -->\n    <div class=\"results-summary\">\n      <span class=\"results-count\">\n        <i class=\"fa-solid fa-comment-dots\"></i>\n        {{ (filteredPrompts$ | async)?.length || 0 }} prompt(s)\n      </span>\n      @if (config.multiSelect && selectedPrompts.size > 0) {\n        <span class=\"selected-count\">\n          <i class=\"fa-solid fa-check-circle\"></i>\n          {{ selectedPrompts.size }} selected\n        </span>\n      }\n    </div>\n\n    <!-- Prompts List/Grid -->\n    <div class=\"prompts-container\" [class.grid-view]=\"viewMode === 'grid'\" [class.list-view]=\"viewMode === 'list'\">\n      @if ((filteredPrompts$ | async)?.length === 0) {\n        <div class=\"no-results\">\n          <i class=\"fa-solid fa-search fa-2x\"></i>\n          <h4>No prompts found</h4>\n          <p>Try adjusting your search criteria or check that prompts are properly configured.</p>\n        </div>\n      } @else {\n        @for (prompt of filteredPrompts$ | async; track prompt.ID) {\n          <div class=\"prompt-card\" \n               [class.selected]=\"isPromptSelected(prompt)\"\n               [class.linked]=\"isPromptLinked(prompt)\"\n               (click)=\"togglePromptSelection(prompt)\">\n            \n            <!-- Selection indicator -->\n            <div class=\"selection-indicator\">\n              @if (isPromptLinked(prompt)) {\n                <i class=\"fa-solid fa-link linked-icon\" title=\"Already linked to this agent\"></i>\n              } @else if (isPromptSelected(prompt)) {\n                <i class=\"fa-solid fa-check-circle selected-icon\"></i>\n              } @else {\n                <i class=\"fa-regular fa-circle unselected-icon\"></i>\n              }\n            </div>\n\n            <!-- Prompt Content -->\n            <div class=\"prompt-content\">\n              <div class=\"prompt-header\">\n                <h4 class=\"prompt-name\">{{ prompt.Name }}</h4>\n                <div class=\"prompt-badges\">\n                  @if (isPromptLinked(prompt)) {\n                    <span class=\"linked-badge\">\n                      <i class=\"fa-solid fa-link\"></i>\n                      Linked\n                    </span>\n                  }\n                  <span class=\"status-badge\" \n                        [style.background-color]=\"getPromptStatusColor(prompt)\">\n                    {{ getPromptStatusText(prompt) }}\n                  </span>\n                </div>\n              </div>\n\n              @if (prompt.Description) {\n                <p class=\"prompt-description\">{{ prompt.Description }}</p>\n              }\n\n              <!-- Prompt Metadata -->\n              <div class=\"prompt-metadata\">\n                @if (prompt.__mj_CreatedAt) {\n                  <span class=\"metadata-item\">\n                    <i class=\"fa-solid fa-calendar\"></i>\n                    Created {{ prompt.__mj_CreatedAt | date:'short' }}\n                  </span>\n                }\n              </div>\n            </div>\n          </div>\n        }\n      }\n    </div>\n  }\n\n  <!-- Dialog Footer -->\n  <div class=\"dialog-footer\">\n    <div class=\"footer-left\">\n      @if (config.showCreateNew) {\n        <button mjButton\n                variant=\"flat\"\n                (click)=\"createNew()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          Create New Prompt\n        </button>\n      }\n    </div>\n    \n    <div class=\"footer-right\">\n      <button mjButton\n              variant=\"flat\"\n              (click)=\"cancel()\">\n        Cancel\n      </button>\n\n      <button mjButton\n              variant=\"primary\"\n              (click)=\"selectPrompts()\"\n              [disabled]=\"selectedPrompts.size === 0\">\n        @if (config.multiSelect) {\n          <i class=\"fa-solid fa-check\"></i>\n          Add {{ selectedPrompts.size }} Prompt{{ selectedPrompts.size === 1 ? '' : 's' }}\n        } @else {\n          <i class=\"fa-solid fa-check\"></i>\n          Select Prompt\n        }\n      </button>\n    </div>\n  </div>\n</div>", styles: [".prompt-selector-dialog {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  max-height: 70vh;\n}\n\n/* Ensure dialog appears above banner and other elements */\n:host ::ng-deep .k-dialog,\n:host ::ng-deep .k-window {\n  z-index: 10000 !important;\n}\n\n:host ::ng-deep .k-overlay {\n  z-index: 9999 !important;\n}\n\n/* === Loading State === */\n.loading-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 300px;\n  color: var(--mj-text-secondary);\n}\n\n.loading-spinner {\n  margin-bottom: 16px;\n}\n\n/* === Header Section === */\n.dialog-header {\n  padding: 16px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.search-section {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.search-box {\n  flex: 1;\n  position: relative;\n}\n\n.search-icon {\n  position: absolute;\n  left: 12px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: var(--mj-text-secondary);\n  z-index: 2;\n}\n\n.search-input {\n  width: 100%;\n}\n\n.search-input input {\n  padding-left: 36px !important;\n}\n\n.view-controls button.active {\n  background-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n/* === Results Summary === */\n.results-summary {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.results-count, .selected-count {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.selected-count {\n  color: var(--mj-brand-primary);\n  font-weight: 500;\n}\n\n/* === Prompts Container === */\n.prompts-container {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n}\n\n/* List View */\n.prompts-container.list-view {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n/* Grid View */\n.prompts-container.grid-view {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 16px;\n}\n\n/* === Prompt Cards === */\n.prompt-card {\n  border: 2px solid var(--mj-border-default);\n  border-radius: 8px;\n  padding: 16px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  background: var(--mj-bg-surface);\n  display: flex;\n  gap: 12px;\n  position: relative;\n}\n\n.prompt-card:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n.prompt-card.selected {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 25%, transparent);\n}\n\n.prompt-card.linked {\n  border-color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-card);\n  opacity: 0.7;\n  cursor: not-allowed;\n}\n\n.prompt-card.linked:hover {\n  border-color: var(--mj-text-muted);\n  box-shadow: none;\n}\n\n/* === Selection Indicator === */\n.selection-indicator {\n  display: flex;\n  align-items: flex-start;\n  margin-top: 2px;\n}\n\n.selected-icon {\n  color: var(--mj-brand-primary);\n  font-size: 18px;\n}\n\n.unselected-icon {\n  color: var(--mj-border-strong);\n  font-size: 18px;\n}\n\n.linked-icon {\n  color: var(--mj-text-muted);\n  font-size: 18px;\n}\n\n/* === Prompt Content === */\n.prompt-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.prompt-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 12px;\n  margin-bottom: 8px;\n}\n\n.prompt-name {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  line-height: 1.4;\n  flex: 1;\n}\n\n.prompt-badges {\n  display: flex;\n  gap: 6px;\n  align-items: center;\n}\n\n.status-badge {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n}\n\n.linked-badge {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  background: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.prompt-description {\n  margin: 0 0 12px 0;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* === Prompt Metadata === */\n.prompt-metadata {\n  display: flex;\n  gap: 16px;\n  font-size: 12px;\n  color: var(--mj-text-disabled);\n  flex-wrap: wrap;\n}\n\n.metadata-item {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.metadata-item i {\n  width: 12px;\n  font-size: 10px;\n}\n\n/* === No Results === */\n.no-results {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 200px;\n  color: var(--mj-text-secondary);\n  text-align: center;\n}\n\n.no-results i {\n  margin-bottom: 16px;\n  color: var(--mj-border-strong);\n}\n\n.no-results h4 {\n  margin: 0 0 8px 0;\n  color: var(--mj-text-primary);\n}\n\n.no-results p {\n  margin: 0;\n  color: var(--mj-text-disabled);\n  max-width: 300px;\n}\n\n/* === Dialog Footer === */\n.dialog-footer {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px;\n  border-top: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.footer-left {\n  display: flex;\n}\n\n.footer-right {\n  display: flex;\n  gap: 8px;\n}\n\n/* === Responsive Design === */\n@media (max-width: 768px) {\n  .prompts-container.grid-view {\n    grid-template-columns: 1fr;\n  }\n\n  .prompt-header {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .search-section {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .view-controls {\n    align-self: flex-end;\n  }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-prompt-selector-dialog', template: "<!-- Prompt Selector Dialog -->\n<div class=\"prompt-selector-dialog\">\n  \n  <!-- Loading State -->\n  @if (isLoading$ | async) {\n    <div class=\"loading-state\">\n      <div class=\"loading-spinner\">\n        <i class=\"fa-solid fa-spinner fa-spin fa-2x\"></i>\n      </div>\n      <p>Loading prompts...</p>\n    </div>\n  } @else {\n    \n    <!-- Search and Controls Header -->\n    <div class=\"dialog-header\">\n      <div class=\"search-section\">\n        <div class=\"search-box\">\n          <i class=\"fa-solid fa-search search-icon\"></i>\n          <input\n            class=\"mj-input search-input\"\n            [formControl]=\"searchControl\"\n            placeholder=\"Search prompts by name or description...\">\n        </div>\n        \n        <div class=\"view-controls\">\n          <button mjButton\n                  variant=\"flat\"\n                  [class.active]=\"viewMode === 'list'\"\n                  (click)=\"toggleViewMode()\"\n                  title=\"Toggle between list and grid view\">\n            <i class=\"fa-solid\" [class.fa-list]=\"viewMode === 'grid'\" [class.fa-th]=\"viewMode === 'list'\"></i>\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Results Summary -->\n    <div class=\"results-summary\">\n      <span class=\"results-count\">\n        <i class=\"fa-solid fa-comment-dots\"></i>\n        {{ (filteredPrompts$ | async)?.length || 0 }} prompt(s)\n      </span>\n      @if (config.multiSelect && selectedPrompts.size > 0) {\n        <span class=\"selected-count\">\n          <i class=\"fa-solid fa-check-circle\"></i>\n          {{ selectedPrompts.size }} selected\n        </span>\n      }\n    </div>\n\n    <!-- Prompts List/Grid -->\n    <div class=\"prompts-container\" [class.grid-view]=\"viewMode === 'grid'\" [class.list-view]=\"viewMode === 'list'\">\n      @if ((filteredPrompts$ | async)?.length === 0) {\n        <mj-empty-state\n          Variant=\"no-results\"\n          Title=\"No prompts found\"\n          Message=\"Try adjusting your search criteria or check that prompts are properly configured.\"\n          Size=\"compact\" />\n      } @else {\n        @for (prompt of filteredPrompts$ | async; track prompt.ID) {\n          <div class=\"prompt-card\" \n               [class.selected]=\"isPromptSelected(prompt)\"\n               [class.linked]=\"isPromptLinked(prompt)\"\n               (click)=\"togglePromptSelection(prompt)\">\n            \n            <!-- Selection indicator -->\n            <div class=\"selection-indicator\">\n              @if (isPromptLinked(prompt)) {\n                <i class=\"fa-solid fa-link linked-icon\" title=\"Already linked to this agent\"></i>\n              } @else if (isPromptSelected(prompt)) {\n                <i class=\"fa-solid fa-check-circle selected-icon\"></i>\n              } @else {\n                <i class=\"fa-regular fa-circle unselected-icon\"></i>\n              }\n            </div>\n\n            <!-- Prompt Content -->\n            <div class=\"prompt-content\">\n              <div class=\"prompt-header\">\n                <h4 class=\"prompt-name\">{{ prompt.Name }}</h4>\n                <div class=\"prompt-badges\">\n                  @if (isPromptLinked(prompt)) {\n                    <span class=\"linked-badge\">\n                      <i class=\"fa-solid fa-link\"></i>\n                      Linked\n                    </span>\n                  }\n                  <span class=\"status-badge\" \n                        [style.background-color]=\"getPromptStatusColor(prompt)\">\n                    {{ getPromptStatusText(prompt) }}\n                  </span>\n                </div>\n              </div>\n\n              @if (prompt.Description) {\n                <p class=\"prompt-description\">{{ prompt.Description }}</p>\n              }\n\n              <!-- Prompt Metadata -->\n              <div class=\"prompt-metadata\">\n                @if (prompt.__mj_CreatedAt) {\n                  <span class=\"metadata-item\">\n                    <i class=\"fa-solid fa-calendar\"></i>\n                    Created {{ prompt.__mj_CreatedAt | date:'short' }}\n                  </span>\n                }\n              </div>\n            </div>\n          </div>\n        }\n      }\n    </div>\n  }\n\n  <!-- Dialog Footer -->\n  <div class=\"dialog-footer\">\n    <div class=\"footer-left\">\n      @if (config.showCreateNew) {\n        <button mjButton\n                variant=\"flat\"\n                (click)=\"createNew()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          Create New Prompt\n        </button>\n      }\n    </div>\n    \n    <div class=\"footer-right\">\n      <button mjButton\n              variant=\"flat\"\n              (click)=\"cancel()\">\n        Cancel\n      </button>\n\n      <button mjButton\n              variant=\"primary\"\n              (click)=\"selectPrompts()\"\n              [disabled]=\"selectedPrompts.size === 0\">\n        @if (config.multiSelect) {\n          <i class=\"fa-solid fa-check\"></i>\n          Add {{ selectedPrompts.size }} Prompt{{ selectedPrompts.size === 1 ? '' : 's' }}\n        } @else {\n          <i class=\"fa-solid fa-check\"></i>\n          Select Prompt\n        }\n      </button>\n    </div>\n  </div>\n</div>", styles: [".prompt-selector-dialog {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  max-height: 70vh;\n}\n\n/* Ensure dialog appears above banner and other elements */\n:host ::ng-deep .k-dialog,\n:host ::ng-deep .k-window {\n  z-index: 10000 !important;\n}\n\n:host ::ng-deep .k-overlay {\n  z-index: 9999 !important;\n}\n\n/* === Loading State === */\n.loading-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  height: 300px;\n  color: var(--mj-text-secondary);\n}\n\n.loading-spinner {\n  margin-bottom: 16px;\n}\n\n/* === Header Section === */\n.dialog-header {\n  padding: 16px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.search-section {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.search-box {\n  flex: 1;\n  position: relative;\n}\n\n.search-icon {\n  position: absolute;\n  left: 12px;\n  top: 50%;\n  transform: translateY(-50%);\n  color: var(--mj-text-secondary);\n  z-index: 2;\n}\n\n.search-input {\n  width: 100%;\n}\n\n.search-input input {\n  padding-left: 36px !important;\n}\n\n.view-controls button.active {\n  background-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n/* === Results Summary === */\n.results-summary {\n  padding: 12px 16px;\n  background: var(--mj-bg-surface-sunken);\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  font-size: 14px;\n  color: var(--mj-text-secondary);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.results-count, .selected-count {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.selected-count {\n  color: var(--mj-brand-primary);\n  font-weight: 500;\n}\n\n/* === Prompts Container === */\n.prompts-container {\n  flex: 1;\n  overflow-y: auto;\n  padding: 16px;\n}\n\n/* List View */\n.prompts-container.list-view {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n/* Grid View */\n.prompts-container.grid-view {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n  gap: 16px;\n}\n\n/* === Prompt Cards === */\n.prompt-card {\n  border: 2px solid var(--mj-border-default);\n  border-radius: 8px;\n  padding: 16px;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  background: var(--mj-bg-surface);\n  display: flex;\n  gap: 12px;\n  position: relative;\n}\n\n.prompt-card:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 15%, transparent);\n}\n\n.prompt-card.selected {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 4%, var(--mj-bg-surface));\n  box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 25%, transparent);\n}\n\n.prompt-card.linked {\n  border-color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-card);\n  opacity: 0.7;\n  cursor: not-allowed;\n}\n\n.prompt-card.linked:hover {\n  border-color: var(--mj-text-muted);\n  box-shadow: none;\n}\n\n/* === Selection Indicator === */\n.selection-indicator {\n  display: flex;\n  align-items: flex-start;\n  margin-top: 2px;\n}\n\n.selected-icon {\n  color: var(--mj-brand-primary);\n  font-size: 18px;\n}\n\n.unselected-icon {\n  color: var(--mj-border-strong);\n  font-size: 18px;\n}\n\n.linked-icon {\n  color: var(--mj-text-muted);\n  font-size: 18px;\n}\n\n/* === Prompt Content === */\n.prompt-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.prompt-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 12px;\n  margin-bottom: 8px;\n}\n\n.prompt-name {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  line-height: 1.4;\n  flex: 1;\n}\n\n.prompt-badges {\n  display: flex;\n  gap: 6px;\n  align-items: center;\n}\n\n.status-badge {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n}\n\n.linked-badge {\n  padding: 4px 8px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: 500;\n  background: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n  white-space: nowrap;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.prompt-description {\n  margin: 0 0 12px 0;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  line-height: 1.4;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n/* === Prompt Metadata === */\n.prompt-metadata {\n  display: flex;\n  gap: 16px;\n  font-size: 12px;\n  color: var(--mj-text-disabled);\n  flex-wrap: wrap;\n}\n\n.metadata-item {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.metadata-item i {\n  width: 12px;\n  font-size: 10px;\n}\n\n/* No-results empty state spans the full container in grid view */\n.prompts-container mj-empty-state {\n  grid-column: 1 / -1;\n  width: 100%;\n}\n\n/* === Dialog Footer === */\n.dialog-footer {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px;\n  border-top: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.footer-left {\n  display: flex;\n}\n\n.footer-right {\n  display: flex;\n  gap: 8px;\n}\n\n/* === Responsive Design === */\n@media (max-width: 768px) {\n  .prompts-container.grid-view {\n    grid-template-columns: 1fr;\n  }\n\n  .prompt-header {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 8px;\n  }\n\n  .search-section {\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .view-controls {\n    align-self: flex-end;\n  }\n}\n"] }]
     }], () => [{ type: i0.ChangeDetectorRef }], { DialogClose: [{
             type: Output
         }] }); })();