@memberjunction/ng-dashboards 2.55.0 → 2.57.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.
@@ -2,10 +2,9 @@ import { Component, Output, EventEmitter, Input } from '@angular/core';
2
2
  import { RunView } from '@memberjunction/core';
3
3
  import * as i0 from "@angular/core";
4
4
  import * as i1 from "@memberjunction/ng-core-entity-forms";
5
- import * as i2 from "@progress/kendo-angular-layout";
6
- import * as i3 from "@progress/kendo-angular-dialog";
7
- import * as i4 from "@memberjunction/ng-ai-test-harness";
8
- import * as i5 from "./agent-filter-panel.component";
5
+ import * as i2 from "@memberjunction/ng-ai-test-harness";
6
+ import * as i3 from "@progress/kendo-angular-layout";
7
+ import * as i4 from "./agent-filter-panel.component";
9
8
  const _forTrack0 = ($index, $item) => $item.ID;
10
9
  function AgentConfigurationComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
11
10
  i0.ɵɵtext(0, " Hide Filters ");
@@ -14,16 +13,16 @@ function AgentConfigurationComponent_Conditional_9_Template(rf, ctx) { if (rf &
14
13
  i0.ɵɵtext(0, " Show Filters ");
15
14
  } }
16
15
  function AgentConfigurationComponent_Conditional_27_Template(rf, ctx) { if (rf & 1) {
17
- i0.ɵɵelementStart(0, "div", 22)(1, "div", 24)(2, "div", 25);
18
- i0.ɵɵelement(3, "div", 26)(4, "div", 26)(5, "div", 26);
16
+ i0.ɵɵelementStart(0, "div", 22)(1, "div", 23)(2, "div", 24);
17
+ i0.ɵɵelement(3, "div", 25)(4, "div", 25)(5, "div", 25);
19
18
  i0.ɵɵelementEnd();
20
- i0.ɵɵelementStart(6, "div", 27);
19
+ i0.ɵɵelementStart(6, "div", 26);
21
20
  i0.ɵɵtext(7, "Loading agents...");
22
21
  i0.ɵɵelementEnd()()();
23
22
  } }
24
23
  function AgentConfigurationComponent_Conditional_28_Conditional_0_Template(rf, ctx) { if (rf & 1) {
25
24
  const _r1 = i0.ɵɵgetCurrentView();
26
- i0.ɵɵelementStart(0, "div", 28);
25
+ i0.ɵɵelementStart(0, "div", 27);
27
26
  i0.ɵɵelement(1, "i", 4);
28
27
  i0.ɵɵelementStart(2, "h3");
29
28
  i0.ɵɵtext(3, "No agents found");
@@ -31,15 +30,28 @@ function AgentConfigurationComponent_Conditional_28_Conditional_0_Template(rf, c
31
30
  i0.ɵɵelementStart(4, "p");
32
31
  i0.ɵɵtext(5, "No agents match your current filters. Try adjusting your search criteria or create a new agent.");
33
32
  i0.ɵɵelementEnd();
34
- i0.ɵɵelementStart(6, "button", 29);
33
+ i0.ɵɵelementStart(6, "button", 28);
35
34
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_0_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.createNewAgent()); });
36
35
  i0.ɵɵelement(7, "i", 15);
37
36
  i0.ɵɵtext(8, " Create New Agent ");
38
37
  i0.ɵɵelementEnd()();
39
38
  } }
40
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
41
- i0.ɵɵelementStart(0, "span", 40);
42
- i0.ɵɵelement(1, "i", 52);
39
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
40
+ i0.ɵɵelement(0, "img", 36);
41
+ } if (rf & 2) {
42
+ const agent_r4 = i0.ɵɵnextContext().$implicit;
43
+ i0.ɵɵproperty("src", agent_r4.LogoURL, i0.ɵɵsanitizeUrl)("alt", agent_r4.Name + " logo");
44
+ } }
45
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
46
+ i0.ɵɵelement(0, "i");
47
+ } if (rf & 2) {
48
+ const agent_r4 = i0.ɵɵnextContext().$implicit;
49
+ const ctx_r1 = i0.ɵɵnextContext(4);
50
+ i0.ɵɵclassMap(ctx_r1.getAgentIcon(agent_r4));
51
+ } }
52
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
53
+ i0.ɵɵelementStart(0, "span", 41);
54
+ i0.ɵɵelement(1, "i", 53);
43
55
  i0.ɵɵtext(2);
44
56
  i0.ɵɵelementEnd();
45
57
  } if (rf & 2) {
@@ -48,14 +60,14 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
48
60
  i0.ɵɵadvance(2);
49
61
  i0.ɵɵtextInterpolate1(" ", agent_r4.Status, " ");
50
62
  } }
51
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
52
- i0.ɵɵelementStart(0, "span", 40);
53
- i0.ɵɵelement(1, "i", 53);
63
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
64
+ i0.ɵɵelementStart(0, "span", 41);
65
+ i0.ɵɵelement(1, "i", 54);
54
66
  i0.ɵɵtext(2, " Exposed ");
55
67
  i0.ɵɵelementEnd();
56
68
  } }
