@memberjunction/ng-core-entity-forms 6.2.0-edge.0 → 6.2.0-edge.2

package/dist/lib/custom/AIAgents/sub-agent-selector-dialog.component.d.ts

@@ -6,19 +6,19 @@ import { MJAIAgentEntityExtended } from "@memberjunction/ai-core-plus";
 import { BaseAngularComponent } from '@memberjunction/ng-base-types';
 import * as i0 from "@angular/core";
 export interface SubAgentSelectorResult {
-    selectedAgents: MJAIAgentEntityExtended[];
-    createNew: boolean;
+    SelectedAgents: MJAIAgentEntityExtended[];
+    CreateNew: boolean;
 }
 export interface SubAgentSelectorConfig {
-    title: string;
-    multiSelect: boolean;
-    selectedAgentIds: string[];
-    showCreateNew: boolean;
-    parentAgentId: string;
+    Title: string;
+    MultiSelect: boolean;
+    SelectedAgentIds: string[];
+    ShowCreateNew: boolean;
+    ParentAgentId: string;
 }
 export interface AgentDisplayItem extends MJAIAgentEntityExtended {
-    selected: boolean;
-    typeName?: string;
+    Selected: boolean;
+    TypeName?: string;
 }
 /**
  * Sub-Agent Selector Dialog for selecting agents to convert to sub-agents.
@@ -28,16 +28,54 @@ export declare class SubAgentSelectorDialogComponent extends BaseAngularComponen
     private cdr;
     config: SubAgentSelectorConfig;
     private destroy$;
-    result: Subject<SubAgentSelectorResult | null>;
-    allAgents$: BehaviorSubject<AgentDisplayItem[]>;
-    agentTypes$: BehaviorSubject<MJAIAgentTypeEntity[]>;
-    filteredAgents$: BehaviorSubject<AgentDisplayItem[]>;
-    selectedAgents$: BehaviorSubject<Set<string>>;
-    isLoading$: BehaviorSubject<boolean>;
-    searchControl: FormControl<string | null>;
-    selectedTypeId$: BehaviorSubject<string>;
+    Result: Subject<SubAgentSelectorResult | null>;
+    /** @deprecated Use {@link Result}. */
+    get result(): Subject<SubAgentSelectorResult | null>;
+    /** @deprecated Use {@link Result}. */
+    set result(value: Subject<SubAgentSelectorResult | null>);
+    AllAgents$: BehaviorSubject<AgentDisplayItem[]>;
+    /** @deprecated Use {@link AllAgents$}. */
+    get allAgents$(): BehaviorSubject<AgentDisplayItem[]>;
+    /** @deprecated Use {@link AllAgents$}. */
+    set allAgents$(value: BehaviorSubject<AgentDisplayItem[]>);
+    AgentTypes$: BehaviorSubject<MJAIAgentTypeEntity[]>;
+    /** @deprecated Use {@link AgentTypes$}. */
+    get agentTypes$(): BehaviorSubject<MJAIAgentTypeEntity[]>;
+    /** @deprecated Use {@link AgentTypes$}. */
+    set agentTypes$(value: BehaviorSubject<MJAIAgentTypeEntity[]>);
+    FilteredAgents$: BehaviorSubject<AgentDisplayItem[]>;
+    /** @deprecated Use {@link FilteredAgents$}. */
+    get filteredAgents$(): BehaviorSubject<AgentDisplayItem[]>;
+    /** @deprecated Use {@link FilteredAgents$}. */
+    set filteredAgents$(value: BehaviorSubject<AgentDisplayItem[]>);
+    SelectedAgents$: BehaviorSubject<Set<string>>;
+    /** @deprecated Use {@link SelectedAgents$}. */
+    get selectedAgents$(): BehaviorSubject<Set<string>>;
+    /** @deprecated Use {@link SelectedAgents$}. */
+    set selectedAgents$(value: BehaviorSubject<Set<string>>);
+    IsLoading$: BehaviorSubject<boolean>;
+    /** @deprecated Use {@link IsLoading$}. */
+    get isLoading$(): BehaviorSubject<boolean>;
+    /** @deprecated Use {@link IsLoading$}. */
+    set isLoading$(value: BehaviorSubject<boolean>);
+    SearchControl: FormControl<string | null>;
+    /** @deprecated Use {@link SearchControl}. */
+    get searchControl(): FormControl<string | null>;
+    /** @deprecated Use {@link SearchControl}. */
+    set searchControl(value: FormControl<string | null>);
+    SelectedTypeId$: BehaviorSubject<string>;
+    /** @deprecated Use {@link SelectedTypeId$}. */
+    get selectedTypeId$(): BehaviorSubject<string>;
+    /** @deprecated Use {@link SelectedTypeId$}. */
+    set selectedTypeId$(value: BehaviorSubject<string>);
+    get SelectedCount(): number;
+    /** @deprecated Use {@link SelectedCount}. */
     get selectedCount(): number;
+    get TotalAgentCount(): number;
+    /** @deprecated Use {@link TotalAgentCount}. */
     get totalAgentCount(): number;
+    get FilteredCount(): number;
+    /** @deprecated Use {@link FilteredCount}. */
     get filteredCount(): number;
     /** True when the empty list is the result of search/type filtering (vs. no eligible agents at all). */
     get IsAgentListNarrowed(): boolean;
@@ -52,8 +90,14 @@ export declare class SubAgentSelectorDialogComponent extends BaseAngularComponen
     private setupFiltering;
     private filterAgents;
     private preselectExistingAgents;
+    SelectType(typeId: string): void;
+    /** @deprecated Use {@link SelectType}. */
     selectType(typeId: string): void;
+    ToggleAgentSelection(agent: AgentDisplayItem): void;
+    /** @deprecated Use {@link ToggleAgentSelection}. */
     toggleAgentSelection(agent: AgentDisplayItem): void;
+    ClearSearch(): void;
+    /** @deprecated Use {@link ClearSearch}. */
     clearSearch(): void;
     /**
      * Backs the no-results empty-state "Clear Filters" CTA. Unlike clearSearch (the
@@ -61,11 +105,21 @@ export declare class SubAgentSelectorDialogComponent extends BaseAngularComponen
      * dimension the list narrows on — search AND the agent-type filter — so the CTA
      * actually returns results instead of appearing to do nothing.
      */
+    ClearFilters(): void;
+    /** @deprecated Use {@link ClearFilters}. */
     clearFilters(): void;
+    GetAgentIcon(agent: AgentDisplayItem): string;
+    /** @deprecated Use {@link GetAgentIcon}. */
     getAgentIcon(agent: AgentDisplayItem): string;
+    GetAgentStatusColor(agent: AgentDisplayItem): string;
+    /** @deprecated Use {@link GetAgentStatusColor}. */
     getAgentStatusColor(agent: AgentDisplayItem): string;
     cancel(): void;