57
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_16_Template(rf, ctx) { if (rf & 1) {
58
- i0.ɵɵelementStart(0, "p", 45);
69
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_17_Template(rf, ctx) { if (rf & 1) {
70
+ i0.ɵɵelementStart(0, "p", 46);
59
71
  i0.ɵɵtext(1);
60
72
  i0.ɵɵelementEnd();
61
73
  } if (rf & 2) {
@@ -63,16 +75,16 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
63
75
  i0.ɵɵadvance();
64
76
  i0.ɵɵtextInterpolate(agent_r4.Description);
65
77
  } }
66
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_17_Template(rf, ctx) { if (rf & 1) {
67
- i0.ɵɵelementStart(0, "p", 46);
78
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Template(rf, ctx) { if (rf & 1) {
79
+ i0.ɵɵelementStart(0, "p", 47);
68
80
  i0.ɵɵtext(1, "No description provided");
69
81
  i0.ɵɵelementEnd();
70
82
  } }
71
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_2_Template(rf, ctx) { if (rf & 1) {
72
- i0.ɵɵelementStart(0, "div", 55)(1, "span", 56);
83
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Conditional_2_Template(rf, ctx) { if (rf & 1) {
84
+ i0.ɵɵelementStart(0, "div", 56)(1, "span", 57);
73
85
  i0.ɵɵtext(2, "Parent");
74
86
  i0.ɵɵelementEnd();
75
- i0.ɵɵelementStart(3, "span", 57);
87
+ i0.ɵɵelementStart(3, "span", 58);
76
88
  i0.ɵɵtext(4);
77
89
  i0.ɵɵelementEnd()();
78
90
  } if (rf & 2) {
@@ -80,22 +92,22 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
80
92
  i0.ɵɵadvance(4);
81
93
  i0.ɵɵtextInterpolate(agent_r4.Parent);
82
94
  } }
83
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_7_Template(rf, ctx) { if (rf & 1) {
84
- i0.ɵɵelement(0, "i", 58);
95
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Conditional_7_Template(rf, ctx) { if (rf & 1) {
96
+ i0.ɵɵelement(0, "i", 59);
85
97
  i0.ɵɵtext(1, " Enabled ");
86
98
  } }
87
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_8_Template(rf, ctx) { if (rf & 1) {
88
- i0.ɵɵelement(0, "i", 59);
99
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Conditional_8_Template(rf, ctx) { if (rf & 1) {
100
+ i0.ɵɵelement(0, "i", 60);
89
101
  i0.ɵɵtext(1, " Disabled ");
90
102
  } }
91
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Template(rf, ctx) { if (rf & 1) {
92
- i0.ɵɵelementStart(0, "div", 47)(1, "div", 54);
93
- i0.ɵɵtemplate(2, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_2_Template, 5, 1, "div", 55);
94
- i0.ɵɵelementStart(3, "div", 55)(4, "span", 56);
103
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
104
+ i0.ɵɵelementStart(0, "div", 48)(1, "div", 55);
105
+ i0.ɵɵtemplate(2, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Conditional_2_Template, 5, 1, "div", 56);
106
+ i0.ɵɵelementStart(3, "div", 56)(4, "span", 57);
95
107
  i0.ɵɵtext(5, "Context Compression");
96
108
  i0.ɵɵelementEnd();
97
- i0.ɵɵelementStart(6, "span", 57);
98
- i0.ɵɵtemplate(7, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_7_Template, 2, 0)(8, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_8_Template, 2, 0);
109
+ i0.ɵɵelementStart(6, "span", 58);
110
+ i0.ɵɵtemplate(7, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Conditional_7_Template, 2, 0)(8, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Conditional_8_Template, 2, 0);
99
111
  i0.ɵɵelementEnd()()()();
100
112
  } if (rf & 2) {
101
113
  const agent_r4 = i0.ɵɵnextContext().$implicit;
@@ -104,41 +116,41 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
104
116
  i0.ɵɵadvance(5);
105
117
  i0.ɵɵconditional(agent_r4.EnableContextCompression ? 7 : 8);
106
118
  } }
107
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_23_Template(rf, ctx) { if (rf & 1) {
119
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_24_Template(rf, ctx) { if (rf & 1) {
108
120
  const _r5 = i0.ɵɵgetCurrentView();
109
- i0.ɵɵelementStart(0, "button", 60);
110
- i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_23_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const agent_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.runAgent(agent_r4)); });
111
- i0.ɵɵelement(1, "i", 61);
121
+ i0.ɵɵelementStart(0, "button", 61);
122
+ i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_24_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const agent_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.runAgent(agent_r4)); });
123
+ i0.ɵɵelement(1, "i", 62);
112
124
  i0.ɵɵtext(2, " Run ");
113
125
  i0.ɵɵelementEnd();
114
126
  } }
115
127
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template(rf, ctx) { if (rf & 1) {
116
128
  const _r3 = i0.ɵɵgetCurrentView();
117
- i0.ɵɵelementStart(0, "div", 33)(1, "div", 34);
129
+ i0.ɵɵelementStart(0, "div", 32)(1, "div", 33);
118
130
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template_div_click_1_listener() { const agent_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.toggleAgentExpansion(agent_r4.ID)); });
119
- i0.ɵɵelementStart(2, "div", 35)(3, "div", 36);
120
- i0.ɵɵelement(4, "i");
131
+ i0.ɵɵelementStart(2, "div", 34)(3, "div", 35);
132
+ i0.ɵɵtemplate(4, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_4_Template, 1, 2, "img", 36)(5, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_5_Template, 1, 2, "i", 37);
121
133
  i0.ɵɵelementEnd();
122
- i0.ɵɵelementStart(5, "div", 37)(6, "h4", 38);
123
- i0.ɵɵtext(7);
134
+ i0.ɵɵelementStart(6, "div", 38)(7, "h4", 39);
135
+ i0.ɵɵtext(8);
124
136
  i0.ɵɵelementEnd();
125
- i0.ɵɵelementStart(8, "div", 39)(9, "span", 40);
126
- i0.ɵɵelement(10, "i", 41);
127
- i0.ɵɵtext(11);
137
+ i0.ɵɵelementStart(9, "div", 40)(10, "span", 41);
138
+ i0.ɵɵelement(11, "i", 42);
139
+ i0.ɵɵtext(12);
128
140
  i0.ɵɵelementEnd();
129
- i0.ɵɵtemplate(12, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_12_Template, 3, 3, "span", 42)(13, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_13_Template, 3, 0, "span", 40);
141
+ i0.ɵɵtemplate(13, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_13_Template, 3, 3, "span", 43)(14, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_14_Template, 3, 0, "span", 41);
130
142
  i0.ɵɵelementEnd()()();
131
- i0.ɵɵelement(14, "i", 43);
143
+ i0.ɵɵelement(15, "i", 44);
132
144
  i0.ɵɵelementEnd();
133
- i0.ɵɵelementStart(15, "div", 44);
134
- i0.ɵɵtemplate(16, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_16_Template, 2, 1, "p", 45)(17, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_17_Template, 2, 0, "p", 46)(18, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Template, 9, 2, "div", 47);
145
+ i0.ɵɵelementStart(16, "div", 45);
146
+ i0.ɵɵtemplate(17, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_17_Template, 2, 1, "p", 46)(18, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Template, 2, 0, "p", 47)(19, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_19_Template, 9, 2, "div", 48);
135
147
  i0.ɵɵelementEnd();
136
- i0.ɵɵelementStart(19, "div", 48)(20, "button", 49);
137
- i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template_button_click_20_listener() { const agent_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openAgentRecord(agent_r4.ID)); });
138
- i0.ɵɵelement(21, "i", 50);
139
- i0.ɵɵtext(22, " Open ");
148
+ i0.ɵɵelementStart(20, "div", 49)(21, "button", 50);
149
+ i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template_button_click_21_listener() { const agent_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openAgentRecord(agent_r4.ID)); });
150
+ i0.ɵɵelement(22, "i", 51);
151
+ i0.ɵɵtext(23, " Open ");
140
152
  i0.ɵɵelementEnd();
141
- i0.ɵɵtemplate(23, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_23_Template, 3, 0, "button", 51);
153
+ i0.ɵɵtemplate(24, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_24_Template, 3, 0, "button", 52);
142
154
  i0.ɵɵelementEnd()();
143
155
  } if (rf & 2) {
144
156
  const agent_r4 = ctx.$implicit;
@@ -147,35 +159,48 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
147
159
  i0.ɵɵadvance(3);
148
160
  i0.ɵɵstyleProp("background-color", ctx_r1.getAgentIconColor(agent_r4));
149
161
  i0.ɵɵadvance();
150
- i0.ɵɵclassMap(ctx_r1.getExecutionModeIcon(agent_r4.ExecutionMode));
151
- i0.ɵɵadvance(3);
162
+ i0.ɵɵconditional(ctx_r1.hasLogoURL(agent_r4) ? 4 : 5);
163
+ i0.ɵɵadvance(4);
152
164
  i0.ɵɵtextInterpolate(agent_r4.Name);
153
165
  i0.ɵɵadvance(4);
154
166
  i0.ɵɵtextInterpolate1(" ", agent_r4.ExecutionMode, " ");
155
167
  i0.ɵɵadvance();
156
- i0.ɵɵconditional(agent_r4.Status ? 12 : -1);
168
+ i0.ɵɵconditional(agent_r4.Status ? 13 : -1);
157
169
  i0.ɵɵadvance();
158
- i0.ɵɵconditional(agent_r4.ExposeAsAction ? 13 : -1);
170
+ i0.ɵɵconditional(agent_r4.ExposeAsAction ? 14 : -1);
159
171
  i0.ɵɵadvance();
160
172
  i0.ɵɵclassProp("rotated", ctx_r1.expandedAgentId === agent_r4.ID);
161
173
  i0.ɵɵadvance(2);
162
- i0.ɵɵconditional(agent_r4.Description ? 16 : 17);
174
+ i0.ɵɵconditional(agent_r4.Description ? 17 : 18);
163
175
  i0.ɵɵadvance(2);
164
- i0.ɵɵconditional(ctx_r1.expandedAgentId === agent_r4.ID ? 18 : -1);
176
+ i0.ɵɵconditional(ctx_r1.expandedAgentId === agent_r4.ID ? 19 : -1);
165
177
  i0.ɵɵadvance(5);
166
- i0.ɵɵconditional(agent_r4.Status === "Active" ? 23 : -1);
178
+ i0.ɵɵconditional(agent_r4.Status === "Active" ? 24 : -1);
167
179
  } }
168
180
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
169
- i0.ɵɵelementStart(0, "div", 30);
170
- i0.ɵɵrepeaterCreate(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template, 24, 15, "div", 32, _forTrack0);
181
+ i0.ɵɵelementStart(0, "div", 29);
182
+ i0.ɵɵrepeaterCreate(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template, 25, 14, "div", 31, _forTrack0);
171
183
  i0.ɵɵelementEnd();
172
184
  } if (rf & 2) {
173
185
  const ctx_r1 = i0.ɵɵnextContext(3);
174
186
  i0.ɵɵadvance();
175
187
  i0.ɵɵrepeater(ctx_r1.filteredAgents);
176
188
  } }
177
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_8_Template(rf, ctx) { if (rf & 1) {
178
- i0.ɵɵelementStart(0, "div", 65);
189
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_4_Template(rf, ctx) { if (rf & 1) {
190
+ i0.ɵɵelement(0, "img", 66);
191
+ } if (rf & 2) {
192
+ const agent_r7 = i0.ɵɵnextContext().$implicit;
193
+ i0.ɵɵproperty("src", agent_r7.LogoURL, i0.ɵɵsanitizeUrl)("alt", agent_r7.Name + " logo");
194
+ } }
195
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_5_Template(rf, ctx) { if (rf & 1) {
196
+ i0.ɵɵelement(0, "i");
197
+ } if (rf & 2) {
198
+ const agent_r7 = i0.ɵɵnextContext().$implicit;
199
+ const ctx_r1 = i0.ɵɵnextContext(4);
200
+ i0.ɵɵclassMap(ctx_r1.getAgentIcon(agent_r7));
201
+ } }
202
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_9_Template(rf, ctx) { if (rf & 1) {
203
+ i0.ɵɵelementStart(0, "div", 67);
179
204
  i0.ɵɵtext(1);
180
205
  i0.ɵɵelementEnd();
181
206
  } if (rf & 2) {
@@ -183,35 +208,35 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
183
208
  i0.ɵɵadvance();
184
209
  i0.ɵɵtextInterpolate(agent_r7.Description);
185
210
  } }
186
- function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_20_Template(rf, ctx) { if (rf & 1) {
211
+ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_21_Template(rf, ctx) { if (rf & 1) {
187
212
  const _r8 = i0.ɵɵgetCurrentView();
188
- i0.ɵɵelementStart(0, "button", 71);
189
- i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_20_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r8); const agent_r7 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.runAgent(agent_r7)); });
190
- i0.ɵɵelement(1, "i", 61);
213
+ i0.ɵɵelementStart(0, "button", 73);
214
+ i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_21_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r8); const agent_r7 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.runAgent(agent_r7)); });
215
+ i0.ɵɵelement(1, "i", 62);
191
216
  i0.ɵɵelementEnd();
192
217
  } }
193
218
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Template(rf, ctx) { if (rf & 1) {
194
219
  const _r6 = i0.ɵɵgetCurrentView();
195
- i0.ɵɵelementStart(0, "tr")(1, "td")(2, "div", 63)(3, "div", 64);
196
- i0.ɵɵelement(4, "i");
220
+ i0.ɵɵelementStart(0, "tr")(1, "td")(2, "div", 64)(3, "div", 65);
221
+ i0.ɵɵtemplate(4, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_4_Template, 1, 2, "img", 66)(5, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_5_Template, 1, 2, "i", 37);
197
222
  i0.ɵɵelementEnd();
198
- i0.ɵɵelementStart(5, "div")(6, "div", 38);
199
- i0.ɵɵtext(7);
223
+ i0.ɵɵelementStart(6, "div")(7, "div", 39);
224
+ i0.ɵɵtext(8);
200
225
  i0.ɵɵelementEnd();
201
- i0.ɵɵtemplate(8, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_8_Template, 2, 1, "div", 65);
226
+ i0.ɵɵtemplate(9, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_9_Template, 2, 1, "div", 67);
202
227
  i0.ɵɵelementEnd()()();
203
- i0.ɵɵelementStart(9, "td")(10, "span", 66);
204
- i0.ɵɵtext(11);
228
+ i0.ɵɵelementStart(10, "td")(11, "span", 68);
229
+ i0.ɵɵtext(12);
205
230
  i0.ɵɵelementEnd()();
206
- i0.ɵɵelementStart(12, "td")(13, "span", 67);
207
- i0.ɵɵelement(14, "i");
208
- i0.ɵɵtext(15);
231
+ i0.ɵɵelementStart(13, "td")(14, "span", 69);
232
+ i0.ɵɵelement(15, "i");
233
+ i0.ɵɵtext(16);
209
234
  i0.ɵɵelementEnd()();
210
- i0.ɵɵelementStart(16, "td")(17, "div", 68)(18, "button", 69);
211
- i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Template_button_click_18_listener() { const agent_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openAgentRecord(agent_r7.ID)); });
212
- i0.ɵɵelement(19, "i", 50);
235
+ i0.ɵɵelementStart(17, "td")(18, "div", 70)(19, "button", 71);
236
+ i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Template_button_click_19_listener() { const agent_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openAgentRecord(agent_r7.ID)); });
237
+ i0.ɵɵelement(20, "i", 51);
213
238
  i0.ɵɵelementEnd();
214
- i0.ɵɵtemplate(20, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_20_Template, 2, 0, "button", 70);
239
+ i0.ɵɵtemplate(21, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_21_Template, 2, 0, "button", 72);
215
240
  i0.ɵɵelementEnd()()();
216
241
  } if (rf & 2) {
217
242
  const agent_r7 = ctx.$implicit;
@@ -219,11 +244,11 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
219
244
  i0.ɵɵadvance(3);
220
245
  i0.ɵɵstyleProp("background-color", ctx_r1.getAgentIconColor(agent_r7));
221
246
  i0.ɵɵadvance();
222
- i0.ɵɵclassMap(ctx_r1.getExecutionModeIcon(agent_r7.ExecutionMode));
223
- i0.ɵɵadvance(3);
247
+ i0.ɵɵconditional(ctx_r1.hasLogoURL(agent_r7) ? 4 : 5);
248
+ i0.ɵɵadvance(4);
224
249
  i0.ɵɵtextInterpolate(agent_r7.Name);
225
250
  i0.ɵɵadvance();
226
- i0.ɵɵconditional(agent_r7.Description ? 8 : -1);
251
+ i0.ɵɵconditional(agent_r7.Description ? 9 : -1);
227
252
  i0.ɵɵadvance(2);
228
253
  i0.ɵɵclassMap("status-" + (agent_r7.Status || "unknown").toLowerCase());
229
254
  i0.ɵɵadvance();
@@ -233,10 +258,10 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
233
258
  i0.ɵɵadvance();
234
259
  i0.ɵɵtextInterpolate1(" ", agent_r7.ExecutionMode, " ");
235
260
  i0.ɵɵadvance(5);
236
- i0.ɵɵconditional(agent_r7.Status === "Active" ? 20 : -1);
261
+ i0.ɵɵconditional(agent_r7.Status === "Active" ? 21 : -1);
237
262
  } }