+    CreateNew(): void;
+    /** @deprecated Use {@link CreateNew}. */
     createNew(): void;
+    AddSelectedAgents(): Promise<void>;
+    /** @deprecated Use {@link AddSelectedAgents}. */
     addSelectedAgents(): Promise<void>;
     static ɵfac: i0.ɵɵFactoryDeclaration<SubAgentSelectorDialogComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<SubAgentSelectorDialogComponent, "mj-sub-agent-selector-dialog", never, {}, { "DialogClose": "DialogClose"; }, never, never, false, never>;

package/dist/lib/custom/AIAgents/sub-agent-selector-dialog.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sub-agent-selector-dialog.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/custom/AIAgents/sub-agent-selector-dialog.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAU,YAAY,EAAE,MAAM,eAAe,CAAC;AACtG,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,OAAO,EAAE,eAAe,EAA2E,MAAM,MAAM,CAAC;AAEzH,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AAGvE,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;;AACrE,MAAM,WAAW,sBAAsB;IACrC,cAAc,EAAE,uBAAuB,EAAE,CAAC;IAC1C,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,aAAa,EAAE,OAAO,CAAC;IACvB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,gBAAiB,SAAQ,uBAAuB;IAC/D,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;GAGG;AACH,qBAMa,+BAAgC,SAAQ,oBAAqB,YAAW,MAAM,EAAE,SAAS;IAgDlG,OAAO,CAAC,GAAG;IA7Cb,MAAM,EAAG,sBAAsB,CAAC;IAGhC,OAAO,CAAC,QAAQ,CAAuB;IAChC,MAAM,yCAAgD;IAG7D,UAAU,sCAA+C;IACzD,WAAW,yCAAkD;IAC7D,eAAe,sCAA+C;IAC9D,eAAe,+BAA+C;IAC9D,UAAU,2BAAuC;IAGjD,aAAa,6BAAuB;IACpC,eAAe,0BAAsC;IAGrD,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED,IAAI,eAAe,IAAI,MAAM,CAE5B;IAED,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED,uGAAuG;IACvG,IAAI,mBAAmB,IAAI,OAAO,CAEjC;IAED,qDAAqD;IACrD,IAAI,eAAe,IAAI,MAAM,CAI5B;IAES,WAAW,qBAA4B;gBAGvC,GAAG,EAAE,iBAAiB;IAIhC,QAAQ;IAMR,WAAW;YAKG,cAAc;YAYd,kBAAkB;IAwChC,OAAO,CAAC,cAAc;IAgBtB,OAAO,CAAC,YAAY;IAqBpB,OAAO,CAAC,uBAAuB;IAgB/B,UAAU,CAAC,MAAM,EAAE,MAAM;IAIzB,oBAAoB,CAAC,KAAK,EAAE,gBAAgB;IAqC5C,WAAW;IAIX;;;;;OAKG;IACH,YAAY;IAKZ,YAAY,CAAC,KAAK,EAAE,gBAAgB,GAAG,MAAM;IAO7C,mBAAmB,CAAC,KAAK,EAAE,gBAAgB,GAAG,MAAM;IAWpD,MAAM;IAKN,SAAS;IAQH,iBAAiB;yCA/PZ,+BAA+B;2CAA/B,+BAA+B;CAgR3C"}
+{"version":3,"file":"sub-agent-selector-dialog.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/custom/AIAgents/sub-agent-selector-dialog.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/custom/AIAgents/sub-agent-selector-dialog.component.js

@@ -88,7 +88,7 @@ function SubAgentSelectorDialogComponent_Conditional_26_Conditional_2_For_2_Cond
 } if (rf & 2) {
     const agent_r5 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(agent_r5.typeName);
+    i0.ɵɵtextInterpolate(agent_r5.TypeName);
 } }
 function SubAgentSelectorDialogComponent_Conditional_26_Conditional_2_For_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 44);
@@ -120,9 +120,9 @@ function SubAgentSelectorDialogComponent_Conditional_26_Conditional_2_For_2_Temp
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const agent_r5 = ctx.$implicit;
-    i0.ɵɵclassProp("selected", agent_r5.selected);
+    i0.ɵɵclassProp("selected", agent_r5.Selected);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(agent_r5.selected ? 2 : 3);
+    i0.ɵɵconditional(agent_r5.Selected ? 2 : 3);
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(agent_r5.LogoURL ? 5 : 6);
     i0.ɵɵadvance(4);
@@ -132,7 +132,7 @@ function SubAgentSelectorDialogComponent_Conditional_26_Conditional_2_For_2_Temp
     i0.ɵɵadvance(2);
     i0.ɵɵconditional(agent_r5.Status ? 12 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(agent_r5.typeName ? 13 : -1);
+    i0.ɵɵconditional(agent_r5.TypeName ? 13 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(agent_r5.ExecutionMode ? 14 : -1);
 } }
@@ -177,19 +177,95 @@ function SubAgentSelectorDialogComponent_Conditional_35_Template(rf, ctx) { if (
  * Only shows agents with NULL ParentID (root agents) that can become sub-agents.
  */
 export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
+    /** @deprecated Use {@link Result}. */
+    get result() {
+        return this.Result;
+    }
+    /** @deprecated Use {@link Result}. */
+    set result(value) {
+        this.Result = value;
+    }
+    /** @deprecated Use {@link AllAgents$}. */
+    get allAgents$() {
+        return this.AllAgents$;
+    }
+    /** @deprecated Use {@link AllAgents$}. */
+    set allAgents$(value) {
+        this.AllAgents$ = value;
+    }
+    /** @deprecated Use {@link AgentTypes$}. */
+    get agentTypes$() {
+        return this.AgentTypes$;
+    }
+    /** @deprecated Use {@link AgentTypes$}. */
+    set agentTypes$(value) {
+        this.AgentTypes$ = value;
+    }
+    /** @deprecated Use {@link FilteredAgents$}. */
+    get filteredAgents$() {
+        return this.FilteredAgents$;
+    }
+    /** @deprecated Use {@link FilteredAgents$}. */
+    set filteredAgents$(value) {
+        this.FilteredAgents$ = value;
+    }
+    /** @deprecated Use {@link SelectedAgents$}. */
+    get selectedAgents$() {
+        return this.SelectedAgents$;
+    }
+    /** @deprecated Use {@link SelectedAgents$}. */
+    set selectedAgents$(value) {
+        this.SelectedAgents$ = value;
+    }
+    /** @deprecated Use {@link IsLoading$}. */
+    get isLoading$() {
+        return this.IsLoading$;
+    }
+    /** @deprecated Use {@link IsLoading$}. */
+    set isLoading$(value) {
+        this.IsLoading$ = value;
+    }
+    /** @deprecated Use {@link SearchControl}. */
+    get searchControl() {
+        return this.SearchControl;
+    }
+    /** @deprecated Use {@link SearchControl}. */
+    set searchControl(value) {
+        this.SearchControl = value;
+    }
+    /** @deprecated Use {@link SelectedTypeId$}. */
+    get selectedTypeId$() {
+        return this.SelectedTypeId$;
+    }
+    /** @deprecated Use {@link SelectedTypeId$}. */
+    set selectedTypeId$(value) {
+        this.SelectedTypeId$ = value;
+    }
     // Computed values
+    get SelectedCount() {
+        return this.SelectedAgents$.value.size;
+    }
+    /** @deprecated Use {@link SelectedCount}. */
     get selectedCount() {
-        return this.selectedAgents$.value.size;
+        return this.SelectedCount;
     }
+    get TotalAgentCount() {
+        return this.AllAgents$.value.length;
+    }
+    /** @deprecated Use {@link TotalAgentCount}. */
     get totalAgentCount() {
-        return this.allAgents$.value.length;
+        return this.TotalAgentCount;
+    }
+    get FilteredCount() {
+        return this.FilteredAgents$.value.length;
     }
+    /** @deprecated Use {@link FilteredCount}. */
     get filteredCount() {
-        return this.filteredAgents$.value.length;
+        return this.FilteredCount;
     }
     /** True when the empty list is the result of search/type filtering (vs. no eligible agents at all). */
     get IsAgentListNarrowed() {
-        return this.totalAgentCount > 0;
+        return this.TotalAgentCount > 0;
     }
     /** Supporting copy for the no-agents empty state. */
     get NoAgentsMessage() {
@@ -202,16 +278,16 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
         this.cdr = cdr;
         // Reactive state management
         this.destroy$ = new Subject();
-        this.result = new Subject();
+        this.Result = new Subject();
         // Data streams
-        this.allAgents$ = new BehaviorSubject([]);
-        this.agentTypes$ = new BehaviorSubject([]);
-        this.filteredAgents$ = new BehaviorSubject([]);
-        this.selectedAgents$ = new BehaviorSubject(new Set());
-        this.isLoading$ = new BehaviorSubject(false);
+        this.AllAgents$ = new BehaviorSubject([]);
+        this.AgentTypes$ = new BehaviorSubject([]);
+        this.FilteredAgents$ = new BehaviorSubject([]);
+        this.SelectedAgents$ = new BehaviorSubject(new Set());
+        this.IsLoading$ = new BehaviorSubject(false);
         // UI state
-        this.searchControl = new FormControl('');
-        this.selectedTypeId$ = new BehaviorSubject('all');
+        this.SearchControl = new FormControl('');
+        this.SelectedTypeId$ = new BehaviorSubject('all');
         this.DialogClose = new EventEmitter();
     }
     ngOnInit() {
@@ -224,7 +300,7 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
         this.destroy$.complete();
     }
     async initializeData() {
-        this.isLoading$.next(true);
+        this.IsLoading$.next(true);
         try {
             await this.loadAgentsAndTypes();
         }
@@ -232,7 +308,7 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
             console.error('Error loading dialog data:', error);
         }
         finally {
-            this.isLoading$.next(false);
+            this.IsLoading$.next(false);
         }
     }
     async loadAgentsAndTypes() {
@@ -242,7 +318,7 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
             // Root agents (index 0)
             {
                 EntityName: 'MJ: AI Agents',
-                ExtraFilter: `ParentID IS NULL AND ID != '${this.config.parentAgentId}' AND Status = 'Active' AND (ExposeAsAction = 0 OR ExposeAsAction IS NULL)`,
+                ExtraFilter: `ParentID IS NULL AND ID != '${this.config.ParentAgentId}' AND Status = 'Active' AND (ExposeAsAction = 0 OR ExposeAsAction IS NULL)`,
                 OrderBy: 'Name',
                 ResultType: 'entity_object',
                 MaxRows: 1000
@@ -260,21 +336,21 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
         if (results[0].Success) {
             const agents = (results[0].Results || []).map(agent => ({
                 ...agent.GetAll(),
-                selected: false,
-                typeName: agent.Type || 'Default'
+                Selected: false,
+                TypeName: agent.Type || 'Default'
             }));
-            this.allAgents$.next(agents);
+            this.AllAgents$.next(agents);
         }
         // Process agent types (index 1)
         if (results[1].Success) {
-            this.agentTypes$.next(results[1].Results || []);
+            this.AgentTypes$.next(results[1].Results || []);
         }
     }
     setupFiltering() {
         combineLatest([
-            this.allAgents$,
-            this.searchControl.valueChanges.pipe(debounceTime(300), distinctUntilChanged(), startWith('')),
-            this.selectedTypeId$
+            this.AllAgents$,
+            this.SearchControl.valueChanges.pipe(debounceTime(300), distinctUntilChanged(), startWith('')),
+            this.SelectedTypeId$
         ]).pipe(takeUntil(this.destroy$)).subscribe(([agents, searchTerm, typeId]) => {
             this.filterAgents(agents, searchTerm || '', typeId);
         });
@@ -290,40 +366,44 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
             const term = searchTerm.toLowerCase();
             filtered = filtered.filter(agent => (agent.Name && agent.Name.toLowerCase().includes(term)) ||
                 (agent.Description && agent.Description.toLowerCase().includes(term)) ||
-                (agent.typeName && agent.typeName.toLowerCase().includes(term)));
+                (agent.TypeName && agent.TypeName.toLowerCase().includes(term)));
         }
-        this.filteredAgents$.next(filtered);
+        this.FilteredAgents$.next(filtered);
     }
     preselectExistingAgents() {
-        if (this.config.selectedAgentIds.length > 0) {
-            const selected = new Set(this.config.selectedAgentIds);
-            this.selectedAgents$.next(selected);
+        if (this.config.SelectedAgentIds.length > 0) {
+            const selected = new Set(this.config.SelectedAgentIds);
+            this.SelectedAgents$.next(selected);
             // Update agent selection state
-            const agents = this.allAgents$.value;
+            const agents = this.AllAgents$.value;
             agents.forEach(agent => {
-                agent.selected = selected.has(agent.ID);
+                agent.Selected = selected.has(agent.ID);
             });
-            this.allAgents$.next(agents);
+            this.AllAgents$.next(agents);
         }
     }
     // === UI Event Handlers ===
+    SelectType(typeId) {
+        this.SelectedTypeId$.next(typeId);
+    }
+    /** @deprecated Use {@link SelectType}. */
     selectType(typeId) {
-        this.selectedTypeId$.next(typeId);
+        return this.SelectType(typeId);
     }
-    toggleAgentSelection(agent) {
-        const selected = this.selectedAgents$.value;
-        const agents = this.allAgents$.value;
+    ToggleAgentSelection(agent) {
+        const selected = this.SelectedAgents$.value;
+        const agents = this.AllAgents$.value;
         // Find the agent and toggle its selection
         const agentToUpdate = agents.find(a => UUIDsEqual(a.ID, agent.ID));
         if (agentToUpdate) {
-            agentToUpdate.selected = !agentToUpdate.selected;
-            if (agentToUpdate.selected) {
-                if (!this.config.multiSelect) {
+            agentToUpdate.Selected = !agentToUpdate.Selected;
+            if (agentToUpdate.Selected) {
+                if (!this.config.MultiSelect) {
                     // Single select mode - clear other selections
                     selected.clear();
                     agents.forEach(a => {
                         if (!UUIDsEqual(a.ID, agent.ID)) {
-                            a.selected = false;
+                            a.Selected = false;
                         }
                     });
                 }
@@ -332,19 +412,27 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
             else {
                 selected.delete(agent.ID);
             }
-            this.selectedAgents$.next(new Set(selected));
-            this.allAgents$.next(agents);
+            this.SelectedAgents$.next(new Set(selected));
+            this.AllAgents$.next(agents);
             // Update filtered agents to reflect selection state
-            const filtered = this.filteredAgents$.value;
+            const filtered = this.FilteredAgents$.value;
             const filteredAgent = filtered.find(a => UUIDsEqual(a.ID, agent.ID));
             if (filteredAgent) {
-                filteredAgent.selected = agentToUpdate.selected;
-                this.filteredAgents$.next(filtered);
+                filteredAgent.Selected = agentToUpdate.Selected;
+                this.FilteredAgents$.next(filtered);
             }
         }
     }
+    /** @deprecated Use {@link ToggleAgentSelection}. */
+    toggleAgentSelection(agent) {
+        return this.ToggleAgentSelection(agent);
+    }
+    ClearSearch() {
+        this.SearchControl.reset();
+    }
+    /** @deprecated Use {@link ClearSearch}. */
     clearSearch() {
-        this.searchControl.reset();
+        return this.ClearSearch();
     }
     /**
      * Backs the no-results empty-state "Clear Filters" CTA. Unlike clearSearch (the
@@ -352,17 +440,25 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
      * dimension the list narrows on — search AND the agent-type filter — so the CTA
      * actually returns results instead of appearing to do nothing.
      */
+    ClearFilters() {
+        this.SearchControl.reset();
+        this.SelectedTypeId$.next('all');
+    }
+    /** @deprecated Use {@link ClearFilters}. */
     clearFilters() {
-        this.searchControl.reset();
-        this.selectedTypeId$.next('all');
+        return this.ClearFilters();
     }
-    getAgentIcon(agent) {
+    GetAgentIcon(agent) {
         if (agent.IconClass) {
             return agent.IconClass;
         }
         return 'fa-solid fa-robot';
     }
-    getAgentStatusColor(agent) {
+    /** @deprecated Use {@link GetAgentIcon}. */
+    getAgentIcon(agent) {
+        return this.GetAgentIcon(agent);
+    }
+    GetAgentStatusColor(agent) {
         switch (agent.Status) {
             case 'Active': return 'var(--mj-status-success)';
             case 'Disabled': return 'var(--mj-text-muted)';
@@ -370,32 +466,44 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
             default: return 'var(--mj-text-muted)';
         }
     }
+    /** @deprecated Use {@link GetAgentStatusColor}. */
+    getAgentStatusColor(agent) {
+        return this.GetAgentStatusColor(agent);
+    }
     // === Dialog Actions ===
     cancel() {
-        this.result.next(null);
+        this.Result.next(null);
         this.DialogClose.emit();
     }
-    createNew() {
-        this.result.next({
-            selectedAgents: [],
-            createNew: true
+    CreateNew() {
+        this.Result.next({
+            SelectedAgents: [],
+            CreateNew: true
         });
         this.DialogClose.emit();
     }
-    async addSelectedAgents() {
-        const selectedIds = this.selectedAgents$.value;
-        const allAgents = this.allAgents$.value;
+    /** @deprecated Use {@link CreateNew}. */
+    createNew() {
+        return this.CreateNew();
+    }
+    async AddSelectedAgents() {
+        const selectedIds = this.SelectedAgents$.value;
+        const allAgents = this.AllAgents$.value;
         // Get the selected agent display items
         const selectedDisplayItems = allAgents
             .filter(agent => selectedIds.has(agent.ID));
         // Convert AgentDisplayItem to MJAIAgentEntityExtended by casting (they have the same structure)
         const selectedAgents = selectedDisplayItems.map(item => item);
-        this.result.next({
-            selectedAgents,
-            createNew: false
+        this.Result.next({
+            SelectedAgents: selectedAgents,
+            CreateNew: false
         });
         this.DialogClose.emit();
     }
+    /** @deprecated Use {@link AddSelectedAgents}. */
+    async addSelectedAgents() {
+        return this.AddSelectedAgents();
+    }
     static { this.ɵfac = function SubAgentSelectorDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SubAgentSelectorDialogComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SubAgentSelectorDialogComponent, selectors: [["mj-sub-agent-selector-dialog"]], outputs: { DialogClose: "DialogClose" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 36, vars: 21, consts: [[1, "sub-agent-selector-dialog"], [1, "dialog-header"], [1, "header-info"], [1, "header-description"], [1, "header-stats"], [1, "selection-count"], [1, "total-count"], [1, "controls-section"], [1, "search-controls"], [1, "search-input"], [1, "fa-solid", "fa-search", "search-icon"], ["placeholder", "Search agents by name, description, or type...", 1, "mj-input", "search-field", 3, "formControl"], ["mjButton", "", "variant", "flat", 1, "clear-search"], [1, "filter-controls"], [1, "type-filter"], ["TextField", "Name", "ValueField", "ID", 1, "type-dropdown", 3, "ngModelChange", "ngModel", "ValuePrimitive", "DefaultItem", "Data"], [1, "loading-state"], [1, "content-area"], [1, "dialog-footer"], [1, "footer-left"], ["mjButton", "", "variant", "primary"], [1, "footer-right"], ["mjButton", "", "variant", "flat", 3, "click"], ["mjButton", "", "variant", "primary", 3, "click", "disabled"], ["mjButton", "", "variant", "flat", 1, "clear-search", 3, "click"], [1, "fa-solid", "fa-times"], [1, "fa-solid", "fa-spinner", "fa-spin", "fa-2x"], ["Icon", "fa-solid fa-robot", "Title", "No agents found", "Size", "compact", 3, "Variant", "Message", "ActionText"], [1, "agents-grid"], ["Icon", "fa-solid fa-robot", "Title", "No agents found", "Size", "compact", 3, "Action", "Variant", "Message", "ActionText"], [1, "agent-card", 3, "selected"], [1, "agent-card", 3, "click"], [1, "selection-indicator"], [1, "fa-solid", "fa-check-circle"], [1, "fa-regular", "fa-circle"], [1, "agent-icon"], [1, "agent-logo", 3, "src", "alt"], [3, "class"], [1, "agent-info"], [1, "agent-name"], [1, "agent-description"], [1, "agent-meta"], [1, "status-badge", 3, "background-color"], [1, "type-badge"], [1, "execution-badge"], [1, "status-badge"], ["mjButton", "", "variant", "primary", 3, "click"], [1, "fa-solid", "fa-plus"]], template: function SubAgentSelectorDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "h3");
@@ -437,7 +545,7 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
             i0.ɵɵelementEnd()()()();
         } if (rf & 2) {
             i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate(ctx.config.title || "Select Sub-Agents");
+            i0.ɵɵtextInterpolate(ctx.config.Title || "Select Sub-Agents");
             i0.ɵɵadvance(4);
             i0.ɵɵconditional(ctx.selectedCount > 0 ? 8 : -1);
             i0.ɵɵadvance(2);
@@ -451,16 +559,16 @@ export class SubAgentSelectorDialogComponent extends BaseAngularComponent {
             i0.ɵɵadvance(3);
             i0.ɵɵconditional(i0.ɵɵpipeBind1(25, 18, ctx.isLoading$) ? 24 : 26);
             i0.ɵɵadvance(5);
-            i0.ɵɵconditional(ctx.config.showCreateNew ? 29 : -1);
+            i0.ɵɵconditional(ctx.config.ShowCreateNew ? 29 : -1);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("disabled", ctx.selectedCount === 0);
             i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.config.multiSelect ? 34 : 35);
+            i0.ɵɵconditional(ctx.config.MultiSelect ? 34 : 35);
         } }, dependencies: [i1.DefaultValueAccessor, i1.NgControlStatus, i1.NgModel, i1.FormControlDirective, i2.MJEmptyStateComponent, i2.MJButtonDirective, i2.MJDropdownComponent, i3.AsyncPipe], styles: [".sub-agent-selector-dialog[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--mj-bg-surface-card);\n  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\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.dialog-header[_ngcontent-%COMP%] {\n  padding: 1.5rem;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n}\n\n.header-info[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n  margin: 0 0 0.5rem 0;\n  color: var(--mj-text-primary);\n  font-size: 1.25rem;\n  font-weight: 600;\n}\n\n.header-description[_ngcontent-%COMP%] {\n  margin: 0;\n  color: var(--mj-text-muted);\n  font-size: 0.9rem;\n  line-height: 1.4;\n}\n\n.header-stats[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 0.25rem;\n  font-size: 0.85rem;\n}\n\n.selection-count[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  font-weight: 600;\n}\n\n.total-count[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n}\n\n\n.controls-section[_ngcontent-%COMP%] {\n  padding: 1rem 1.5rem;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.search-controls[_ngcontent-%COMP%] {\n  flex: 1;\n}\n\n.search-input[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.search-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 12px;\n  color: var(--mj-text-muted);\n  z-index: 1;\n}\n\n.search-field[_ngcontent-%COMP%] {\n  width: 100%;\n  padding-left: 40px;\n}\n\n.clear-search[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 8px;\n  z-index: 1;\n}\n\n.filter-controls[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.type-filter[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.type-filter[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  font-size: 0.85rem;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n}\n\n.type-dropdown[_ngcontent-%COMP%] {\n  min-width: 150px;\n}\n\n\n.content-area[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 1rem;\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-muted);\n}\n\n.loading-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  margin-bottom: 1rem;\n}\n\n.loading-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: 1rem;\n}\n\n\n.agents-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 1rem;\n}\n\n.agent-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border: 2px solid var(--mj-bg-surface-sunken);\n  border-radius: 8px;\n  padding: 1rem;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  display: flex;\n  gap: 1rem;\n  position: relative;\n}\n\n.agent-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.agent-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) 20%, transparent);\n}\n\n.selection-indicator[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0.75rem;\n  right: 0.75rem;\n  font-size: 1.1rem;\n}\n\n.selection-indicator[_ngcontent-%COMP%]   .fa-check-circle[_ngcontent-%COMP%] {\n  color: var(--mj-status-success);\n}\n\n.selection-indicator[_ngcontent-%COMP%]   .fa-circle[_ngcontent-%COMP%] {\n  color: var(--mj-border-default);\n}\n\n.agent-icon[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  width: 48px;\n  height: 48px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 8px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-bg-surface-sunken);\n}\n\n.agent-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 1.5rem;\n  color: var(--mj-brand-primary);\n}\n\n.agent-logo[_ngcontent-%COMP%] {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: 6px;\n}\n\n.agent-info[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n}\n\n.agent-name[_ngcontent-%COMP%] {\n  font-size: 1rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  margin-bottom: 0.5rem;\n  word-wrap: break-word;\n}\n\n.agent-description[_ngcontent-%COMP%] {\n  font-size: 0.85rem;\n  color: var(--mj-text-muted);\n  line-height: 1.4;\n  margin-bottom: 0.75rem;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.agent-meta[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n}\n\n.status-badge[_ngcontent-%COMP%], \n.type-badge[_ngcontent-%COMP%], \n.execution-badge[_ngcontent-%COMP%] {\n  padding: 0.25rem 0.5rem;\n  border-radius: 4px;\n  font-size: 0.75rem;\n  font-weight: 500;\n  color: var(--mj-text-inverse);\n}\n\n\n\n.type-badge[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n}\n\n.execution-badge[_ngcontent-%COMP%] {\n  background: var(--mj-status-warning);\n}\n\n\n.dialog-footer[_ngcontent-%COMP%] {\n  padding: 1rem 1.5rem;\n  background: var(--mj-bg-surface);\n  border-top: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.footer-left[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.footer-right[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 0.75rem;\n}\n\n.dialog-footer[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  min-width: 100px;\n}\n\n.dialog-footer[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  margin-right: 0.5rem;\n}\n\n\n@media (max-width: 768px) {\n  .agents-grid[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .dialog-header[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 1rem;\n  }\n\n  .header-stats[_ngcontent-%COMP%] {\n    align-items: flex-start;\n  }\n\n  .controls-section[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .filter-controls[_ngcontent-%COMP%] {\n    justify-content: flex-start;\n  }\n\n  .dialog-footer[_ngcontent-%COMP%] {\n    flex-direction: column-reverse;\n    gap: 1rem;\n  }\n\n  .footer-left[_ngcontent-%COMP%], \n   .footer-right[_ngcontent-%COMP%] {\n    width: 100%;\n    justify-content: center;\n  }\n}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SubAgentSelectorDialogComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-sub-agent-selector-dialog', template: "<!-- Sub-Agent Selector Dialog -->\n<div class=\"sub-agent-selector-dialog\">\n  \n  <!-- Dialog Header -->\n  <div class=\"dialog-header\">\n    <div class=\"header-info\">\n      <h3>{{ config.title || 'Select Sub-Agents' }}</h3>\n      <p class=\"header-description\">\n        Choose existing root agents to convert into sub-agents. Only active agents without parents and not exposed as actions can be selected.\n      </p>\n    </div>\n    <div class=\"header-stats\">\n      @if (selectedCount > 0) {\n        <span class=\"selection-count\">{{ selectedCount }} selected</span>\n      }\n      <span class=\"total-count\">{{ filteredCount }} of {{ totalAgentCount }} agents</span>\n    </div>\n  </div>\n\n  <!-- Search and Filter Controls -->\n  <div class=\"controls-section\">\n    <div class=\"search-controls\">\n      <div class=\"search-input\">\n        <i class=\"fa-solid fa-search search-icon\"></i>\n        <input\n          class=\"mj-input search-field\"\n          [formControl]=\"searchControl\"\n          placeholder=\"Search agents by name, description, or type...\">\n        @if (searchControl.value) {\n          <button mjButton\n                  variant=\"flat\"\n                  (click)=\"clearSearch()\"\n                  class=\"clear-search\">\n            <i class=\"fa-solid fa-times\"></i>\n          </button>\n        }\n      </div>\n    </div>\n\n    <div class=\"filter-controls\">\n      <div class=\"type-filter\">\n        <label>Agent Type:</label>\n        <mj-dropdown\n          [ngModel]=\"selectedTypeId$ | async\"\n          (ngModelChange)=\"selectType($any($event))\"\n          TextField=\"Name\"\n          ValueField=\"ID\"\n          [ValuePrimitive]=\"true\"\n          [DefaultItem]=\"{ Name: 'All Types', ID: 'all' }\"\n          [Data]=\"agentTypes$ | async\"\n          class=\"type-dropdown\">\n        </mj-dropdown>\n      </div>\n    </div>\n  </div>\n\n  <!-- Loading State -->\n  @if (isLoading$ | async) {\n    <div class=\"loading-state\">\n      <i class=\"fa-solid fa-spinner fa-spin fa-2x\"></i>\n      <p>Loading available agents...</p>\n    </div>\n  } @else {\n    \n    <!-- Content Area -->\n    <div class=\"content-area\">\n      @if (filteredCount === 0) {\n        <mj-empty-state\n          [Variant]=\"IsAgentListNarrowed ? 'no-results' : 'empty'\"\n          Icon=\"fa-solid fa-robot\"\n          Title=\"No agents found\"\n          [Message]=\"NoAgentsMessage\"\n          [ActionText]=\"IsAgentListNarrowed ? 'Clear Filters' : ''\"\n          (Action)=\"clearFilters()\"\n          Size=\"compact\" />\n      } @else {\n        \n        <!-- Agents Grid -->\n        <div class=\"agents-grid\">\n          @for (agent of (filteredAgents$ | async); track agent.ID) {\n            <div class=\"agent-card\" \n                 [class.selected]=\"agent.selected\"\n                 (click)=\"toggleAgentSelection(agent)\">\n              \n              <!-- Selection Indicator -->\n              <div class=\"selection-indicator\">\n                @if (agent.selected) {\n                  <i class=\"fa-solid fa-check-circle\"></i>\n                } @else {\n                  <i class=\"fa-regular fa-circle\"></i>\n                }\n              </div>\n              \n              <!-- Agent Icon/Logo -->\n              <div class=\"agent-icon\">\n                @if (agent.LogoURL) {\n                  <img [src]=\"agent.LogoURL\" [alt]=\"agent.Name + ' logo'\" class=\"agent-logo\">\n                } @else {\n                  <i [class]=\"getAgentIcon(agent)\"></i>\n                }\n              </div>\n              \n              <!-- Agent Info -->\n              <div class=\"agent-info\">\n                <div class=\"agent-name\">{{ agent.Name }}</div>\n                @if (agent.Description) {\n                  <div class=\"agent-description\">{{ agent.Description }}</div>\n                }\n                <div class=\"agent-meta\">\n                  @if (agent.Status) {\n                    <span class=\"status-badge\" [style.background-color]=\"getAgentStatusColor(agent)\">\n                      {{ agent.Status }}\n                    </span>\n                  }\n                  @if (agent.typeName) {\n                    <span class=\"type-badge\">{{ agent.typeName }}</span>\n                  }\n                  @if (agent.ExecutionMode) {\n                    <span class=\"execution-badge\">{{ agent.ExecutionMode }}</span>\n                  }\n                </div>\n              </div>\n            </div>\n          }\n        </div>\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=\"primary\"\n                (click)=\"createNew()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          Create Sub-Agent\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)=\"addSelectedAgents()\"\n              [disabled]=\"selectedCount === 0\">\n        @if (config.multiSelect) {\n          Add {{ selectedCount > 0 ? selectedCount + ' ' : '' }}Sub-Agent{{ selectedCount !== 1 ? 's' : '' }}\n        } @else {\n          Add Sub-Agent\n        }\n      </button>\n    </div>\n  </div>\n</div>", styles: [".sub-agent-selector-dialog {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--mj-bg-surface-card);\n  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\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/* === Dialog Header === */\n.dialog-header {\n  padding: 1.5rem;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n}\n\n.header-info h3 {\n  margin: 0 0 0.5rem 0;\n  color: var(--mj-text-primary);\n  font-size: 1.25rem;\n  font-weight: 600;\n}\n\n.header-description {\n  margin: 0;\n  color: var(--mj-text-muted);\n  font-size: 0.9rem;\n  line-height: 1.4;\n}\n\n.header-stats {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 0.25rem;\n  font-size: 0.85rem;\n}\n\n.selection-count {\n  color: var(--mj-brand-primary);\n  font-weight: 600;\n}\n\n.total-count {\n  color: var(--mj-text-muted);\n}\n\n/* === Controls Section === */\n.controls-section {\n  padding: 1rem 1.5rem;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.search-controls {\n  flex: 1;\n}\n\n.search-input {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.search-icon {\n  position: absolute;\n  left: 12px;\n  color: var(--mj-text-muted);\n  z-index: 1;\n}\n\n.search-field {\n  width: 100%;\n  padding-left: 40px;\n}\n\n.clear-search {\n  position: absolute;\n  right: 8px;\n  z-index: 1;\n}\n\n.filter-controls {\n  display: flex;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.type-filter {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.type-filter label {\n  font-size: 0.85rem;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n}\n\n.type-dropdown {\n  min-width: 150px;\n}\n\n/* === Content Area === */\n.content-area {\n  flex: 1;\n  overflow-y: auto;\n  padding: 1rem;\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-muted);\n}\n\n.loading-state i {\n  color: var(--mj-brand-primary);\n  margin-bottom: 1rem;\n}\n\n.loading-state p {\n  margin: 0;\n  font-size: 1rem;\n}\n\n/* === Agents Grid === */\n.agents-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 1rem;\n}\n\n.agent-card {\n  background: var(--mj-bg-surface);\n  border: 2px solid var(--mj-bg-surface-sunken);\n  border-radius: 8px;\n  padding: 1rem;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  display: flex;\n  gap: 1rem;\n  position: relative;\n}\n\n.agent-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.agent-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) 20%, transparent);\n}\n\n.selection-indicator {\n  position: absolute;\n  top: 0.75rem;\n  right: 0.75rem;\n  font-size: 1.1rem;\n}\n\n.selection-indicator .fa-check-circle {\n  color: var(--mj-status-success);\n}\n\n.selection-indicator .fa-circle {\n  color: var(--mj-border-default);\n}\n\n.agent-icon {\n  flex-shrink: 0;\n  width: 48px;\n  height: 48px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 8px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-bg-surface-sunken);\n}\n\n.agent-icon i {\n  font-size: 1.5rem;\n  color: var(--mj-brand-primary);\n}\n\n.agent-logo {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: 6px;\n}\n\n.agent-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.agent-name {\n  font-size: 1rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  margin-bottom: 0.5rem;\n  word-wrap: break-word;\n}\n\n.agent-description {\n  font-size: 0.85rem;\n  color: var(--mj-text-muted);\n  line-height: 1.4;\n  margin-bottom: 0.75rem;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.agent-meta {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n}\n\n.status-badge,\n.type-badge,\n.execution-badge {\n  padding: 0.25rem 0.5rem;\n  border-radius: 4px;\n  font-size: 0.75rem;\n  font-weight: 500;\n  color: var(--mj-text-inverse);\n}\n\n/* Status badge color set dynamically via style binding */\n\n.type-badge {\n  background: var(--mj-brand-primary);\n}\n\n.execution-badge {\n  background: var(--mj-status-warning);\n}\n\n/* === Dialog Footer === */\n.dialog-footer {\n  padding: 1rem 1.5rem;\n  background: var(--mj-bg-surface);\n  border-top: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.footer-left {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.footer-right {\n  display: flex;\n  gap: 0.75rem;\n}\n\n.dialog-footer button {\n  min-width: 100px;\n}\n\n.dialog-footer button i {\n  margin-right: 0.5rem;\n}\n\n/* === Responsive Design === */\n@media (max-width: 768px) {\n  .agents-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .dialog-header {\n    flex-direction: column;\n    gap: 1rem;\n  }\n\n  .header-stats {\n    align-items: flex-start;\n  }\n\n  .controls-section {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .filter-controls {\n    justify-content: flex-start;\n  }\n\n  .dialog-footer {\n    flex-direction: column-reverse;\n    gap: 1rem;\n  }\n\n  .footer-left,\n  .footer-right {\n    width: 100%;\n    justify-content: center;\n  }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-sub-agent-selector-dialog', template: "<!-- Sub-Agent Selector Dialog -->\n<div class=\"sub-agent-selector-dialog\">\n  \n  <!-- Dialog Header -->\n  <div class=\"dialog-header\">\n    <div class=\"header-info\">\n      <h3>{{ config.Title || 'Select Sub-Agents' }}</h3>\n      <p class=\"header-description\">\n        Choose existing root agents to convert into sub-agents. Only active agents without parents and not exposed as actions can be selected.\n      </p>\n    </div>\n    <div class=\"header-stats\">\n      @if (selectedCount > 0) {\n        <span class=\"selection-count\">{{ selectedCount }} selected</span>\n      }\n      <span class=\"total-count\">{{ filteredCount }} of {{ totalAgentCount }} agents</span>\n    </div>\n  </div>\n\n  <!-- Search and Filter Controls -->\n  <div class=\"controls-section\">\n    <div class=\"search-controls\">\n      <div class=\"search-input\">\n        <i class=\"fa-solid fa-search search-icon\"></i>\n        <input\n          class=\"mj-input search-field\"\n          [formControl]=\"searchControl\"\n          placeholder=\"Search agents by name, description, or type...\">\n        @if (searchControl.value) {\n          <button mjButton\n                  variant=\"flat\"\n                  (click)=\"clearSearch()\"\n                  class=\"clear-search\">\n            <i class=\"fa-solid fa-times\"></i>\n          </button>\n        }\n      </div>\n    </div>\n\n    <div class=\"filter-controls\">\n      <div class=\"type-filter\">\n        <label>Agent Type:</label>\n        <mj-dropdown\n          [ngModel]=\"selectedTypeId$ | async\"\n          (ngModelChange)=\"selectType($any($event))\"\n          TextField=\"Name\"\n          ValueField=\"ID\"\n          [ValuePrimitive]=\"true\"\n          [DefaultItem]=\"{ Name: 'All Types', ID: 'all' }\"\n          [Data]=\"agentTypes$ | async\"\n          class=\"type-dropdown\">\n        </mj-dropdown>\n      </div>\n    </div>\n  </div>\n\n  <!-- Loading State -->\n  @if (isLoading$ | async) {\n    <div class=\"loading-state\">\n      <i class=\"fa-solid fa-spinner fa-spin fa-2x\"></i>\n      <p>Loading available agents...</p>\n    </div>\n  } @else {\n    \n    <!-- Content Area -->\n    <div class=\"content-area\">\n      @if (filteredCount === 0) {\n        <mj-empty-state\n          [Variant]=\"IsAgentListNarrowed ? 'no-results' : 'empty'\"\n          Icon=\"fa-solid fa-robot\"\n          Title=\"No agents found\"\n          [Message]=\"NoAgentsMessage\"\n          [ActionText]=\"IsAgentListNarrowed ? 'Clear Filters' : ''\"\n          (Action)=\"clearFilters()\"\n          Size=\"compact\" />\n      } @else {\n        \n        <!-- Agents Grid -->\n        <div class=\"agents-grid\">\n          @for (agent of (filteredAgents$ | async); track agent.ID) {\n            <div class=\"agent-card\" \n                 [class.selected]=\"agent.Selected\"\n                 (click)=\"toggleAgentSelection(agent)\">\n              \n              <!-- Selection Indicator -->\n              <div class=\"selection-indicator\">\n                @if (agent.Selected) {\n                  <i class=\"fa-solid fa-check-circle\"></i>\n                } @else {\n                  <i class=\"fa-regular fa-circle\"></i>\n                }\n              </div>\n              \n              <!-- Agent Icon/Logo -->\n              <div class=\"agent-icon\">\n                @if (agent.LogoURL) {\n                  <img [src]=\"agent.LogoURL\" [alt]=\"agent.Name + ' logo'\" class=\"agent-logo\">\n                } @else {\n                  <i [class]=\"getAgentIcon(agent)\"></i>\n                }\n              </div>\n              \n              <!-- Agent Info -->\n              <div class=\"agent-info\">\n                <div class=\"agent-name\">{{ agent.Name }}</div>\n                @if (agent.Description) {\n                  <div class=\"agent-description\">{{ agent.Description }}</div>\n                }\n                <div class=\"agent-meta\">\n                  @if (agent.Status) {\n                    <span class=\"status-badge\" [style.background-color]=\"getAgentStatusColor(agent)\">\n                      {{ agent.Status }}\n                    </span>\n                  }\n                  @if (agent.TypeName) {\n                    <span class=\"type-badge\">{{ agent.TypeName }}</span>\n                  }\n                  @if (agent.ExecutionMode) {\n                    <span class=\"execution-badge\">{{ agent.ExecutionMode }}</span>\n                  }\n                </div>\n              </div>\n            </div>\n          }\n        </div>\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=\"primary\"\n                (click)=\"createNew()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          Create Sub-Agent\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)=\"addSelectedAgents()\"\n              [disabled]=\"selectedCount === 0\">\n        @if (config.MultiSelect) {\n          Add {{ selectedCount > 0 ? selectedCount + ' ' : '' }}Sub-Agent{{ selectedCount !== 1 ? 's' : '' }}\n        } @else {\n          Add Sub-Agent\n        }\n      </button>\n    </div>\n  </div>\n</div>", styles: [".sub-agent-selector-dialog {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--mj-bg-surface-card);\n  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\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/* === Dialog Header === */\n.dialog-header {\n  padding: 1.5rem;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n}\n\n.header-info h3 {\n  margin: 0 0 0.5rem 0;\n  color: var(--mj-text-primary);\n  font-size: 1.25rem;\n  font-weight: 600;\n}\n\n.header-description {\n  margin: 0;\n  color: var(--mj-text-muted);\n  font-size: 0.9rem;\n  line-height: 1.4;\n}\n\n.header-stats {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  gap: 0.25rem;\n  font-size: 0.85rem;\n}\n\n.selection-count {\n  color: var(--mj-brand-primary);\n  font-weight: 600;\n}\n\n.total-count {\n  color: var(--mj-text-muted);\n}\n\n/* === Controls Section === */\n.controls-section {\n  padding: 1rem 1.5rem;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.search-controls {\n  flex: 1;\n}\n\n.search-input {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.search-icon {\n  position: absolute;\n  left: 12px;\n  color: var(--mj-text-muted);\n  z-index: 1;\n}\n\n.search-field {\n  width: 100%;\n  padding-left: 40px;\n}\n\n.clear-search {\n  position: absolute;\n  right: 8px;\n  z-index: 1;\n}\n\n.filter-controls {\n  display: flex;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.type-filter {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.type-filter label {\n  font-size: 0.85rem;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n}\n\n.type-dropdown {\n  min-width: 150px;\n}\n\n/* === Content Area === */\n.content-area {\n  flex: 1;\n  overflow-y: auto;\n  padding: 1rem;\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-muted);\n}\n\n.loading-state i {\n  color: var(--mj-brand-primary);\n  margin-bottom: 1rem;\n}\n\n.loading-state p {\n  margin: 0;\n  font-size: 1rem;\n}\n\n/* === Agents Grid === */\n.agents-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n  gap: 1rem;\n}\n\n.agent-card {\n  background: var(--mj-bg-surface);\n  border: 2px solid var(--mj-bg-surface-sunken);\n  border-radius: 8px;\n  padding: 1rem;\n  cursor: pointer;\n  transition: all 0.2s ease;\n  display: flex;\n  gap: 1rem;\n  position: relative;\n}\n\n.agent-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.agent-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) 20%, transparent);\n}\n\n.selection-indicator {\n  position: absolute;\n  top: 0.75rem;\n  right: 0.75rem;\n  font-size: 1.1rem;\n}\n\n.selection-indicator .fa-check-circle {\n  color: var(--mj-status-success);\n}\n\n.selection-indicator .fa-circle {\n  color: var(--mj-border-default);\n}\n\n.agent-icon {\n  flex-shrink: 0;\n  width: 48px;\n  height: 48px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 8px;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-bg-surface-sunken);\n}\n\n.agent-icon i {\n  font-size: 1.5rem;\n  color: var(--mj-brand-primary);\n}\n\n.agent-logo {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: 6px;\n}\n\n.agent-info {\n  flex: 1;\n  min-width: 0;\n}\n\n.agent-name {\n  font-size: 1rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  margin-bottom: 0.5rem;\n  word-wrap: break-word;\n}\n\n.agent-description {\n  font-size: 0.85rem;\n  color: var(--mj-text-muted);\n  line-height: 1.4;\n  margin-bottom: 0.75rem;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.agent-meta {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.5rem;\n}\n\n.status-badge,\n.type-badge,\n.execution-badge {\n  padding: 0.25rem 0.5rem;\n  border-radius: 4px;\n  font-size: 0.75rem;\n  font-weight: 500;\n  color: var(--mj-text-inverse);\n}\n\n/* Status badge color set dynamically via style binding */\n\n.type-badge {\n  background: var(--mj-brand-primary);\n}\n\n.execution-badge {\n  background: var(--mj-status-warning);\n}\n\n/* === Dialog Footer === */\n.dialog-footer {\n  padding: 1rem 1.5rem;\n  background: var(--mj-bg-surface);\n  border-top: 1px solid var(--mj-bg-surface-sunken);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.footer-left {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.footer-right {\n  display: flex;\n  gap: 0.75rem;\n}\n\n.dialog-footer button {\n  min-width: 100px;\n}\n\n.dialog-footer button i {\n  margin-right: 0.5rem;\n}\n\n/* === Responsive Design === */\n@media (max-width: 768px) {\n  .agents-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .dialog-header {\n    flex-direction: column;\n    gap: 1rem;\n  }\n\n  .header-stats {\n    align-items: flex-start;\n  }\n\n  .controls-section {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .filter-controls {\n    justify-content: flex-start;\n  }\n\n  .dialog-footer {\n    flex-direction: column-reverse;\n    gap: 1rem;\n  }\n\n  .footer-left,\n  .footer-right {\n    width: 100%;\n    justify-content: center;\n  }\n}\n"] }]
     }], () => [{ type: i0.ChangeDetectorRef }], { DialogClose: [{
             type: Output
         }] }); })();