238
263
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
239
- i0.ɵɵelementStart(0, "div", 31)(1, "table", 62)(2, "thead")(3, "tr")(4, "th");
264
+ i0.ɵɵelementStart(0, "div", 30)(1, "table", 63)(2, "thead")(3, "tr")(4, "th");
240
265
  i0.ɵɵtext(5, "Name");
241
266
  i0.ɵɵelementEnd();
242
267
  i0.ɵɵelementStart(6, "th");
@@ -249,7 +274,7 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
249
274
  i0.ɵɵtext(11, "Actions");
250
275
  i0.ɵɵelementEnd()()();
251
276
  i0.ɵɵelementStart(12, "tbody");
252
- i0.ɵɵrepeaterCreate(13, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Template, 21, 13, "tr", null, _forTrack0);
277
+ i0.ɵɵrepeaterCreate(13, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Template, 22, 12, "tr", null, _forTrack0);
253
278
  i0.ɵɵelementEnd()()();
254
279
  } if (rf & 2) {
255
280
  const ctx_r1 = i0.ɵɵnextContext(3);
@@ -257,7 +282,7 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
257
282
  i0.ɵɵrepeater(ctx_r1.filteredAgents);
258
283
  } }
259
284
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Template(rf, ctx) { if (rf & 1) {
260
- i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_Template, 3, 0, "div", 30)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_Template, 15, 0, "div", 31);
285
+ i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_Template, 3, 0, "div", 29)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_Template, 15, 0, "div", 30);
261
286
  } if (rf & 2) {
262
287
  const ctx_r1 = i0.ɵɵnextContext(2);
263
288
  i0.ɵɵconditional(ctx_r1.viewMode === "grid" ? 0 : -1);
@@ -265,28 +290,15 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Template(rf, c
265
290
  i0.ɵɵconditional(ctx_r1.viewMode === "list" ? 1 : -1);
266
291
  } }
267
292
  function AgentConfigurationComponent_Conditional_28_Template(rf, ctx) { if (rf & 1) {
268
- i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_0_Template, 9, 0, "div", 28)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Template, 2, 2);
293
+ i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_0_Template, 9, 0, "div", 27)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Template, 2, 2);
269
294
  } if (rf & 2) {
270
295
  const ctx_r1 = i0.ɵɵnextContext();
271
296
  i0.ɵɵconditional(ctx_r1.filteredAgents.length === 0 ? 0 : 1);
272
297
  } }
273
- function AgentConfigurationComponent_Conditional_29_Template(rf, ctx) { if (rf & 1) {
274
- const _r9 = i0.ɵɵgetCurrentView();
275
- i0.ɵɵelementStart(0, "kendo-window", 72);
276
- i0.ɵɵlistener("close", function AgentConfigurationComponent_Conditional_29_Template_kendo_window_close_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeTestHarness()); });
277
- i0.ɵɵelementStart(1, "mj-ai-test-harness", 73);
278
- i0.ɵɵlistener("visibilityChange", function AgentConfigurationComponent_Conditional_29_Template_mj_ai_test_harness_visibilityChange_1_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeTestHarness()); });
279
- i0.ɵɵelementEnd()();
280
- } if (rf & 2) {
281
- const ctx_r1 = i0.ɵɵnextContext();
282
- i0.ɵɵpropertyInterpolate1("title", "Run AI Agent - ", ctx_r1.selectedAgentForTest.Name || "Untitled", "");
283
- i0.ɵɵproperty("width", 1200)("height", 800)("minWidth", 800)("minHeight", 600)("draggable", true)("resizable", true)("state", "default");
284
- i0.ɵɵadvance();
285
- i0.ɵɵproperty("aiAgent", ctx_r1.selectedAgentForTest)("isVisible", true);
286
- } }
287
298
  export class AgentConfigurationComponent {
288
299
  newAgentDialogService;
289
300
  viewContainerRef;
301
+ testHarnessService;
290
302
  initialState = null;
291
303
  openEntityRecord = new EventEmitter();
292
304
  stateChange = new EventEmitter();
@@ -305,9 +317,10 @@ export class AgentConfigurationComponent {
305
317
  exposeAsAction: 'all'
306
318
  };
307
319
  selectedAgentForTest = null;
308
- constructor(newAgentDialogService, viewContainerRef) {
320
+ constructor(newAgentDialogService, viewContainerRef, testHarnessService) {
309
321
  this.newAgentDialogService = newAgentDialogService;
310
322
  this.viewContainerRef = viewContainerRef;
323
+ this.testHarnessService = testHarnessService;
311
324
  }
312
325
  ngOnInit() {
313
326
  if (this.initialState) {
@@ -449,9 +462,11 @@ export class AgentConfigurationComponent {
449
462
  });
450
463
  }
451
464
  runAgent(agent) {
452
- this.selectedAgentForTest = agent;
465
+ // Use the test harness service for window management features
466
+ this.testHarnessService.openForAgent(agent.ID);
453
467
  }
454
468
  closeTestHarness() {
469
+ // No longer needed - window manages its own closure
455
470
  this.selectedAgentForTest = null;
456
471
  }
457
472
  getAgentIconColor(agent) {
@@ -477,8 +492,25 @@ export class AgentConfigurationComponent {
477
492
  default: return 'fa-solid fa-robot';
478
493
  }
479
494
  }
480
- static ɵfac = function AgentConfigurationComponent_Factory(t) { return new (t || AgentConfigurationComponent)(i0.ɵɵdirectiveInject(i1.NewAgentDialogService), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); };
481
- static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AgentConfigurationComponent, selectors: [["app-agent-configuration"]], inputs: { initialState: "initialState" }, outputs: { openEntityRecord: "openEntityRecord", stateChange: "stateChange" }, decls: 30, vars: 19, consts: [[1, "agent-configuration-container"], [1, "dashboard-header"], [1, "header-info"], [1, "dashboard-title"], [1, "fa-solid", "fa-robot"], ["type", "button", "title", "Toggle Filters", 1, "filter-toggle-btn", 3, "click"], [1, "fa-solid", "fa-filter"], [1, "item-count"], [1, "header-controls"], [1, "view-toggle"], ["type", "button", "title", "Grid View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["type", "button", "title", "List View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["type", "button", "title", "Create New Agent", 1, "control-btn", "primary", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "main-content"], ["orientation", "horizontal", 1, "main-splitter", 3, "layoutChange"], [3, "size", "collapsible", "resizable", "scrollable", "hidden"], [3, "filtersChange", "filterChange", "resetFilters", "closePanel", "agents", "filteredAgents", "filters"], [3, "resizable", "scrollable"], [1, "agents-content"], [1, "loading-container"], [3, "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [1, "loading-content"], [1, "loading-spinner"], [1, "spinner-ring"], [1, "loading-text"], [1, "empty-state"], ["type", "button", 1, "empty-state-btn", 3, "click"], [1, "agents-grid"], [1, "agents-list"], [1, "agent-card", 3, "expanded"], [1, "agent-card"], [1, "card-header", 3, "click"], [1, "agent-info"], [1, "agent-icon"], [1, "agent-details"], [1, "agent-name"], [1, "agent-meta"], [1, "meta-item"], [1, "fa-solid", "fa-microchip"], [1, "meta-item", 3, "class"], [1, "fa-solid", "fa-chevron-down", "expand-icon"], [1, "card-body"], [1, "agent-description"], [1, "agent-description", "text-muted"], [1, "expanded-content"], [1, "card-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary"], [1, "fa-solid", "fa-circle", 2, "font-size", "8px"], [1, "fa-solid", "fa-bolt"], [1, "agent-stats"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "fa-solid", "fa-check", 2, "color", "#28a745"], [1, "fa-solid", "fa-times", 2, "color", "#dc3545"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary", 3, "click"], [1, "fa-solid", "fa-play"], [1, "agents-table"], [1, "agent-name-cell"], [1, "agent-icon-small"], [1, "agent-description-small"], [1, "status-badge"], [1, "execution-mode"], [1, "table-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn-small", 3, "click"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary", 3, "click"], [3, "close", "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [3, "visibilityChange", "aiAgent", "isVisible"]], template: function AgentConfigurationComponent_Template(rf, ctx) { if (rf & 1) {
495
+ /**
496
+ * Gets the agent's display icon
497
+ * Prioritizes LogoURL, falls back to IconClass, then default robot icon
498
+ */
499
+ getAgentIcon(agent) {
500
+ if (agent?.LogoURL) {
501
+ // LogoURL is used in img tag, not here
502
+ return '';
503
+ }
504
+ return agent?.IconClass || 'fa-solid fa-robot';
505
+ }
506
+ /**
507
+ * Checks if the agent has a logo URL (for image display)
508
+ */
509
+ hasLogoURL(agent) {
510
+ return !!agent?.LogoURL;
511
+ }
512
+ static ɵfac = function AgentConfigurationComponent_Factory(t) { return new (t || AgentConfigurationComponent)(i0.ɵɵdirectiveInject(i1.NewAgentDialogService), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(i2.AITestHarnessDialogService)); };
513
+ static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AgentConfigurationComponent, selectors: [["app-agent-configuration"]], inputs: { initialState: "initialState" }, outputs: { openEntityRecord: "openEntityRecord", stateChange: "stateChange" }, decls: 29, vars: 18, consts: [[1, "agent-configuration-container"], [1, "dashboard-header"], [1, "header-info"], [1, "dashboard-title"], [1, "fa-solid", "fa-robot"], ["type", "button", "title", "Toggle Filters", 1, "filter-toggle-btn", 3, "click"], [1, "fa-solid", "fa-filter"], [1, "item-count"], [1, "header-controls"], [1, "view-toggle"], ["type", "button", "title", "Grid View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["type", "button", "title", "List View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["type", "button", "title", "Create New Agent", 1, "control-btn", "primary", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "main-content"], ["orientation", "horizontal", 1, "main-splitter", 3, "layoutChange"], [3, "size", "collapsible", "resizable", "scrollable", "hidden"], [3, "filtersChange", "filterChange", "resetFilters", "closePanel", "agents", "filteredAgents", "filters"], [3, "resizable", "scrollable"], [1, "agents-content"], [1, "loading-container"], [1, "loading-content"], [1, "loading-spinner"], [1, "spinner-ring"], [1, "loading-text"], [1, "empty-state"], ["type", "button", 1, "empty-state-btn", 3, "click"], [1, "agents-grid"], [1, "agents-list"], [1, "agent-card", 3, "expanded"], [1, "agent-card"], [1, "card-header", 3, "click"], [1, "agent-info"], [1, "agent-icon"], [1, "agent-logo", 3, "src", "alt"], [3, "class"], [1, "agent-details"], [1, "agent-name"], [1, "agent-meta"], [1, "meta-item"], [1, "fa-solid", "fa-microchip"], [1, "meta-item", 3, "class"], [1, "fa-solid", "fa-chevron-down", "expand-icon"], [1, "card-body"], [1, "agent-description"], [1, "agent-description", "text-muted"], [1, "expanded-content"], [1, "card-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary"], [1, "fa-solid", "fa-circle", 2, "font-size", "8px"], [1, "fa-solid", "fa-bolt"], [1, "agent-stats"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "fa-solid", "fa-check", 2, "color", "#28a745"], [1, "fa-solid", "fa-times", 2, "color", "#dc3545"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary", 3, "click"], [1, "fa-solid", "fa-play"], [1, "agents-table"], [1, "agent-name-cell"], [1, "agent-icon-small"], [1, "agent-logo-small", 3, "src", "alt"], [1, "agent-description-small"], [1, "status-badge"], [1, "execution-mode"], [1, "table-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn-small", 3, "click"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary", 3, "click"]], template: function AgentConfigurationComponent_Template(rf, ctx) { if (rf & 1) {
482
514
  i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "h2", 3);
483
515
  i0.ɵɵelement(4, "i", 4);
484
516
  i0.ɵɵtext(5, " Agent Configuration ");
@@ -512,7 +544,6 @@ export class AgentConfigurationComponent {
512
544
  i0.ɵɵelementStart(25, "kendo-splitter-pane", 20)(26, "div", 21);
513
545
  i0.ɵɵtemplate(27, AgentConfigurationComponent_Conditional_27_Template, 8, 0, "div", 22)(28, AgentConfigurationComponent_Conditional_28_Template, 2, 1);
514
546
  i0.ɵɵelementEnd()()()()();
515
- i0.ɵɵtemplate(29, AgentConfigurationComponent_Conditional_29_Template, 2, 11, "kendo-window", 23);
516
547
  } if (rf & 2) {
517
548
  i0.ɵɵadvance(8);
518
549
  i0.ɵɵconditional(ctx.filterPanelVisible ? 8 : 9);
@@ -532,19 +563,17 @@ export class AgentConfigurationComponent {
532
563
  i0.ɵɵconditional(ctx.isLoading ? 27 : -1);
533
564
  i0.ɵɵadvance();
534
565
  i0.ɵɵconditional(!ctx.isLoading ? 28 : -1);
535
- i0.ɵɵadvance();
536
- i0.ɵɵconditional(ctx.selectedAgentForTest ? 29 : -1);
537
- } }, dependencies: [i2.SplitterComponent, i2.SplitterPaneComponent, i3.WindowComponent, i4.AITestHarnessComponent, i5.AgentFilterPanelComponent], styles: ["\n\n.agent-configuration-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n\n\n.dashboard-header[_ngcontent-%COMP%] {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n\n\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n color: #495057;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.main-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content[_ngcontent-%COMP%] {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n\n\n.agents-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card[_ngcontent-%COMP%]:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded[_ngcontent-%COMP%] {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header[_ngcontent-%COMP%] {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 20px;\n}\n\n.agent-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.meta-item.status-active[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.meta-item.status-pending[_ngcontent-%COMP%] {\n color: #ffc107;\n}\n\n.meta-item.status-disabled[_ngcontent-%COMP%] {\n color: #6c757d;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated[_ngcontent-%COMP%] {\n transform: rotate(180deg);\n}\n\n.card-body[_ngcontent-%COMP%] {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description[_ngcontent-%COMP%] {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted[_ngcontent-%COMP%] {\n font-style: italic;\n color: #adb5bd;\n}\n\n\n\n.expanded-content[_ngcontent-%COMP%] {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n\n\n.card-actions[_ngcontent-%COMP%] {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.agents-list[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table[_ngcontent-%COMP%] thead[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%] {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n}\n\n.agents-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 16px;\n}\n\n.agent-description-small[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending[_ngcontent-%COMP%] {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled[_ngcontent-%COMP%] {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown[_ngcontent-%COMP%] {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%] {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: _ngcontent-%COMP%_spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes _ngcontent-%COMP%_spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n}\n\n\n\n@media (max-width: 768px) {\n .dashboard-header[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .header-controls[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .agents-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n \n .agent-stats[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}"] });
566
+ } }, dependencies: [i3.SplitterComponent, i3.SplitterPaneComponent, i4.AgentFilterPanelComponent], styles: ["\n\n.agent-configuration-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n\n\n.dashboard-header[_ngcontent-%COMP%] {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n\n\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n color: #495057;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.main-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content[_ngcontent-%COMP%] {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n\n\n.agents-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card[_ngcontent-%COMP%]:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded[_ngcontent-%COMP%] {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header[_ngcontent-%COMP%] {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 20px;\n}\n\n.agent-icon[_ngcontent-%COMP%] .agent-logo[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 10px;\n}\n\n.agent-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.meta-item.status-active[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.meta-item.status-pending[_ngcontent-%COMP%] {\n color: #ffc107;\n}\n\n.meta-item.status-disabled[_ngcontent-%COMP%] {\n color: #6c757d;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated[_ngcontent-%COMP%] {\n transform: rotate(180deg);\n}\n\n.card-body[_ngcontent-%COMP%] {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description[_ngcontent-%COMP%] {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted[_ngcontent-%COMP%] {\n font-style: italic;\n color: #adb5bd;\n}\n\n\n\n.expanded-content[_ngcontent-%COMP%] {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n\n\n.card-actions[_ngcontent-%COMP%] {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.agents-list[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table[_ngcontent-%COMP%] thead[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%] {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n}\n\n.agents-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 16px;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] .agent-logo-small[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 8px;\n}\n\n.agent-description-small[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending[_ngcontent-%COMP%] {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled[_ngcontent-%COMP%] {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown[_ngcontent-%COMP%] {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%] {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: _ngcontent-%COMP%_spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes _ngcontent-%COMP%_spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n}\n\n\n\n@media (max-width: 768px) {\n .dashboard-header[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .header-controls[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .agents-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n \n .agent-stats[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}"] });
538
567
  }
539
568
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AgentConfigurationComponent, [{
540
569
  type: Component,
541
- args: [{ selector: 'app-agent-configuration', template: "<div class=\"agent-configuration-container\">\n <!-- Header -->\n <div class=\"dashboard-header\">\n <div class=\"header-info\">\n <h2 class=\"dashboard-title\">\n <i class=\"fa-solid fa-robot\"></i>\n Agent Configuration\n </h2>\n <button \n type=\"button\" \n class=\"filter-toggle-btn\"\n (click)=\"toggleFilterPanel()\"\n title=\"Toggle Filters\">\n <i class=\"fa-solid fa-filter\"></i>\n @if (filterPanelVisible) {\n Hide Filters\n } @else {\n Show Filters\n }\n </button>\n <span class=\"item-count\">{{ filteredAgents.length }} agents</span>\n </div>\n \n <div class=\"header-controls\">\n <div class=\"view-toggle\">\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"setViewMode('grid')\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-grip\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"setViewMode('list')\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n </div>\n \n <button \n type=\"button\" \n class=\"control-btn primary\"\n (click)=\"createNewAgent()\"\n title=\"Create New Agent\">\n <i class=\"fa-solid fa-plus\"></i>\n New Agent\n </button>\n </div>\n </div>\n\n <!-- Main Content with Splitter -->\n <div class=\"main-content\" >\n <kendo-splitter \n class=\"main-splitter\"\n orientation=\"horizontal\"\n (layoutChange)=\"onMainSplitterChange($event)\"\n >\n \n <!-- Filter Panel (Left) -->\n <kendo-splitter-pane \n [size]=\"filterPanelVisible ? '320px' : '0px'\"\n [collapsible]=\"false\"\n [resizable]=\"filterPanelVisible\"\n [scrollable]=\"false\"\n [hidden]=\"!filterPanelVisible\">\n <mj-agent-filter-panel\n [agents]=\"agents\"\n [filteredAgents]=\"filteredAgents\"\n [filters]=\"currentFilters\"\n (filtersChange)=\"onFiltersChange($event)\"\n (filterChange)=\"onFilterChange()\"\n (resetFilters)=\"onResetFilters()\"\n (closePanel)=\"toggleFilterPanel()\">\n </mj-agent-filter-panel>\n </kendo-splitter-pane>\n \n <!-- Agents List Panel -->\n <kendo-splitter-pane \n [resizable]=\"true\"\n [scrollable]=\"false\">\n <div class=\"agents-content\">\n <!-- Loading State -->\n @if (isLoading) {\n <div class=\"loading-container\">\n <div class=\"loading-content\">\n <div class=\"loading-spinner\">\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n </div>\n <div class=\"loading-text\">Loading agents...</div>\n </div>\n </div>\n }\n\n <!-- Agents Display -->\n @if (!isLoading) {\n @if (filteredAgents.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-robot\"></i>\n <h3>No agents found</h3>\n <p>No agents match your current filters. Try adjusting your search criteria or create a new agent.</p>\n <button \n type=\"button\" \n class=\"empty-state-btn\"\n (click)=\"createNewAgent()\">\n <i class=\"fa-solid fa-plus\"></i>\n Create New Agent\n </button>\n </div>\n } @else {\n <!-- Grid View -->\n @if (viewMode === 'grid') {\n <div class=\"agents-grid\">\n @for (agent of filteredAgents; track agent.ID) {\n <div class=\"agent-card\" [class.expanded]=\"expandedAgentId === agent.ID\">\n <!-- Card Header -->\n <div class=\"card-header\" (click)=\"toggleAgentExpansion(agent.ID)\">\n <div class=\"agent-info\">\n <div class=\"agent-icon\" [style.background-color]=\"getAgentIconColor(agent)\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n </div>\n <div class=\"agent-details\">\n <h4 class=\"agent-name\">{{ agent.Name }}</h4>\n <div class=\"agent-meta\">\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-microchip\"></i>\n {{ agent.ExecutionMode }}\n </span>\n @if (agent.Status) {\n <span class=\"meta-item\" [class]=\"'status-' + agent.Status.toLowerCase()\">\n <i class=\"fa-solid fa-circle\" style=\"font-size: 8px;\"></i>\n {{ agent.Status }}\n </span>\n }\n @if (agent.ExposeAsAction) {\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-bolt\"></i>\n Exposed\n </span>\n }\n </div>\n </div>\n </div>\n \n <i class=\"fa-solid fa-chevron-down expand-icon\" \n [class.rotated]=\"expandedAgentId === agent.ID\"></i>\n </div>\n\n <!-- Card Body -->\n <div class=\"card-body\">\n @if (agent.Description) {\n <p class=\"agent-description\">{{ agent.Description }}</p>\n } @else {\n <p class=\"agent-description text-muted\">No description provided</p>\n }\n \n <!-- Expandable Content -->\n @if (expandedAgentId === agent.ID) {\n <div class=\"expanded-content\">\n <div class=\"agent-stats\">\n @if (agent.Parent) {\n <div class=\"stat-item\">\n <span class=\"stat-label\">Parent</span>\n <span class=\"stat-value\">{{ agent.Parent }}</span>\n </div>\n }\n <div class=\"stat-item\">\n <span class=\"stat-label\">Context Compression</span>\n <span class=\"stat-value\">\n @if (agent.EnableContextCompression) {\n <i class=\"fa-solid fa-check\" style=\"color: #28a745;\"></i> Enabled\n } @else {\n <i class=\"fa-solid fa-times\" style=\"color: #dc3545;\"></i> Disabled\n }\n </span>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Card Actions -->\n <div class=\"card-actions\">\n <button \n type=\"button\" \n class=\"action-btn\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n Open\n </button>\n \n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn action-btn-primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n Run\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n \n <!-- List View -->\n @if (viewMode === 'list') {\n <div class=\"agents-list\">\n <table class=\"agents-table\">\n <thead>\n <tr>\n <th>Name</th>\n <th>Status</th>\n <th>Execution Mode</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (agent of filteredAgents; track agent.ID) {\n <tr>\n <td>\n <div class=\"agent-name-cell\">\n <div class=\"agent-icon-small\" [style.background-color]=\"getAgentIconColor(agent)\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n </div>\n <div>\n <div class=\"agent-name\">{{ agent.Name }}</div>\n @if (agent.Description) {\n <div class=\"agent-description-small\">{{ agent.Description }}</div>\n }\n </div>\n </div>\n </td>\n <td>\n <span class=\"status-badge\" [class]=\"'status-' + (agent.Status || 'unknown').toLowerCase()\">\n {{ agent.Status || 'Unknown' }}\n </span>\n </td>\n <td>\n <span class=\"execution-mode\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n {{ agent.ExecutionMode }}\n </span>\n </td>\n <td>\n <div class=\"table-actions\">\n <button \n type=\"button\" \n class=\"action-btn-small\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n </button>\n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn-small primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n </button>\n }\n </div>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n }\n }\n </div>\n </kendo-splitter-pane>\n </kendo-splitter>\n </div>\n</div>\n\n<!-- AI Agent Test Harness -->\n@if (selectedAgentForTest) {\n <kendo-window \n [width]=\"1200\" \n [height]=\"800\" \n [minWidth]=\"800\"\n [minHeight]=\"600\"\n [draggable]=\"true\"\n [resizable]=\"true\"\n [state]=\"'default'\"\n (close)=\"closeTestHarness()\"\n title=\"Run AI Agent - {{ selectedAgentForTest.Name || 'Untitled' }}\">\n <mj-ai-test-harness\n [aiAgent]=\"selectedAgentForTest\"\n [isVisible]=\"true\"\n (visibilityChange)=\"closeTestHarness()\">\n </mj-ai-test-harness>\n </kendo-window>\n}", styles: ["/* Agent Configuration Component - Modern Design */\n.agent-configuration-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n/* Dashboard Header */\n.dashboard-header {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title i {\n color: #17a2b8;\n}\n\n.filter-toggle-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n/* View Toggle */\n.view-toggle {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn:hover {\n color: #495057;\n}\n\n.view-btn.active {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Main Content */\n.main-content {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n/* Grid View */\n.agents-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon i {\n color: white;\n font-size: 20px;\n}\n\n.agent-details {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item i {\n font-size: 12px;\n}\n\n.meta-item.status-active {\n color: #28a745;\n}\n\n.meta-item.status-pending {\n color: #ffc107;\n}\n\n.meta-item.status-disabled {\n color: #6c757d;\n}\n\n.expand-icon {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated {\n transform: rotate(180deg);\n}\n\n.card-body {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted {\n font-style: italic;\n color: #adb5bd;\n}\n\n/* Expanded Content */\n.expanded-content {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n/* Card Actions */\n.card-actions {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* List View */\n.agents-list {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table thead {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table tbody tr {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table tbody tr:hover {\n background: #f8f9fa;\n}\n\n.agents-table td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small i {\n color: white;\n font-size: 16px;\n}\n\n.agent-description-small {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Empty State */\n.empty-state {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state i {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state h3 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n/* Loading State */\n.loading-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content {\n text-align: center;\n}\n\n.loading-spinner {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text {\n color: #6c757d;\n font-size: 14px;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n .dashboard-header {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info {\n justify-content: space-between;\n }\n \n .header-controls {\n justify-content: space-between;\n }\n \n .agents-grid {\n grid-template-columns: 1fr;\n }\n \n .agent-stats {\n grid-template-columns: 1fr;\n }\n}"] }]
542
- }], () => [{ type: i1.NewAgentDialogService }, { type: i0.ViewContainerRef }], { initialState: [{
570
+ args: [{ selector: 'app-agent-configuration', template: "<div class=\"agent-configuration-container\">\n <!-- Header -->\n <div class=\"dashboard-header\">\n <div class=\"header-info\">\n <h2 class=\"dashboard-title\">\n <i class=\"fa-solid fa-robot\"></i>\n Agent Configuration\n </h2>\n <button \n type=\"button\" \n class=\"filter-toggle-btn\"\n (click)=\"toggleFilterPanel()\"\n title=\"Toggle Filters\">\n <i class=\"fa-solid fa-filter\"></i>\n @if (filterPanelVisible) {\n Hide Filters\n } @else {\n Show Filters\n }\n </button>\n <span class=\"item-count\">{{ filteredAgents.length }} agents</span>\n </div>\n \n <div class=\"header-controls\">\n <div class=\"view-toggle\">\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"setViewMode('grid')\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-grip\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"setViewMode('list')\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n </div>\n \n <button \n type=\"button\" \n class=\"control-btn primary\"\n (click)=\"createNewAgent()\"\n title=\"Create New Agent\">\n <i class=\"fa-solid fa-plus\"></i>\n New Agent\n </button>\n </div>\n </div>\n\n <!-- Main Content with Splitter -->\n <div class=\"main-content\" >\n <kendo-splitter \n class=\"main-splitter\"\n orientation=\"horizontal\"\n (layoutChange)=\"onMainSplitterChange($event)\"\n >\n \n <!-- Filter Panel (Left) -->\n <kendo-splitter-pane \n [size]=\"filterPanelVisible ? '320px' : '0px'\"\n [collapsible]=\"false\"\n [resizable]=\"filterPanelVisible\"\n [scrollable]=\"false\"\n [hidden]=\"!filterPanelVisible\">\n <mj-agent-filter-panel\n [agents]=\"agents\"\n [filteredAgents]=\"filteredAgents\"\n [filters]=\"currentFilters\"\n (filtersChange)=\"onFiltersChange($event)\"\n (filterChange)=\"onFilterChange()\"\n (resetFilters)=\"onResetFilters()\"\n (closePanel)=\"toggleFilterPanel()\">\n </mj-agent-filter-panel>\n </kendo-splitter-pane>\n \n <!-- Agents List Panel -->\n <kendo-splitter-pane \n [resizable]=\"true\"\n [scrollable]=\"false\">\n <div class=\"agents-content\">\n <!-- Loading State -->\n @if (isLoading) {\n <div class=\"loading-container\">\n <div class=\"loading-content\">\n <div class=\"loading-spinner\">\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n </div>\n <div class=\"loading-text\">Loading agents...</div>\n </div>\n </div>\n }\n\n <!-- Agents Display -->\n @if (!isLoading) {\n @if (filteredAgents.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-robot\"></i>\n <h3>No agents found</h3>\n <p>No agents match your current filters. Try adjusting your search criteria or create a new agent.</p>\n <button \n type=\"button\" \n class=\"empty-state-btn\"\n (click)=\"createNewAgent()\">\n <i class=\"fa-solid fa-plus\"></i>\n Create New Agent\n </button>\n </div>\n } @else {\n <!-- Grid View -->\n @if (viewMode === 'grid') {\n <div class=\"agents-grid\">\n @for (agent of filteredAgents; track agent.ID) {\n <div class=\"agent-card\" [class.expanded]=\"expandedAgentId === agent.ID\">\n <!-- Card Header -->\n <div class=\"card-header\" (click)=\"toggleAgentExpansion(agent.ID)\">\n <div class=\"agent-info\">\n <div class=\"agent-icon\" [style.background-color]=\"getAgentIconColor(agent)\">\n @if (hasLogoURL(agent)) {\n <img [src]=\"agent.LogoURL\" [alt]=\"agent.Name + ' logo'\" class=\"agent-logo\">\n } @else {\n <i [class]=\"getAgentIcon(agent)\"></i>\n }\n </div>\n <div class=\"agent-details\">\n <h4 class=\"agent-name\">{{ agent.Name }}</h4>\n <div class=\"agent-meta\">\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-microchip\"></i>\n {{ agent.ExecutionMode }}\n </span>\n @if (agent.Status) {\n <span class=\"meta-item\" [class]=\"'status-' + agent.Status.toLowerCase()\">\n <i class=\"fa-solid fa-circle\" style=\"font-size: 8px;\"></i>\n {{ agent.Status }}\n </span>\n }\n @if (agent.ExposeAsAction) {\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-bolt\"></i>\n Exposed\n </span>\n }\n </div>\n </div>\n </div>\n \n <i class=\"fa-solid fa-chevron-down expand-icon\" \n [class.rotated]=\"expandedAgentId === agent.ID\"></i>\n </div>\n\n <!-- Card Body -->\n <div class=\"card-body\">\n @if (agent.Description) {\n <p class=\"agent-description\">{{ agent.Description }}</p>\n } @else {\n <p class=\"agent-description text-muted\">No description provided</p>\n }\n \n <!-- Expandable Content -->\n @if (expandedAgentId === agent.ID) {\n <div class=\"expanded-content\">\n <div class=\"agent-stats\">\n @if (agent.Parent) {\n <div class=\"stat-item\">\n <span class=\"stat-label\">Parent</span>\n <span class=\"stat-value\">{{ agent.Parent }}</span>\n </div>\n }\n <div class=\"stat-item\">\n <span class=\"stat-label\">Context Compression</span>\n <span class=\"stat-value\">\n @if (agent.EnableContextCompression) {\n <i class=\"fa-solid fa-check\" style=\"color: #28a745;\"></i> Enabled\n } @else {\n <i class=\"fa-solid fa-times\" style=\"color: #dc3545;\"></i> Disabled\n }\n </span>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Card Actions -->\n <div class=\"card-actions\">\n <button \n type=\"button\" \n class=\"action-btn\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n Open\n </button>\n \n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn action-btn-primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n Run\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n \n <!-- List View -->\n @if (viewMode === 'list') {\n <div class=\"agents-list\">\n <table class=\"agents-table\">\n <thead>\n <tr>\n <th>Name</th>\n <th>Status</th>\n <th>Execution Mode</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (agent of filteredAgents; track agent.ID) {\n <tr>\n <td>\n <div class=\"agent-name-cell\">\n <div class=\"agent-icon-small\" [style.background-color]=\"getAgentIconColor(agent)\">\n @if (hasLogoURL(agent)) {\n <img [src]=\"agent.LogoURL\" [alt]=\"agent.Name + ' logo'\" class=\"agent-logo-small\">\n } @else {\n <i [class]=\"getAgentIcon(agent)\"></i>\n }\n </div>\n <div>\n <div class=\"agent-name\">{{ agent.Name }}</div>\n @if (agent.Description) {\n <div class=\"agent-description-small\">{{ agent.Description }}</div>\n }\n </div>\n </div>\n </td>\n <td>\n <span class=\"status-badge\" [class]=\"'status-' + (agent.Status || 'unknown').toLowerCase()\">\n {{ agent.Status || 'Unknown' }}\n </span>\n </td>\n <td>\n <span class=\"execution-mode\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n {{ agent.ExecutionMode }}\n </span>\n </td>\n <td>\n <div class=\"table-actions\">\n <button \n type=\"button\" \n class=\"action-btn-small\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n </button>\n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn-small primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n </button>\n }\n </div>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n }\n }\n </div>\n </kendo-splitter-pane>\n </kendo-splitter>\n </div>\n</div>\n\n<!-- AI Agent Test Harness - Now handled by service with minimize support -->", styles: ["/* Agent Configuration Component - Modern Design */\n.agent-configuration-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n/* Dashboard Header */\n.dashboard-header {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title i {\n color: #17a2b8;\n}\n\n.filter-toggle-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n/* View Toggle */\n.view-toggle {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn:hover {\n color: #495057;\n}\n\n.view-btn.active {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Main Content */\n.main-content {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n/* Grid View */\n.agents-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon i {\n color: white;\n font-size: 20px;\n}\n\n.agent-icon .agent-logo {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 10px;\n}\n\n.agent-details {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item i {\n font-size: 12px;\n}\n\n.meta-item.status-active {\n color: #28a745;\n}\n\n.meta-item.status-pending {\n color: #ffc107;\n}\n\n.meta-item.status-disabled {\n color: #6c757d;\n}\n\n.expand-icon {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated {\n transform: rotate(180deg);\n}\n\n.card-body {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted {\n font-style: italic;\n color: #adb5bd;\n}\n\n/* Expanded Content */\n.expanded-content {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n/* Card Actions */\n.card-actions {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* List View */\n.agents-list {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table thead {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table tbody tr {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table tbody tr:hover {\n background: #f8f9fa;\n}\n\n.agents-table td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small i {\n color: white;\n font-size: 16px;\n}\n\n.agent-icon-small .agent-logo-small {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 8px;\n}\n\n.agent-description-small {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Empty State */\n.empty-state {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state i {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state h3 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n/* Loading State */\n.loading-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content {\n text-align: center;\n}\n\n.loading-spinner {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text {\n color: #6c757d;\n font-size: 14px;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n .dashboard-header {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info {\n justify-content: space-between;\n }\n \n .header-controls {\n justify-content: space-between;\n }\n \n .agents-grid {\n grid-template-columns: 1fr;\n }\n \n .agent-stats {\n grid-template-columns: 1fr;\n }\n}"] }]
571
+ }], () => [{ type: i1.NewAgentDialogService }, { type: i0.ViewContainerRef }, { type: i2.AITestHarnessDialogService }], { initialState: [{
543
572
  type: Input
544
573
  }], openEntityRecord: [{
545
574
  type: Output
546
575
  }], stateChange: [{
547
576
  type: Output
548
577
  }] }); })();
549
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AgentConfigurationComponent, { className: "AgentConfigurationComponent", filePath: "src/AI/components/agents/agent-configuration.component.ts", lineNumber: 20 }); })();
578
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AgentConfigurationComponent, { className: "AgentConfigurationComponent", filePath: "src/AI/components/agents/agent-configuration.component.ts", lineNumber: 21 }); })();
550
579
  //# sourceMappingURL=agent-configuration.component.js.map