@memberjunction/ng-core-entity-forms 2.82.0 → 2.83.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/lib/custom/AIAgents/ai-agent-form.component.js +587 -587
  2. package/dist/lib/custom/AIAgents/ai-agent-form.component.js.map +1 -1
  3. package/dist/lib/custom/AIAgents/create-sub-agent-dialog.component.d.ts +3 -2
  4. package/dist/lib/custom/AIAgents/create-sub-agent-dialog.component.d.ts.map +1 -1
  5. package/dist/lib/custom/AIAgents/create-sub-agent-dialog.component.js +7 -6
  6. package/dist/lib/custom/AIAgents/create-sub-agent-dialog.component.js.map +1 -1
  7. package/dist/lib/custom/AIAgents/prompt-selector-dialog.component.d.ts +2 -2
  8. package/dist/lib/custom/AIAgents/prompt-selector-dialog.component.js +2 -2
  9. package/dist/lib/custom/Queries/query-form.component.d.ts +0 -1
  10. package/dist/lib/custom/Queries/query-form.component.d.ts.map +1 -1
  11. package/dist/lib/custom/Queries/query-form.component.js +2 -3
  12. package/dist/lib/custom/Queries/query-form.component.js.map +1 -1
  13. package/package.json +16 -16
package/dist/lib/custom/AIAgents/ai-agent-form.component.js CHANGED
@@ -29,29 +29,29 @@ import * as i13 from "@memberjunction/ng-form-toolbar";
29
29
  import * as i14 from "@memberjunction/ng-code-editor";
30
30
  const _c0 = ["customSectionContainer"];
31
31
  const _forTrack0 = ($index, $item) => $item.ID;
32
- function AIAgentFormComponentExtended_form_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
33
- i0.ɵɵelement(0, "img", 11);
32
+ function AIAgentFormComponentExtended_form_3_Conditional_7_Template(rf, ctx) { if (rf & 1) {
33
+ i0.ɵɵelement(0, "img", 12);
34
34
  } if (rf & 2) {
35
35
  const ctx_r1 = i0.ɵɵnextContext(2);
36
36
  i0.ɵɵproperty("src", ctx_r1.record.LogoURL, i0.ɵɵsanitizeUrl)("alt", ctx_r1.record.Name + " logo");
37
37
  } }
38
- function AIAgentFormComponentExtended_form_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
38
+ function AIAgentFormComponentExtended_form_3_Conditional_8_Template(rf, ctx) { if (rf & 1) {
39
39
  i0.ɵɵelement(0, "i");
40
40
  } if (rf & 2) {
41
41
  const ctx_r1 = i0.ɵɵnextContext(2);
42
42
  i0.ɵɵclassMap(ctx_r1.getAgentIcon());
43
43
  } }
44
- function AIAgentFormComponentExtended_form_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
44
+ function AIAgentFormComponentExtended_form_3_Conditional_10_Template(rf, ctx) { if (rf & 1) {
45
45
  const _r3 = i0.ɵɵgetCurrentView();
46
- i0.ɵɵelementStart(0, "kendo-textbox", 29);
47
- i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_2_Conditional_10_Template_kendo_textbox_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Name, $event) || (ctx_r1.record.Name = $event); return i0.ɵɵresetView($event); });
46
+ i0.ɵɵelementStart(0, "kendo-textbox", 30);
47
+ i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_3_Conditional_10_Template_kendo_textbox_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Name, $event) || (ctx_r1.record.Name = $event); return i0.ɵɵresetView($event); });
48
48
  i0.ɵɵelementEnd();
49
49
  } if (rf & 2) {
50
50
  const ctx_r1 = i0.ɵɵnextContext(2);
51
51
  i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.Name);
52
52
  } }
53
- function AIAgentFormComponentExtended_form_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
54
- i0.ɵɵelementStart(0, "h1", 15);
53
+ function AIAgentFormComponentExtended_form_3_Conditional_11_Template(rf, ctx) { if (rf & 1) {
54
+ i0.ɵɵelementStart(0, "h1", 16);
55
55
  i0.ɵɵtext(1);
56
56
  i0.ɵɵelementEnd();
57
57
  } if (rf & 2) {
@@ -59,9 +59,9 @@ function AIAgentFormComponentExtended_form_2_Conditional_11_Template(rf, ctx) {
59
59
  i0.ɵɵadvance();
60
60
  i0.ɵɵtextInterpolate(ctx_r1.record.Name || "Untitled AI Agent");
61
61
  } }
62
- function AIAgentFormComponentExtended_form_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
63
- i0.ɵɵelementStart(0, "span", 30);
64
- i0.ɵɵelement(1, "i", 31);
62
+ function AIAgentFormComponentExtended_form_3_Conditional_13_Template(rf, ctx) { if (rf & 1) {
63
+ i0.ɵɵelementStart(0, "span", 31);
64
+ i0.ɵɵelement(1, "i", 32);
65
65
  i0.ɵɵtext(2);
66
66
  i0.ɵɵelementEnd();
67
67
  } if (rf & 2) {
@@ -70,8 +70,8 @@ function AIAgentFormComponentExtended_form_2_Conditional_13_Template(rf, ctx) {
70
70
  i0.ɵɵadvance(2);
71
71
  i0.ɵɵtextInterpolate1(" ", ctx_r1.record.Status, " ");
72
72
  } }
73
- function AIAgentFormComponentExtended_form_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
74
- i0.ɵɵelementStart(0, "span", 18);
73
+ function AIAgentFormComponentExtended_form_3_Conditional_14_Template(rf, ctx) { if (rf & 1) {
74
+ i0.ɵɵelementStart(0, "span", 19);
75
75
  i0.ɵɵtext(1);
76
76
  i0.ɵɵelementEnd();
77
77
  } if (rf & 2) {
@@ -79,9 +79,9 @@ function AIAgentFormComponentExtended_form_2_Conditional_14_Template(rf, ctx) {
79
79
  i0.ɵɵadvance();
80
80
  i0.ɵɵtextInterpolate1(" Agent Type: ", ctx_r1.record.Type, " ");
81
81
  } }
82
- function AIAgentFormComponentExtended_form_2_Conditional_15_Template(rf, ctx) { if (rf & 1) {
83
- i0.ɵɵelementStart(0, "span", 19);
84
- i0.ɵɵelement(1, "i", 32);
82
+ function AIAgentFormComponentExtended_form_3_Conditional_15_Template(rf, ctx) { if (rf & 1) {
83
+ i0.ɵɵelementStart(0, "span", 20);
84
+ i0.ɵɵelement(1, "i", 33);
85
85
  i0.ɵɵtext(2);
86
86
  i0.ɵɵelementEnd();
87
87
  } if (rf & 2) {
@@ -89,53 +89,53 @@ function AIAgentFormComponentExtended_form_2_Conditional_15_Template(rf, ctx) {
89
89
  i0.ɵɵadvance(2);
90
90
  i0.ɵɵtextInterpolate1(" Child of ", ctx_r1.record.Parent, " ");
91
91
  } }
92
- function AIAgentFormComponentExtended_form_2_Conditional_17_Template(rf, ctx) { if (rf & 1) {
92
+ function AIAgentFormComponentExtended_form_3_Conditional_17_Template(rf, ctx) { if (rf & 1) {
93
93
  const _r4 = i0.ɵɵgetCurrentView();
94
- i0.ɵɵelementStart(0, "button", 33);
95
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_17_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openTestHarness()); });
96
- i0.ɵɵelement(1, "i", 34);
94
+ i0.ɵɵelementStart(0, "button", 34);
95
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_17_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openTestHarness()); });
96
+ i0.ɵɵelement(1, "i", 35);
97
97
  i0.ɵɵtext(2, " Run ");
98
98
  i0.ɵɵelementEnd();
99
99
  } if (rf & 2) {
100
100
  const ctx_r1 = i0.ɵɵnextContext(2);
101
101
  i0.ɵɵproperty("disabled", ctx_r1.record.Status !== "Active");
102
102
  } }
103
- function AIAgentFormComponentExtended_form_2_Conditional_22_ng_template_1_Template(rf, ctx) { if (rf & 1) {
104
- i0.ɵɵelement(0, "i", 36);
103
+ function AIAgentFormComponentExtended_form_3_Conditional_22_ng_template_1_Template(rf, ctx) { if (rf & 1) {
104
+ i0.ɵɵelement(0, "i", 37);
105
105
  i0.ɵɵtext(1);
106
106
  } if (rf & 2) {
107
107
  const ctx_r1 = i0.ɵɵnextContext(3);
108
108
  i0.ɵɵadvance();
109
109
  i0.ɵɵtextInterpolate1(" ", ctx_r1.agentType.Name, " Configuration ");
110
110
  } }
111
- function AIAgentFormComponentExtended_form_2_Conditional_22_ng_template_2_Template(rf, ctx) { if (rf & 1) {
112
- i0.ɵɵelementStart(0, "div", 37);
111
+ function AIAgentFormComponentExtended_form_3_Conditional_22_ng_template_2_Template(rf, ctx) { if (rf & 1) {
112
+ i0.ɵɵelementStart(0, "div", 38);
113
113
  i0.ɵɵelementContainer(1, null, 1);
114
114
  i0.ɵɵelementEnd();
115
115
  } if (rf & 2) {
116
116
  i0.ɵɵstyleProp("display", "block");
117
117
  } }
118
- function AIAgentFormComponentExtended_form_2_Conditional_22_Template(rf, ctx) { if (rf & 1) {
118
+ function AIAgentFormComponentExtended_form_3_Conditional_22_Template(rf, ctx) { if (rf & 1) {
119
119
  const _r5 = i0.ɵɵgetCurrentView();
120
- i0.ɵɵelementStart(0, "kendo-panelbar-item", 35);
121
- i0.ɵɵlistener("stateChange", function AIAgentFormComponentExtended_form_2_Conditional_22_Template_kendo_panelbar_item_stateChange_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onCustomSectionStateChange($event)); });
122
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_22_ng_template_1_Template, 2, 1, "ng-template", 27)(2, AIAgentFormComponentExtended_form_2_Conditional_22_ng_template_2_Template, 3, 2, "ng-template", 28);
120
+ i0.ɵɵelementStart(0, "kendo-panelbar-item", 36);
121
+ i0.ɵɵlistener("stateChange", function AIAgentFormComponentExtended_form_3_Conditional_22_Template_kendo_panelbar_item_stateChange_0_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onCustomSectionStateChange($event)); });
122
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_22_ng_template_1_Template, 2, 1, "ng-template", 28)(2, AIAgentFormComponentExtended_form_3_Conditional_22_ng_template_2_Template, 3, 2, "ng-template", 29);
123
123
  i0.ɵɵelementEnd();
124
124
  } if (rf & 2) {
125
125
  const ctx_r1 = i0.ɵɵnextContext(2);
126
126
  i0.ɵɵproperty("expanded", ctx_r1.agentType.UIFormSectionExpandedByDefault);
127
127
  } }
128
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_1_Template(rf, ctx) { if (rf & 1) {
129
- i0.ɵɵelement(0, "i", 38);
128
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_1_Template(rf, ctx) { if (rf & 1) {
129
+ i0.ɵɵelement(0, "i", 39);
130
130
  i0.ɵɵtext(1);
131
131
  } if (rf & 2) {
132
132
  const ctx_r1 = i0.ɵɵnextContext(3);
133
133
  i0.ɵɵadvance();
134
134
  i0.ɵɵtextInterpolate1(" Execution History", ctx_r1.executionHistoryCount > 0 ? " (" + ctx_r1.executionHistoryCount + ")" : "", " ");
135
135
  } }
136
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
137
- i0.ɵɵelementStart(0, "div", 40);
138
- i0.ɵɵelement(1, "i", 38);
136
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
137
+ i0.ɵɵelementStart(0, "div", 41);
138
+ i0.ɵɵelement(1, "i", 39);
139
139
  i0.ɵɵelementStart(2, "h4");
140
140
  i0.ɵɵtext(3, "No Execution History");
141
141
  i0.ɵɵelementEnd();
@@ -143,13 +143,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
143
143
  i0.ɵɵtext(5, "This agent hasn't been executed yet. Use the Test Agent button to run the agent and see execution history here.");
144
144
  i0.ɵɵelementEnd()();
145
145
  } }
146
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
147
- i0.ɵɵelementStart(0, "div", 54);
148
- i0.ɵɵelement(1, "i", 59);
149
- i0.ɵɵelementStart(2, "span", 60);
146
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
147
+ i0.ɵɵelementStart(0, "div", 55);
148
+ i0.ɵɵelement(1, "i", 60);
149
+ i0.ɵɵelementStart(2, "span", 61);
150
150
  i0.ɵɵtext(3, "Config:");
151
151
  i0.ɵɵelementEnd();
152
- i0.ɵɵelementStart(4, "span", 61);
152
+ i0.ɵɵelementStart(4, "span", 62);
153
153
  i0.ɵɵtext(5);
154
154
  i0.ɵɵelementEnd()();
155
155
  } if (rf & 2) {
@@ -157,13 +157,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
157
157
  i0.ɵɵadvance(5);
158
158
  i0.ɵɵtextInterpolate(execution_r7.Configuration);
159
159
  } }
160
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_15_Template(rf, ctx) { if (rf & 1) {
161
- i0.ɵɵelementStart(0, "div", 54);
162
- i0.ɵɵelement(1, "i", 62);
163
- i0.ɵɵelementStart(2, "span", 60);
160
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_15_Template(rf, ctx) { if (rf & 1) {
161
+ i0.ɵɵelementStart(0, "div", 55);
162
+ i0.ɵɵelement(1, "i", 63);
163
+ i0.ɵɵelementStart(2, "span", 61);
164
164
  i0.ɵɵtext(3, "Duration:");
165
165
  i0.ɵɵelementEnd();
166
- i0.ɵɵelementStart(4, "span", 61);
166
+ i0.ɵɵelementStart(4, "span", 62);
167
167
  i0.ɵɵtext(5);
168
168
  i0.ɵɵelementEnd()();
169
169
  } if (rf & 2) {
@@ -172,13 +172,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
172
172
  i0.ɵɵadvance(5);
173
173
  i0.ɵɵtextInterpolate(ctx_r1.formatExecutionTimeFromDates(execution_r7.StartedAt, execution_r7.CompletedAt));
174
174
  } }
175
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_16_Template(rf, ctx) { if (rf & 1) {
176
- i0.ɵɵelementStart(0, "div", 54);
177
- i0.ɵɵelement(1, "i", 63);
178
- i0.ɵɵelementStart(2, "span", 60);
175
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_16_Template(rf, ctx) { if (rf & 1) {
176
+ i0.ɵɵelementStart(0, "div", 55);
177
+ i0.ɵɵelement(1, "i", 64);
178
+ i0.ɵɵelementStart(2, "span", 61);
179
179
  i0.ɵɵtext(3, "Running:");
180
180
  i0.ɵɵelementEnd();
181
- i0.ɵɵelementStart(4, "span", 61);
181
+ i0.ɵɵelementStart(4, "span", 62);
182
182
  i0.ɵɵtext(5);
183
183
  i0.ɵɵelementEnd()();
184
184
  } if (rf & 2) {
@@ -187,13 +187,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
187
187
  i0.ɵɵadvance(5);
188
188
  i0.ɵɵtextInterpolate(ctx_r1.getRunningTime(execution_r7.StartedAt));
189
189
  } }
190
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_17_Template(rf, ctx) { if (rf & 1) {
191
- i0.ɵɵelementStart(0, "div", 54);
192
- i0.ɵɵelement(1, "i", 64);
193
- i0.ɵɵelementStart(2, "span", 60);
190
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_17_Template(rf, ctx) { if (rf & 1) {
191
+ i0.ɵɵelementStart(0, "div", 55);
192
+ i0.ɵɵelement(1, "i", 65);
193
+ i0.ɵɵelementStart(2, "span", 61);
194
194
  i0.ɵɵtext(3, "Tokens:");
195
195
  i0.ɵɵelementEnd();
196
- i0.ɵɵelementStart(4, "span", 61);
196
+ i0.ɵɵelementStart(4, "span", 62);
197
197
  i0.ɵɵtext(5);
198
198
  i0.ɵɵelementEnd()();
199
199
  } if (rf & 2) {
@@ -202,13 +202,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
202
202
  i0.ɵɵadvance(5);
203
203
  i0.ɵɵtextInterpolate(ctx_r1.formatTokenCount(execution_r7.TotalTokensUsedRollup || execution_r7.TotalTokensUsed));
204
204
  } }
205
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_18_Template(rf, ctx) { if (rf & 1) {
206
- i0.ɵɵelementStart(0, "div", 54);
207
- i0.ɵɵelement(1, "i", 65);
208
- i0.ɵɵelementStart(2, "span", 60);
205
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_18_Template(rf, ctx) { if (rf & 1) {
206
+ i0.ɵɵelementStart(0, "div", 55);
207
+ i0.ɵɵelement(1, "i", 66);
208
+ i0.ɵɵelementStart(2, "span", 61);
209
209
  i0.ɵɵtext(3, "Cost:");
210
210
  i0.ɵɵelementEnd();
211
- i0.ɵɵelementStart(4, "span", 61);
211
+ i0.ɵɵelementStart(4, "span", 62);
212
212
  i0.ɵɵtext(5);
213
213
  i0.ɵɵelementEnd()();
214
214
  } if (rf & 2) {
@@ -217,13 +217,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
217
217
  i0.ɵɵadvance(5);
218
218
  i0.ɵɵtextInterpolate1("$", ctx_r1.formatCost(execution_r7.TotalCostRollup || execution_r7.TotalCost), "");
219
219
  } }
220
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_11_Template(rf, ctx) { if (rf & 1) {
221
- i0.ɵɵelementStart(0, "div", 68);
222
- i0.ɵɵelement(1, "i", 74);
223
- i0.ɵɵelementStart(2, "div", 69)(3, "span", 70);
220
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_11_Template(rf, ctx) { if (rf & 1) {
221
+ i0.ɵɵelementStart(0, "div", 69);
222
+ i0.ɵɵelement(1, "i", 75);
223
+ i0.ɵɵelementStart(2, "div", 70)(3, "span", 71);
224
224
  i0.ɵɵtext(4, "Completed");
225
225
  i0.ɵɵelementEnd();
226
- i0.ɵɵelementStart(5, "span", 71);
226
+ i0.ɵɵelementStart(5, "span", 72);
227
227
  i0.ɵɵtext(6);
228
228
  i0.ɵɵpipe(7, "date");
229
229
  i0.ɵɵelementEnd()()();
@@ -232,13 +232,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
232
232
  i0.ɵɵadvance(6);
233
233
  i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(7, 1, execution_r7.CompletedAt, "medium"));
234
234
  } }
235
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_12_Template(rf, ctx) { if (rf & 1) {
236
- i0.ɵɵelementStart(0, "div", 68);
237
- i0.ɵɵelement(1, "i", 64);
238
- i0.ɵɵelementStart(2, "div", 69)(3, "span", 70);
235
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_12_Template(rf, ctx) { if (rf & 1) {
236
+ i0.ɵɵelementStart(0, "div", 69);
237
+ i0.ɵɵelement(1, "i", 65);
238
+ i0.ɵɵelementStart(2, "div", 70)(3, "span", 71);
239
239
  i0.ɵɵtext(4, "Direct Tokens");
240
240
  i0.ɵɵelementEnd();
241
- i0.ɵɵelementStart(5, "span", 71);
241
+ i0.ɵɵelementStart(5, "span", 72);
242
242
  i0.ɵɵtext(6);
243
243
  i0.ɵɵelementEnd()()();
244
244
  } if (rf & 2) {
@@ -247,13 +247,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
247
247
  i0.ɵɵadvance(6);
248
248
  i0.ɵɵtextInterpolate(ctx_r1.formatTokenCount(execution_r7.TotalTokensUsed));
249
249
  } }
250
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_13_Template(rf, ctx) { if (rf & 1) {
251
- i0.ɵɵelementStart(0, "div", 68);
252
- i0.ɵɵelement(1, "i", 32);
253
- i0.ɵɵelementStart(2, "div", 69)(3, "span", 70);
250
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_13_Template(rf, ctx) { if (rf & 1) {
251
+ i0.ɵɵelementStart(0, "div", 69);
252
+ i0.ɵɵelement(1, "i", 33);
253
+ i0.ɵɵelementStart(2, "div", 70)(3, "span", 71);
254
254
  i0.ɵɵtext(4, "Total + Sub-agents");
255
255
  i0.ɵɵelementEnd();
256
- i0.ɵɵelementStart(5, "span", 71);
256
+ i0.ɵɵelementStart(5, "span", 72);
257
257
  i0.ɵɵtext(6);
258
258
  i0.ɵɵelementEnd()()();
259
259
  } if (rf & 2) {
@@ -262,13 +262,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
262
262
  i0.ɵɵadvance(6);
263
263
  i0.ɵɵtextInterpolate(ctx_r1.formatTokenCount(execution_r7.TotalTokensUsedRollup));
264
264
  } }
265
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_14_Template(rf, ctx) { if (rf & 1) {
266
- i0.ɵɵelementStart(0, "div", 68);
267
- i0.ɵɵelement(1, "i", 65);
268
- i0.ɵɵelementStart(2, "div", 69)(3, "span", 70);
265
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_14_Template(rf, ctx) { if (rf & 1) {
266
+ i0.ɵɵelementStart(0, "div", 69);
267
+ i0.ɵɵelement(1, "i", 66);
268
+ i0.ɵɵelementStart(2, "div", 70)(3, "span", 71);
269
269
  i0.ɵɵtext(4, "Direct Cost");
270
270
  i0.ɵɵelementEnd();
271
- i0.ɵɵelementStart(5, "span", 71);
271
+ i0.ɵɵelementStart(5, "span", 72);
272
272
  i0.ɵɵtext(6);
273
273
  i0.ɵɵelementEnd()()();
274
274
  } if (rf & 2) {
@@ -277,13 +277,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
277
277
  i0.ɵɵadvance(6);
278
278
  i0.ɵɵtextInterpolate1("$", ctx_r1.formatCost(execution_r7.TotalCost), "");
279
279
  } }
280
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_15_Template(rf, ctx) { if (rf & 1) {
281
- i0.ɵɵelementStart(0, "div", 68);
282
- i0.ɵɵelement(1, "i", 75);
283
- i0.ɵɵelementStart(2, "div", 69)(3, "span", 70);
280
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_15_Template(rf, ctx) { if (rf & 1) {
281
+ i0.ɵɵelementStart(0, "div", 69);
282
+ i0.ɵɵelement(1, "i", 76);
283
+ i0.ɵɵelementStart(2, "div", 70)(3, "span", 71);
284
284
  i0.ɵɵtext(4, "Total + Sub-agents");
285
285
  i0.ɵɵelementEnd();
286
- i0.ɵɵelementStart(5, "span", 71);
286
+ i0.ɵɵelementStart(5, "span", 72);
287
287
  i0.ɵɵtext(6);
288
288
  i0.ɵɵelementEnd()()();
289
289
  } if (rf & 2) {
@@ -292,13 +292,13 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
292
292
  i0.ɵɵadvance(6);
293
293
  i0.ɵɵtextInterpolate1("$", ctx_r1.formatCost(execution_r7.TotalCostRollup), "");
294
294
  } }
295
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_16_Template(rf, ctx) { if (rf & 1) {
296
- i0.ɵɵelementStart(0, "div", 68);
297
- i0.ɵɵelement(1, "i", 76);
298
- i0.ɵɵelementStart(2, "div", 69)(3, "span", 70);
295
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_16_Template(rf, ctx) { if (rf & 1) {
296
+ i0.ɵɵelementStart(0, "div", 69);
297
+ i0.ɵɵelement(1, "i", 77);
298
+ i0.ɵɵelementStart(2, "div", 70)(3, "span", 71);
299
299
  i0.ɵɵtext(4, "Conversation");
300
300
  i0.ɵɵelementEnd();
301
- i0.ɵɵelementStart(5, "span", 71);
301
+ i0.ɵɵelementStart(5, "span", 72);
302
302
  i0.ɵɵtext(6);
303
303
  i0.ɵɵelementEnd()()();
304
304
  } if (rf & 2) {
@@ -306,12 +306,12 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
306
306
  i0.ɵɵadvance(6);
307
307
  i0.ɵɵtextInterpolate1("", execution_r7.ConversationID.substring(0, 8), "...");
308
308
  } }
309
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_17_Template(rf, ctx) { if (rf & 1) {
310
- i0.ɵɵelementStart(0, "div", 72)(1, "h5");
311
- i0.ɵɵelement(2, "i", 77);
309
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_17_Template(rf, ctx) { if (rf & 1) {
310
+ i0.ɵɵelementStart(0, "div", 73)(1, "h5");
311
+ i0.ɵɵelement(2, "i", 78);
312
312
  i0.ɵɵtext(3, " Result");
313
313
  i0.ɵɵelementEnd();
314
- i0.ɵɵelement(4, "mj-code-editor", 78);
314
+ i0.ɵɵelement(4, "mj-code-editor", 79);
315
315
  i0.ɵɵelementEnd();
316
316
  } if (rf & 2) {
317
317
  const execution_r7 = i0.ɵɵnextContext(2).$implicit;
@@ -319,12 +319,12 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
319
319
  i0.ɵɵadvance(4);
320
320
  i0.ɵɵproperty("value", ctx_r1.getExecutionResultPreview(execution_r7, false))("readonly", true)("lineWrapping", true);
321
321
  } }
322
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_18_Template(rf, ctx) { if (rf & 1) {
323
- i0.ɵɵelementStart(0, "div", 73)(1, "h5");
324
- i0.ɵɵelement(2, "i", 79);
322
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_18_Template(rf, ctx) { if (rf & 1) {
323
+ i0.ɵɵelementStart(0, "div", 74)(1, "h5");
324
+ i0.ɵɵelement(2, "i", 80);
325
325
  i0.ɵɵtext(3, " Error");
326
326
  i0.ɵɵelementEnd();
327
- i0.ɵɵelementStart(4, "div", 80);
327
+ i0.ɵɵelementStart(4, "div", 81);
328
328
  i0.ɵɵtext(5);
329
329
  i0.ɵɵelementEnd()();
330
330
  } if (rf & 2) {
@@ -332,19 +332,19 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
332
332
  i0.ɵɵadvance(5);
333
333
  i0.ɵɵtextInterpolate(execution_r7.ErrorMessage);
334
334
  } }
335
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Template(rf, ctx) { if (rf & 1) {
336
- i0.ɵɵelementStart(0, "div", 58)(1, "div", 66)(2, "div", 67)(3, "div", 68);
337
- i0.ɵɵelement(4, "i", 63);
338
- i0.ɵɵelementStart(5, "div", 69)(6, "span", 70);
335
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Template(rf, ctx) { if (rf & 1) {
336
+ i0.ɵɵelementStart(0, "div", 59)(1, "div", 67)(2, "div", 68)(3, "div", 69);
337
+ i0.ɵɵelement(4, "i", 64);
338
+ i0.ɵɵelementStart(5, "div", 70)(6, "span", 71);
339
339
  i0.ɵɵtext(7, "Started");
340
340
  i0.ɵɵelementEnd();
341
- i0.ɵɵelementStart(8, "span", 71);
341
+ i0.ɵɵelementStart(8, "span", 72);
342
342
  i0.ɵɵtext(9);
343
343
  i0.ɵɵpipe(10, "date");
344
344
  i0.ɵɵelementEnd()()();
345
- i0.ɵɵtemplate(11, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_11_Template, 8, 4, "div", 68)(12, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_12_Template, 7, 1, "div", 68)(13, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_13_Template, 7, 1, "div", 68)(14, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_14_Template, 7, 1, "div", 68)(15, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_15_Template, 7, 1, "div", 68)(16, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_16_Template, 7, 1, "div", 68);
345
+ i0.ɵɵtemplate(11, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_11_Template, 8, 4, "div", 69)(12, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_12_Template, 7, 1, "div", 69)(13, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_13_Template, 7, 1, "div", 69)(14, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_14_Template, 7, 1, "div", 69)(15, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_15_Template, 7, 1, "div", 69)(16, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_16_Template, 7, 1, "div", 69);
346
346
  i0.ɵɵelementEnd()();
347
- i0.ɵɵtemplate(17, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_17_Template, 5, 3, "div", 72)(18, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_18_Template, 6, 1, "div", 73);
347
+ i0.ɵɵtemplate(17, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_17_Template, 5, 3, "div", 73)(18, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Conditional_18_Template, 6, 1, "div", 74);
348
348
  i0.ɵɵelementEnd();
349
349
  } if (rf & 2) {
350
350
  const execution_r7 = i0.ɵɵnextContext().$implicit;
@@ -367,29 +367,29 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
367
367
  i0.ɵɵadvance();
368
368
  i0.ɵɵconditional(execution_r7.ErrorMessage ? 18 : -1);
369
369
  } }
370
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Template(rf, ctx) { if (rf & 1) {
370
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Template(rf, ctx) { if (rf & 1) {
371
371
  const _r6 = i0.ɵɵgetCurrentView();
372
- i0.ɵɵelementStart(0, "div", 44)(1, "div", 45);
373
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Template_div_click_1_listener() { const execution_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.toggleExecutionExpanded(execution_r7.ID)); });
374
- i0.ɵɵelementStart(2, "div", 46)(3, "div", 47)(4, "div", 48);
372
+ i0.ɵɵelementStart(0, "div", 45)(1, "div", 46);
373
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Template_div_click_1_listener() { const execution_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.toggleExecutionExpanded(execution_r7.ID)); });
374
+ i0.ɵɵelementStart(2, "div", 47)(3, "div", 48)(4, "div", 49);
375
375
  i0.ɵɵelement(5, "i");
376
376
  i0.ɵɵelementEnd();
377
- i0.ɵɵelementStart(6, "div", 49)(7, "div", 50);
378
- i0.ɵɵelement(8, "i", 51);
377
+ i0.ɵɵelementStart(6, "div", 50)(7, "div", 51);
378
+ i0.ɵɵelement(8, "i", 52);
379
379
  i0.ɵɵtext(9);
380
380
  i0.ɵɵelementEnd();
381
- i0.ɵɵelementStart(10, "div", 52);
381
+ i0.ɵɵelementStart(10, "div", 53);
382
382
  i0.ɵɵtext(11);
383
383
  i0.ɵɵpipe(12, "date");
384
384
  i0.ɵɵelementEnd()()();
385
- i0.ɵɵelementStart(13, "div", 53);
386
- i0.ɵɵtemplate(14, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_14_Template, 6, 1, "div", 54)(15, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_15_Template, 6, 1, "div", 54)(16, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_16_Template, 6, 1, "div", 54)(17, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_17_Template, 6, 1, "div", 54)(18, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_18_Template, 6, 1, "div", 54);
385
+ i0.ɵɵelementStart(13, "div", 54);
386
+ i0.ɵɵtemplate(14, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_14_Template, 6, 1, "div", 55)(15, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_15_Template, 6, 1, "div", 55)(16, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_16_Template, 6, 1, "div", 55)(17, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_17_Template, 6, 1, "div", 55)(18, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_18_Template, 6, 1, "div", 55);
387
387
  i0.ɵɵelementEnd()();
388
- i0.ɵɵelementStart(19, "div", 55)(20, "button", 56);
389
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Template_button_click_20_listener($event) { const execution_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); ctx_r1.openExecutionRecord(execution_r7.ID); return i0.ɵɵresetView($event.stopPropagation()); });
390
- i0.ɵɵelement(21, "i", 57);
388
+ i0.ɵɵelementStart(19, "div", 56)(20, "button", 57);
389
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Template_button_click_20_listener($event) { const execution_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); ctx_r1.openExecutionRecord(execution_r7.ID); return i0.ɵɵresetView($event.stopPropagation()); });
390
+ i0.ɵɵelement(21, "i", 58);
391
391
  i0.ɵɵelementEnd()()();
392
- i0.ɵɵtemplate(22, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Template, 19, 12, "div", 58);
392
+ i0.ɵɵtemplate(22, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Conditional_22_Template, 19, 12, "div", 59);
393
393
  i0.ɵɵelementEnd();
394
394
  } if (rf & 2) {
395
395
  const execution_r7 = ctx.$implicit;
@@ -416,10 +416,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
416
416
  i0.ɵɵadvance(4);
417
417
  i0.ɵɵconditional(ctx_r1.expandedExecutions[execution_r7.ID] ? 22 : -1);
418
418
  } }
419
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
419
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
420
420
  const _r8 = i0.ɵɵgetCurrentView();
421
- i0.ɵɵelementStart(0, "div", 81);
422
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("MJ: AI Agent Runs", "")); });
421
+ i0.ɵɵelementStart(0, "div", 82);
422
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("MJ: AI Agent Runs", "")); });
423
423
  i0.ɵɵelementStart(1, "span");
424
424
  i0.ɵɵtext(2);
425
425
  i0.ɵɵelementEnd()();
@@ -428,10 +428,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
428
428
  i0.ɵɵadvance(2);
429
429
  i0.ɵɵtextInterpolate1("View all ", ctx_r1.executionHistoryCount, " executions...");
430
430
  } }
431
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
432
- i0.ɵɵelementStart(0, "div", 41);
433
- i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_For_2_Template, 23, 18, "div", 42, _forTrack0);
434
- i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_Conditional_3_Template, 3, 1, "div", 43);
431
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
432
+ i0.ɵɵelementStart(0, "div", 42);
433
+ i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_For_2_Template, 23, 18, "div", 43, _forTrack0);
434
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_Conditional_3_Template, 3, 1, "div", 44);
435
435
  i0.ɵɵelementEnd();
436
436
  } if (rf & 2) {
437
437
  const ctx_r1 = i0.ɵɵnextContext(4);
@@ -440,64 +440,64 @@ function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Condit
440
440
  i0.ɵɵadvance(2);
441
441
  i0.ɵɵconditional(ctx_r1.executionHistoryCount > ctx_r1.recentExecutions.length ? 3 : -1);
442
442
  } }
443
- function AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Template(rf, ctx) { if (rf & 1) {
444
- i0.ɵɵelementStart(0, "div", 39);
445
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_1_Template, 6, 0, "div", 40)(2, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Conditional_2_Template, 4, 1, "div", 41);
443
+ function AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Template(rf, ctx) { if (rf & 1) {
444
+ i0.ɵɵelementStart(0, "div", 40);
445
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_1_Template, 6, 0, "div", 41)(2, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Conditional_2_Template, 4, 1, "div", 42);
446
446
  i0.ɵɵelementEnd();
447
447
  } if (rf & 2) {
448
448
  const ctx_r1 = i0.ɵɵnextContext(3);
449
449
  i0.ɵɵadvance();
450
450
  i0.ɵɵconditional(ctx_r1.executionHistoryCount === 0 ? 1 : 2);
451
451
  } }
452
- function AIAgentFormComponentExtended_form_2_Conditional_23_Template(rf, ctx) { if (rf & 1) {
453
- i0.ɵɵelementStart(0, "kendo-panelbar-item", 26);
454
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_1_Template, 2, 1, "ng-template", 27)(2, AIAgentFormComponentExtended_form_2_Conditional_23_ng_template_2_Template, 3, 1, "ng-template", 28);
452
+ function AIAgentFormComponentExtended_form_3_Conditional_23_Template(rf, ctx) { if (rf & 1) {
453
+ i0.ɵɵelementStart(0, "kendo-panelbar-item", 27);
454
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_1_Template, 2, 1, "ng-template", 28)(2, AIAgentFormComponentExtended_form_3_Conditional_23_ng_template_2_Template, 3, 1, "ng-template", 29);
455
455
  i0.ɵɵelementEnd();
456
456
  } if (rf & 2) {
457
457
  i0.ɵɵproperty("expanded", false);
458
458
  } }
459
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_1_Template(rf, ctx) { if (rf & 1) {
460
- i0.ɵɵelement(0, "i", 82);
459
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_1_Template(rf, ctx) { if (rf & 1) {
460
+ i0.ɵɵelement(0, "i", 83);
461
461
  i0.ɵɵtext(1);
462
462
  } if (rf & 2) {
463
463
  const ctx_r1 = i0.ɵɵnextContext(3);
464
464
  i0.ɵɵadvance();
465
465
  i0.ɵɵtextInterpolate1(" Actions", ctx_r1.actionCount > 0 ? " (" + ctx_r1.actionCount + ")" : "", " ");
466
466
  } }
467
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
467
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
468
468
  const _r9 = i0.ɵɵgetCurrentView();
469
- i0.ɵɵelementStart(0, "button", 88);
470
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.configureActions()); });
471
- i0.ɵɵelement(1, "i", 89);
469
+ i0.ɵɵelementStart(0, "button", 89);
470
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.configureActions()); });
471
+ i0.ɵɵelement(1, "i", 90);
472
472
  i0.ɵɵtext(2, " Add Action ");
473
473
  i0.ɵɵelementEnd();
474
474
  } }
475
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
475
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
476
476
  const _r10 = i0.ɵɵgetCurrentView();
477
- i0.ɵɵelementStart(0, "button", 91);
478
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_4_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.configureActions()); });
479
- i0.ɵɵelement(1, "i", 89);
477
+ i0.ɵɵelementStart(0, "button", 92);
478
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_4_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.configureActions()); });
479
+ i0.ɵɵelement(1, "i", 90);
480
480
  i0.ɵɵtext(2, " Configure First Action ");
481
481
  i0.ɵɵelementEnd();
482
482
  } }
483
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
484
- i0.ɵɵelementStart(0, "div", 40);
485
- i0.ɵɵelement(1, "i", 82);
483
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
484
+ i0.ɵɵelementStart(0, "div", 41);
485
+ i0.ɵɵelement(1, "i", 83);
486
486
  i0.ɵɵelementStart(2, "h4");
487
487
  i0.ɵɵtext(3, "No Actions Configured");
488
488
  i0.ɵɵelementEnd();
489
489
  i0.ɵɵelementStart(4, "p");
490
490
  i0.ɵɵtext(5, "Add actions to enable this agent to perform specific tasks and operations.");
491
491
  i0.ɵɵelementEnd();
492
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_4_Conditional_6_Template, 3, 0, "button", 90);
492
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_4_Conditional_6_Template, 3, 0, "button", 91);
493
493
  i0.ɵɵelementEnd();
494
494
  } if (rf & 2) {
495
495
  const ctx_r1 = i0.ɵɵnextContext(4);
496
496
  i0.ɵɵadvance(6);
497
497
  i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanCreateActions ? 6 : -1);
498
498
  } }
499
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
500
- i0.ɵɵelementStart(0, "div", 97);
499
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
500
+ i0.ɵɵelementStart(0, "div", 98);
501
501
  i0.ɵɵtext(1);
502
502
  i0.ɵɵelementEnd();
503
503
  } if (rf & 2) {
@@ -505,8 +505,8 @@ function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Condit
505
505
  i0.ɵɵadvance();
506
506
  i0.ɵɵtextInterpolate(action_r12.Description);
507
507
  } }
508
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
509
- i0.ɵɵelementStart(0, "span", 99);
508
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
509
+ i0.ɵɵelementStart(0, "span", 100);
510
510
  i0.ɵɵtext(1);
511
511
  i0.ɵɵelementEnd();
512
512
  } if (rf & 2) {
@@ -514,33 +514,33 @@ function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Condit
514
514
  i0.ɵɵadvance();
515
515
  i0.ɵɵtextInterpolate(action_r12.Type);
516
516
  } }
517
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
517
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
518
518
  const _r13 = i0.ɵɵgetCurrentView();
519
- i0.ɵɵelementStart(0, "button", 105);
520
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_13_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r13); const action_r12 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removeAction(action_r12, $event)); });
521
- i0.ɵɵelement(1, "i", 106);
519
+ i0.ɵɵelementStart(0, "button", 106);
520
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_13_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r13); const action_r12 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removeAction(action_r12, $event)); });
521
+ i0.ɵɵelement(1, "i", 107);
522
522
  i0.ɵɵelementEnd();
523
523
  } }
524
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
524
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
525
525
  const _r11 = i0.ɵɵgetCurrentView();
526
- i0.ɵɵelementStart(0, "div", 93);
527
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Template_div_click_0_listener() { const action_r12 = i0.ɵɵrestoreView(_r11).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("Actions", action_r12.ID)); });
528
- i0.ɵɵelementStart(1, "div", 94);
526
+ i0.ɵɵelementStart(0, "div", 94);
527
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Template_div_click_0_listener() { const action_r12 = i0.ɵɵrestoreView(_r11).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("Actions", action_r12.ID)); });
528
+ i0.ɵɵelementStart(1, "div", 95);
529
529
  i0.ɵɵelement(2, "i");
530
530
  i0.ɵɵelementEnd();
531
- i0.ɵɵelementStart(3, "div", 95)(4, "div", 96);
531
+ i0.ɵɵelementStart(3, "div", 96)(4, "div", 97);
532
532
  i0.ɵɵtext(5);
533
533
  i0.ɵɵelementEnd();
534
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_6_Template, 2, 1, "div", 97);
535
- i0.ɵɵelementStart(7, "div", 98);
536
- i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_8_Template, 2, 1, "span", 99);
537
- i0.ɵɵelementStart(9, "span", 100);
538
- i0.ɵɵelement(10, "i", 101);
534
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_6_Template, 2, 1, "div", 98);
535
+ i0.ɵɵelementStart(7, "div", 99);
536
+ i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_8_Template, 2, 1, "span", 100);
537
+ i0.ɵɵelementStart(9, "span", 101);
538
+ i0.ɵɵelement(10, "i", 102);
539
539
  i0.ɵɵtext(11);
540
540
  i0.ɵɵelementEnd()()();
541
- i0.ɵɵelementStart(12, "div", 102);
542
- i0.ɵɵtemplate(13, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_13_Template, 2, 0, "button", 103);
543
- i0.ɵɵelement(14, "i", 104);
541
+ i0.ɵɵelementStart(12, "div", 103);
542
+ i0.ɵɵtemplate(13, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Conditional_13_Template, 2, 0, "button", 104);
543
+ i0.ɵɵelement(14, "i", 105);
544
544
  i0.ɵɵelementEnd()();
545
545
  } if (rf & 2) {
546
546
  const action_r12 = ctx.$implicit;
@@ -562,10 +562,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Condit
562
562
  i0.ɵɵadvance(2);
563
563
  i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanDeleteActions ? 13 : -1);
564
564
  } }
565
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
565
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
566
566
  const _r14 = i0.ɵɵgetCurrentView();
567
- i0.ɵɵelementStart(0, "div", 81);
568
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Actions", "")); });
567
+ i0.ɵɵelementStart(0, "div", 82);
568
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Actions", "")); });
569
569
  i0.ɵɵelementStart(1, "span");
570
570
  i0.ɵɵtext(2);
571
571
  i0.ɵɵelementEnd()();
@@ -574,10 +574,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Condit
574
574
  i0.ɵɵadvance(2);
575
575
  i0.ɵɵtextInterpolate1("View all ", ctx_r1.actionCount, " actions...");
576
576
  } }
577
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
578
- i0.ɵɵelementStart(0, "div", 87);
579
- i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_For_2_Template, 15, 15, "div", 92, _forTrack0);
580
- i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_Conditional_3_Template, 3, 1, "div", 43);
577
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
578
+ i0.ɵɵelementStart(0, "div", 88);
579
+ i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_For_2_Template, 15, 15, "div", 93, _forTrack0);
580
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_Conditional_3_Template, 3, 1, "div", 44);
581
581
  i0.ɵɵelementEnd();
582
582
  } if (rf & 2) {
583
583
  const ctx_r1 = i0.ɵɵnextContext(4);
@@ -586,11 +586,11 @@ function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Condit
586
586
  i0.ɵɵadvance(2);
587
587
  i0.ɵɵconditional(ctx_r1.actionCount > ctx_r1.agentActions.length ? 3 : -1);
588
588
  } }
589
- function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Template(rf, ctx) { if (rf & 1) {
590
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 85);
591
- i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_3_Template, 3, 0, "button", 86);
589
+ function AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Template(rf, ctx) { if (rf & 1) {
590
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 86);
591
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_3_Template, 3, 0, "button", 87);
592
592
  i0.ɵɵelementEnd()();
593
- i0.ɵɵtemplate(4, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_4_Template, 7, 1, "div", 40)(5, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Conditional_5_Template, 4, 1, "div", 87);
593
+ i0.ɵɵtemplate(4, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_4_Template, 7, 1, "div", 41)(5, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Conditional_5_Template, 4, 1, "div", 88);
594
594
  i0.ɵɵelementEnd();
595
595
  } if (rf & 2) {
596
596
  const ctx_r1 = i0.ɵɵnextContext(3);
@@ -599,78 +599,78 @@ function AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Templa
599
599
  i0.ɵɵadvance();
600
600
  i0.ɵɵconditional(ctx_r1.actionCount === 0 ? 4 : 5);
601
601
  } }
602
- function AIAgentFormComponentExtended_form_2_Conditional_24_Template(rf, ctx) { if (rf & 1) {
603
- i0.ɵɵelementStart(0, "kendo-panelbar-item", 26);
604
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_1_Template, 2, 1, "ng-template", 27)(2, AIAgentFormComponentExtended_form_2_Conditional_24_ng_template_2_Template, 6, 2, "ng-template", 28);
602
+ function AIAgentFormComponentExtended_form_3_Conditional_24_Template(rf, ctx) { if (rf & 1) {
603
+ i0.ɵɵelementStart(0, "kendo-panelbar-item", 27);
604
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_1_Template, 2, 1, "ng-template", 28)(2, AIAgentFormComponentExtended_form_3_Conditional_24_ng_template_2_Template, 6, 2, "ng-template", 29);
605
605
  i0.ɵɵelementEnd();
606
606
  } if (rf & 2) {
607
607
  i0.ɵɵproperty("expanded", false);
608
608
  } }
609
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_1_Template(rf, ctx) { if (rf & 1) {
610
- i0.ɵɵelement(0, "i", 32);
609
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_1_Template(rf, ctx) { if (rf & 1) {
610
+ i0.ɵɵelement(0, "i", 33);
611
611
  i0.ɵɵtext(1);
612
612
  } if (rf & 2) {
613
613
  const ctx_r1 = i0.ɵɵnextContext(3);
614
614
  i0.ɵɵadvance();
615
615
  i0.ɵɵtextInterpolate1(" Sub-Agents", ctx_r1.subAgentCount > 0 ? " (" + ctx_r1.subAgentCount + ")" : "", " ");
616
616
  } }
617
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
617
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
618
618
  const _r15 = i0.ɵɵgetCurrentView();
619
- i0.ɵɵelementStart(0, "button", 88);
620
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.addSubAgents()); });
621
- i0.ɵɵelement(1, "i", 89);
619
+ i0.ɵɵelementStart(0, "button", 89);
620
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.addSubAgents()); });
621
+ i0.ɵɵelement(1, "i", 90);
622
622
  i0.ɵɵtext(2, " Add Subagent ");
623
623
  i0.ɵɵelementEnd();
624
- i0.ɵɵelementStart(3, "button", 108);
625
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_5_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.createSubAgent()); });
626
- i0.ɵɵelement(4, "i", 89);
624
+ i0.ɵɵelementStart(3, "button", 109);
625
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_5_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.createSubAgent()); });
626
+ i0.ɵɵelement(4, "i", 90);
627
627
  i0.ɵɵtext(5, " Create Sub-Agent ");
628
628
  i0.ɵɵelementEnd();
629
629
  } }
630
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template(rf, ctx) { if (rf & 1) {
630
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template(rf, ctx) { if (rf & 1) {
631
631
  const _r16 = i0.ɵɵgetCurrentView();
632
- i0.ɵɵelementStart(0, "button", 91);
633
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addSubAgents()); });
634
- i0.ɵɵelement(1, "i", 89);
632
+ i0.ɵɵelementStart(0, "button", 92);
633
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addSubAgents()); });
634
+ i0.ɵɵelement(1, "i", 90);
635
635
  i0.ɵɵtext(2, " Add Subagent ");
636
636
  i0.ɵɵelementEnd();
637
- i0.ɵɵelementStart(3, "button", 109);
638
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.createSubAgent()); });
639
- i0.ɵɵelement(4, "i", 89);
637
+ i0.ɵɵelementStart(3, "button", 110);
638
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r16); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.createSubAgent()); });
639
+ i0.ɵɵelement(4, "i", 90);
640
640
  i0.ɵɵtext(5, " Create First Sub-Agent ");
641
641
  i0.ɵɵelementEnd();
642
642
  } }
643
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
644
- i0.ɵɵelementStart(0, "div", 40);
645
- i0.ɵɵelement(1, "i", 32);
643
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
644
+ i0.ɵɵelementStart(0, "div", 41);
645
+ i0.ɵɵelement(1, "i", 33);
646
646
  i0.ɵɵelementStart(2, "h4");
647
647
  i0.ɵɵtext(3, "No Sub-Agents");
648
648
  i0.ɵɵelementEnd();
649
649
  i0.ɵɵelementStart(4, "p");
650
650
  i0.ɵɵtext(5, "Create sub-agents to build a hierarchical structure for complex workflows.");
651
651
  i0.ɵɵelementEnd();
652
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template, 6, 0);
652
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_6_Conditional_6_Template, 6, 0);
653
653
  i0.ɵɵelementEnd();
654
654
  } if (rf & 2) {
655
655
  const ctx_r1 = i0.ɵɵnextContext(4);
656
656
  i0.ɵɵadvance(6);
657
657
  i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanCreateSubAgents ? 6 : -1);
658
658
  } }
659
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
660
- i0.ɵɵelement(0, "img", 112);
659
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
660
+ i0.ɵɵelement(0, "img", 113);
661
661
  } if (rf & 2) {
662
662
  const subAgent_r18 = i0.ɵɵnextContext().$implicit;
663
663
  i0.ɵɵproperty("src", subAgent_r18.LogoURL, i0.ɵɵsanitizeUrl)("alt", subAgent_r18.Name + " logo");
664
664
  } }
665
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
665
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
666
666
  i0.ɵɵelement(0, "i");
667
667
  } if (rf & 2) {
668
668
  const subAgent_r18 = i0.ɵɵnextContext().$implicit;
669
669
  const ctx_r1 = i0.ɵɵnextContext(5);
670
670
  i0.ɵɵclassMap(ctx_r1.getSubAgentIcon(subAgent_r18));
671
671
  } }
672
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
673
- i0.ɵɵelementStart(0, "div", 97);
672
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
673
+ i0.ɵɵelementStart(0, "div", 98);
674
674
  i0.ɵɵtext(1);
675
675
  i0.ɵɵelementEnd();
676
676
  } if (rf & 2) {
@@ -678,8 +678,8 @@ function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Condit
678
678
  i0.ɵɵadvance();
679
679
  i0.ɵɵtextInterpolate(subAgent_r18.Description);
680
680
  } }
681
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_9_Template(rf, ctx) { if (rf & 1) {
682
- i0.ɵɵelementStart(0, "span", 100);
681
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_9_Template(rf, ctx) { if (rf & 1) {
682
+ i0.ɵɵelementStart(0, "span", 101);
683
683
  i0.ɵɵtext(1);
684
684
  i0.ɵɵelementEnd();
685
685
  } if (rf & 2) {
@@ -689,8 +689,8 @@ function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Condit
689
689
  i0.ɵɵadvance();
690
690
  i0.ɵɵtextInterpolate1(" ", subAgent_r18.Status, " ");
691
691
  } }
692
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
693
- i0.ɵɵelementStart(0, "span", 99);
692
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
693
+ i0.ɵɵelementStart(0, "span", 100);
694
694
  i0.ɵɵtext(1);
695
695
  i0.ɵɵelementEnd();
696
696
  } if (rf & 2) {
@@ -698,37 +698,37 @@ function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Condit
698
698
  i0.ɵɵadvance();
699
699
  i0.ɵɵtextInterpolate(subAgent_r18.ExecutionMode);
700
700
  } }
701
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
701
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
702
702
  const _r19 = i0.ɵɵgetCurrentView();
703
- i0.ɵɵelementStart(0, "button", 116);
704
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_12_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r19); const subAgent_r18 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.openSubAgentAdvancedSettings(subAgent_r18, $event)); });
705
- i0.ɵɵelement(1, "i", 59);
703
+ i0.ɵɵelementStart(0, "button", 117);
704
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_12_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r19); const subAgent_r18 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.openSubAgentAdvancedSettings(subAgent_r18, $event)); });
705
+ i0.ɵɵelement(1, "i", 60);
706
706
  i0.ɵɵelementEnd();
707
707
  } }
708
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
708
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
709
709
  const _r20 = i0.ɵɵgetCurrentView();
710
- i0.ɵɵelementStart(0, "button", 117);
711
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_13_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r20); const subAgent_r18 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removeSubAgent(subAgent_r18, $event)); });
712
- i0.ɵɵelement(1, "i", 106);
710
+ i0.ɵɵelementStart(0, "button", 118);
711
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_13_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r20); const subAgent_r18 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removeSubAgent(subAgent_r18, $event)); });
712
+ i0.ɵɵelement(1, "i", 107);
713
713
  i0.ɵɵelementEnd();
714
714
  } }
715
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
715
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
716
716
  const _r17 = i0.ɵɵgetCurrentView();
717
- i0.ɵɵelementStart(0, "div", 111);
718
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Template_div_click_0_listener() { const subAgent_r18 = i0.ɵɵrestoreView(_r17).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agents", subAgent_r18.ID)); });
719
- i0.ɵɵelementStart(1, "div", 94);
720
- i0.ɵɵtemplate(2, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_2_Template, 1, 2, "img", 112)(3, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_3_Template, 1, 2, "i", 12);
717
+ i0.ɵɵelementStart(0, "div", 112);
718
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Template_div_click_0_listener() { const subAgent_r18 = i0.ɵɵrestoreView(_r17).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agents", subAgent_r18.ID)); });
719
+ i0.ɵɵelementStart(1, "div", 95);
720
+ i0.ɵɵtemplate(2, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_2_Template, 1, 2, "img", 113)(3, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_3_Template, 1, 2, "i", 13);
721
721
  i0.ɵɵelementEnd();
722
- i0.ɵɵelementStart(4, "div", 95)(5, "div", 96);
722
+ i0.ɵɵelementStart(4, "div", 96)(5, "div", 97);
723
723
  i0.ɵɵtext(6);
724
724
  i0.ɵɵelementEnd();
725
- i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_7_Template, 2, 1, "div", 97);
726
- i0.ɵɵelementStart(8, "div", 98);
727
- i0.ɵɵtemplate(9, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_9_Template, 2, 3, "span", 113)(10, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_10_Template, 2, 1, "span", 99);
725
+ i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_7_Template, 2, 1, "div", 98);
726
+ i0.ɵɵelementStart(8, "div", 99);
727
+ i0.ɵɵtemplate(9, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_9_Template, 2, 3, "span", 114)(10, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_10_Template, 2, 1, "span", 100);
728
728
  i0.ɵɵelementEnd()();
729
- i0.ɵɵelementStart(11, "div", 102);
730
- i0.ɵɵtemplate(12, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_12_Template, 2, 0, "button", 114)(13, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_13_Template, 2, 0, "button", 115);
731
- i0.ɵɵelement(14, "i", 104);
729
+ i0.ɵɵelementStart(11, "div", 103);
730
+ i0.ɵɵtemplate(12, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_12_Template, 2, 0, "button", 115)(13, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Conditional_13_Template, 2, 0, "button", 116);
731
+ i0.ɵɵelement(14, "i", 105);
732
732
  i0.ɵɵelementEnd()();
733
733
  } if (rf & 2) {
734
734
  const subAgent_r18 = ctx.$implicit;
@@ -748,10 +748,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Condit
748
748
  i0.ɵɵadvance();
749
749
  i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanDeleteSubAgents ? 13 : -1);
750
750
  } }
751
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
751
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
752
752
  const _r21 = i0.ɵɵgetCurrentView();
753
- i0.ɵɵelementStart(0, "div", 81);
754
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agents", "")); });
753
+ i0.ɵɵelementStart(0, "div", 82);
754
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agents", "")); });
755
755
  i0.ɵɵelementStart(1, "span");
756
756
  i0.ɵɵtext(2);
757
757
  i0.ɵɵelementEnd()();
@@ -760,10 +760,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Condit
760
760
  i0.ɵɵadvance(2);
761
761
  i0.ɵɵtextInterpolate1("View all ", ctx_r1.subAgentCount, " sub-agents...");
762
762
  } }
763
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
764
- i0.ɵɵelementStart(0, "div", 87);
765
- i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_For_2_Template, 15, 7, "div", 110, _forTrack0);
766
- i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_Conditional_3_Template, 3, 1, "div", 43);
763
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
764
+ i0.ɵɵelementStart(0, "div", 88);
765
+ i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_For_2_Template, 15, 7, "div", 111, _forTrack0);
766
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_Conditional_3_Template, 3, 1, "div", 44);
767
767
  i0.ɵɵelementEnd();
768
768
  } if (rf & 2) {
769
769
  const ctx_r1 = i0.ɵɵnextContext(4);
@@ -772,14 +772,14 @@ function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Condit
772
772
  i0.ɵɵadvance(2);
773
773
  i0.ɵɵconditional(ctx_r1.subAgentCount > ctx_r1.subAgents.length ? 3 : -1);
774
774
  } }
775
- function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Template(rf, ctx) { if (rf & 1) {
776
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 107);
775
+ function AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Template(rf, ctx) { if (rf & 1) {
776
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 108);
777
777
  i0.ɵɵtext(3, " Manage hierarchical relationships with child agents that work under this agent. ");
778
778
  i0.ɵɵelementEnd();
779
- i0.ɵɵelementStart(4, "div", 85);
780
- i0.ɵɵtemplate(5, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_5_Template, 6, 0);
779
+ i0.ɵɵelementStart(4, "div", 86);
780
+ i0.ɵɵtemplate(5, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_5_Template, 6, 0);
781
781
  i0.ɵɵelementEnd()();
782
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_6_Template, 7, 1, "div", 40)(7, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Conditional_7_Template, 4, 1, "div", 87);
782
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_6_Template, 7, 1, "div", 41)(7, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Conditional_7_Template, 4, 1, "div", 88);
783
783
  i0.ɵɵelementEnd();
784
784
  } if (rf & 2) {
785
785
  const ctx_r1 = i0.ɵɵnextContext(3);
@@ -788,33 +788,33 @@ function AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Templa
788
788
  i0.ɵɵadvance();
789
789
  i0.ɵɵconditional(ctx_r1.subAgentCount === 0 ? 6 : 7);
790
790
  } }
791
- function AIAgentFormComponentExtended_form_2_Conditional_25_Template(rf, ctx) { if (rf & 1) {
792
- i0.ɵɵelementStart(0, "kendo-panelbar-item", 26);
793
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_1_Template, 2, 1, "ng-template", 27)(2, AIAgentFormComponentExtended_form_2_Conditional_25_ng_template_2_Template, 8, 2, "ng-template", 28);
791
+ function AIAgentFormComponentExtended_form_3_Conditional_25_Template(rf, ctx) { if (rf & 1) {
792
+ i0.ɵɵelementStart(0, "kendo-panelbar-item", 27);
793
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_1_Template, 2, 1, "ng-template", 28)(2, AIAgentFormComponentExtended_form_3_Conditional_25_ng_template_2_Template, 8, 2, "ng-template", 29);
794
794
  i0.ɵɵelementEnd();
795
795
  } if (rf & 2) {
796
796
  i0.ɵɵproperty("expanded", false);
797
797
  } }
798
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_1_Template(rf, ctx) { if (rf & 1) {
799
- i0.ɵɵelement(0, "i", 76);
798
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_1_Template(rf, ctx) { if (rf & 1) {
799
+ i0.ɵɵelement(0, "i", 77);
800
800
  i0.ɵɵtext(1);
801
801
  } if (rf & 2) {
802
802
  const ctx_r1 = i0.ɵɵnextContext(3);
803
803
  i0.ɵɵadvance();
804
804
  i0.ɵɵtextInterpolate1(" Prompts", ctx_r1.promptCount > 0 ? " (" + ctx_r1.promptCount + ")" : "", " ");
805
805
  } }
806
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
806
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
807
807
  const _r22 = i0.ɵɵgetCurrentView();
808
- i0.ɵɵelementStart(0, "kendo-dropdownlist", 124);
809
- i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_7_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(4); i0.ɵɵtwoWayBindingSet(ctx_r1.record.ModelSelectionMode, $event) || (ctx_r1.record.ModelSelectionMode = $event); return i0.ɵɵresetView($event); });
808
+ i0.ɵɵelementStart(0, "kendo-dropdownlist", 125);
809
+ i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_7_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(4); i0.ɵɵtwoWayBindingSet(ctx_r1.record.ModelSelectionMode, $event) || (ctx_r1.record.ModelSelectionMode = $event); return i0.ɵɵresetView($event); });
810
810
  i0.ɵɵelementEnd();
811
811
  } if (rf & 2) {
812
812
  const ctx_r1 = i0.ɵɵnextContext(4);
813
813
  i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.ModelSelectionMode);
814
814
  i0.ɵɵproperty("data", ctx_r1.modelSelectionModes)("valuePrimitive", true);
815
815
  } }
816
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
817
- i0.ɵɵelementStart(0, "span", 123);
816
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
817
+ i0.ɵɵelementStart(0, "span", 124);
818
818
  i0.ɵɵtext(1);
819
819
  i0.ɵɵelementEnd();
820
820
  } if (rf & 2) {
@@ -822,40 +822,40 @@ function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Condit
822
822
  i0.ɵɵadvance();
823
823
  i0.ɵɵtextInterpolate(ctx_r1.record.ModelSelectionMode || "Agent Type");
824
824
  } }
825
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
825
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
826
826
  const _r23 = i0.ɵɵgetCurrentView();
827
- i0.ɵɵelementStart(0, "button", 88);
828
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.addPrompt()); });
829
- i0.ɵɵelement(1, "i", 89);
827
+ i0.ɵɵelementStart(0, "button", 89);
828
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.addPrompt()); });
829
+ i0.ɵɵelement(1, "i", 90);
830
830
  i0.ɵɵtext(2, " Add Prompt ");
831
831
  i0.ɵɵelementEnd();
832
832
  } }
833
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_11_Conditional_6_Template(rf, ctx) { if (rf & 1) {
833
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_11_Conditional_6_Template(rf, ctx) { if (rf & 1) {
834
834
  const _r24 = i0.ɵɵgetCurrentView();
835
- i0.ɵɵelementStart(0, "button", 91);
836
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_11_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addPrompt()); });
837
- i0.ɵɵelement(1, "i", 89);
835
+ i0.ɵɵelementStart(0, "button", 92);
836
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_11_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addPrompt()); });
837
+ i0.ɵɵelement(1, "i", 90);
838
838
  i0.ɵɵtext(2, " Create First Prompt ");
839
839
  i0.ɵɵelementEnd();
840
840
  } }
841
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
842
- i0.ɵɵelementStart(0, "div", 40);
843
- i0.ɵɵelement(1, "i", 76);
841
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
842
+ i0.ɵɵelementStart(0, "div", 41);
843
+ i0.ɵɵelement(1, "i", 77);
844
844
  i0.ɵɵelementStart(2, "h4");
845
845
  i0.ɵɵtext(3, "No Prompts Configured");
846
846
  i0.ɵɵelementEnd();
847
847
  i0.ɵɵelementStart(4, "p");
848
848
  i0.ɵɵtext(5, "Add prompts to define how this agent processes requests and generates responses.");
849
849
  i0.ɵɵelementEnd();
850
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_11_Conditional_6_Template, 3, 0, "button", 90);
850
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_11_Conditional_6_Template, 3, 0, "button", 91);
851
851
  i0.ɵɵelementEnd();
852
852
  } if (rf & 2) {
853
853
  const ctx_r1 = i0.ɵɵnextContext(4);
854
854
  i0.ɵɵadvance(6);
855
855
  i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanCreateNewPrompts ? 6 : -1);
856
856
  } }
857
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
858
- i0.ɵɵelementStart(0, "div", 97);
857
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
858
+ i0.ɵɵelementStart(0, "div", 98);
859
859
  i0.ɵɵtext(1);
860
860
  i0.ɵɵelementEnd();
861
861
  } if (rf & 2) {
@@ -863,8 +863,8 @@ function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Condit
863
863
  i0.ɵɵadvance();
864
864
  i0.ɵɵtextInterpolate2("", prompt_r26.TemplateText.substring(0, 120), "", prompt_r26.TemplateText.length > 120 ? "..." : "", "");
865
865
  } }
866
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
867
- i0.ɵɵelementStart(0, "span", 99);
866
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
867
+ i0.ɵɵelementStart(0, "span", 100);
868
868
  i0.ɵɵtext(1);
869
869
  i0.ɵɵelementEnd();
870
870
  } if (rf & 2) {
@@ -872,37 +872,37 @@ function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Condit
872
872
  i0.ɵɵadvance();
873
873
  i0.ɵɵtextInterpolate(prompt_r26.PromptRole);
874
874
  } }
875
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
875
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
876
876
  const _r27 = i0.ɵɵgetCurrentView();
877
- i0.ɵɵelementStart(0, "button", 116);
878
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_10_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r27); const prompt_r26 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.openPromptAdvancedSettings(prompt_r26, $event)); });
879
- i0.ɵɵelement(1, "i", 59);
877
+ i0.ɵɵelementStart(0, "button", 117);
878
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_10_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r27); const prompt_r26 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.openPromptAdvancedSettings(prompt_r26, $event)); });
879
+ i0.ɵɵelement(1, "i", 60);
880
880
  i0.ɵɵelementEnd();
881
881
  } }
882
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
882
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
883
883
  const _r28 = i0.ɵɵgetCurrentView();
884
- i0.ɵɵelementStart(0, "button", 129);
885
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_11_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r28); const prompt_r26 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removePrompt(prompt_r26, $event)); });
886
- i0.ɵɵelement(1, "i", 106);
884
+ i0.ɵɵelementStart(0, "button", 130);
885
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_11_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r28); const prompt_r26 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removePrompt(prompt_r26, $event)); });
886
+ i0.ɵɵelement(1, "i", 107);
887
887
  i0.ɵɵelementEnd();
888
888
  } }
889
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Template(rf, ctx) { if (rf & 1) {
889
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Template(rf, ctx) { if (rf & 1) {
890
890
  const _r25 = i0.ɵɵgetCurrentView();
891
- i0.ɵɵelementStart(0, "div", 126);
892
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Template_div_click_0_listener() { const prompt_r26 = i0.ɵɵrestoreView(_r25).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Prompts", prompt_r26.ID)); });
893
- i0.ɵɵelementStart(1, "div", 94);
894
- i0.ɵɵelement(2, "i", 127);
891
+ i0.ɵɵelementStart(0, "div", 127);
892
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Template_div_click_0_listener() { const prompt_r26 = i0.ɵɵrestoreView(_r25).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Prompts", prompt_r26.ID)); });
893
+ i0.ɵɵelementStart(1, "div", 95);
894
+ i0.ɵɵelement(2, "i", 128);
895
895
  i0.ɵɵelementEnd();
896
- i0.ɵɵelementStart(3, "div", 95)(4, "div", 96);
896
+ i0.ɵɵelementStart(3, "div", 96)(4, "div", 97);
897
897
  i0.ɵɵtext(5);
898
898
  i0.ɵɵelementEnd();
899
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_6_Template, 2, 2, "div", 97);
900
- i0.ɵɵelementStart(7, "div", 98);
901
- i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_8_Template, 2, 1, "span", 99);
899
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_6_Template, 2, 2, "div", 98);
900
+ i0.ɵɵelementStart(7, "div", 99);
901
+ i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_8_Template, 2, 1, "span", 100);
902
902
  i0.ɵɵelementEnd()();
903
- i0.ɵɵelementStart(9, "div", 102);
904
- i0.ɵɵtemplate(10, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_10_Template, 2, 0, "button", 114)(11, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_11_Template, 2, 0, "button", 128);
905
- i0.ɵɵelement(12, "i", 104);
903
+ i0.ɵɵelementStart(9, "div", 103);
904
+ i0.ɵɵtemplate(10, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_10_Template, 2, 0, "button", 115)(11, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Conditional_11_Template, 2, 0, "button", 129);
905
+ i0.ɵɵelement(12, "i", 105);
906
906
  i0.ɵɵelementEnd()();
907
907
  } if (rf & 2) {
908
908
  const prompt_r26 = ctx.$implicit;
@@ -918,10 +918,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Condit
918
918
  i0.ɵɵadvance();
919
919
  i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanDeletePrompts ? 11 : -1);
920
920
  } }
921
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_Conditional_3_Template(rf, ctx) { if (rf & 1) {
921
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_Conditional_3_Template(rf, ctx) { if (rf & 1) {
922
922
  const _r29 = i0.ɵɵgetCurrentView();
923
- i0.ɵɵelementStart(0, "div", 81);
924
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r29); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Prompts", "")); });
923
+ i0.ɵɵelementStart(0, "div", 82);
924
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r29); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Prompts", "")); });
925
925
  i0.ɵɵelementStart(1, "span");
926
926
  i0.ɵɵtext(2);
927
927
  i0.ɵɵelementEnd()();
@@ -930,10 +930,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Condit
930
930
  i0.ɵɵadvance(2);
931
931
  i0.ɵɵtextInterpolate1("View all ", ctx_r1.promptCount, " prompts...");
932
932
  } }
933
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
934
- i0.ɵɵelementStart(0, "div", 87);
935
- i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_For_2_Template, 13, 5, "div", 125, _forTrack0);
936
- i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_Conditional_3_Template, 3, 1, "div", 43);
933
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
934
+ i0.ɵɵelementStart(0, "div", 88);
935
+ i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_For_2_Template, 13, 5, "div", 126, _forTrack0);
936
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_Conditional_3_Template, 3, 1, "div", 44);
937
937
  i0.ɵɵelementEnd();
938
938
  } if (rf & 2) {
939
939
  const ctx_r1 = i0.ɵɵnextContext(4);
@@ -942,17 +942,17 @@ function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Condit
942
942
  i0.ɵɵadvance(2);
943
943
  i0.ɵɵconditional(ctx_r1.promptCount > ctx_r1.agentPrompts.length ? 3 : -1);
944
944
  } }
945
- function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Template(rf, ctx) { if (rf & 1) {
946
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 118)(3, "div", 119)(4, "label", 120);
947
- i0.ɵɵelement(5, "i", 121);
945
+ function AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Template(rf, ctx) { if (rf & 1) {
946
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 119)(3, "div", 120)(4, "label", 121);
947
+ i0.ɵɵelement(5, "i", 122);
948
948
  i0.ɵɵtext(6, " Model Selection: ");
949
949
  i0.ɵɵelementEnd();
950
- i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_7_Template, 1, 3, "kendo-dropdownlist", 122)(8, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_8_Template, 2, 1, "span", 123);
950
+ i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_7_Template, 1, 3, "kendo-dropdownlist", 123)(8, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_8_Template, 2, 1, "span", 124);
951
951
  i0.ɵɵelementEnd()();
952
- i0.ɵɵelementStart(9, "div", 85);
953
- i0.ɵɵtemplate(10, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_10_Template, 3, 0, "button", 86);
952
+ i0.ɵɵelementStart(9, "div", 86);
953
+ i0.ɵɵtemplate(10, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_10_Template, 3, 0, "button", 87);
954
954
  i0.ɵɵelementEnd()();
955
- i0.ɵɵtemplate(11, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_11_Template, 7, 1, "div", 40)(12, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Conditional_12_Template, 4, 1, "div", 87);
955
+ i0.ɵɵtemplate(11, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_11_Template, 7, 1, "div", 41)(12, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Conditional_12_Template, 4, 1, "div", 88);
956
956
  i0.ɵɵelementEnd();
957
957
  } if (rf & 2) {
958
958
  const ctx_r1 = i0.ɵɵnextContext(3);
@@ -963,24 +963,24 @@ function AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Templa
963
963
  i0.ɵɵadvance();
964
964
  i0.ɵɵconditional(ctx_r1.promptCount === 0 ? 11 : 12);
965
965
  } }
966
- function AIAgentFormComponentExtended_form_2_Conditional_26_Template(rf, ctx) { if (rf & 1) {
967
- i0.ɵɵelementStart(0, "kendo-panelbar-item", 26);
968
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_1_Template, 2, 1, "ng-template", 27)(2, AIAgentFormComponentExtended_form_2_Conditional_26_ng_template_2_Template, 13, 3, "ng-template", 28);
966
+ function AIAgentFormComponentExtended_form_3_Conditional_26_Template(rf, ctx) { if (rf & 1) {
967
+ i0.ɵɵelementStart(0, "kendo-panelbar-item", 27);
968
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_1_Template, 2, 1, "ng-template", 28)(2, AIAgentFormComponentExtended_form_3_Conditional_26_ng_template_2_Template, 13, 3, "ng-template", 29);
969
969
  i0.ɵɵelementEnd();
970
970
  } if (rf & 2) {
971
971
  i0.ɵɵproperty("expanded", false);
972
972
  } }
973
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_1_Template(rf, ctx) { if (rf & 1) {
974
- i0.ɵɵelement(0, "i", 130);
973
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_1_Template(rf, ctx) { if (rf & 1) {
974
+ i0.ɵɵelement(0, "i", 131);
975
975
  i0.ɵɵtext(1);
976
976
  } if (rf & 2) {
977
977
  const ctx_r1 = i0.ɵɵnextContext(3);
978
978
  i0.ɵɵadvance();
979
979
  i0.ɵɵtextInterpolate1(" Learning Cycles", ctx_r1.learningCycleCount > 0 ? " (" + ctx_r1.learningCycleCount + ")" : "", " ");
980
980
  } }
981
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
982
- i0.ɵɵelementStart(0, "div", 40);
983
- i0.ɵɵelement(1, "i", 130);
981
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
982
+ i0.ɵɵelementStart(0, "div", 41);
983
+ i0.ɵɵelement(1, "i", 131);
984
984
  i0.ɵɵelementStart(2, "h4");
985
985
  i0.ɵɵtext(3, "No Learning Cycles");
986
986
  i0.ɵɵelementEnd();
@@ -988,9 +988,9 @@ function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Condit
988
988
  i0.ɵɵtext(5, "Learning cycles will appear here as the agent processes requests and improves over time.");
989
989
  i0.ɵɵelementEnd()();
990
990
  } }
991
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
992
- i0.ɵɵelementStart(0, "span", 99);
993
- i0.ɵɵelement(1, "i", 133);
991
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
992
+ i0.ɵɵelementStart(0, "span", 100);
993
+ i0.ɵɵelement(1, "i", 134);
994
994
  i0.ɵɵtext(2);
995
995
  i0.ɵɵpipe(3, "date");
996
996
  i0.ɵɵelementEnd();
@@ -999,8 +999,8 @@ function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Condit
999
999
  i0.ɵɵadvance(2);
1000
1000
  i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 1, cycle_r31.StartedAt, "short"), " ");
1001
1001
  } }
1002
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
1003
- i0.ɵɵelementStart(0, "span", 100);
1002
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
1003
+ i0.ɵɵelementStart(0, "span", 101);
1004
1004
  i0.ɵɵtext(1);
1005
1005
  i0.ɵɵelementEnd();
1006
1006
  } if (rf & 2) {
@@ -1008,21 +1008,21 @@ function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Condit
1008
1008
  i0.ɵɵadvance();
1009
1009
  i0.ɵɵtextInterpolate(cycle_r31.Status);
1010
1010
  } }
1011
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
1011
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
1012
1012
  const _r30 = i0.ɵɵgetCurrentView();
1013
- i0.ɵɵelementStart(0, "div", 132);
1014
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_For_2_Template_div_click_0_listener() { const cycle_r31 = i0.ɵɵrestoreView(_r30).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Learning Cycles", cycle_r31.ID)); });
1015
- i0.ɵɵelementStart(1, "div", 94);
1016
- i0.ɵɵelement(2, "i", 130);
1013
+ i0.ɵɵelementStart(0, "div", 133);
1014
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_For_2_Template_div_click_0_listener() { const cycle_r31 = i0.ɵɵrestoreView(_r30).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Learning Cycles", cycle_r31.ID)); });
1015
+ i0.ɵɵelementStart(1, "div", 95);
1016
+ i0.ɵɵelement(2, "i", 131);
1017
1017
  i0.ɵɵelementEnd();
1018
- i0.ɵɵelementStart(3, "div", 95)(4, "div", 96);
1018
+ i0.ɵɵelementStart(3, "div", 96)(4, "div", 97);
1019
1019
  i0.ɵɵtext(5);
1020
1020
  i0.ɵɵelementEnd();
1021
- i0.ɵɵelementStart(6, "div", 98);
1022
- i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_7_Template, 4, 4, "span", 99)(8, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_8_Template, 2, 1, "span", 100);
1021
+ i0.ɵɵelementStart(6, "div", 99);
1022
+ i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_7_Template, 4, 4, "span", 100)(8, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_For_2_Conditional_8_Template, 2, 1, "span", 101);
1023
1023
  i0.ɵɵelementEnd()();
1024
- i0.ɵɵelementStart(9, "div", 102);
1025
- i0.ɵɵelement(10, "i", 104);
1024
+ i0.ɵɵelementStart(9, "div", 103);
1025
+ i0.ɵɵelement(10, "i", 105);
1026
1026
  i0.ɵɵelementEnd()();
1027
1027
  } if (rf & 2) {
1028
1028
  const cycle_r31 = ctx.$implicit;
@@ -1033,10 +1033,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Condit
1033
1033
  i0.ɵɵadvance();
1034
1034
  i0.ɵɵconditional(cycle_r31.Status ? 8 : -1);
1035
1035
  } }
1036
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
1036
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
1037
1037
  const _r32 = i0.ɵɵgetCurrentView();
1038
- i0.ɵɵelementStart(0, "div", 81);
1039
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Learning Cycles", "")); });
1038
+ i0.ɵɵelementStart(0, "div", 82);
1039
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Learning Cycles", "")); });
1040
1040
  i0.ɵɵelementStart(1, "span");
1041
1041
  i0.ɵɵtext(2);
1042
1042
  i0.ɵɵelementEnd()();
@@ -1045,10 +1045,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Condit
1045
1045
  i0.ɵɵadvance(2);
1046
1046
  i0.ɵɵtextInterpolate1("View all ", ctx_r1.learningCycleCount, " cycles...");
1047
1047
  } }
1048
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
1049
- i0.ɵɵelementStart(0, "div", 87);
1050
- i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_For_2_Template, 11, 3, "div", 131, _forTrack0);
1051
- i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_Conditional_3_Template, 3, 1, "div", 43);
1048
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
1049
+ i0.ɵɵelementStart(0, "div", 88);
1050
+ i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_For_2_Template, 11, 3, "div", 132, _forTrack0);
1051
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_Conditional_3_Template, 3, 1, "div", 44);
1052
1052
  i0.ɵɵelementEnd();
1053
1053
  } if (rf & 2) {
1054
1054
  const ctx_r1 = i0.ɵɵnextContext(4);
@@ -1057,66 +1057,66 @@ function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Condit
1057
1057
  i0.ɵɵadvance(2);
1058
1058
  i0.ɵɵconditional(ctx_r1.learningCycleCount > ctx_r1.learningCycles.length ? 3 : -1);
1059
1059
  } }
1060
- function AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Template(rf, ctx) { if (rf & 1) {
1061
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 107);
1060
+ function AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Template(rf, ctx) { if (rf & 1) {
1061
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 108);
1062
1062
  i0.ɵɵtext(3, " Monitor and manage learning cycles, training sessions, and performance analytics. ");
1063
1063
  i0.ɵɵelementEnd()();
1064
- i0.ɵɵtemplate(4, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_4_Template, 6, 0, "div", 40)(5, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Conditional_5_Template, 4, 1, "div", 87);
1064
+ i0.ɵɵtemplate(4, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_4_Template, 6, 0, "div", 41)(5, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Conditional_5_Template, 4, 1, "div", 88);
1065
1065
  i0.ɵɵelementEnd();
1066
1066
  } if (rf & 2) {
1067
1067
  const ctx_r1 = i0.ɵɵnextContext(3);
1068
1068
  i0.ɵɵadvance(4);
1069
1069
  i0.ɵɵconditional(ctx_r1.learningCycleCount === 0 ? 4 : 5);
1070
1070
  } }
1071
- function AIAgentFormComponentExtended_form_2_Conditional_27_Template(rf, ctx) { if (rf & 1) {
1072
- i0.ɵɵelementStart(0, "kendo-panelbar-item", 26);
1073
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_1_Template, 2, 1, "ng-template", 27)(2, AIAgentFormComponentExtended_form_2_Conditional_27_ng_template_2_Template, 6, 1, "ng-template", 28);
1071
+ function AIAgentFormComponentExtended_form_3_Conditional_27_Template(rf, ctx) { if (rf & 1) {
1072
+ i0.ɵɵelementStart(0, "kendo-panelbar-item", 27);
1073
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_1_Template, 2, 1, "ng-template", 28)(2, AIAgentFormComponentExtended_form_3_Conditional_27_ng_template_2_Template, 6, 1, "ng-template", 29);
1074
1074
  i0.ɵɵelementEnd();
1075
1075
  } if (rf & 2) {
1076
1076
  i0.ɵɵproperty("expanded", false);
1077
1077
  } }
1078
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_1_Template(rf, ctx) { if (rf & 1) {
1079
- i0.ɵɵelement(0, "i", 134);
1078
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_1_Template(rf, ctx) { if (rf & 1) {
1079
+ i0.ɵɵelement(0, "i", 135);
1080
1080
  i0.ɵɵtext(1);
1081
1081
  } if (rf & 2) {
1082
1082
  const ctx_r1 = i0.ɵɵnextContext(3);
1083
1083
  i0.ɵɵadvance();
1084
1084
  i0.ɵɵtextInterpolate1(" Notes", ctx_r1.noteCount > 0 ? " (" + ctx_r1.noteCount + ")" : "", " ");
1085
1085
  } }
1086
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
1086
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
1087
1087
  const _r33 = i0.ɵɵgetCurrentView();
1088
- i0.ɵɵelementStart(0, "button", 88);
1089
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.addNote()); });
1090
- i0.ɵɵelement(1, "i", 89);
1088
+ i0.ɵɵelementStart(0, "button", 89);
1089
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r33); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.addNote()); });
1090
+ i0.ɵɵelement(1, "i", 90);
1091
1091
  i0.ɵɵtext(2, " Add Note ");
1092
1092
  i0.ɵɵelementEnd();
1093
1093
  } }
1094
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_6_Conditional_6_Template(rf, ctx) { if (rf & 1) {
1094
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_6_Conditional_6_Template(rf, ctx) { if (rf & 1) {
1095
1095
  const _r34 = i0.ɵɵgetCurrentView();
1096
- i0.ɵɵelementStart(0, "button", 91);
1097
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_6_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addNote()); });
1098
- i0.ɵɵelement(1, "i", 89);
1096
+ i0.ɵɵelementStart(0, "button", 92);
1097
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_6_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addNote()); });
1098
+ i0.ɵɵelement(1, "i", 90);
1099
1099
  i0.ɵɵtext(2, " Create First Note ");
1100
1100
  i0.ɵɵelementEnd();
1101
1101
  } }
1102
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
1103
- i0.ɵɵelementStart(0, "div", 40);
1104
- i0.ɵɵelement(1, "i", 134);
1102
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
1103
+ i0.ɵɵelementStart(0, "div", 41);
1104
+ i0.ɵɵelement(1, "i", 135);
1105
1105
  i0.ɵɵelementStart(2, "h4");
1106
1106
  i0.ɵɵtext(3, "No Notes");
1107
1107
  i0.ɵɵelementEnd();
1108
1108
  i0.ɵɵelementStart(4, "p");
1109
1109
  i0.ɵɵtext(5, "Add notes to document important information, observations, or instructions for this agent.");
1110
1110
  i0.ɵɵelementEnd();
1111
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_6_Conditional_6_Template, 3, 0, "button", 90);
1111
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_6_Conditional_6_Template, 3, 0, "button", 91);
1112
1112
  i0.ɵɵelementEnd();
1113
1113
  } if (rf & 2) {
1114
1114
  const ctx_r1 = i0.ɵɵnextContext(4);
1115
1115
  i0.ɵɵadvance(6);
1116
1116
  i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanCreateNotes ? 6 : -1);
1117
1117
  } }
1118
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
1119
- i0.ɵɵelementStart(0, "div", 97);
1118
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
1119
+ i0.ɵɵelementStart(0, "div", 98);
1120
1120
  i0.ɵɵtext(1);
1121
1121
  i0.ɵɵelementEnd();
1122
1122
  } if (rf & 2) {
@@ -1124,9 +1124,9 @@ function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Condit
1124
1124
  i0.ɵɵadvance();
1125
1125
  i0.ɵɵtextInterpolate2("", note_r36.Note.substring(0, 100), "", note_r36.Note.length > 100 ? "..." : "", "");
1126
1126
  } }
1127
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
1128
- i0.ɵɵelementStart(0, "span", 99);
1129
- i0.ɵɵelement(1, "i", 133);
1127
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
1128
+ i0.ɵɵelementStart(0, "span", 100);
1129
+ i0.ɵɵelement(1, "i", 134);
1130
1130
  i0.ɵɵtext(2);
1131
1131
  i0.ɵɵpipe(3, "date");
1132
1132
  i0.ɵɵelementEnd();
@@ -1135,22 +1135,22 @@ function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Condit
1135
1135
  i0.ɵɵadvance(2);
1136
1136
  i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(3, 1, note_r36.__mj_CreatedAt, "short"), " ");
1137
1137
  } }
1138
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
1138
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
1139
1139
  const _r35 = i0.ɵɵgetCurrentView();
1140
- i0.ɵɵelementStart(0, "div", 136);
1141
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_For_2_Template_div_click_0_listener() { const note_r36 = i0.ɵɵrestoreView(_r35).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Notes", note_r36.ID)); });
1142
- i0.ɵɵelementStart(1, "div", 94);
1143
- i0.ɵɵelement(2, "i", 134);
1140
+ i0.ɵɵelementStart(0, "div", 137);
1141
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_For_2_Template_div_click_0_listener() { const note_r36 = i0.ɵɵrestoreView(_r35).$implicit; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Notes", note_r36.ID)); });
1142
+ i0.ɵɵelementStart(1, "div", 95);
1143
+ i0.ɵɵelement(2, "i", 135);
1144
1144
  i0.ɵɵelementEnd();
1145
- i0.ɵɵelementStart(3, "div", 95)(4, "div", 96);
1145
+ i0.ɵɵelementStart(3, "div", 96)(4, "div", 97);
1146
1146
  i0.ɵɵtext(5);
1147
1147
  i0.ɵɵelementEnd();
1148
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_6_Template, 2, 2, "div", 97);
1149
- i0.ɵɵelementStart(7, "div", 98);
1150
- i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_8_Template, 4, 4, "span", 99);
1148
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_6_Template, 2, 2, "div", 98);
1149
+ i0.ɵɵelementStart(7, "div", 99);
1150
+ i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_For_2_Conditional_8_Template, 4, 4, "span", 100);
1151
1151
  i0.ɵɵelementEnd()();
1152
- i0.ɵɵelementStart(9, "div", 102);
1153
- i0.ɵɵelement(10, "i", 104);
1152
+ i0.ɵɵelementStart(9, "div", 103);
1153
+ i0.ɵɵelement(10, "i", 105);
1154
1154
  i0.ɵɵelementEnd()();
1155
1155
  } if (rf & 2) {
1156
1156
  const note_r36 = ctx.$implicit;
@@ -1161,10 +1161,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Condit
1161
1161
  i0.ɵɵadvance(2);
1162
1162
  i0.ɵɵconditional(note_r36.__mj_CreatedAt ? 8 : -1);
1163
1163
  } }
1164
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
1164
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
1165
1165
  const _r37 = i0.ɵɵgetCurrentView();
1166
- i0.ɵɵelementStart(0, "div", 81);
1167
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r37); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Notes", "")); });
1166
+ i0.ɵɵelementStart(0, "div", 82);
1167
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r37); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.navigateToEntity("AI Agent Notes", "")); });
1168
1168
  i0.ɵɵelementStart(1, "span");
1169
1169
  i0.ɵɵtext(2);
1170
1170
  i0.ɵɵelementEnd()();
@@ -1173,10 +1173,10 @@ function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Condit
1173
1173
  i0.ɵɵadvance(2);
1174
1174
  i0.ɵɵtextInterpolate1("View all ", ctx_r1.noteCount, " notes...");
1175
1175
  } }
1176
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
1177
- i0.ɵɵelementStart(0, "div", 87);
1178
- i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_For_2_Template, 11, 3, "div", 135, _forTrack0);
1179
- i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_Conditional_3_Template, 3, 1, "div", 43);
1176
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
1177
+ i0.ɵɵelementStart(0, "div", 88);
1178
+ i0.ɵɵrepeaterCreate(1, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_For_2_Template, 11, 3, "div", 136, _forTrack0);
1179
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_Conditional_3_Template, 3, 1, "div", 44);
1180
1180
  i0.ɵɵelementEnd();
1181
1181
  } if (rf & 2) {
1182
1182
  const ctx_r1 = i0.ɵɵnextContext(4);
@@ -1185,14 +1185,14 @@ function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Condit
1185
1185
  i0.ɵɵadvance(2);
1186
1186
  i0.ɵɵconditional(ctx_r1.noteCount > ctx_r1.agentNotes.length ? 3 : -1);
1187
1187
  } }
1188
- function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Template(rf, ctx) { if (rf & 1) {
1189
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 107);
1188
+ function AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Template(rf, ctx) { if (rf & 1) {
1189
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 108);
1190
1190
  i0.ɵɵtext(3, " Manage notes, documentation, and annotations for this agent. ");
1191
1191
  i0.ɵɵelementEnd();
1192
- i0.ɵɵelementStart(4, "div", 85);
1193
- i0.ɵɵtemplate(5, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_5_Template, 3, 0, "button", 86);
1192
+ i0.ɵɵelementStart(4, "div", 86);
1193
+ i0.ɵɵtemplate(5, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_5_Template, 3, 0, "button", 87);
1194
1194
  i0.ɵɵelementEnd()();
1195
- i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_6_Template, 7, 1, "div", 40)(7, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Conditional_7_Template, 4, 1, "div", 87);
1195
+ i0.ɵɵtemplate(6, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_6_Template, 7, 1, "div", 41)(7, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Conditional_7_Template, 4, 1, "div", 88);
1196
1196
  i0.ɵɵelementEnd();
1197
1197
  } if (rf & 2) {
1198
1198
  const ctx_r1 = i0.ɵɵnextContext(3);
@@ -1201,36 +1201,36 @@ function AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Templa
1201
1201
  i0.ɵɵadvance();
1202
1202
  i0.ɵɵconditional(ctx_r1.noteCount === 0 ? 6 : 7);
1203
1203
  } }
1204
- function AIAgentFormComponentExtended_form_2_Conditional_28_Template(rf, ctx) { if (rf & 1) {
1205
- i0.ɵɵelementStart(0, "kendo-panelbar-item", 26);
1206
- i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_1_Template, 2, 1, "ng-template", 27)(2, AIAgentFormComponentExtended_form_2_Conditional_28_ng_template_2_Template, 8, 2, "ng-template", 28);
1204
+ function AIAgentFormComponentExtended_form_3_Conditional_28_Template(rf, ctx) { if (rf & 1) {
1205
+ i0.ɵɵelementStart(0, "kendo-panelbar-item", 27);
1206
+ i0.ɵɵtemplate(1, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_1_Template, 2, 1, "ng-template", 28)(2, AIAgentFormComponentExtended_form_3_Conditional_28_ng_template_2_Template, 8, 2, "ng-template", 29);
1207
1207
  i0.ɵɵelementEnd();
1208
1208
  } if (rf & 2) {
1209
1209
  i0.ɵɵproperty("expanded", false);
1210
1210
  } }
1211
- function AIAgentFormComponentExtended_form_2_ng_template_30_Template(rf, ctx) { if (rf & 1) {
1212
- i0.ɵɵelement(0, "i", 137);
1211
+ function AIAgentFormComponentExtended_form_3_ng_template_30_Template(rf, ctx) { if (rf & 1) {
1212
+ i0.ɵɵelement(0, "i", 138);
1213
1213
  i0.ɵɵtext(1, " Payload Management ");
1214
1214
  } }
1215
- function AIAgentFormComponentExtended_form_2_ng_template_31_Template(rf, ctx) { if (rf & 1) {
1215
+ function AIAgentFormComponentExtended_form_3_ng_template_31_Template(rf, ctx) { if (rf & 1) {
1216
1216
  const _r38 = i0.ɵɵgetCurrentView();
1217
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 107);
1217
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 108);
1218
1218
  i0.ɵɵtext(3, " Configure how this agent handles data payloads, path routing, and validation between parent and child agents. ");
1219
1219
  i0.ɵɵelementEnd()();
1220
- i0.ɵɵelementStart(4, "div", 138)(5, "h3", 139);
1221
- i0.ɵɵelement(6, "i", 140);
1220
+ i0.ɵɵelementStart(4, "div", 139)(5, "h3", 140);
1221
+ i0.ɵɵelement(6, "i", 141);
1222
1222
  i0.ɵɵtext(7, " Payload Scope ");
1223
1223
  i0.ɵɵelementEnd();
1224
- i0.ɵɵelementStart(8, "div", 141)(9, "div", 142)(10, "label", 143);
1224
+ i0.ɵɵelementStart(8, "div", 142)(9, "div", 143)(10, "label", 144);
1225
1225
  i0.ɵɵtext(11, "Payload Scope Path");
1226
1226
  i0.ɵɵelementEnd();
1227
- i0.ɵɵelementStart(12, "p", 144);
1227
+ i0.ɵɵelementStart(12, "p", 145);
1228
1228
  i0.ɵɵtext(13, " Specify a path within the parent payload that this sub-agent should operate on. Leave empty to receive the entire payload. ");
1229
1229
  i0.ɵɵelementEnd()();
1230
- i0.ɵɵelementStart(14, "div", 145);
1231
- i0.ɵɵelement(15, "mj-form-field", 146);
1232
- i0.ɵɵelementStart(16, "div", 147);
1233
- i0.ɵɵelement(17, "i", 148);
1230
+ i0.ɵɵelementStart(14, "div", 146);
1231
+ i0.ɵɵelement(15, "mj-form-field", 147);
1232
+ i0.ɵɵelementStart(16, "div", 148);
1233
+ i0.ɵɵelement(17, "i", 149);
1234
1234
  i0.ɵɵelementStart(18, "span");
1235
1235
  i0.ɵɵtext(19, "Example: ");
1236
1236
  i0.ɵɵelementStart(20, "code");
@@ -1240,24 +1240,24 @@ function AIAgentFormComponentExtended_form_2_ng_template_31_Template(rf, ctx) {
1240
1240
  i0.ɵɵelementStart(23, "code");
1241
1241
  i0.ɵɵtext(24, "/analysis/results");
1242
1242
  i0.ɵɵelementEnd()()()()()();
1243
- i0.ɵɵelementStart(25, "div", 138)(26, "h3", 139);
1244
- i0.ɵɵelement(27, "i", 149);
1243
+ i0.ɵɵelementStart(25, "div", 139)(26, "h3", 140);
1244
+ i0.ɵɵelement(27, "i", 150);
1245
1245
  i0.ɵɵtext(28, " Path Configuration ");
1246
1246
  i0.ɵɵelementEnd();
1247
- i0.ɵɵelementStart(29, "div", 150)(30, "div", 151)(31, "div", 152)(32, "div", 153);
1248
- i0.ɵɵelement(33, "i", 154);
1247
+ i0.ɵɵelementStart(29, "div", 151)(30, "div", 152)(31, "div", 153)(32, "div", 154);
1248
+ i0.ɵɵelement(33, "i", 155);
1249
1249
  i0.ɵɵelementEnd();
1250
- i0.ɵɵelementStart(34, "div", 155)(35, "h4");
1250
+ i0.ɵɵelementStart(34, "div", 156)(35, "h4");
1251
1251
  i0.ɵɵtext(36, "Downstream Paths");
1252
1252
  i0.ɵɵelementEnd();
1253
1253
  i0.ɵɵelementStart(37, "p");
1254
1254
  i0.ɵɵtext(38, "JSON array of paths to pass to sub-agents");
1255
1255
  i0.ɵɵelementEnd()()();
1256
- i0.ɵɵelementStart(39, "div", 156)(40, "div", 157)(41, "mj-code-editor", 158);
1257
- i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_2_ng_template_31_Template_mj_code_editor_valueChange_41_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadDownstreamPaths", $event)); });
1256
+ i0.ɵɵelementStart(39, "div", 157)(40, "div", 158)(41, "mj-code-editor", 159);
1257
+ i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_3_ng_template_31_Template_mj_code_editor_valueChange_41_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadDownstreamPaths", $event)); });
1258
1258
  i0.ɵɵelementEnd()();
1259
- i0.ɵɵelementStart(42, "div", 159);
1260
- i0.ɵɵelement(43, "i", 160);
1259
+ i0.ɵɵelementStart(42, "div", 160);
1260
+ i0.ɵɵelement(43, "i", 161);
1261
1261
  i0.ɵɵtext(44, " Use ");
1262
1262
  i0.ɵɵelementStart(45, "code");
1263
1263
  i0.ɵɵtext(46, "[\"*\"]");
@@ -1266,87 +1266,87 @@ function AIAgentFormComponentExtended_form_2_ng_template_31_Template(rf, ctx) {
1266
1266
  i0.ɵɵelementStart(48, "code");
1267
1267
  i0.ɵɵtext(49, "[\"user.id\", \"order.*\"]");
1268
1268
  i0.ɵɵelementEnd()()()();
1269
- i0.ɵɵelementStart(50, "div", 151)(51, "div", 152)(52, "div", 161);
1270
- i0.ɵɵelement(53, "i", 162);
1269
+ i0.ɵɵelementStart(50, "div", 152)(51, "div", 153)(52, "div", 162);
1270
+ i0.ɵɵelement(53, "i", 163);
1271
1271
  i0.ɵɵelementEnd();
1272
- i0.ɵɵelementStart(54, "div", 155)(55, "h4");
1272
+ i0.ɵɵelementStart(54, "div", 156)(55, "h4");
1273
1273
  i0.ɵɵtext(56, "Upstream Paths");
1274
1274
  i0.ɵɵelementEnd();
1275
1275
  i0.ɵɵelementStart(57, "p");
1276
1276
  i0.ɵɵtext(58, "JSON array of paths sub-agents can write back");
1277
1277
  i0.ɵɵelementEnd()()();
1278
- i0.ɵɵelementStart(59, "div", 156)(60, "div", 157)(61, "mj-code-editor", 158);
1279
- i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_2_ng_template_31_Template_mj_code_editor_valueChange_61_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadUpstreamPaths", $event)); });
1278
+ i0.ɵɵelementStart(59, "div", 157)(60, "div", 158)(61, "mj-code-editor", 159);
1279
+ i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_3_ng_template_31_Template_mj_code_editor_valueChange_61_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadUpstreamPaths", $event)); });
1280
1280
  i0.ɵɵelementEnd()();
1281
- i0.ɵɵelementStart(62, "div", 159);
1282
- i0.ɵɵelement(63, "i", 160);
1281
+ i0.ɵɵelementStart(62, "div", 160);
1282
+ i0.ɵɵelement(63, "i", 161);
1283
1283
  i0.ɵɵtext(64, " Use ");
1284
1284
  i0.ɵɵelementStart(65, "code");
1285
1285
  i0.ɵɵtext(66, "[\"*\"]");
1286
1286
  i0.ɵɵelementEnd();
1287
1287
  i0.ɵɵtext(67, " to allow all writes or limit to specific paths ");
1288
1288
  i0.ɵɵelementEnd()()();
1289
- i0.ɵɵelementStart(68, "div", 151)(69, "div", 152)(70, "div", 163);
1290
- i0.ɵɵelement(71, "i", 164);
1289
+ i0.ɵɵelementStart(68, "div", 152)(69, "div", 153)(70, "div", 164);
1290
+ i0.ɵɵelement(71, "i", 165);
1291
1291
  i0.ɵɵelementEnd();
1292
- i0.ɵɵelementStart(72, "div", 155)(73, "h4");
1292
+ i0.ɵɵelementStart(72, "div", 156)(73, "h4");
1293
1293
  i0.ɵɵtext(74, "Self Read Paths");
1294
1294
  i0.ɵɵelementEnd();
1295
1295
  i0.ɵɵelementStart(75, "p");
1296
1296
  i0.ɵɵtext(76, "JSON array of paths this agent can read");
1297
1297
  i0.ɵɵelementEnd()()();
1298
- i0.ɵɵelementStart(77, "div", 156)(78, "div", 157)(79, "mj-code-editor", 158);
1299
- i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_2_ng_template_31_Template_mj_code_editor_valueChange_79_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadSelfReadPaths", $event)); });
1298
+ i0.ɵɵelementStart(77, "div", 157)(78, "div", 158)(79, "mj-code-editor", 159);
1299
+ i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_3_ng_template_31_Template_mj_code_editor_valueChange_79_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadSelfReadPaths", $event)); });
1300
1300
  i0.ɵɵelementEnd()();
1301
- i0.ɵɵelementStart(80, "div", 159);
1302
- i0.ɵɵelement(81, "i", 160);
1301
+ i0.ɵɵelementStart(80, "div", 160);
1302
+ i0.ɵɵelement(81, "i", 161);
1303
1303
  i0.ɵɵtext(82, " Paths this agent's prompts can read from the payload ");
1304
1304
  i0.ɵɵelementEnd()()();
1305
- i0.ɵɵelementStart(83, "div", 151)(84, "div", 152)(85, "div", 165);
1306
- i0.ɵɵelement(86, "i", 166);
1305
+ i0.ɵɵelementStart(83, "div", 152)(84, "div", 153)(85, "div", 166);
1306
+ i0.ɵɵelement(86, "i", 167);
1307
1307
  i0.ɵɵelementEnd();
1308
- i0.ɵɵelementStart(87, "div", 155)(88, "h4");
1308
+ i0.ɵɵelementStart(87, "div", 156)(88, "h4");
1309
1309
  i0.ɵɵtext(89, "Self Write Paths");
1310
1310
  i0.ɵɵelementEnd();
1311
1311
  i0.ɵɵelementStart(90, "p");
1312
1312
  i0.ɵɵtext(91, "JSON array of paths this agent can write to");
1313
1313
  i0.ɵɵelementEnd()()();
1314
- i0.ɵɵelementStart(92, "div", 156)(93, "div", 157)(94, "mj-code-editor", 158);
1315
- i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_2_ng_template_31_Template_mj_code_editor_valueChange_94_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadSelfWritePaths", $event)); });
1314
+ i0.ɵɵelementStart(92, "div", 157)(93, "div", 158)(94, "mj-code-editor", 159);
1315
+ i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_3_ng_template_31_Template_mj_code_editor_valueChange_94_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("PayloadSelfWritePaths", $event)); });
1316
1316
  i0.ɵɵelementEnd()();
1317
- i0.ɵɵelementStart(95, "div", 159);
1318
- i0.ɵɵelement(96, "i", 160);
1317
+ i0.ɵɵelementStart(95, "div", 160);
1318
+ i0.ɵɵelement(96, "i", 161);
1319
1319
  i0.ɵɵtext(97, " Paths this agent's prompts can write back to the payload ");
1320
1320
  i0.ɵɵelementEnd()()()()();
1321
- i0.ɵɵelementStart(98, "div", 138)(99, "h3", 139);
1322
- i0.ɵɵelement(100, "i", 167);
1321
+ i0.ɵɵelementStart(98, "div", 139)(99, "h3", 140);
1322
+ i0.ɵɵelement(100, "i", 168);
1323
1323
  i0.ɵɵtext(101, " Final Payload Validation ");
1324
1324
  i0.ɵɵelementEnd();
1325
- i0.ɵɵelementStart(102, "div", 168)(103, "div", 169)(104, "div", 170)(105, "label", 171);
1325
+ i0.ɵɵelementStart(102, "div", 169)(103, "div", 170)(104, "div", 171)(105, "label", 172);
1326
1326
  i0.ɵɵtext(106, "Validation Mode");
1327
1327
  i0.ɵɵelementEnd();
1328
- i0.ɵɵelementStart(107, "p", 172);
1328
+ i0.ɵɵelementStart(107, "p", 173);
1329
1329
  i0.ɵɵtext(108, "How to handle validation failures");
1330
1330
  i0.ɵɵelementEnd();
1331
- i0.ɵɵelement(109, "mj-form-field", 173);
1331
+ i0.ɵɵelement(109, "mj-form-field", 174);
1332
1332
  i0.ɵɵelementEnd();
1333
- i0.ɵɵelementStart(110, "div", 170)(111, "label", 171);
1333
+ i0.ɵɵelementStart(110, "div", 171)(111, "label", 172);
1334
1334
  i0.ɵɵtext(112, "Max Retries");
1335
1335
  i0.ɵɵelementEnd();
1336
- i0.ɵɵelementStart(113, "p", 172);
1336
+ i0.ɵɵelementStart(113, "p", 173);
1337
1337
  i0.ɵɵtext(114, "Maximum validation retry attempts");
1338
1338
  i0.ɵɵelementEnd();
1339
- i0.ɵɵelement(115, "mj-form-field", 174);
1339
+ i0.ɵɵelement(115, "mj-form-field", 175);
1340
1340
  i0.ɵɵelementEnd()();
1341
- i0.ɵɵelementStart(116, "div", 175)(117, "label", 176);
1342
- i0.ɵɵelement(118, "i", 177);
1341
+ i0.ɵɵelementStart(116, "div", 176)(117, "label", 177);
1342
+ i0.ɵɵelement(118, "i", 178);
1343
1343
  i0.ɵɵtext(119, " Validation Schema ");
1344
1344
  i0.ɵɵelementEnd();
1345
- i0.ɵɵelementStart(120, "p", 178);
1345
+ i0.ɵɵelementStart(120, "p", 179);
1346
1346
  i0.ɵɵtext(121, " JSON schema or validation rules for the final payload structure ");
1347
1347
  i0.ɵɵelementEnd();
1348
- i0.ɵɵelementStart(122, "div", 179)(123, "mj-code-editor", 180);
1349
- i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_2_ng_template_31_Template_mj_code_editor_valueChange_123_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("FinalPayloadValidation", $event)); });
1348
+ i0.ɵɵelementStart(122, "div", 180)(123, "mj-code-editor", 181);
1349
+ i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_3_ng_template_31_Template_mj_code_editor_valueChange_123_listener($event) { i0.ɵɵrestoreView(_r38); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.updatePayloadField("FinalPayloadValidation", $event)); });
1350
1350
  i0.ɵɵelementEnd()()()()()();
1351
1351
  } if (rf & 2) {
1352
1352
  const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1367,16 +1367,16 @@ function AIAgentFormComponentExtended_form_2_ng_template_31_Template(rf, ctx) {
1367
1367
  i0.ɵɵadvance(8);
1368
1368
  i0.ɵɵproperty("value", ctx_r1.record.FinalPayloadValidation || "{}")("readonly", !ctx_r1.EditMode)("lineWrapping", true);
1369
1369
  } }
1370
- function AIAgentFormComponentExtended_form_2_ng_template_33_Template(rf, ctx) { if (rf & 1) {
1371
- i0.ɵɵelement(0, "i", 181);
1370
+ function AIAgentFormComponentExtended_form_3_ng_template_33_Template(rf, ctx) { if (rf & 1) {
1371
+ i0.ɵɵelement(0, "i", 182);
1372
1372
  i0.ɵɵtext(1, " Execution Guardrails ");
1373
1373
  } }
1374
- function AIAgentFormComponentExtended_form_2_ng_template_34_Template(rf, ctx) { if (rf & 1) {
1375
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 107);
1374
+ function AIAgentFormComponentExtended_form_3_ng_template_34_Template(rf, ctx) { if (rf & 1) {
1375
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 108);
1376
1376
  i0.ɵɵtext(3, " Set limits to prevent runaway agent executions and control resource usage. ");
1377
1377
  i0.ɵɵelementEnd()();
1378
- i0.ɵɵelementStart(4, "div", 182);
1379
- i0.ɵɵelement(5, "mj-form-field", 183)(6, "mj-form-field", 184)(7, "mj-form-field", 185)(8, "mj-form-field", 186);
1378
+ i0.ɵɵelementStart(4, "div", 183);
1379
+ i0.ɵɵelement(5, "mj-form-field", 184)(6, "mj-form-field", 185)(7, "mj-form-field", 186)(8, "mj-form-field", 187);
1380
1380
  i0.ɵɵelementEnd()();
1381
1381
  } if (rf & 2) {
1382
1382
  const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1389,22 +1389,22 @@ function AIAgentFormComponentExtended_form_2_ng_template_34_Template(rf, ctx) {
1389
1389
  i0.ɵɵadvance();
1390
1390
  i0.ɵɵproperty("EditMode", ctx_r1.EditMode)("record", ctx_r1.record);
1391
1391
  } }
1392
- function AIAgentFormComponentExtended_form_2_ng_template_36_Template(rf, ctx) { if (rf & 1) {
1393
- i0.ɵɵelement(0, "i", 187);
1392
+ function AIAgentFormComponentExtended_form_3_ng_template_36_Template(rf, ctx) { if (rf & 1) {
1393
+ i0.ɵɵelement(0, "i", 188);
1394
1394
  i0.ɵɵtext(1, " Configuration ");
1395
1395
  } }
1396
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_19_Template(rf, ctx) { if (rf & 1) {
1396
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_19_Template(rf, ctx) { if (rf & 1) {
1397
1397
  const _r40 = i0.ɵɵgetCurrentView();
1398
- i0.ɵɵelementStart(0, "kendo-dropdownlist", 220);
1399
- i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_19_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r40); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Status, $event) || (ctx_r1.record.Status = $event); return i0.ɵɵresetView($event); });
1398
+ i0.ɵɵelementStart(0, "kendo-dropdownlist", 221);
1399
+ i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_19_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r40); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Status, $event) || (ctx_r1.record.Status = $event); return i0.ɵɵresetView($event); });
1400
1400
  i0.ɵɵelementEnd();
1401
1401
  } if (rf & 2) {
1402
1402
  const ctx_r1 = i0.ɵɵnextContext(3);
1403
1403
  i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.Status);
1404
1404
  i0.ɵɵproperty("data", ctx_r1.statusOptions)("valuePrimitive", true);
1405
1405
  } }
1406
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_20_Template(rf, ctx) { if (rf & 1) {
1407
- i0.ɵɵelementStart(0, "span", 199);
1406
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_20_Template(rf, ctx) { if (rf & 1) {
1407
+ i0.ɵɵelementStart(0, "span", 200);
1408
1408
  i0.ɵɵtext(1);
1409
1409
  i0.ɵɵelementEnd();
1410
1410
  } if (rf & 2) {
@@ -1412,18 +1412,18 @@ function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_20_Templ
1412
1412
  i0.ɵɵadvance();
1413
1413
  i0.ɵɵtextInterpolate(ctx_r1.record.Status || "Not Set");
1414
1414
  } }
1415
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_31_Template(rf, ctx) { if (rf & 1) {
1415
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_31_Template(rf, ctx) { if (rf & 1) {
1416
1416
  const _r41 = i0.ɵɵgetCurrentView();
1417
- i0.ɵɵelementStart(0, "kendo-dropdownlist", 221);
1418
- i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_31_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r41); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.TypeID, $event) || (ctx_r1.record.TypeID = $event); return i0.ɵɵresetView($event); });
1417
+ i0.ɵɵelementStart(0, "kendo-dropdownlist", 222);
1418
+ i0.ɵɵtwoWayListener("ngModelChange", function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_31_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r41); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.TypeID, $event) || (ctx_r1.record.TypeID = $event); return i0.ɵɵresetView($event); });
1419
1419
  i0.ɵɵelementEnd();
1420
1420
  } if (rf & 2) {
1421
1421
  const ctx_r1 = i0.ɵɵnextContext(3);
1422
1422
  i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.TypeID);
1423
1423
  i0.ɵɵproperty("data", ctx_r1.agentTypes)("valuePrimitive", true);
1424
1424
  } }
1425
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_32_Template(rf, ctx) { if (rf & 1) {
1426
- i0.ɵɵelementStart(0, "span", 199);
1425
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_32_Template(rf, ctx) { if (rf & 1) {
1426
+ i0.ɵɵelementStart(0, "span", 200);
1427
1427
  i0.ɵɵtext(1);
1428
1428
  i0.ɵɵelementEnd();
1429
1429
  } if (rf & 2) {
@@ -1431,8 +1431,8 @@ function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_32_Templ
1431
1431
  i0.ɵɵadvance();
1432
1432
  i0.ɵɵtextInterpolate(ctx_r1.record.Type || "Not Set");
1433
1433
  } }
1434
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Conditional_2_Template(rf, ctx) { if (rf & 1) {
1435
- i0.ɵɵelementStart(0, "span", 228);
1434
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Conditional_2_Template(rf, ctx) { if (rf & 1) {
1435
+ i0.ɵɵelementStart(0, "span", 229);
1436
1436
  i0.ɵɵtext(1);
1437
1437
  i0.ɵɵelementEnd();
1438
1438
  } if (rf & 2) {
@@ -1440,29 +1440,29 @@ function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Cond
1440
1440
  i0.ɵɵadvance();
1441
1441
  i0.ɵɵtextInterpolate(ctx_r1.selectedContextCompressionPrompt.Name);
1442
1442
  } }
1443
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Conditional_3_Template(rf, ctx) { if (rf & 1) {
1444
- i0.ɵɵelementStart(0, "span", 229);
1443
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Conditional_3_Template(rf, ctx) { if (rf & 1) {
1444
+ i0.ɵɵelementStart(0, "span", 230);
1445
1445
  i0.ɵɵtext(1, "No prompt selected");
1446
1446
  i0.ɵɵelementEnd();
1447
1447
  } }
1448
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Conditional_8_Template(rf, ctx) { if (rf & 1) {
1448
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Conditional_8_Template(rf, ctx) { if (rf & 1) {
1449
1449
  const _r43 = i0.ɵɵgetCurrentView();
1450
- i0.ɵɵelementStart(0, "button", 234);
1451
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Conditional_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r43); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.clearContextCompressionPrompt()); });
1452
- i0.ɵɵelement(1, "i", 235);
1450
+ i0.ɵɵelementStart(0, "button", 235);
1451
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Conditional_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r43); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.clearContextCompressionPrompt()); });
1452
+ i0.ɵɵelement(1, "i", 236);
1453
1453
  i0.ɵɵelementEnd();
1454
1454
  } }
1455
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Template(rf, ctx) { if (rf & 1) {
1455
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Template(rf, ctx) { if (rf & 1) {
1456
1456
  const _r42 = i0.ɵɵgetCurrentView();
1457
- i0.ɵɵelementStart(0, "div", 226)(1, "div", 227);
1458
- i0.ɵɵtemplate(2, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Conditional_2_Template, 2, 1, "span", 228)(3, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Conditional_3_Template, 2, 0, "span", 229);
1457
+ i0.ɵɵelementStart(0, "div", 227)(1, "div", 228);
1458
+ i0.ɵɵtemplate(2, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Conditional_2_Template, 2, 1, "span", 229)(3, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Conditional_3_Template, 2, 0, "span", 230);
1459
1459
  i0.ɵɵelementEnd();
1460
- i0.ɵɵelementStart(4, "div", 230)(5, "button", 231);
1461
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r42); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openContextCompressionPromptSelector()); });
1462
- i0.ɵɵelement(6, "i", 232);
1460
+ i0.ɵɵelementStart(4, "div", 231)(5, "button", 232);
1461
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r42); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openContextCompressionPromptSelector()); });
1462
+ i0.ɵɵelement(6, "i", 233);
1463
1463
  i0.ɵɵtext(7);
1464
1464
  i0.ɵɵelementEnd();
1465
- i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Conditional_8_Template, 2, 0, "button", 233);
1465
+ i0.ɵɵtemplate(8, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Conditional_8_Template, 2, 0, "button", 234);
1466
1466
  i0.ɵɵelementEnd()();
1467
1467
  } if (rf & 2) {
1468
1468
  const ctx_r1 = i0.ɵɵnextContext(4);
@@ -1473,8 +1473,8 @@ function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Cond
1473
1473
  i0.ɵɵadvance();
1474
1474
  i0.ɵɵconditional(ctx_r1.selectedContextCompressionPrompt ? 8 : -1);
1475
1475
  } }
1476
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_33_Template(rf, ctx) { if (rf & 1) {
1477
- i0.ɵɵelementStart(0, "span", 199);
1476
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_33_Template(rf, ctx) { if (rf & 1) {
1477
+ i0.ɵɵelementStart(0, "span", 200);
1478
1478
  i0.ɵɵtext(1);
1479
1479
  i0.ɵɵelementEnd();
1480
1480
  } if (rf & 2) {
@@ -1482,42 +1482,42 @@ function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Cond
1482
1482
  i0.ɵɵadvance();
1483
1483
  i0.ɵɵtextInterpolate((ctx_r1.selectedContextCompressionPrompt == null ? null : ctx_r1.selectedContextCompressionPrompt.Name) || ctx_r1.record.ContextCompressionPrompt || "Not Set");
1484
1484
  } }
1485
- function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Template(rf, ctx) { if (rf & 1) {
1486
- i0.ɵɵelementStart(0, "div", 192)(1, "div", 193)(2, "div", 194);
1487
- i0.ɵɵelement(3, "i", 222);
1485
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Template(rf, ctx) { if (rf & 1) {
1486
+ i0.ɵɵelementStart(0, "div", 193)(1, "div", 194)(2, "div", 195);
1487
+ i0.ɵɵelement(3, "i", 223);
1488
1488
  i0.ɵɵelementEnd();
1489
- i0.ɵɵelementStart(4, "div", 196)(5, "h4");
1489
+ i0.ɵɵelementStart(4, "div", 197)(5, "h4");
1490
1490
  i0.ɵɵtext(6, "Message Threshold");
1491
1491
  i0.ɵɵelementEnd();
1492
1492
  i0.ɵɵelementStart(7, "p");
1493
1493
  i0.ɵɵtext(8, "Messages before compression triggers");
1494
1494
  i0.ɵɵelementEnd()()();
1495
- i0.ɵɵelementStart(9, "div", 197);
1496
- i0.ɵɵelement(10, "mj-form-field", 223);
1495
+ i0.ɵɵelementStart(9, "div", 198);
1496
+ i0.ɵɵelement(10, "mj-form-field", 224);
1497
1497
  i0.ɵɵelementEnd()();
1498
- i0.ɵɵelementStart(11, "div", 192)(12, "div", 193)(13, "div", 194);
1499
- i0.ɵɵelement(14, "i", 224);
1498
+ i0.ɵɵelementStart(11, "div", 193)(12, "div", 194)(13, "div", 195);
1499
+ i0.ɵɵelement(14, "i", 225);
1500
1500
  i0.ɵɵelementEnd();
1501
- i0.ɵɵelementStart(15, "div", 196)(16, "h4");
1501
+ i0.ɵɵelementStart(15, "div", 197)(16, "h4");
1502
1502
  i0.ɵɵtext(17, "Messages to Keep");
1503
1503
  i0.ɵɵelementEnd();
1504
1504
  i0.ɵɵelementStart(18, "p");
1505
1505
  i0.ɵɵtext(19, "Recent messages to retain uncompressed");
1506
1506
  i0.ɵɵelementEnd()()();
1507
- i0.ɵɵelementStart(20, "div", 197);
1508
- i0.ɵɵelement(21, "mj-form-field", 225);
1507
+ i0.ɵɵelementStart(20, "div", 198);
1508
+ i0.ɵɵelement(21, "mj-form-field", 226);
1509
1509
  i0.ɵɵelementEnd()();
1510
- i0.ɵɵelementStart(22, "div", 192)(23, "div", 193)(24, "div", 194);
1511
- i0.ɵɵelement(25, "i", 127);
1510
+ i0.ɵɵelementStart(22, "div", 193)(23, "div", 194)(24, "div", 195);
1511
+ i0.ɵɵelement(25, "i", 128);
1512
1512
  i0.ɵɵelementEnd();
1513
- i0.ɵɵelementStart(26, "div", 196)(27, "h4");
1513
+ i0.ɵɵelementStart(26, "div", 197)(27, "h4");
1514
1514
  i0.ɵɵtext(28, "Compression Prompt");
1515
1515
  i0.ɵɵelementEnd();
1516
1516
  i0.ɵɵelementStart(29, "p");
1517
1517
  i0.ɵɵtext(30, "Prompt used for summarization");
1518
1518
  i0.ɵɵelementEnd()()();
1519
- i0.ɵɵelementStart(31, "div", 197);
1520
- i0.ɵɵtemplate(32, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_32_Template, 9, 3, "div", 226)(33, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Conditional_33_Template, 2, 1, "span", 199);
1519
+ i0.ɵɵelementStart(31, "div", 198);
1520
+ i0.ɵɵtemplate(32, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_32_Template, 9, 3, "div", 227)(33, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Conditional_33_Template, 2, 1, "span", 200);
1521
1521
  i0.ɵɵelementEnd()();
1522
1522
  } if (rf & 2) {
1523
1523
  const ctx_r1 = i0.ɵɵnextContext(3);
@@ -1528,171 +1528,171 @@ function AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Temp
1528
1528
  i0.ɵɵadvance(11);
1529
1529
  i0.ɵɵconditional(ctx_r1.EditMode ? 32 : 33);
1530
1530
  } }
1531
- function AIAgentFormComponentExtended_form_2_ng_template_37_Template(rf, ctx) { if (rf & 1) {
1531
+ function AIAgentFormComponentExtended_form_3_ng_template_37_Template(rf, ctx) { if (rf & 1) {
1532
1532
  const _r39 = i0.ɵɵgetCurrentView();
1533
- i0.ɵɵelementStart(0, "div", 83)(1, "div", 84)(2, "div", 107);
1533
+ i0.ɵɵelementStart(0, "div", 84)(1, "div", 85)(2, "div", 108);
1534
1534
  i0.ɵɵtext(3, " Configure agent behavior, execution settings, and advanced features. ");
1535
1535
  i0.ɵɵelementEnd()();
1536
- i0.ɵɵelementStart(4, "div", 188)(5, "h3", 189);
1537
- i0.ɵɵelement(6, "i", 190);
1536
+ i0.ɵɵelementStart(4, "div", 189)(5, "h3", 190);
1537
+ i0.ɵɵelement(6, "i", 191);
1538
1538
  i0.ɵɵtext(7, " Identity & Behavior ");
1539
1539
  i0.ɵɵelementEnd();
1540
- i0.ɵɵelementStart(8, "div", 191)(9, "div", 192)(10, "div", 193)(11, "div", 194);
1541
- i0.ɵɵelement(12, "i", 195);
1540
+ i0.ɵɵelementStart(8, "div", 192)(9, "div", 193)(10, "div", 194)(11, "div", 195);
1541
+ i0.ɵɵelement(12, "i", 196);
1542
1542
  i0.ɵɵelementEnd();
1543
- i0.ɵɵelementStart(13, "div", 196)(14, "h4");
1543
+ i0.ɵɵelementStart(13, "div", 197)(14, "h4");
1544
1544
  i0.ɵɵtext(15, "Agent Status");
1545
1545
  i0.ɵɵelementEnd();
1546
1546
  i0.ɵɵelementStart(16, "p");
1547
1547
  i0.ɵɵtext(17, "Current availability and operational status");
1548
1548
  i0.ɵɵelementEnd()()();
1549
- i0.ɵɵelementStart(18, "div", 197);
1550
- i0.ɵɵtemplate(19, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_19_Template, 1, 3, "kendo-dropdownlist", 198)(20, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_20_Template, 2, 1, "span", 199);
1549
+ i0.ɵɵelementStart(18, "div", 198);
1550
+ i0.ɵɵtemplate(19, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_19_Template, 1, 3, "kendo-dropdownlist", 199)(20, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_20_Template, 2, 1, "span", 200);
1551
1551
  i0.ɵɵelementEnd()();
1552
- i0.ɵɵelementStart(21, "div", 192)(22, "div", 193)(23, "div", 194);
1553
- i0.ɵɵelement(24, "i", 32);
1552
+ i0.ɵɵelementStart(21, "div", 193)(22, "div", 194)(23, "div", 195);
1553
+ i0.ɵɵelement(24, "i", 33);
1554
1554
  i0.ɵɵelementEnd();
1555
- i0.ɵɵelementStart(25, "div", 196)(26, "h4");
1555
+ i0.ɵɵelementStart(25, "div", 197)(26, "h4");
1556
1556
  i0.ɵɵtext(27, "Agent Type");
1557
1557
  i0.ɵɵelementEnd();
1558
1558
  i0.ɵɵelementStart(28, "p");
1559
1559
  i0.ɵɵtext(29, "Category and system-level behavior");
1560
1560
  i0.ɵɵelementEnd()()();
1561
- i0.ɵɵelementStart(30, "div", 197);
1562
- i0.ɵɵtemplate(31, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_31_Template, 1, 3, "kendo-dropdownlist", 200)(32, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_32_Template, 2, 1, "span", 199);
1561
+ i0.ɵɵelementStart(30, "div", 198);
1562
+ i0.ɵɵtemplate(31, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_31_Template, 1, 3, "kendo-dropdownlist", 201)(32, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_32_Template, 2, 1, "span", 200);
1563
1563
  i0.ɵɵelementEnd()();
1564
- i0.ɵɵelementStart(33, "div", 192)(34, "div", 193)(35, "div", 194);
1565
- i0.ɵɵelement(36, "i", 82);
1564
+ i0.ɵɵelementStart(33, "div", 193)(34, "div", 194)(35, "div", 195);
1565
+ i0.ɵɵelement(36, "i", 83);
1566
1566
  i0.ɵɵelementEnd();
1567
- i0.ɵɵelementStart(37, "div", 196)(38, "h4");
1567
+ i0.ɵɵelementStart(37, "div", 197)(38, "h4");
1568
1568
  i0.ɵɵtext(39, "Expose as Action");
1569
1569
  i0.ɵɵelementEnd();
1570
1570
  i0.ɵɵelementStart(40, "p");
1571
1571
  i0.ɵɵtext(41, "Make available as an action for other agents");
1572
1572
  i0.ɵɵelementEnd()()();
1573
- i0.ɵɵelementStart(42, "div", 197);
1574
- i0.ɵɵelement(43, "mj-form-field", 201);
1573
+ i0.ɵɵelementStart(42, "div", 198);
1574
+ i0.ɵɵelement(43, "mj-form-field", 202);
1575
1575
  i0.ɵɵelementEnd()();
1576
- i0.ɵɵelementStart(44, "div", 202)(45, "div", 193)(46, "div", 194);
1577
- i0.ɵɵelement(47, "i", 203);
1576
+ i0.ɵɵelementStart(44, "div", 203)(45, "div", 194)(46, "div", 195);
1577
+ i0.ɵɵelement(47, "i", 204);
1578
1578
  i0.ɵɵelementEnd();
1579
- i0.ɵɵelementStart(48, "div", 196)(49, "h4");
1579
+ i0.ɵɵelementStart(48, "div", 197)(49, "h4");
1580
1580
  i0.ɵɵtext(50, "Description");
1581
1581
  i0.ɵɵelementEnd();
1582
1582
  i0.ɵɵelementStart(51, "p");
1583
1583
  i0.ɵɵtext(52, "Detailed agent description and purpose");
1584
1584
  i0.ɵɵelementEnd()()();
1585
- i0.ɵɵelementStart(53, "div", 197);
1586
- i0.ɵɵelement(54, "mj-form-field", 204);
1585
+ i0.ɵɵelementStart(53, "div", 198);
1586
+ i0.ɵɵelement(54, "mj-form-field", 205);
1587
1587
  i0.ɵɵelementEnd()()()();
1588
- i0.ɵɵelementStart(55, "div", 188)(56, "h3", 189);
1589
- i0.ɵɵelement(57, "i", 34);
1588
+ i0.ɵɵelementStart(55, "div", 189)(56, "h3", 190);
1589
+ i0.ɵɵelement(57, "i", 35);
1590
1590
  i0.ɵɵtext(58, " Execution Settings ");
1591
1591
  i0.ɵɵelementEnd();
1592
- i0.ɵɵelementStart(59, "div", 191)(60, "div", 192)(61, "div", 193)(62, "div", 194);
1593
- i0.ɵɵelement(63, "i", 205);
1592
+ i0.ɵɵelementStart(59, "div", 192)(60, "div", 193)(61, "div", 194)(62, "div", 195);
1593
+ i0.ɵɵelement(63, "i", 206);
1594
1594
  i0.ɵɵelementEnd();
1595
- i0.ɵɵelementStart(64, "div", 196)(65, "h4");
1595
+ i0.ɵɵelementStart(64, "div", 197)(65, "h4");
1596
1596
  i0.ɵɵtext(66, "Execution Mode");
1597
1597
  i0.ɵɵelementEnd();
1598
1598
  i0.ɵɵelementStart(67, "p");
1599
1599
  i0.ɵɵtext(68, "How sub-agents are executed");
1600
1600
  i0.ɵɵelementEnd()()();
1601
- i0.ɵɵelementStart(69, "div", 197);
1602
- i0.ɵɵelement(70, "mj-form-field", 206);
1601
+ i0.ɵɵelementStart(69, "div", 198);
1602
+ i0.ɵɵelement(70, "mj-form-field", 207);
1603
1603
  i0.ɵɵelementEnd()();
1604
- i0.ɵɵelementStart(71, "div", 192)(72, "div", 193)(73, "div", 194);
1605
- i0.ɵɵelement(74, "i", 207);
1604
+ i0.ɵɵelementStart(71, "div", 193)(72, "div", 194)(73, "div", 195);
1605
+ i0.ɵɵelement(74, "i", 208);
1606
1606
  i0.ɵɵelementEnd();
1607
- i0.ɵɵelementStart(75, "div", 196)(76, "h4");
1607
+ i0.ɵɵelementStart(75, "div", 197)(76, "h4");
1608
1608
  i0.ɵɵtext(77, "Execution Order");
1609
1609
  i0.ɵɵelementEnd();
1610
1610
  i0.ɵɵelementStart(78, "p");
1611
1611
  i0.ɵɵtext(79, "Order when run with siblings");
1612
1612
  i0.ɵɵelementEnd()()();
1613
- i0.ɵɵelementStart(80, "div", 197);
1614
- i0.ɵɵelement(81, "mj-form-field", 208);
1613
+ i0.ɵɵelementStart(80, "div", 198);
1614
+ i0.ɵɵelement(81, "mj-form-field", 209);
1615
1615
  i0.ɵɵelementEnd()();
1616
- i0.ɵɵelementStart(82, "div", 192)(83, "div", 193)(84, "div", 194);
1617
- i0.ɵɵelement(85, "i", 209);
1616
+ i0.ɵɵelementStart(82, "div", 193)(83, "div", 194)(84, "div", 195);
1617
+ i0.ɵɵelement(85, "i", 210);
1618
1618
  i0.ɵɵelementEnd();
1619
- i0.ɵɵelementStart(86, "div", 196)(87, "h4");
1619
+ i0.ɵɵelementStart(86, "div", 197)(87, "h4");
1620
1620
  i0.ɵɵtext(88, "Default Effort Level");
1621
1621
  i0.ɵɵelementEnd();
1622
1622
  i0.ɵɵelementStart(89, "p");
1623
1623
  i0.ɵɵtext(90, "Default effort level for all prompts (1-100)");
1624
1624
  i0.ɵɵelementEnd()()();
1625
- i0.ɵɵelementStart(91, "div", 197);
1626
- i0.ɵɵelement(92, "mj-form-field", 210);
1627
- i0.ɵɵelementStart(93, "div", 211);
1628
- i0.ɵɵelement(94, "i", 160);
1625
+ i0.ɵɵelementStart(91, "div", 198);
1626
+ i0.ɵɵelement(92, "mj-form-field", 211);
1627
+ i0.ɵɵelementStart(93, "div", 212);
1628
+ i0.ɵɵelement(94, "i", 161);
1629
1629
  i0.ɵɵtext(95, " Higher values request more thorough reasoning (1=minimal, 100=maximum) ");
1630
1630
  i0.ɵɵelementEnd()()();
1631
- i0.ɵɵelementStart(96, "div", 192)(97, "div", 193)(98, "div", 194);
1632
- i0.ɵɵelement(99, "i", 177);
1631
+ i0.ɵɵelementStart(96, "div", 193)(97, "div", 194)(98, "div", 195);
1632
+ i0.ɵɵelement(99, "i", 178);
1633
1633
  i0.ɵɵelementEnd();
1634
- i0.ɵɵelementStart(100, "div", 196)(101, "h4");
1634
+ i0.ɵɵelementStart(100, "div", 197)(101, "h4");
1635
1635
  i0.ɵɵtext(102, "Driver Class");
1636
1636
  i0.ɵɵelementEnd();
1637
1637
  i0.ɵɵelementStart(103, "p");
1638
1638
  i0.ɵɵtext(104, "Custom implementation class");
1639
1639
  i0.ɵɵelementEnd()()();
1640
- i0.ɵɵelementStart(105, "div", 197);
1641
- i0.ɵɵelement(106, "mj-form-field", 212);
1640
+ i0.ɵɵelementStart(105, "div", 198);
1641
+ i0.ɵɵelement(106, "mj-form-field", 213);
1642
1642
  i0.ɵɵelementEnd()()()();
1643
- i0.ɵɵelementStart(107, "div", 188)(108, "h3", 189);
1644
- i0.ɵɵelement(109, "i", 213);
1643
+ i0.ɵɵelementStart(107, "div", 189)(108, "h3", 190);
1644
+ i0.ɵɵelement(109, "i", 214);
1645
1645
  i0.ɵɵtext(110, " Visual Identity ");
1646
1646
  i0.ɵɵelementEnd();
1647
- i0.ɵɵelementStart(111, "div", 191)(112, "div", 192)(113, "div", 193)(114, "div", 194);
1648
- i0.ɵɵelement(115, "i", 214);
1647
+ i0.ɵɵelementStart(111, "div", 192)(112, "div", 193)(113, "div", 194)(114, "div", 195);
1648
+ i0.ɵɵelement(115, "i", 215);
1649
1649
  i0.ɵɵelementEnd();
1650
- i0.ɵɵelementStart(116, "div", 196)(117, "h4");
1650
+ i0.ɵɵelementStart(116, "div", 197)(117, "h4");
1651
1651
  i0.ɵɵtext(118, "Icon Class");
1652
1652
  i0.ɵɵelementEnd();
1653
1653
  i0.ɵɵelementStart(119, "p");
1654
1654
  i0.ɵɵtext(120, "Font Awesome icon class");
1655
1655
  i0.ɵɵelementEnd()()();
1656
- i0.ɵɵelementStart(121, "div", 197);
1657
- i0.ɵɵelement(122, "mj-form-field", 215);
1658
- i0.ɵɵelementStart(123, "div", 211);
1659
- i0.ɵɵelement(124, "i", 160);
1656
+ i0.ɵɵelementStart(121, "div", 198);
1657
+ i0.ɵɵelement(122, "mj-form-field", 216);
1658
+ i0.ɵɵelementStart(123, "div", 212);
1659
+ i0.ɵɵelement(124, "i", 161);
1660
1660
  i0.ɵɵtext(125, " Example: ");
1661
1661
  i0.ɵɵelementStart(126, "code");
1662
1662
  i0.ɵɵtext(127, "fa-solid fa-robot");
1663
1663
  i0.ɵɵelementEnd()()()();
1664
- i0.ɵɵelementStart(128, "div", 192)(129, "div", 193)(130, "div", 194);
1665
- i0.ɵɵelement(131, "i", 216);
1664
+ i0.ɵɵelementStart(128, "div", 193)(129, "div", 194)(130, "div", 195);
1665
+ i0.ɵɵelement(131, "i", 217);
1666
1666
  i0.ɵɵelementEnd();
1667
- i0.ɵɵelementStart(132, "div", 196)(133, "h4");
1667
+ i0.ɵɵelementStart(132, "div", 197)(133, "h4");
1668
1668
  i0.ɵɵtext(134, "Logo URL");
1669
1669
  i0.ɵɵelementEnd();
1670
1670
  i0.ɵɵelementStart(135, "p");
1671
1671
  i0.ɵɵtext(136, "URL for agent logo image");
1672
1672
  i0.ɵɵelementEnd()()();
1673
- i0.ɵɵelementStart(137, "div", 197);
1674
- i0.ɵɵelement(138, "mj-form-field", 217);
1675
- i0.ɵɵelementStart(139, "div", 211);
1676
- i0.ɵɵelement(140, "i", 160);
1673
+ i0.ɵɵelementStart(137, "div", 198);
1674
+ i0.ɵɵelement(138, "mj-form-field", 218);
1675
+ i0.ɵɵelementStart(139, "div", 212);
1676
+ i0.ɵɵelement(140, "i", 161);
1677
1677
  i0.ɵɵtext(141, " Takes precedence over Icon Class ");
1678
1678
  i0.ɵɵelementEnd()()()()();
1679
- i0.ɵɵelementStart(142, "div", 188)(143, "h3", 189);
1680
- i0.ɵɵelement(144, "i", 218);
1679
+ i0.ɵɵelementStart(142, "div", 189)(143, "h3", 190);
1680
+ i0.ɵɵelement(144, "i", 219);
1681
1681
  i0.ɵɵtext(145, " Context Compression ");
1682
1682
  i0.ɵɵelementEnd();
1683
- i0.ɵɵelementStart(146, "div", 191)(147, "div", 202)(148, "div", 193)(149, "div", 194);
1684
- i0.ɵɵelement(150, "i", 195);
1683
+ i0.ɵɵelementStart(146, "div", 192)(147, "div", 203)(148, "div", 194)(149, "div", 195);
1684
+ i0.ɵɵelement(150, "i", 196);
1685
1685
  i0.ɵɵelementEnd();
1686
- i0.ɵɵelementStart(151, "div", 196)(152, "h4");
1686
+ i0.ɵɵelementStart(151, "div", 197)(152, "h4");
1687
1687
  i0.ɵɵtext(153, "Enable Context Compression");
1688
1688
  i0.ɵɵelementEnd();
1689
1689
  i0.ɵɵelementStart(154, "p");
1690
1690
  i0.ɵɵtext(155, "Automatically compress conversation context when message threshold is reached");
1691
1691
  i0.ɵɵelementEnd()()();
1692
- i0.ɵɵelementStart(156, "div", 197)(157, "mj-form-field", 219);
1693
- i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_2_ng_template_37_Template_mj_form_field_valueChange_157_listener($event) { i0.ɵɵrestoreView(_r39); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onContextCompressionToggle($event)); });
1692
+ i0.ɵɵelementStart(156, "div", 198)(157, "mj-form-field", 220);
1693
+ i0.ɵɵlistener("valueChange", function AIAgentFormComponentExtended_form_3_ng_template_37_Template_mj_form_field_valueChange_157_listener($event) { i0.ɵɵrestoreView(_r39); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onContextCompressionToggle($event)); });
1694
1694
  i0.ɵɵelementEnd()()();
1695
- i0.ɵɵtemplate(158, AIAgentFormComponentExtended_form_2_ng_template_37_Conditional_158_Template, 34, 5);
1695
+ i0.ɵɵtemplate(158, AIAgentFormComponentExtended_form_3_ng_template_37_Conditional_158_Template, 34, 5);
1696
1696
  i0.ɵɵelementEnd()()();
1697
1697
  } if (rf & 2) {
1698
1698
  const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1721,34 +1721,34 @@ function AIAgentFormComponentExtended_form_2_ng_template_37_Template(rf, ctx) {
1721
1721
  i0.ɵɵadvance();
1722
1722
  i0.ɵɵconditional(ctx_r1.record.EnableContextCompression ? 158 : -1);
1723
1723
  } }
1724
- function AIAgentFormComponentExtended_form_2_Template(rf, ctx) { if (rf & 1) {
1724
+ function AIAgentFormComponentExtended_form_3_Template(rf, ctx) { if (rf & 1) {
1725
1725
  const _r1 = i0.ɵɵgetCurrentView();
1726
- i0.ɵɵelementStart(0, "form", 5, 0);
1727
- i0.ɵɵelement(2, "mj-form-toolbar", 6);
1728
- i0.ɵɵelementStart(3, "div", 7)(4, "div", 8)(5, "div", 9)(6, "div", 10);
1729
- i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_2_Conditional_7_Template, 1, 2, "img", 11)(8, AIAgentFormComponentExtended_form_2_Conditional_8_Template, 1, 2, "i", 12);
1730
- i0.ɵɵelementEnd();
1731
- i0.ɵɵelementStart(9, "div", 13);
1732
- i0.ɵɵtemplate(10, AIAgentFormComponentExtended_form_2_Conditional_10_Template, 1, 1, "kendo-textbox", 14)(11, AIAgentFormComponentExtended_form_2_Conditional_11_Template, 2, 1, "h1", 15);
1733
- i0.ɵɵelementStart(12, "div", 16);
1734
- i0.ɵɵtemplate(13, AIAgentFormComponentExtended_form_2_Conditional_13_Template, 3, 3, "span", 17)(14, AIAgentFormComponentExtended_form_2_Conditional_14_Template, 2, 1, "span", 18)(15, AIAgentFormComponentExtended_form_2_Conditional_15_Template, 3, 1, "span", 19);
1726
+ i0.ɵɵelementStart(0, "form", 6, 0);
1727
+ i0.ɵɵelement(2, "mj-form-toolbar", 7);
1728
+ i0.ɵɵelementStart(3, "div", 8)(4, "div", 9)(5, "div", 10)(6, "div", 11);
1729
+ i0.ɵɵtemplate(7, AIAgentFormComponentExtended_form_3_Conditional_7_Template, 1, 2, "img", 12)(8, AIAgentFormComponentExtended_form_3_Conditional_8_Template, 1, 2, "i", 13);
1730
+ i0.ɵɵelementEnd();
1731
+ i0.ɵɵelementStart(9, "div", 14);
1732
+ i0.ɵɵtemplate(10, AIAgentFormComponentExtended_form_3_Conditional_10_Template, 1, 1, "kendo-textbox", 15)(11, AIAgentFormComponentExtended_form_3_Conditional_11_Template, 2, 1, "h1", 16);
1733
+ i0.ɵɵelementStart(12, "div", 17);
1734
+ i0.ɵɵtemplate(13, AIAgentFormComponentExtended_form_3_Conditional_13_Template, 3, 3, "span", 18)(14, AIAgentFormComponentExtended_form_3_Conditional_14_Template, 2, 1, "span", 19)(15, AIAgentFormComponentExtended_form_3_Conditional_15_Template, 3, 1, "span", 20);
1735
1735
  i0.ɵɵelementEnd()()();
1736
- i0.ɵɵelementStart(16, "div", 20);
1737
- i0.ɵɵtemplate(17, AIAgentFormComponentExtended_form_2_Conditional_17_Template, 3, 1, "button", 21);
1738
- i0.ɵɵelementStart(18, "button", 22);
1739
- i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_2_Template_button_click_18_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.refreshRelatedData()); });
1740
- i0.ɵɵelement(19, "i", 23);
1736
+ i0.ɵɵelementStart(16, "div", 21);
1737
+ i0.ɵɵtemplate(17, AIAgentFormComponentExtended_form_3_Conditional_17_Template, 3, 1, "button", 22);
1738
+ i0.ɵɵelementStart(18, "button", 23);
1739
+ i0.ɵɵlistener("click", function AIAgentFormComponentExtended_form_3_Template_button_click_18_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.refreshRelatedData()); });
1740
+ i0.ɵɵelement(19, "i", 24);
1741
1741
  i0.ɵɵelementEnd()()()();
1742
- i0.ɵɵelementStart(20, "div", 24)(21, "kendo-panelbar", 25);
1743
- i0.ɵɵtemplate(22, AIAgentFormComponentExtended_form_2_Conditional_22_Template, 3, 1, "kendo-panelbar-item", 26)(23, AIAgentFormComponentExtended_form_2_Conditional_23_Template, 3, 1, "kendo-panelbar-item", 26)(24, AIAgentFormComponentExtended_form_2_Conditional_24_Template, 3, 1, "kendo-panelbar-item", 26)(25, AIAgentFormComponentExtended_form_2_Conditional_25_Template, 3, 1, "kendo-panelbar-item", 26)(26, AIAgentFormComponentExtended_form_2_Conditional_26_Template, 3, 1, "kendo-panelbar-item", 26)(27, AIAgentFormComponentExtended_form_2_Conditional_27_Template, 3, 1, "kendo-panelbar-item", 26)(28, AIAgentFormComponentExtended_form_2_Conditional_28_Template, 3, 1, "kendo-panelbar-item", 26);
1744
- i0.ɵɵelementStart(29, "kendo-panelbar-item", 26);
1745
- i0.ɵɵtemplate(30, AIAgentFormComponentExtended_form_2_ng_template_30_Template, 2, 0, "ng-template", 27)(31, AIAgentFormComponentExtended_form_2_ng_template_31_Template, 124, 21, "ng-template", 28);
1742
+ i0.ɵɵelementStart(20, "div", 25)(21, "kendo-panelbar", 26);
1743
+ i0.ɵɵtemplate(22, AIAgentFormComponentExtended_form_3_Conditional_22_Template, 3, 1, "kendo-panelbar-item", 27)(23, AIAgentFormComponentExtended_form_3_Conditional_23_Template, 3, 1, "kendo-panelbar-item", 27)(24, AIAgentFormComponentExtended_form_3_Conditional_24_Template, 3, 1, "kendo-panelbar-item", 27)(25, AIAgentFormComponentExtended_form_3_Conditional_25_Template, 3, 1, "kendo-panelbar-item", 27)(26, AIAgentFormComponentExtended_form_3_Conditional_26_Template, 3, 1, "kendo-panelbar-item", 27)(27, AIAgentFormComponentExtended_form_3_Conditional_27_Template, 3, 1, "kendo-panelbar-item", 27)(28, AIAgentFormComponentExtended_form_3_Conditional_28_Template, 3, 1, "kendo-panelbar-item", 27);
1744
+ i0.ɵɵelementStart(29, "kendo-panelbar-item", 27);
1745
+ i0.ɵɵtemplate(30, AIAgentFormComponentExtended_form_3_ng_template_30_Template, 2, 0, "ng-template", 28)(31, AIAgentFormComponentExtended_form_3_ng_template_31_Template, 124, 21, "ng-template", 29);
1746
1746
  i0.ɵɵelementEnd();
1747
- i0.ɵɵelementStart(32, "kendo-panelbar-item", 26);
1748
- i0.ɵɵtemplate(33, AIAgentFormComponentExtended_form_2_ng_template_33_Template, 2, 0, "ng-template", 27)(34, AIAgentFormComponentExtended_form_2_ng_template_34_Template, 9, 8, "ng-template", 28);
1747
+ i0.ɵɵelementStart(32, "kendo-panelbar-item", 27);
1748
+ i0.ɵɵtemplate(33, AIAgentFormComponentExtended_form_3_ng_template_33_Template, 2, 0, "ng-template", 28)(34, AIAgentFormComponentExtended_form_3_ng_template_34_Template, 9, 8, "ng-template", 29);
1749
1749
  i0.ɵɵelementEnd();
1750
- i0.ɵɵelementStart(35, "kendo-panelbar-item", 26);
1751
- i0.ɵɵtemplate(36, AIAgentFormComponentExtended_form_2_ng_template_36_Template, 2, 0, "ng-template", 27)(37, AIAgentFormComponentExtended_form_2_ng_template_37_Template, 159, 21, "ng-template", 28);
1750
+ i0.ɵɵelementStart(35, "kendo-panelbar-item", 27);
1751
+ i0.ɵɵtemplate(36, AIAgentFormComponentExtended_form_3_ng_template_36_Template, 2, 0, "ng-template", 28)(37, AIAgentFormComponentExtended_form_3_ng_template_37_Template, 159, 21, "ng-template", 29);
1752
1752
  i0.ɵɵelementEnd()()()();
1753
1753
  } if (rf & 2) {
1754
1754
  const ctx_r1 = i0.ɵɵnextContext();
@@ -3695,15 +3695,15 @@ let AIAgentFormComponentExtended = class AIAgentFormComponentExtended extends AI
3695
3695
  } if (rf & 2) {
3696
3696
  let _t;
3697
3697
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.customSectionContainer = _t.first);
3698
- } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 1, consts: [["form", "ngForm"], ["customSectionContainer", ""], [1, "record-form-container"], ["kendoDialogContainer", ""], ["class", "record-form", 4, "ngIf"], [1, "record-form"], [3, "form"], [1, "agent-header"], [1, "agent-header-content"], [1, "agent-overview"], [1, "agent-icon-wrapper"], [1, "agent-logo", 3, "src", "alt"], [3, "class"], [1, "agent-info"], ["name", "agentName", "placeholder", "Enter agent name...", 1, "agent-name-input", 3, "ngModel"], [1, "agent-name"], [1, "agent-meta"], [1, "status-badge", 3, "background-color"], [1, "execution-mode"], [1, "parent-agent"], [1, "agent-actions"], ["kendoButton", "", "themeColor", "primary", "size", "large", "title", "Run this AI agent", 3, "disabled"], ["kendoButton", "", "fillMode", "outline", "size", "small", "title", "Refresh all data", 3, "click"], [1, "fa-solid", "fa-refresh"], [1, "form-content"], [3, "keepItemContent"], [3, "expanded"], ["kendoPanelBarItemTitle", ""], ["kendoPanelBarContent", ""], ["name", "agentName", "placeholder", "Enter agent name...", 1, "agent-name-input", 3, "ngModelChange", "ngModel"], [1, "status-badge"], [1, "fa-solid", "fa-circle"], [1, "fa-solid", "fa-sitemap"], ["kendoButton", "", "themeColor", "primary", "size", "large", "title", "Run this AI agent", 3, "click", "disabled"], [1, "fa-solid", "fa-play"], [3, "stateChange", "expanded"], [1, "fa-solid", "fa-puzzle-piece"], [1, "panel-content", "custom-agent-type-section"], [1, "fa-solid", "fa-history"], [1, "panel-content", "execution-history-panel"], [1, "empty-state"], [1, "execution-history-list"], [1, "execution-card", 3, "expanded"], [1, "view-more-item"], [1, "execution-card"], [1, "execution-header", 3, "click"], [1, "execution-left-section"], [1, "execution-status"], [1, "status-indicator"], [1, "execution-info"], [1, "execution-title"], [1, "fa-solid", "fa-chevron-right", "expand-icon"], [1, "execution-date"], [1, "execution-metrics"], [1, "metric-item"], [1, "execution-actions"], ["title", "View details", 1, "action-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], [1, "execution-expanded-content"], [1, "fa-solid", "fa-cog"], [1, "metric-label"], [1, "metric-value"], [1, "fa-solid", "fa-stopwatch"], [1, "fa-solid", "fa-clock"], [1, "fa-solid", "fa-microchip"], [1, "fa-solid", "fa-dollar-sign"], [1, "detailed-metrics"], [1, "metrics-grid"], [1, "metric-detail"], [1, "metric-info"], [1, "metric-title"], [1, "metric-data"], [1, "result-section"], [1, "error-section"], [1, "fa-solid", "fa-check-circle"], [1, "fa-solid", "fa-calculator"], [1, "fa-solid", "fa-comments"], [1, "fa-solid", "fa-file-text"], ["language", "json", 2, "max-height", "200px", "width", "100%", 3, "value", "readonly", "lineWrapping"], [1, "fa-solid", "fa-exclamation-triangle"], [1, "error-content"], [1, "view-more-item", 3, "click"], [1, "fa-solid", "fa-bolt"], [1, "panel-content"], [1, "section-header"], [1, "header-actions"], ["kendoButton", "", "themeColor", "primary", "size", "small"], [1, "entity-list"], ["kendoButton", "", "themeColor", "primary", "size", "small", 3, "click"], [1, "fa-solid", "fa-plus"], ["kendoButton", "", "themeColor", "primary"], ["kendoButton", "", "themeColor", "primary", 3, "click"], [1, "entity-item", "action-item"], [1, "entity-item", "action-item", 3, "click"], [1, "item-icon"], [1, "item-content"], [1, "item-title"], [1, "item-preview"], [1, "item-meta"], [1, "meta-tag"], [1, "status-tag"], [1, "fa-solid"], [1, "item-actions"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove action"], [1, "fa-solid", "fa-external-link"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove action", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "section-description"], ["kendoButton", "", "themeColor", "secondary", "size", "small", 3, "click"], ["kendoButton", "", "themeColor", "secondary", 3, "click"], [1, "entity-item", "sub-agent-item"], [1, "entity-item", "sub-agent-item", 3, "click"], [1, "sub-agent-logo", 3, "src", "alt"], [1, "status-tag", 3, "background-color"], ["kendoButton", "", "fillMode", "flat", "themeColor", "primary", "size", "small", "title", "Advanced settings"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove sub-agent"], ["kendoButton", "", "fillMode", "flat", "themeColor", "primary", "size", "small", "title", "Advanced settings", 3, "click"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove sub-agent", 3, "click"], [1, "prompt-controls"], [1, "model-selection-mode"], [1, "model-selection-label"], [1, "fa-solid", "fa-sliders"], ["name", "modelSelectionMode", "textField", "text", "valueField", "value", 1, "model-selection-dropdown", 3, "ngModel", "data", "valuePrimitive"], [1, "model-selection-value"], ["name", "modelSelectionMode", "textField", "text", "valueField", "value", 1, "model-selection-dropdown", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [1, "entity-item", "prompt-item"], [1, "entity-item", "prompt-item", 3, "click"], [1, "fa-solid", "fa-comment-dots"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove prompt"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove prompt", 3, "click"], [1, "fa-solid", "fa-brain"], [1, "entity-item", "learning-item"], [1, "entity-item", "learning-item", 3, "click"], [1, "fa-solid", "fa-calendar"], [1, "fa-solid", "fa-sticky-note"], [1, "entity-item", "note-item"], [1, "entity-item", "note-item", 3, "click"], [1, "fa-solid", "fa-exchange-alt"], [1, "payload-section"], [1, "payload-section-title"], [1, "fa-solid", "fa-target"], [1, "payload-field-container"], [1, "payload-field-info"], [1, "payload-field-label"], [1, "payload-field-description"], [1, "payload-field-input"], ["FieldName", "PayloadScope", "Type", "textbox", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], [1, "payload-field-example"], [1, "fa-solid", "fa-lightbulb"], [1, "fa-solid", "fa-route"], [1, "payload-paths-grid"], [1, "payload-path-card"], [1, "payload-path-header"], [1, "payload-path-icon", "downstream"], [1, "fa-solid", "fa-arrow-down"], [1, "payload-path-info"], [1, "payload-path-content"], [1, "json-editor-container"], ["language", "json", 2, "height", "100px", "width", "100%", 3, "valueChange", "value", "readonly", "lineWrapping"], [1, "payload-path-hint"], [1, "fa-solid", "fa-info-circle"], [1, "payload-path-icon", "upstream"], [1, "fa-solid", "fa-arrow-up"], [1, "payload-path-icon", "self-read"], [1, "fa-solid", "fa-eye"], [1, "payload-path-icon", "self-write"], [1, "fa-solid", "fa-pen"], [1, "fa-solid", "fa-shield-check"], [1, "payload-validation-container"], [1, "payload-validation-settings"], [1, "validation-field-group"], [1, "validation-field-label"], [1, "validation-field-description"], ["FieldName", "FinalPayloadValidationMode", "Type", "dropdownlist", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], ["FieldName", "FinalPayloadValidationMaxRetries", "Type", "numerictextbox", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], [1, "payload-validation-schema"], [1, "validation-schema-label"], [1, "fa-solid", "fa-code"], [1, "validation-schema-description"], [1, "validation-schema-editor"], ["language", "json", 2, "height", "200px", "width", "100%", 3, "valueChange", "value", "readonly", "lineWrapping"], [1, "fa-solid", "fa-shield-halved"], [1, "form-fields-grid"], ["FieldName", "MaxCostPerRun", "Type", "numerictextbox", "Caption", "Max Cost ($)", "Description", "Maximum cost per run", 3, "EditMode", "record"], ["FieldName", "MaxTokensPerRun", "Type", "numerictextbox", "Caption", "Max Tokens", "Description", "Maximum tokens per run", 3, "EditMode", "record"], ["FieldName", "MaxIterationsPerRun", "Type", "numerictextbox", "Caption", "Max Iterations", "Description", "Maximum prompt iterations", 3, "EditMode", "record"], ["FieldName", "MaxTimePerRun", "Type", "numerictextbox", "Caption", "Max Time (seconds)", "Description", "Maximum execution time", 3, "EditMode", "record"], [1, "fa-solid", "fa-cogs"], [1, "config-section"], [1, "config-section-title"], [1, "fa-solid", "fa-id-card"], [1, "config-grid"], [1, "config-card"], [1, "config-card-header"], [1, "config-card-icon"], [1, "fa-solid", "fa-toggle-on"], [1, "config-card-info"], [1, "config-card-content"], ["textField", "text", "valueField", "value", "name", "agentStatus", 1, "config-field-input", 3, "ngModel", "data", "valuePrimitive"], [1, "config-field-display"], ["textField", "Name", "valueField", "ID", "name", "agentTypeID", 1, "config-field-input", 3, "ngModel", "data", "valuePrimitive"], ["FieldName", "ExposeAsAction", "Type", "checkbox", "Caption", "", 3, "EditMode", "record"], [1, "config-card", "full-width"], [1, "fa-solid", "fa-align-left"], ["FieldName", "Description", "Type", "textarea", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], [1, "fa-solid", "fa-layer-group"], ["FieldName", "ExecutionMode", "Type", "dropdownlist", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-sort-numeric-down"], ["FieldName", "ExecutionOrder", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-tachometer-alt"], ["FieldName", "DefaultPromptEffortLevel", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "config-card-hint"], ["FieldName", "DriverClass", "Type", "textbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-palette"], [1, "fa-solid", "fa-icons"], ["FieldName", "IconClass", "Type", "textbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-image"], ["FieldName", "LogoURL", "Type", "textbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-compress"], ["FieldName", "EnableContextCompression", "Type", "checkbox", "Caption", "", 3, "valueChange", "EditMode", "record"], ["textField", "text", "valueField", "value", "name", "agentStatus", 1, "config-field-input", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], ["textField", "Name", "valueField", "ID", "name", "agentTypeID", 1, "config-field-input", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [1, "fa-solid", "fa-hashtag"], ["FieldName", "ContextCompressionMessageThreshold", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-save"], ["FieldName", "ContextCompressionMessageRetentionCount", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "prompt-selector-container"], [1, "prompt-display"], [1, "prompt-name"], [1, "no-prompt"], [1, "prompt-actions"], ["type", "button", "kendoButton", "", "fillMode", "outline", "size", "small", 1, "prompt-select-btn", 3, "click"], [1, "fa-solid", "fa-search"], ["type", "button", "kendoButton", "", "fillMode", "flat", "size", "small", "title", "Clear selection", 1, "prompt-clear-btn"], ["type", "button", "kendoButton", "", "fillMode", "flat", "size", "small", "title", "Clear selection", 1, "prompt-clear-btn", 3, "click"], [1, "fa-solid", "fa-times"]], template: function AIAgentFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
3698
+ } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 4, vars: 1, consts: [["form", "ngForm"], ["customSectionContainer", ""], [1, "record-form-container"], ["kendoDialogContainer", ""], ["kendoWindowContainer", ""], ["class", "record-form", 4, "ngIf"], [1, "record-form"], [3, "form"], [1, "agent-header"], [1, "agent-header-content"], [1, "agent-overview"], [1, "agent-icon-wrapper"], [1, "agent-logo", 3, "src", "alt"], [3, "class"], [1, "agent-info"], ["name", "agentName", "placeholder", "Enter agent name...", 1, "agent-name-input", 3, "ngModel"], [1, "agent-name"], [1, "agent-meta"], [1, "status-badge", 3, "background-color"], [1, "execution-mode"], [1, "parent-agent"], [1, "agent-actions"], ["kendoButton", "", "themeColor", "primary", "size", "large", "title", "Run this AI agent", 3, "disabled"], ["kendoButton", "", "fillMode", "outline", "size", "small", "title", "Refresh all data", 3, "click"], [1, "fa-solid", "fa-refresh"], [1, "form-content"], [3, "keepItemContent"], [3, "expanded"], ["kendoPanelBarItemTitle", ""], ["kendoPanelBarContent", ""], ["name", "agentName", "placeholder", "Enter agent name...", 1, "agent-name-input", 3, "ngModelChange", "ngModel"], [1, "status-badge"], [1, "fa-solid", "fa-circle"], [1, "fa-solid", "fa-sitemap"], ["kendoButton", "", "themeColor", "primary", "size", "large", "title", "Run this AI agent", 3, "click", "disabled"], [1, "fa-solid", "fa-play"], [3, "stateChange", "expanded"], [1, "fa-solid", "fa-puzzle-piece"], [1, "panel-content", "custom-agent-type-section"], [1, "fa-solid", "fa-history"], [1, "panel-content", "execution-history-panel"], [1, "empty-state"], [1, "execution-history-list"], [1, "execution-card", 3, "expanded"], [1, "view-more-item"], [1, "execution-card"], [1, "execution-header", 3, "click"], [1, "execution-left-section"], [1, "execution-status"], [1, "status-indicator"], [1, "execution-info"], [1, "execution-title"], [1, "fa-solid", "fa-chevron-right", "expand-icon"], [1, "execution-date"], [1, "execution-metrics"], [1, "metric-item"], [1, "execution-actions"], ["title", "View details", 1, "action-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], [1, "execution-expanded-content"], [1, "fa-solid", "fa-cog"], [1, "metric-label"], [1, "metric-value"], [1, "fa-solid", "fa-stopwatch"], [1, "fa-solid", "fa-clock"], [1, "fa-solid", "fa-microchip"], [1, "fa-solid", "fa-dollar-sign"], [1, "detailed-metrics"], [1, "metrics-grid"], [1, "metric-detail"], [1, "metric-info"], [1, "metric-title"], [1, "metric-data"], [1, "result-section"], [1, "error-section"], [1, "fa-solid", "fa-check-circle"], [1, "fa-solid", "fa-calculator"], [1, "fa-solid", "fa-comments"], [1, "fa-solid", "fa-file-text"], ["language", "json", 2, "max-height", "200px", "width", "100%", 3, "value", "readonly", "lineWrapping"], [1, "fa-solid", "fa-exclamation-triangle"], [1, "error-content"], [1, "view-more-item", 3, "click"], [1, "fa-solid", "fa-bolt"], [1, "panel-content"], [1, "section-header"], [1, "header-actions"], ["kendoButton", "", "themeColor", "primary", "size", "small"], [1, "entity-list"], ["kendoButton", "", "themeColor", "primary", "size", "small", 3, "click"], [1, "fa-solid", "fa-plus"], ["kendoButton", "", "themeColor", "primary"], ["kendoButton", "", "themeColor", "primary", 3, "click"], [1, "entity-item", "action-item"], [1, "entity-item", "action-item", 3, "click"], [1, "item-icon"], [1, "item-content"], [1, "item-title"], [1, "item-preview"], [1, "item-meta"], [1, "meta-tag"], [1, "status-tag"], [1, "fa-solid"], [1, "item-actions"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove action"], [1, "fa-solid", "fa-external-link"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove action", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "section-description"], ["kendoButton", "", "themeColor", "secondary", "size", "small", 3, "click"], ["kendoButton", "", "themeColor", "secondary", 3, "click"], [1, "entity-item", "sub-agent-item"], [1, "entity-item", "sub-agent-item", 3, "click"], [1, "sub-agent-logo", 3, "src", "alt"], [1, "status-tag", 3, "background-color"], ["kendoButton", "", "fillMode", "flat", "themeColor", "primary", "size", "small", "title", "Advanced settings"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove sub-agent"], ["kendoButton", "", "fillMode", "flat", "themeColor", "primary", "size", "small", "title", "Advanced settings", 3, "click"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove sub-agent", 3, "click"], [1, "prompt-controls"], [1, "model-selection-mode"], [1, "model-selection-label"], [1, "fa-solid", "fa-sliders"], ["name", "modelSelectionMode", "textField", "text", "valueField", "value", 1, "model-selection-dropdown", 3, "ngModel", "data", "valuePrimitive"], [1, "model-selection-value"], ["name", "modelSelectionMode", "textField", "text", "valueField", "value", 1, "model-selection-dropdown", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [1, "entity-item", "prompt-item"], [1, "entity-item", "prompt-item", 3, "click"], [1, "fa-solid", "fa-comment-dots"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove prompt"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove prompt", 3, "click"], [1, "fa-solid", "fa-brain"], [1, "entity-item", "learning-item"], [1, "entity-item", "learning-item", 3, "click"], [1, "fa-solid", "fa-calendar"], [1, "fa-solid", "fa-sticky-note"], [1, "entity-item", "note-item"], [1, "entity-item", "note-item", 3, "click"], [1, "fa-solid", "fa-exchange-alt"], [1, "payload-section"], [1, "payload-section-title"], [1, "fa-solid", "fa-target"], [1, "payload-field-container"], [1, "payload-field-info"], [1, "payload-field-label"], [1, "payload-field-description"], [1, "payload-field-input"], ["FieldName", "PayloadScope", "Type", "textbox", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], [1, "payload-field-example"], [1, "fa-solid", "fa-lightbulb"], [1, "fa-solid", "fa-route"], [1, "payload-paths-grid"], [1, "payload-path-card"], [1, "payload-path-header"], [1, "payload-path-icon", "downstream"], [1, "fa-solid", "fa-arrow-down"], [1, "payload-path-info"], [1, "payload-path-content"], [1, "json-editor-container"], ["language", "json", 2, "height", "100px", "width", "100%", 3, "valueChange", "value", "readonly", "lineWrapping"], [1, "payload-path-hint"], [1, "fa-solid", "fa-info-circle"], [1, "payload-path-icon", "upstream"], [1, "fa-solid", "fa-arrow-up"], [1, "payload-path-icon", "self-read"], [1, "fa-solid", "fa-eye"], [1, "payload-path-icon", "self-write"], [1, "fa-solid", "fa-pen"], [1, "fa-solid", "fa-shield-check"], [1, "payload-validation-container"], [1, "payload-validation-settings"], [1, "validation-field-group"], [1, "validation-field-label"], [1, "validation-field-description"], ["FieldName", "FinalPayloadValidationMode", "Type", "dropdownlist", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], ["FieldName", "FinalPayloadValidationMaxRetries", "Type", "numerictextbox", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], [1, "payload-validation-schema"], [1, "validation-schema-label"], [1, "fa-solid", "fa-code"], [1, "validation-schema-description"], [1, "validation-schema-editor"], ["language", "json", 2, "height", "200px", "width", "100%", 3, "valueChange", "value", "readonly", "lineWrapping"], [1, "fa-solid", "fa-shield-halved"], [1, "form-fields-grid"], ["FieldName", "MaxCostPerRun", "Type", "numerictextbox", "Caption", "Max Cost ($)", "Description", "Maximum cost per run", 3, "EditMode", "record"], ["FieldName", "MaxTokensPerRun", "Type", "numerictextbox", "Caption", "Max Tokens", "Description", "Maximum tokens per run", 3, "EditMode", "record"], ["FieldName", "MaxIterationsPerRun", "Type", "numerictextbox", "Caption", "Max Iterations", "Description", "Maximum prompt iterations", 3, "EditMode", "record"], ["FieldName", "MaxTimePerRun", "Type", "numerictextbox", "Caption", "Max Time (seconds)", "Description", "Maximum execution time", 3, "EditMode", "record"], [1, "fa-solid", "fa-cogs"], [1, "config-section"], [1, "config-section-title"], [1, "fa-solid", "fa-id-card"], [1, "config-grid"], [1, "config-card"], [1, "config-card-header"], [1, "config-card-icon"], [1, "fa-solid", "fa-toggle-on"], [1, "config-card-info"], [1, "config-card-content"], ["textField", "text", "valueField", "value", "name", "agentStatus", 1, "config-field-input", 3, "ngModel", "data", "valuePrimitive"], [1, "config-field-display"], ["textField", "Name", "valueField", "ID", "name", "agentTypeID", 1, "config-field-input", 3, "ngModel", "data", "valuePrimitive"], ["FieldName", "ExposeAsAction", "Type", "checkbox", "Caption", "", 3, "EditMode", "record"], [1, "config-card", "full-width"], [1, "fa-solid", "fa-align-left"], ["FieldName", "Description", "Type", "textarea", "Caption", "", 2, "width", "100%", 3, "EditMode", "record"], [1, "fa-solid", "fa-layer-group"], ["FieldName", "ExecutionMode", "Type", "dropdownlist", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-sort-numeric-down"], ["FieldName", "ExecutionOrder", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-tachometer-alt"], ["FieldName", "DefaultPromptEffortLevel", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "config-card-hint"], ["FieldName", "DriverClass", "Type", "textbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-palette"], [1, "fa-solid", "fa-icons"], ["FieldName", "IconClass", "Type", "textbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-image"], ["FieldName", "LogoURL", "Type", "textbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-compress"], ["FieldName", "EnableContextCompression", "Type", "checkbox", "Caption", "", 3, "valueChange", "EditMode", "record"], ["textField", "text", "valueField", "value", "name", "agentStatus", 1, "config-field-input", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], ["textField", "Name", "valueField", "ID", "name", "agentTypeID", 1, "config-field-input", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [1, "fa-solid", "fa-hashtag"], ["FieldName", "ContextCompressionMessageThreshold", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "fa-solid", "fa-save"], ["FieldName", "ContextCompressionMessageRetentionCount", "Type", "numerictextbox", "Caption", "", 3, "EditMode", "record"], [1, "prompt-selector-container"], [1, "prompt-display"], [1, "prompt-name"], [1, "no-prompt"], [1, "prompt-actions"], ["type", "button", "kendoButton", "", "fillMode", "outline", "size", "small", 1, "prompt-select-btn", 3, "click"], [1, "fa-solid", "fa-search"], ["type", "button", "kendoButton", "", "fillMode", "flat", "size", "small", "title", "Clear selection", 1, "prompt-clear-btn"], ["type", "button", "kendoButton", "", "fillMode", "flat", "size", "small", "title", "Clear selection", 1, "prompt-clear-btn", 3, "click"], [1, "fa-solid", "fa-times"]], template: function AIAgentFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
3699
3699
  i0.ɵɵelementStart(0, "div", 2);
3700
- i0.ɵɵelement(1, "div", 3);
3701
- i0.ɵɵtemplate(2, AIAgentFormComponentExtended_form_2_Template, 38, 18, "form", 4);
3700
+ i0.ɵɵelement(1, "div", 3)(2, "div", 4);
3701
+ i0.ɵɵtemplate(3, AIAgentFormComponentExtended_form_3_Template, 38, 18, "form", 5);
3702
3702
  i0.ɵɵelementEnd();
3703
3703
  } if (rf & 2) {
3704
- i0.ɵɵadvance(2);
3704
+ i0.ɵɵadvance(3);
3705
3705
  i0.ɵɵproperty("ngIf", ctx.record);
3706
- } }, dependencies: [i6.NgIf, i7.ɵNgNoValidate, i7.NgControlStatus, i7.NgControlStatusGroup, i7.NgModel, i7.NgForm, i8.PanelBarComponent, i8.PanelBarItemComponent, i8.PanelBarContentDirective, i8.PanelBarItemTitleDirective, i3.DialogContainerDirective, i9.TextBoxComponent, i10.DropDownListComponent, i11.ButtonComponent, i12.MJFormField, i13.FormToolbarComponent, i14.CodeEditorComponent, i6.DatePipe], styles: ["\n\n.record-form-container[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #f5f7fa;\n}\n\n.record-form[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n\n\n.agent-header[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);\n border-bottom: 1px solid #e0e6ed;\n padding: 12px 20px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.agent-header-content[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 20px;\n}\n\n.agent-overview[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n flex: 1;\n min-width: 0;\n}\n\n.agent-icon-wrapper[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.2);\n flex-shrink: 0;\n}\n\n.agent-icon-wrapper[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 24px;\n}\n\n.agent-icon-wrapper[_ngcontent-%COMP%] img.agent-logo[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 8px;\n}\n\n.agent-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name[_ngcontent-%COMP%] {\n font-size: 22px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n line-height: 1.2;\n}\n\n.agent-name-input[_ngcontent-%COMP%] {\n font-size: 18px !important;\n font-weight: 500 !important;\n height: 36px !important;\n width: 100% !important;\n max-width: 400px !important;\n}\n\n.agent-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n padding: 6px 16px;\n border-radius: 20px;\n font-size: 13px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n}\n\n.status-badge.active[_ngcontent-%COMP%] {\n background: #28a745;\n color: white;\n}\n\n.status-badge.pending[_ngcontent-%COMP%] {\n background: #ffc107;\n color: #212529;\n}\n\n.status-badge.disabled[_ngcontent-%COMP%] {\n background: #6c757d;\n color: white;\n}\n\n.execution-mode[_ngcontent-%COMP%], \n.parent-agent[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 10px;\n border-radius: 12px;\n}\n\n.execution-mode[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.parent-agent[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n opacity: 0.8;\n}\n\n\n\n.prompt-controls[_ngcontent-%COMP%] {\n flex: 1;\n margin-right: 16px;\n}\n\n.agent-meta-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 24px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.meta-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.meta-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n.agent-description[_ngcontent-%COMP%] {\n margin-top: 16px;\n color: #6c757d;\n line-height: 1.6;\n font-size: 15px;\n}\n\n.agent-description-input[_ngcontent-%COMP%] {\n width: 100%;\n max-width: 600px;\n min-height: 80px;\n resize: vertical;\n}\n\n\n\n.agent-actions[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.action-buttons-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.action-button[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 20px;\n border-radius: 8px;\n font-weight: 500;\n font-size: 14px;\n transition: all 0.2s ease;\n box-shadow: 0 2px 4px rgba(0,0,0,0.08);\n}\n\n.action-button[_ngcontent-%COMP%]:hover {\n transform: translateY(-1px);\n box-shadow: 0 4px 8px rgba(0,0,0,0.12);\n}\n\n.action-button.primary[_ngcontent-%COMP%] {\n background: #2196f3;\n color: white;\n}\n\n.action-button.primary[_ngcontent-%COMP%]:hover {\n background: #1976d2;\n}\n\n.action-button.secondary[_ngcontent-%COMP%] {\n background: #6c757d;\n color: white;\n}\n\n.action-button.secondary[_ngcontent-%COMP%]:hover {\n background: #5a6268;\n}\n\n.action-warnings[_ngcontent-%COMP%] {\n margin-top: 8px;\n font-size: 13px;\n color: #dc3545;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n\n\n.form-content[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n overflow-x: hidden;\n background: #f5f7fa;\n padding: 12px;\n}\n\n\n\n .k-panelbar {\n border: none;\n background: transparent;\n}\n\n .k-panelbar > .k-panelbar-item {\n border: none;\n border-radius: 12px;\n margin-bottom: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n background: white;\n overflow: hidden;\n}\n\n .k-panelbar > .k-panelbar-item > .k-header {\n background: white;\n border: none;\n padding: 16px 20px;\n border-radius: 12px 12px 0 0;\n color: #2c3e50;\n font-weight: 600;\n font-size: 16px;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n .k-panelbar > .k-panelbar-item > .k-header:hover {\n background: #f8f9fa;\n}\n\n .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header {\n background: #2196f3;\n color: white;\n border-radius: 12px 12px 0 0;\n}\n\n .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle {\n position: absolute;\n right: 24px;\n color: inherit;\n font-size: 14px;\n transition: transform 0.2s ease;\n}\n\n .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header .k-panelbar-toggle {\n transform: rotate(180deg);\n}\n\n .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle::before {\n content: '\\f107';\n font-family: 'Font Awesome 6 Free';\n font-weight: 900;\n}\n\n .k-panelbar > .k-panelbar-item > .k-content {\n padding: 0;\n border: none;\n background: white;\n border-radius: 0 0 12px 12px;\n}\n\n .k-panelbar .k-header .k-panelbar-icon {\n font-size: 18px;\n color: #2196f3;\n margin-right: 8px;\n}\n\n .k-panelbar .k-panelbar-expanded .k-header .k-panelbar-icon {\n color: white;\n}\n\n\n\n.panel-content[_ngcontent-%COMP%] {\n padding: 16px;\n background: white;\n}\n\n.section-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.section-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-bottom: 16px;\n}\n\n.header-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-shrink: 0;\n}\n\n.tab-section[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n padding: 24px;\n margin-bottom: 24px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n}\n\n.section-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n padding-bottom: 16px;\n border-bottom: 2px solid #f0f4f8;\n}\n\n.section-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n margin: 0;\n color: #2c3e50;\n font-size: 18px;\n font-weight: 600;\n}\n\n.section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 20px;\n}\n\n.section-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-top: 8px;\n}\n\n\n\n.form-fields-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 20px;\n margin-top: 20px;\n}\n\n.form-field-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.form-field-label[_ngcontent-%COMP%] {\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n\n\n.sub-grid-container[_ngcontent-%COMP%] {\n height: 500px;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n display: none; \n\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\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;\n}\n\n\n\n.loading-overlay[_ngcontent-%COMP%] {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(255, 255, 255, 0.9);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n}\n\n.spinner-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border: 4px solid #f3f3f3;\n border-top: 4px solid #2196f3;\n border-radius: 50%;\n animation: _ngcontent-%COMP%_spin 1s linear infinite;\n}\n\n@keyframes _ngcontent-%COMP%_spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n\n\n.quick-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n}\n\n.quick-action-card[_ngcontent-%COMP%] {\n flex: 1;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n border: 1px solid #e0e6ed;\n cursor: pointer;\n transition: all 0.2s ease;\n text-align: center;\n}\n\n.quick-action-card[_ngcontent-%COMP%]:hover {\n background: white;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.quick-action-icon[_ngcontent-%COMP%] {\n font-size: 32px;\n color: #2196f3;\n margin-bottom: 8px;\n}\n\n.quick-action-title[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 4px;\n}\n\n.quick-action-description[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n}\n\n\n\n.header-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n\n\n\n.entity-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.entity-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-1px);\n}\n\n.item-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.prompt-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.sub-agent-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.model-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #6f42c1, #563d7c);\n}\n\n.learning-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #e83e8c, #dc3545);\n}\n\n.note-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #fd7e14, #e55a00);\n}\n\n.item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 18px;\n}\n\n.prompt-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.action-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.sub-agent-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.model-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.learning-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.note-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n}\n\n.item-icon[_ngcontent-%COMP%] img.sub-agent-logo[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 6px;\n}\n\n.item-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.item-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n}\n\n.item-preview[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n margin: 4px 0 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.item-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.meta-tag[_ngcontent-%COMP%], \n.priority-tag[_ngcontent-%COMP%], \n.status-tag[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n padding: 3px 8px;\n border-radius: 6px;\n font-weight: 500;\n}\n\n.meta-tag[_ngcontent-%COMP%] {\n background: #e9ecef;\n color: #495057;\n}\n\n.priority-tag[_ngcontent-%COMP%] {\n color: white;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n.status-tag[_ngcontent-%COMP%] {\n background: #e9ecef;\n color: #495057;\n}\n\n.status-tag.active[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #28a745;\n}\n\n.status-tag.inactive[_ngcontent-%COMP%] {\n background: #f8d7da;\n color: #dc3545;\n}\n\n.item-actions[_ngcontent-%COMP%] {\n opacity: 0;\n transition: opacity 0.2s ease;\n color: #6c757d;\n font-size: 16px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover .item-actions[_ngcontent-%COMP%] {\n opacity: 1;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover .item-actions[_ngcontent-%COMP%] > i[_ngcontent-%COMP%] {\n color: #2196f3;\n}\n\n.view-more-item[_ngcontent-%COMP%] {\n padding: 16px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 10px;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-more-item[_ngcontent-%COMP%]:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n color: #2196f3;\n}\n\n\n\n.payload-config-section[_ngcontent-%COMP%], \n.payload-paths-section[_ngcontent-%COMP%], \n.payload-validation-section[_ngcontent-%COMP%] {\n margin-bottom: 32px;\n}\n\n.subsection-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 16px 0;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.subsection-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n}\n\n.subsection-divider[_ngcontent-%COMP%] {\n margin-top: 32px;\n margin-bottom: 16px;\n padding-top: 24px;\n border-top: 1px solid #e0e6ed;\n}\n\n.payload-config-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 16px;\n margin-bottom: 24px;\n}\n\n.payload-field-group[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n}\n\n.payload-field-label[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n}\n\n.payload-field-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 16px;\n}\n\n.field-description[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: normal;\n color: #6c757d;\n margin-left: auto;\n}\n\n\n\n.payload-field-group[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n border: 1px solid #dee2e6;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.payload-field-group[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n}\n\n\n\n.payload-field-group[_ngcontent-%COMP%] mj-form-field[_ngcontent-%COMP%] textarea {\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 13px;\n line-height: 1.5;\n min-height: 120px;\n resize: vertical;\n}\n\n\n\n.execution-history-panel[_ngcontent-%COMP%] {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n\n\n.timeline-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 16px;\n margin-top: 16px;\n}\n\n.timeline-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.timeline-item[_ngcontent-%COMP%]:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.timeline-marker[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 14px;\n}\n\n.timeline-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.timeline-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 16px;\n}\n\n.timeline-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n background: #e9ecef;\n padding: 2px 8px;\n border-radius: 6px;\n white-space: nowrap;\n flex-shrink: 0;\n}\n\n.timeline-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.timeline-preview[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n\n\n.cards-container[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n gap: 20px;\n margin-top: 16px;\n}\n\n.entity-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n padding: 20px;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n position: relative;\n overflow: hidden;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover {\n transform: translateY(-4px);\n box-shadow: 0 8px 24px rgba(0,0,0,0.12);\n border-color: #2196f3;\n}\n\n.entity-card[_ngcontent-%COMP%]::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 4px;\n background: linear-gradient(90deg, #2196f3, #42a5f5);\n opacity: 0;\n transition: opacity 0.3s ease;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover::before {\n opacity: 1;\n}\n\n.card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n margin-bottom: 12px;\n}\n\n.card-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.sub-agent-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.prompt-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 18px;\n color: #6c757d;\n}\n\n.sub-agent-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.prompt-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.action-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n}\n\n.card-title-section[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.card-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n word-wrap: break-word;\n}\n\n.card-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.card-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #6c757d;\n padding: 4px 8px;\n background: #f8f9fa;\n border-radius: 6px;\n}\n\n.meta-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 11px;\n opacity: 0.8;\n}\n\n.meta-item.active[_ngcontent-%COMP%] {\n color: #28a745;\n background: #d4edda;\n}\n\n.meta-item.inactive[_ngcontent-%COMP%] {\n color: #dc3545;\n background: #f8d7da;\n}\n\n.card-actions[_ngcontent-%COMP%] {\n opacity: 0;\n transition: opacity 0.3s ease;\n color: #6c757d;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover .card-actions[_ngcontent-%COMP%] {\n opacity: 1;\n color: #2196f3;\n}\n\n\n\n.priority-badge[_ngcontent-%COMP%] {\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 11px;\n font-weight: 600;\n color: white;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n padding: 2px 8px;\n border-radius: 6px;\n font-size: 11px;\n font-weight: 500;\n background: #e9ecef;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n\n\n.view-all-card[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 120px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.view-all-card[_ngcontent-%COMP%]:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n transform: translateY(-2px);\n}\n\n.view-all-content[_ngcontent-%COMP%] {\n text-align: center;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-all-content[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 24px;\n margin-bottom: 8px;\n display: block;\n}\n\n\n\n.timeline-container[_ngcontent-%COMP%] {\n position: relative;\n margin-top: 16px;\n}\n\n.timeline-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n margin-bottom: 24px;\n transition: all 0.3s ease;\n border-radius: 12px;\n padding: 16px;\n background: transparent;\n border: 1px solid transparent;\n}\n\n.timeline-item[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #e0e6ed;\n}\n\n.timeline-item.expanded[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n}\n\n.timeline-item.view-all[_ngcontent-%COMP%] {\n cursor: pointer;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n}\n\n.timeline-item.view-all[_ngcontent-%COMP%]:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n}\n\n.timeline-item[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child {\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-marker[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n position: relative;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker[_ngcontent-%COMP%]::after {\n content: '';\n position: absolute;\n top: 50px;\n left: 50%;\n transform: translateX(-50%);\n width: 2px;\n height: 24px;\n background: #e0e6ed;\n}\n\n.timeline-item[_ngcontent-%COMP%]:last-child .timeline-marker[_ngcontent-%COMP%]::after {\n display: none;\n}\n\n.timeline-marker[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 16px;\n}\n\n.timeline-marker.view-all-marker[_ngcontent-%COMP%] {\n background: #6c757d;\n}\n\n.timeline-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-header[_ngcontent-%COMP%] {\n flex: 1;\n cursor: pointer;\n}\n\n.timeline-header[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 8px;\n gap: 16px;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n transition: transform 0.3s ease;\n margin-right: 8px;\n color: #6c757d;\n}\n\n.expand-icon.expanded[_ngcontent-%COMP%] {\n transform: rotate(90deg);\n}\n\n.timeline-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0;\n line-height: 1.3;\n}\n\n.timeline-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n white-space: nowrap;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n margin-left: auto;\n}\n\n.timeline-preview[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n line-height: 1.5;\n margin-top: 8px;\n padding: 8px 12px;\n background: #f8f9fa;\n border-radius: 6px;\n border: 1px solid #e0e6ed;\n}\n\n.timeline-status[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.execution-time[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n}\n\n.timeline-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n}\n\n.timeline-error[_ngcontent-%COMP%] {\n color: #dc3545;\n font-size: 13px;\n background: #f8d7da;\n padding: 8px 12px;\n border-radius: 6px;\n margin-top: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.timeline-error[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n flex-shrink: 0;\n}\n\n\n\n.timeline-expanded-content[_ngcontent-%COMP%] {\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n animation: _ngcontent-%COMP%_fadeIn 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.result-section[_ngcontent-%COMP%], \n.error-section[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n}\n\n.result-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%], \n.error-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.result-content[_ngcontent-%COMP%], \n.error-content[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #495057;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 200px;\n overflow-y: auto;\n}\n\n\n\n.result-section[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.error-content[_ngcontent-%COMP%] {\n background: #f8d7da;\n border-color: #f5c6cb;\n color: #721c24;\n}\n\n.execution-details[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 16px;\n margin-bottom: 20px;\n}\n\n.detail-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n}\n\n.detail-label[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n min-width: 80px;\n}\n\n.detail-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n word-break: break-all;\n}\n\n.timeline-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.btn-primary[_ngcontent-%COMP%] {\n padding: 8px 16px;\n background: #2196f3;\n color: white;\n border: none;\n border-radius: 8px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n transition: all 0.2s ease;\n}\n\n.btn-primary[_ngcontent-%COMP%]:hover {\n background: #1976d2;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(33, 150, 243, 0.3);\n}\n\n.btn-primary[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n background: #f8f9fa;\n border-radius: 12px;\n border: 2px dashed #dee2e6;\n margin-top: 16px;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\n font-size: 18px;\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 20px auto;\n}\n\n\n\n@media (max-width: 768px) {\n \n\n .agent-header[_ngcontent-%COMP%] {\n padding: 16px;\n }\n \n .agent-header-content[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n }\n \n .agent-overview[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .agent-meta[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .agent-actions[_ngcontent-%COMP%] {\n width: 100%;\n align-self: stretch;\n }\n \n .action-button[_ngcontent-%COMP%] {\n flex: 1;\n justify-content: center;\n }\n \n \n\n .form-content[_ngcontent-%COMP%] {\n padding: 12px;\n }\n \n .k-panelbar > .k-panelbar-item > .k-header {\n padding: 16px 20px;\n font-size: 15px;\n }\n \n .panel-content[_ngcontent-%COMP%] {\n padding: 20px 16px;\n }\n \n .section-header[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .header-actions[_ngcontent-%COMP%] {\n flex-wrap: wrap;\n align-self: stretch;\n }\n \n \n\n .entity-item[_ngcontent-%COMP%] {\n padding: 12px;\n gap: 12px;\n }\n \n .item-icon[_ngcontent-%COMP%] {\n width: 36px;\n height: 36px;\n }\n \n .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 16px;\n }\n \n .item-title[_ngcontent-%COMP%] {\n font-size: 15px;\n }\n \n .item-preview[_ngcontent-%COMP%] {\n font-size: 13px;\n }\n \n .item-meta[_ngcontent-%COMP%] {\n gap: 8px;\n }\n \n \n\n .timeline-item[_ngcontent-%COMP%] {\n padding: 12px;\n gap: 12px;\n }\n \n .timeline-marker[_ngcontent-%COMP%] {\n width: 28px;\n height: 28px;\n }\n \n .timeline-marker[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n }\n \n .timeline-title[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .timeline-date[_ngcontent-%COMP%] {\n align-self: flex-start;\n }\n \n \n\n .form-fields-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 16px;\n }\n \n \n\n .cards-container[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}\n\n\n\n.execution-history-panel[_ngcontent-%COMP%] {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar {\n width: 8px;\n}\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 4px;\n}\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n background: #c1c1c1;\n border-radius: 4px;\n}\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n\n\n.execution-history-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.execution-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n overflow: hidden;\n transition: all 0.2s ease;\n cursor: pointer;\n}\n\n.execution-card[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n transform: translateY(-1px);\n}\n\n.execution-card.expanded[_ngcontent-%COMP%] {\n border-color: #2196f3;\n box-shadow: 0 6px 20px rgba(33, 150, 243, 0.15);\n}\n\n.execution-header[_ngcontent-%COMP%] {\n padding: 16px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n}\n\n.execution-left-section[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n\n.execution-status[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n flex-shrink: 0;\n}\n\n.status-indicator[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.status-indicator[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 14px;\n}\n\n.execution-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.execution-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.execution-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n}\n\n.execution-metrics[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n flex-wrap: wrap;\n margin-left: 44px; \n\n}\n\n.metric-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n background: #f8f9fa;\n padding: 6px 10px;\n border-radius: 6px;\n color: #495057;\n white-space: nowrap;\n}\n\n.metric-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 12px;\n}\n\n.metric-label[_ngcontent-%COMP%] {\n font-weight: 500;\n}\n\n.metric-value[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.execution-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.action-btn[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border: none;\n background: #f8f9fa;\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n}\n\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #2196f3;\n color: white;\n transform: translateY(-1px);\n}\n\n.action-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n transition: transform 0.2s ease;\n color: #6c757d;\n margin-right: 4px;\n}\n\n.expand-icon.expanded[_ngcontent-%COMP%] {\n transform: rotate(90deg);\n}\n\n\n\n.execution-expanded-content[_ngcontent-%COMP%] {\n padding: 16px;\n border-top: 1px solid #f0f4f8;\n background: #fafbfc;\n animation: _ngcontent-%COMP%_slideDown 0.2s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n max-height: 0;\n padding-top: 0;\n padding-bottom: 0;\n }\n to {\n opacity: 1;\n max-height: 500px;\n padding-top: 16px;\n padding-bottom: 16px;\n }\n}\n\n.detailed-metrics[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n}\n\n.metrics-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.metric-detail[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n}\n\n.metric-detail[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 16px;\n width: 20px;\n text-align: center;\n}\n\n.metric-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 2px;\n flex: 1;\n}\n\n.metric-title[_ngcontent-%COMP%] {\n font-size: 11px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.metric-data[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #2c3e50;\n}\n\n.result-section[_ngcontent-%COMP%] {\n margin-top: 16px;\n}\n\n.result-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.error-content[_ngcontent-%COMP%] {\n background: #f8d7da;\n border: 1px solid #f5c6cb;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #721c24;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 150px;\n overflow-y: auto;\n}\n\n\n\n@media (max-width: 768px) {\n .execution-header[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .execution-left-section[_ngcontent-%COMP%] {\n width: 100%;\n }\n \n .execution-metrics[_ngcontent-%COMP%] {\n margin-left: 0; \n\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n }\n \n .metric-item[_ngcontent-%COMP%] {\n font-size: 11px;\n padding: 4px 8px;\n }\n \n .metrics-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}\n\n\n\n.payload-section[_ngcontent-%COMP%] {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.payload-section-title[_ngcontent-%COMP%] {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.payload-section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n\n\n.payload-field-container[_ngcontent-%COMP%] {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-field-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.payload-field-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.5;\n margin: 0;\n}\n\n.payload-field-input[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-example[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.85rem;\n color: #6c757d;\n background: #f8f9fa;\n padding: 0.5rem 0.75rem;\n border-radius: 6px;\n border: 1px solid #e9ecef;\n}\n\n.payload-field-example[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #ffc107;\n font-size: 0.9rem;\n}\n\n.payload-field-example[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #e9ecef;\n padding: 0.2rem 0.4rem;\n border-radius: 4px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8rem;\n color: #495057;\n}\n\n\n\n.payload-paths-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n}\n\n.payload-path-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.payload-path-card[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.payload-path-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.payload-path-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.payload-path-icon.downstream[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #28a745, #20c997);\n}\n\n.payload-path-icon.upstream[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #007bff, #6610f2);\n}\n\n.payload-path-icon.self-read[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #17a2b8, #20c997);\n}\n\n.payload-path-icon.self-write[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffc107, #fd7e14);\n}\n\n.payload-path-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 1.2rem;\n}\n\n.payload-path-info[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.payload-path-info[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-content[_ngcontent-%COMP%] {\n padding: 1rem;\n}\n\n.json-editor-container[_ngcontent-%COMP%] {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n margin-bottom: 0.75rem;\n}\n\n.json-editor-container[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n}\n\n.payload-path-hint[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-hint[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.payload-path-hint[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n\n\n.payload-validation-container[_ngcontent-%COMP%] {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-validation-settings[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n.validation-field-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.validation-field-label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.validation-field-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0 0 0.5rem 0;\n}\n\n.payload-validation-schema[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n}\n\n.validation-schema-label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.validation-schema-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n}\n\n.validation-schema-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0;\n}\n\n.validation-schema-editor[_ngcontent-%COMP%] {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.validation-schema-editor[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n}\n\n\n\n.config-section[_ngcontent-%COMP%] {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.config-section-title[_ngcontent-%COMP%] {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.config-section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n.config-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n width: 100%;\n}\n\n.config-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.config-card[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.config-card.full-width[_ngcontent-%COMP%] {\n grid-column: 1 / -1;\n}\n\n.config-card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.config-card-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n background: linear-gradient(135deg, #2196f3, #1976d2);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.config-card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 1.2rem;\n}\n\n.config-card-info[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.config-card-info[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.config-card-content[_ngcontent-%COMP%] {\n padding: 1rem;\n}\n\n\n\n.config-field-input[_ngcontent-%COMP%] {\n width: 100%;\n min-width: 250px;\n}\n\n\n\n.config-card-content[_ngcontent-%COMP%] kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-field-display[_ngcontent-%COMP%] {\n color: #495057;\n font-size: 14px;\n font-weight: 500;\n padding: 8px 0;\n display: block;\n min-height: 20px;\n}\n\n\n\n.prompt-selector-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n width: 100%;\n}\n\n.prompt-display[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 6px;\n}\n\n.prompt-name[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 500;\n font-size: 14px;\n}\n\n.no-prompt[_ngcontent-%COMP%] {\n color: #6c757d;\n font-style: italic;\n font-size: 14px;\n}\n\n.prompt-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.prompt-select-btn[_ngcontent-%COMP%] {\n white-space: nowrap;\n}\n\n.prompt-clear-btn[_ngcontent-%COMP%] {\n min-width: 32px;\n}\n\n.config-card-hint[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n margin-top: 0.5rem;\n}\n\n.config-card-hint[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.config-card-hint[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n\n\n\n@media (max-width: 768px) {\n .payload-field-container[_ngcontent-%COMP%], \n .payload-validation-container[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 1rem;\n }\n \n .payload-paths-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .config-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .payload-section-title[_ngcontent-%COMP%], \n .config-section-title[_ngcontent-%COMP%] {\n padding: 0.75rem 1rem;\n font-size: 1rem;\n }\n \n .payload-path-header[_ngcontent-%COMP%], \n .config-card-header[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n \n .payload-path-content[_ngcontent-%COMP%], \n .config-card-content[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n \n .payload-field-container[_ngcontent-%COMP%], \n .payload-validation-container[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n}"] }); }
3706
+ } }, dependencies: [i6.NgIf, i7.ɵNgNoValidate, i7.NgControlStatus, i7.NgControlStatusGroup, i7.NgModel, i7.NgForm, i8.PanelBarComponent, i8.PanelBarItemComponent, i8.PanelBarContentDirective, i8.PanelBarItemTitleDirective, i3.DialogContainerDirective, i3.WindowContainerDirective, i9.TextBoxComponent, i10.DropDownListComponent, i11.ButtonComponent, i12.MJFormField, i13.FormToolbarComponent, i14.CodeEditorComponent, i6.DatePipe], styles: ["\n\n.record-form-container[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #f5f7fa;\n}\n\n.record-form[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n\n\n.agent-header[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);\n border-bottom: 1px solid #e0e6ed;\n padding: 12px 20px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.agent-header-content[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 20px;\n}\n\n.agent-overview[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n flex: 1;\n min-width: 0;\n}\n\n.agent-icon-wrapper[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.2);\n flex-shrink: 0;\n}\n\n.agent-icon-wrapper[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 24px;\n}\n\n.agent-icon-wrapper[_ngcontent-%COMP%] img.agent-logo[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 8px;\n}\n\n.agent-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name[_ngcontent-%COMP%] {\n font-size: 22px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n line-height: 1.2;\n}\n\n.agent-name-input[_ngcontent-%COMP%] {\n font-size: 18px !important;\n font-weight: 500 !important;\n height: 36px !important;\n width: 100% !important;\n max-width: 400px !important;\n}\n\n.agent-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n padding: 6px 16px;\n border-radius: 20px;\n font-size: 13px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n}\n\n.status-badge.active[_ngcontent-%COMP%] {\n background: #28a745;\n color: white;\n}\n\n.status-badge.pending[_ngcontent-%COMP%] {\n background: #ffc107;\n color: #212529;\n}\n\n.status-badge.disabled[_ngcontent-%COMP%] {\n background: #6c757d;\n color: white;\n}\n\n.execution-mode[_ngcontent-%COMP%], \n.parent-agent[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 10px;\n border-radius: 12px;\n}\n\n.execution-mode[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.parent-agent[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n opacity: 0.8;\n}\n\n\n\n.prompt-controls[_ngcontent-%COMP%] {\n flex: 1;\n margin-right: 16px;\n}\n\n.agent-meta-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 24px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.meta-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.meta-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n.agent-description[_ngcontent-%COMP%] {\n margin-top: 16px;\n color: #6c757d;\n line-height: 1.6;\n font-size: 15px;\n}\n\n.agent-description-input[_ngcontent-%COMP%] {\n width: 100%;\n max-width: 600px;\n min-height: 80px;\n resize: vertical;\n}\n\n\n\n.agent-actions[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.action-buttons-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.action-button[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 20px;\n border-radius: 8px;\n font-weight: 500;\n font-size: 14px;\n transition: all 0.2s ease;\n box-shadow: 0 2px 4px rgba(0,0,0,0.08);\n}\n\n.action-button[_ngcontent-%COMP%]:hover {\n transform: translateY(-1px);\n box-shadow: 0 4px 8px rgba(0,0,0,0.12);\n}\n\n.action-button.primary[_ngcontent-%COMP%] {\n background: #2196f3;\n color: white;\n}\n\n.action-button.primary[_ngcontent-%COMP%]:hover {\n background: #1976d2;\n}\n\n.action-button.secondary[_ngcontent-%COMP%] {\n background: #6c757d;\n color: white;\n}\n\n.action-button.secondary[_ngcontent-%COMP%]:hover {\n background: #5a6268;\n}\n\n.action-warnings[_ngcontent-%COMP%] {\n margin-top: 8px;\n font-size: 13px;\n color: #dc3545;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n\n\n.form-content[_ngcontent-%COMP%] {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n overflow-x: hidden;\n background: #f5f7fa;\n padding: 12px;\n}\n\n\n\n .k-panelbar {\n border: none;\n background: transparent;\n}\n\n .k-panelbar > .k-panelbar-item {\n border: none;\n border-radius: 12px;\n margin-bottom: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n background: white;\n overflow: hidden;\n}\n\n .k-panelbar > .k-panelbar-item > .k-header {\n background: white;\n border: none;\n padding: 16px 20px;\n border-radius: 12px 12px 0 0;\n color: #2c3e50;\n font-weight: 600;\n font-size: 16px;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n .k-panelbar > .k-panelbar-item > .k-header:hover {\n background: #f8f9fa;\n}\n\n .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header {\n background: #2196f3;\n color: white;\n border-radius: 12px 12px 0 0;\n}\n\n .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle {\n position: absolute;\n right: 24px;\n color: inherit;\n font-size: 14px;\n transition: transform 0.2s ease;\n}\n\n .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header .k-panelbar-toggle {\n transform: rotate(180deg);\n}\n\n .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle::before {\n content: '\\f107';\n font-family: 'Font Awesome 6 Free';\n font-weight: 900;\n}\n\n .k-panelbar > .k-panelbar-item > .k-content {\n padding: 0;\n border: none;\n background: white;\n border-radius: 0 0 12px 12px;\n}\n\n .k-panelbar .k-header .k-panelbar-icon {\n font-size: 18px;\n color: #2196f3;\n margin-right: 8px;\n}\n\n .k-panelbar .k-panelbar-expanded .k-header .k-panelbar-icon {\n color: white;\n}\n\n\n\n.panel-content[_ngcontent-%COMP%] {\n padding: 16px;\n background: white;\n}\n\n.section-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.section-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-bottom: 16px;\n}\n\n.header-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-shrink: 0;\n}\n\n.tab-section[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n padding: 24px;\n margin-bottom: 24px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n}\n\n.section-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n padding-bottom: 16px;\n border-bottom: 2px solid #f0f4f8;\n}\n\n.section-title[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n margin: 0;\n color: #2c3e50;\n font-size: 18px;\n font-weight: 600;\n}\n\n.section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 20px;\n}\n\n.section-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-top: 8px;\n}\n\n\n\n.form-fields-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 20px;\n margin-top: 20px;\n}\n\n.form-field-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.form-field-label[_ngcontent-%COMP%] {\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n\n\n.sub-grid-container[_ngcontent-%COMP%] {\n height: 500px;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n display: none; \n\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\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;\n}\n\n\n\n.loading-overlay[_ngcontent-%COMP%] {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(255, 255, 255, 0.9);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n}\n\n.spinner-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border: 4px solid #f3f3f3;\n border-top: 4px solid #2196f3;\n border-radius: 50%;\n animation: _ngcontent-%COMP%_spin 1s linear infinite;\n}\n\n@keyframes _ngcontent-%COMP%_spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n\n\n.quick-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n}\n\n.quick-action-card[_ngcontent-%COMP%] {\n flex: 1;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n border: 1px solid #e0e6ed;\n cursor: pointer;\n transition: all 0.2s ease;\n text-align: center;\n}\n\n.quick-action-card[_ngcontent-%COMP%]:hover {\n background: white;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.quick-action-icon[_ngcontent-%COMP%] {\n font-size: 32px;\n color: #2196f3;\n margin-bottom: 8px;\n}\n\n.quick-action-title[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 4px;\n}\n\n.quick-action-description[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n}\n\n\n\n.header-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n\n\n\n.entity-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.entity-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-1px);\n}\n\n.item-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.prompt-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.sub-agent-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.model-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #6f42c1, #563d7c);\n}\n\n.learning-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #e83e8c, #dc3545);\n}\n\n.note-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #fd7e14, #e55a00);\n}\n\n.item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 18px;\n}\n\n.prompt-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.action-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.sub-agent-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.model-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.learning-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.note-item[_ngcontent-%COMP%] .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n}\n\n.item-icon[_ngcontent-%COMP%] img.sub-agent-logo[_ngcontent-%COMP%] {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 6px;\n}\n\n.item-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.item-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n}\n\n.item-preview[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n margin: 4px 0 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.item-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.meta-tag[_ngcontent-%COMP%], \n.priority-tag[_ngcontent-%COMP%], \n.status-tag[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n padding: 3px 8px;\n border-radius: 6px;\n font-weight: 500;\n}\n\n.meta-tag[_ngcontent-%COMP%] {\n background: #e9ecef;\n color: #495057;\n}\n\n.priority-tag[_ngcontent-%COMP%] {\n color: white;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n.status-tag[_ngcontent-%COMP%] {\n background: #e9ecef;\n color: #495057;\n}\n\n.status-tag.active[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #28a745;\n}\n\n.status-tag.inactive[_ngcontent-%COMP%] {\n background: #f8d7da;\n color: #dc3545;\n}\n\n.item-actions[_ngcontent-%COMP%] {\n opacity: 0;\n transition: opacity 0.2s ease;\n color: #6c757d;\n font-size: 16px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover .item-actions[_ngcontent-%COMP%] {\n opacity: 1;\n}\n\n.entity-item[_ngcontent-%COMP%]:hover .item-actions[_ngcontent-%COMP%] > i[_ngcontent-%COMP%] {\n color: #2196f3;\n}\n\n.view-more-item[_ngcontent-%COMP%] {\n padding: 16px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 10px;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-more-item[_ngcontent-%COMP%]:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n color: #2196f3;\n}\n\n\n\n.payload-config-section[_ngcontent-%COMP%], \n.payload-paths-section[_ngcontent-%COMP%], \n.payload-validation-section[_ngcontent-%COMP%] {\n margin-bottom: 32px;\n}\n\n.subsection-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 16px 0;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.subsection-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n}\n\n.subsection-divider[_ngcontent-%COMP%] {\n margin-top: 32px;\n margin-bottom: 16px;\n padding-top: 24px;\n border-top: 1px solid #e0e6ed;\n}\n\n.payload-config-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 16px;\n margin-bottom: 24px;\n}\n\n.payload-field-group[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n}\n\n.payload-field-label[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n}\n\n.payload-field-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 16px;\n}\n\n.field-description[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: normal;\n color: #6c757d;\n margin-left: auto;\n}\n\n\n\n.payload-field-group[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n border: 1px solid #dee2e6;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.payload-field-group[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n}\n\n\n\n.payload-field-group[_ngcontent-%COMP%] mj-form-field[_ngcontent-%COMP%] textarea {\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 13px;\n line-height: 1.5;\n min-height: 120px;\n resize: vertical;\n}\n\n\n\n.execution-history-panel[_ngcontent-%COMP%] {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n\n\n.timeline-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 16px;\n margin-top: 16px;\n}\n\n.timeline-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.timeline-item[_ngcontent-%COMP%]:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.timeline-marker[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 14px;\n}\n\n.timeline-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.timeline-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 16px;\n}\n\n.timeline-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n background: #e9ecef;\n padding: 2px 8px;\n border-radius: 6px;\n white-space: nowrap;\n flex-shrink: 0;\n}\n\n.timeline-meta[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.timeline-preview[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n\n\n.cards-container[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n gap: 20px;\n margin-top: 16px;\n}\n\n.entity-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n padding: 20px;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n position: relative;\n overflow: hidden;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover {\n transform: translateY(-4px);\n box-shadow: 0 8px 24px rgba(0,0,0,0.12);\n border-color: #2196f3;\n}\n\n.entity-card[_ngcontent-%COMP%]::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 4px;\n background: linear-gradient(90deg, #2196f3, #42a5f5);\n opacity: 0;\n transition: opacity 0.3s ease;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover::before {\n opacity: 1;\n}\n\n.card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n margin-bottom: 12px;\n}\n\n.card-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.sub-agent-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.prompt-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 18px;\n color: #6c757d;\n}\n\n.sub-agent-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.prompt-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%], \n.action-card[_ngcontent-%COMP%] .card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n}\n\n.card-title-section[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.card-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n word-wrap: break-word;\n}\n\n.card-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.card-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #6c757d;\n padding: 4px 8px;\n background: #f8f9fa;\n border-radius: 6px;\n}\n\n.meta-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 11px;\n opacity: 0.8;\n}\n\n.meta-item.active[_ngcontent-%COMP%] {\n color: #28a745;\n background: #d4edda;\n}\n\n.meta-item.inactive[_ngcontent-%COMP%] {\n color: #dc3545;\n background: #f8d7da;\n}\n\n.card-actions[_ngcontent-%COMP%] {\n opacity: 0;\n transition: opacity 0.3s ease;\n color: #6c757d;\n}\n\n.entity-card[_ngcontent-%COMP%]:hover .card-actions[_ngcontent-%COMP%] {\n opacity: 1;\n color: #2196f3;\n}\n\n\n\n.priority-badge[_ngcontent-%COMP%] {\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 11px;\n font-weight: 600;\n color: white;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n padding: 2px 8px;\n border-radius: 6px;\n font-size: 11px;\n font-weight: 500;\n background: #e9ecef;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n\n\n.view-all-card[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 120px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.view-all-card[_ngcontent-%COMP%]:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n transform: translateY(-2px);\n}\n\n.view-all-content[_ngcontent-%COMP%] {\n text-align: center;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-all-content[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 24px;\n margin-bottom: 8px;\n display: block;\n}\n\n\n\n.timeline-container[_ngcontent-%COMP%] {\n position: relative;\n margin-top: 16px;\n}\n\n.timeline-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n margin-bottom: 24px;\n transition: all 0.3s ease;\n border-radius: 12px;\n padding: 16px;\n background: transparent;\n border: 1px solid transparent;\n}\n\n.timeline-item[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #e0e6ed;\n}\n\n.timeline-item.expanded[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n}\n\n.timeline-item.view-all[_ngcontent-%COMP%] {\n cursor: pointer;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n}\n\n.timeline-item.view-all[_ngcontent-%COMP%]:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n}\n\n.timeline-item[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child {\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-marker[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n position: relative;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker[_ngcontent-%COMP%]::after {\n content: '';\n position: absolute;\n top: 50px;\n left: 50%;\n transform: translateX(-50%);\n width: 2px;\n height: 24px;\n background: #e0e6ed;\n}\n\n.timeline-item[_ngcontent-%COMP%]:last-child .timeline-marker[_ngcontent-%COMP%]::after {\n display: none;\n}\n\n.timeline-marker[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 16px;\n}\n\n.timeline-marker.view-all-marker[_ngcontent-%COMP%] {\n background: #6c757d;\n}\n\n.timeline-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-header[_ngcontent-%COMP%] {\n flex: 1;\n cursor: pointer;\n}\n\n.timeline-header[_ngcontent-%COMP%] > div[_ngcontent-%COMP%]:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 8px;\n gap: 16px;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n transition: transform 0.3s ease;\n margin-right: 8px;\n color: #6c757d;\n}\n\n.expand-icon.expanded[_ngcontent-%COMP%] {\n transform: rotate(90deg);\n}\n\n.timeline-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0;\n line-height: 1.3;\n}\n\n.timeline-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n white-space: nowrap;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n margin-left: auto;\n}\n\n.timeline-preview[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n line-height: 1.5;\n margin-top: 8px;\n padding: 8px 12px;\n background: #f8f9fa;\n border-radius: 6px;\n border: 1px solid #e0e6ed;\n}\n\n.timeline-status[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.execution-time[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n}\n\n.timeline-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n}\n\n.timeline-error[_ngcontent-%COMP%] {\n color: #dc3545;\n font-size: 13px;\n background: #f8d7da;\n padding: 8px 12px;\n border-radius: 6px;\n margin-top: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.timeline-error[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n flex-shrink: 0;\n}\n\n\n\n.timeline-expanded-content[_ngcontent-%COMP%] {\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n animation: _ngcontent-%COMP%_fadeIn 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.result-section[_ngcontent-%COMP%], \n.error-section[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n}\n\n.result-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%], \n.error-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.result-content[_ngcontent-%COMP%], \n.error-content[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #495057;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 200px;\n overflow-y: auto;\n}\n\n\n\n.result-section[_ngcontent-%COMP%] mj-code-editor[_ngcontent-%COMP%] {\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.error-content[_ngcontent-%COMP%] {\n background: #f8d7da;\n border-color: #f5c6cb;\n color: #721c24;\n}\n\n.execution-details[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 16px;\n margin-bottom: 20px;\n}\n\n.detail-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n}\n\n.detail-label[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n min-width: 80px;\n}\n\n.detail-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n word-break: break-all;\n}\n\n.timeline-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.btn-primary[_ngcontent-%COMP%] {\n padding: 8px 16px;\n background: #2196f3;\n color: white;\n border: none;\n border-radius: 8px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n transition: all 0.2s ease;\n}\n\n.btn-primary[_ngcontent-%COMP%]:hover {\n background: #1976d2;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(33, 150, 243, 0.3);\n}\n\n.btn-primary[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n background: #f8f9fa;\n border-radius: 12px;\n border: 2px dashed #dee2e6;\n margin-top: 16px;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\n font-size: 18px;\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 20px auto;\n}\n\n\n\n@media (max-width: 768px) {\n \n\n .agent-header[_ngcontent-%COMP%] {\n padding: 16px;\n }\n \n .agent-header-content[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n }\n \n .agent-overview[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .agent-meta[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .agent-actions[_ngcontent-%COMP%] {\n width: 100%;\n align-self: stretch;\n }\n \n .action-button[_ngcontent-%COMP%] {\n flex: 1;\n justify-content: center;\n }\n \n \n\n .form-content[_ngcontent-%COMP%] {\n padding: 12px;\n }\n \n .k-panelbar > .k-panelbar-item > .k-header {\n padding: 16px 20px;\n font-size: 15px;\n }\n \n .panel-content[_ngcontent-%COMP%] {\n padding: 20px 16px;\n }\n \n .section-header[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .header-actions[_ngcontent-%COMP%] {\n flex-wrap: wrap;\n align-self: stretch;\n }\n \n \n\n .entity-item[_ngcontent-%COMP%] {\n padding: 12px;\n gap: 12px;\n }\n \n .item-icon[_ngcontent-%COMP%] {\n width: 36px;\n height: 36px;\n }\n \n .item-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 16px;\n }\n \n .item-title[_ngcontent-%COMP%] {\n font-size: 15px;\n }\n \n .item-preview[_ngcontent-%COMP%] {\n font-size: 13px;\n }\n \n .item-meta[_ngcontent-%COMP%] {\n gap: 8px;\n }\n \n \n\n .timeline-item[_ngcontent-%COMP%] {\n padding: 12px;\n gap: 12px;\n }\n \n .timeline-marker[_ngcontent-%COMP%] {\n width: 28px;\n height: 28px;\n }\n \n .timeline-marker[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n }\n \n .timeline-title[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .timeline-date[_ngcontent-%COMP%] {\n align-self: flex-start;\n }\n \n \n\n .form-fields-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 16px;\n }\n \n \n\n .cards-container[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}\n\n\n\n.execution-history-panel[_ngcontent-%COMP%] {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar {\n width: 8px;\n}\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 4px;\n}\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n background: #c1c1c1;\n border-radius: 4px;\n}\n\n.execution-history-panel[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n\n\n.execution-history-list[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.execution-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n overflow: hidden;\n transition: all 0.2s ease;\n cursor: pointer;\n}\n\n.execution-card[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n transform: translateY(-1px);\n}\n\n.execution-card.expanded[_ngcontent-%COMP%] {\n border-color: #2196f3;\n box-shadow: 0 6px 20px rgba(33, 150, 243, 0.15);\n}\n\n.execution-header[_ngcontent-%COMP%] {\n padding: 16px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n}\n\n.execution-left-section[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n\n.execution-status[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n flex-shrink: 0;\n}\n\n.status-indicator[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.status-indicator[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 14px;\n}\n\n.execution-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.execution-title[_ngcontent-%COMP%] {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.execution-date[_ngcontent-%COMP%] {\n font-size: 12px;\n color: #6c757d;\n}\n\n.execution-metrics[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n flex-wrap: wrap;\n margin-left: 44px; \n\n}\n\n.metric-item[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n background: #f8f9fa;\n padding: 6px 10px;\n border-radius: 6px;\n color: #495057;\n white-space: nowrap;\n}\n\n.metric-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 12px;\n}\n\n.metric-label[_ngcontent-%COMP%] {\n font-weight: 500;\n}\n\n.metric-value[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.execution-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.action-btn[_ngcontent-%COMP%] {\n width: 32px;\n height: 32px;\n border: none;\n background: #f8f9fa;\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n}\n\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #2196f3;\n color: white;\n transform: translateY(-1px);\n}\n\n.action-btn[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n transition: transform 0.2s ease;\n color: #6c757d;\n margin-right: 4px;\n}\n\n.expand-icon.expanded[_ngcontent-%COMP%] {\n transform: rotate(90deg);\n}\n\n\n\n.execution-expanded-content[_ngcontent-%COMP%] {\n padding: 16px;\n border-top: 1px solid #f0f4f8;\n background: #fafbfc;\n animation: _ngcontent-%COMP%_slideDown 0.2s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n max-height: 0;\n padding-top: 0;\n padding-bottom: 0;\n }\n to {\n opacity: 1;\n max-height: 500px;\n padding-top: 16px;\n padding-bottom: 16px;\n }\n}\n\n.detailed-metrics[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n}\n\n.metrics-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.metric-detail[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n}\n\n.metric-detail[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 16px;\n width: 20px;\n text-align: center;\n}\n\n.metric-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 2px;\n flex: 1;\n}\n\n.metric-title[_ngcontent-%COMP%] {\n font-size: 11px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.metric-data[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #2c3e50;\n}\n\n.result-section[_ngcontent-%COMP%] {\n margin-top: 16px;\n}\n\n.result-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section[_ngcontent-%COMP%] h5[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.error-content[_ngcontent-%COMP%] {\n background: #f8d7da;\n border: 1px solid #f5c6cb;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #721c24;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 150px;\n overflow-y: auto;\n}\n\n\n\n@media (max-width: 768px) {\n .execution-header[_ngcontent-%COMP%] {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .execution-left-section[_ngcontent-%COMP%] {\n width: 100%;\n }\n \n .execution-metrics[_ngcontent-%COMP%] {\n margin-left: 0; \n\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n }\n \n .metric-item[_ngcontent-%COMP%] {\n font-size: 11px;\n padding: 4px 8px;\n }\n \n .metrics-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}\n\n\n\n.payload-section[_ngcontent-%COMP%] {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.payload-section-title[_ngcontent-%COMP%] {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.payload-section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n\n\n.payload-field-container[_ngcontent-%COMP%] {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-field-info[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.payload-field-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.5;\n margin: 0;\n}\n\n.payload-field-input[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-example[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.85rem;\n color: #6c757d;\n background: #f8f9fa;\n padding: 0.5rem 0.75rem;\n border-radius: 6px;\n border: 1px solid #e9ecef;\n}\n\n.payload-field-example[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #ffc107;\n font-size: 0.9rem;\n}\n\n.payload-field-example[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #e9ecef;\n padding: 0.2rem 0.4rem;\n border-radius: 4px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8rem;\n color: #495057;\n}\n\n\n\n.payload-paths-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n}\n\n.payload-path-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.payload-path-card[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.payload-path-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.payload-path-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.payload-path-icon.downstream[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #28a745, #20c997);\n}\n\n.payload-path-icon.upstream[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #007bff, #6610f2);\n}\n\n.payload-path-icon.self-read[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #17a2b8, #20c997);\n}\n\n.payload-path-icon.self-write[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #ffc107, #fd7e14);\n}\n\n.payload-path-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 1.2rem;\n}\n\n.payload-path-info[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.payload-path-info[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-content[_ngcontent-%COMP%] {\n padding: 1rem;\n}\n\n.json-editor-container[_ngcontent-%COMP%] {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n margin-bottom: 0.75rem;\n}\n\n.json-editor-container[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n}\n\n.payload-path-hint[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-hint[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.payload-path-hint[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n\n\n.payload-validation-container[_ngcontent-%COMP%] {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-validation-settings[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n.validation-field-group[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.validation-field-label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.validation-field-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0 0 0.5rem 0;\n}\n\n.payload-validation-schema[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n}\n\n.validation-schema-label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.validation-schema-label[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n}\n\n.validation-schema-description[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0;\n}\n\n.validation-schema-editor[_ngcontent-%COMP%] {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.validation-schema-editor[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n}\n\n\n\n.config-section[_ngcontent-%COMP%] {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.config-section-title[_ngcontent-%COMP%] {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.config-section-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n.config-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n width: 100%;\n}\n\n.config-card[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.config-card[_ngcontent-%COMP%]:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.config-card.full-width[_ngcontent-%COMP%] {\n grid-column: 1 / -1;\n}\n\n.config-card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.config-card-icon[_ngcontent-%COMP%] {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n background: linear-gradient(135deg, #2196f3, #1976d2);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.config-card-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 1.2rem;\n}\n\n.config-card-info[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.config-card-info[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.config-card-content[_ngcontent-%COMP%] {\n padding: 1rem;\n}\n\n\n\n.config-field-input[_ngcontent-%COMP%] {\n width: 100%;\n min-width: 250px;\n}\n\n\n\n.config-card-content[_ngcontent-%COMP%] kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content[_ngcontent-%COMP%] mj-form-field kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-field-display[_ngcontent-%COMP%] {\n color: #495057;\n font-size: 14px;\n font-weight: 500;\n padding: 8px 0;\n display: block;\n min-height: 20px;\n}\n\n\n\n.prompt-selector-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n width: 100%;\n}\n\n.prompt-display[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 6px;\n}\n\n.prompt-name[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 500;\n font-size: 14px;\n}\n\n.no-prompt[_ngcontent-%COMP%] {\n color: #6c757d;\n font-style: italic;\n font-size: 14px;\n}\n\n.prompt-actions[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.prompt-select-btn[_ngcontent-%COMP%] {\n white-space: nowrap;\n}\n\n.prompt-clear-btn[_ngcontent-%COMP%] {\n min-width: 32px;\n}\n\n.config-card-hint[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n margin-top: 0.5rem;\n}\n\n.config-card-hint[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.config-card-hint[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n\n\n\n@media (max-width: 768px) {\n .payload-field-container[_ngcontent-%COMP%], \n .payload-validation-container[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 1rem;\n }\n \n .payload-paths-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .config-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .payload-section-title[_ngcontent-%COMP%], \n .config-section-title[_ngcontent-%COMP%] {\n padding: 0.75rem 1rem;\n font-size: 1rem;\n }\n \n .payload-path-header[_ngcontent-%COMP%], \n .config-card-header[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n \n .payload-path-content[_ngcontent-%COMP%], \n .config-card-content[_ngcontent-%COMP%] {\n padding: 0.75rem;\n }\n \n .payload-field-container[_ngcontent-%COMP%], \n .payload-validation-container[_ngcontent-%COMP%] {\n padding: 1rem;\n }\n}"] }); }
3707
3707
  };
3708
3708
  AIAgentFormComponentExtended = __decorate([
3709
3709
  RegisterClass(BaseFormComponent, 'AI Agents')
@@ -3711,7 +3711,7 @@ AIAgentFormComponentExtended = __decorate([
3711
3711
  export { AIAgentFormComponentExtended };
3712
3712
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AIAgentFormComponentExtended, [{
3713
3713
  type: Component,
3714
- args: [{ selector: 'mj-ai-agent-form', template: "<div class=\"record-form-container\">\n <!-- Dialog container for Kendo dialogs -->\n <div kendoDialogContainer></div>\n <form *ngIf=\"record\" class=\"record-form\" #form=\"ngForm\">\n <mj-form-toolbar [form]=\"this\"></mj-form-toolbar>\n\n <!-- Compact Header with Agent Overview -->\n <div class=\"agent-header\">\n <div class=\"agent-header-content\">\n <div class=\"agent-overview\">\n <div class=\"agent-icon-wrapper\">\n @if (hasLogoURL()) {\n <img [src]=\"record.LogoURL\" [alt]=\"record.Name + ' logo'\" class=\"agent-logo\">\n } @else {\n <i [class]=\"getAgentIcon()\"></i>\n }\n </div>\n <div class=\"agent-info\">\n @if (EditMode) {\n <kendo-textbox [(ngModel)]=\"record.Name\" \n name=\"agentName\"\n placeholder=\"Enter agent name...\"\n class=\"agent-name-input\">\n </kendo-textbox>\n } @else {\n <h1 class=\"agent-name\">{{ record.Name || 'Untitled AI Agent' }}</h1>\n }\n <div class=\"agent-meta\">\n @if (record.Status) {\n <span class=\"status-badge\" [style.background-color]=\"getStatusBadgeColor()\">\n <i class=\"fa-solid fa-circle\"></i>\n {{ record.Status }}\n </span>\n }\n @if (record.Type) {\n <span class=\"execution-mode\">\n Agent Type: {{ record.Type }}\n </span>\n }\n @if (record.Parent) {\n <span class=\"parent-agent\">\n <i class=\"fa-solid fa-sitemap\"></i>\n Child of {{ record.Parent }}\n </span>\n }\n </div>\n </div>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"agent-actions\">\n @if (record.ID) {\n <button kendoButton themeColor=\"primary\" size=\"large\"\n (click)=\"openTestHarness()\"\n [disabled]=\"record.Status !== 'Active'\"\n title=\"Run this AI agent\">\n <i class=\"fa-solid fa-play\"></i>\n Run\n </button>\n }\n <button kendoButton fillMode=\"outline\" size=\"small\" (click)=\"refreshRelatedData()\" title=\"Refresh all data\">\n <i class=\"fa-solid fa-refresh\"></i>\n </button>\n </div>\n </div>\n </div>\n\n <!-- Single Pane Layout with Expander Panels -->\n <div class=\"form-content\">\n <kendo-panelbar [keepItemContent]=\"true\">\n <!-- Custom Agent Type Section (if defined) -->\n @if (record.ID && agentType && agentType.UIFormSectionKey) {\n <kendo-panelbar-item \n [expanded]=\"agentType.UIFormSectionExpandedByDefault\" \n (stateChange)=\"onCustomSectionStateChange($event)\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-puzzle-piece\"></i> {{ agentType.Name }} Configuration\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content custom-agent-type-section\" [style.display]=\"'block'\">\n <ng-container #customSectionContainer></ng-container>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Requests & History -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-history\"></i> Execution History{{ executionHistoryCount > 0 ? ' (' + executionHistoryCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content execution-history-panel\">\n \n @if (executionHistoryCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-history\"></i>\n <h4>No Execution History</h4>\n <p>This agent hasn't been executed yet. Use the Test Agent button to run the agent and see execution history here.</p>\n </div>\n } @else {\n <div class=\"execution-history-list\">\n @for (execution of recentExecutions; track execution.ID) {\n <div class=\"execution-card\" [class.expanded]=\"expandedExecutions[execution.ID]\">\n <div class=\"execution-header\" (click)=\"toggleExecutionExpanded(execution.ID)\">\n <div class=\"execution-left-section\">\n <div class=\"execution-status\">\n <div class=\"status-indicator\" [style.background-color]=\"getExecutionStatusColor(execution.Status)\">\n <i [class]=\"getExecutionStatusIcon(execution.Status)\"></i>\n </div>\n <div class=\"execution-info\">\n <div class=\"execution-title\">\n <i class=\"fa-solid fa-chevron-right expand-icon\" [class.expanded]=\"expandedExecutions[execution.ID]\"></i>\n Execution #{{ execution.ID.substring(0, 8) }}\n </div>\n <div class=\"execution-date\">{{ execution.__mj_CreatedAt | date:'MMM d, h:mm a' }}</div>\n </div>\n </div>\n \n <div class=\"execution-metrics\">\n @if (execution.Configuration) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-cog\"></i>\n <span class=\"metric-label\">Config:</span>\n <span class=\"metric-value\">{{ execution.Configuration }}</span>\n </div>\n }\n \n @if (execution.CompletedAt) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-stopwatch\"></i>\n <span class=\"metric-label\">Duration:</span>\n <span class=\"metric-value\">{{ formatExecutionTimeFromDates(execution.StartedAt, execution.CompletedAt) }}</span>\n </div>\n } @else if (execution.Status === 'Running') {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-clock\"></i>\n <span class=\"metric-label\">Running:</span>\n <span class=\"metric-value\">{{ getRunningTime(execution.StartedAt) }}</span>\n </div>\n }\n \n @if (execution.TotalTokensUsedRollup || execution.TotalTokensUsed) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-microchip\"></i>\n <span class=\"metric-label\">Tokens:</span>\n <span class=\"metric-value\">{{ formatTokenCount(execution.TotalTokensUsedRollup || execution.TotalTokensUsed) }}</span>\n </div>\n }\n \n @if (execution.TotalCostRollup || execution.TotalCost) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-dollar-sign\"></i>\n <span class=\"metric-label\">Cost:</span>\n <span class=\"metric-value\">${{ formatCost(execution.TotalCostRollup || execution.TotalCost) }}</span>\n </div>\n }\n </div>\n </div>\n \n <div class=\"execution-actions\">\n <button class=\"action-btn\" (click)=\"openExecutionRecord(execution.ID); $event.stopPropagation()\" title=\"View details\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n </button>\n </div>\n </div>\n @if (expandedExecutions[execution.ID]) {\n <div class=\"execution-expanded-content\">\n <!-- Detailed Metrics -->\n <div class=\"detailed-metrics\">\n <div class=\"metrics-grid\">\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-clock\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Started</span>\n <span class=\"metric-data\">{{ execution.StartedAt | date:'medium' }}</span>\n </div>\n </div>\n \n @if (execution.CompletedAt) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-check-circle\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Completed</span>\n <span class=\"metric-data\">{{ execution.CompletedAt | date:'medium' }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalTokensUsed) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-microchip\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Direct Tokens</span>\n <span class=\"metric-data\">{{ formatTokenCount(execution.TotalTokensUsed) }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalTokensUsedRollup && execution.TotalTokensUsedRollup !== execution.TotalTokensUsed) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-sitemap\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Total + Sub-agents</span>\n <span class=\"metric-data\">{{ formatTokenCount(execution.TotalTokensUsedRollup) }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalCost) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-dollar-sign\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Direct Cost</span>\n <span class=\"metric-data\">${{ formatCost(execution.TotalCost) }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalCostRollup && execution.TotalCostRollup !== execution.TotalCost) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-calculator\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Total + Sub-agents</span>\n <span class=\"metric-data\">${{ formatCost(execution.TotalCostRollup) }}</span>\n </div>\n </div>\n }\n \n @if (execution.ConversationID) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-comments\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Conversation</span>\n <span class=\"metric-data\">{{ execution.ConversationID.substring(0, 8) }}...</span>\n </div>\n </div>\n }\n </div>\n </div>\n \n @if (execution.Result) {\n <div class=\"result-section\">\n <h5><i class=\"fa-solid fa-file-text\"></i> Result</h5>\n <mj-code-editor \n [value]=\"getExecutionResultPreview(execution, false)\"\n [readonly]=\"true\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"max-height: 200px; width: 100%;\">\n </mj-code-editor>\n </div>\n }\n \n @if (execution.ErrorMessage) {\n <div class=\"error-section\">\n <h5><i class=\"fa-solid fa-exclamation-triangle\"></i> Error</h5>\n <div class=\"error-content\">{{ execution.ErrorMessage }}</div>\n </div>\n }\n </div>\n }\n </div>\n }\n @if (executionHistoryCount > recentExecutions.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('MJ: AI Agent Runs', '')\">\n <span>View all {{ executionHistoryCount }} executions...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Actions -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-bolt\"></i> Actions{{ actionCount > 0 ? ' (' + actionCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateActions) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"configureActions()\">\n <i class=\"fa-solid fa-plus\"></i> Add Action\n </button>\n }\n </div>\n </div>\n \n @if (actionCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-bolt\"></i>\n <h4>No Actions Configured</h4>\n <p>Add actions to enable this agent to perform specific tasks and operations.</p>\n @if (EditMode && UserCanCreateActions) {\n <button kendoButton themeColor=\"primary\" (click)=\"configureActions()\">\n <i class=\"fa-solid fa-plus\"></i> Configure First Action\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (action of agentActions; track action.ID) {\n <div class=\"entity-item action-item\" (click)=\"navigateToEntity('Actions', action.ID)\">\n <div class=\"item-icon\">\n <i [class]=\"getActionIcon(action)\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ action.Name || 'Untitled Action' }}</div>\n @if (action.Description) {\n <div class=\"item-preview\">{{ action.Description }}</div>\n }\n <div class=\"item-meta\">\n @if (action.Type) {\n <span class=\"meta-tag\">{{ action.Type }}</span>\n }\n <span class=\"status-tag\" [class.active]=\"action.Status==='Active'\" [class.inactive]=\"action.Status!=='Active'\">\n <i class=\"fa-solid\" [class.fa-check-circle]=\"action.Status==='Active'\" [class.fa-times-circle]=\"action.Status!=='Active'\"></i>\n {{ action.Status }}\n </span>\n </div>\n </div>\n <div class=\"item-actions\">\n @if (EditMode && UserCanDeleteActions) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"error\" \n size=\"small\"\n (click)=\"removeAction(action, $event)\"\n title=\"Remove action\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (actionCount > agentActions.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agent Actions', '')\">\n <span>View all {{ actionCount }} actions...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Sub-Agents -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-sitemap\"></i> Sub-Agents{{ subAgentCount > 0 ? ' (' + subAgentCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Manage hierarchical relationships with child agents that work under this agent.\n </div>\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateSubAgents) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"addSubAgents()\">\n <i class=\"fa-solid fa-plus\"></i> Add Subagent\n </button>\n <button kendoButton themeColor=\"secondary\" size=\"small\" (click)=\"createSubAgent()\">\n <i class=\"fa-solid fa-plus\"></i> Create Sub-Agent\n </button>\n }\n </div>\n </div>\n \n @if (subAgentCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-sitemap\"></i>\n <h4>No Sub-Agents</h4>\n <p>Create sub-agents to build a hierarchical structure for complex workflows.</p>\n @if (EditMode && UserCanCreateSubAgents) {\n <button kendoButton themeColor=\"primary\" (click)=\"addSubAgents()\">\n <i class=\"fa-solid fa-plus\"></i> Add Subagent\n </button>\n <button kendoButton themeColor=\"secondary\" (click)=\"createSubAgent()\">\n <i class=\"fa-solid fa-plus\"></i> Create First Sub-Agent\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (subAgent of subAgents; track subAgent.ID) {\n <div class=\"entity-item sub-agent-item\" (click)=\"navigateToEntity('AI Agents', subAgent.ID)\">\n <div class=\"item-icon\">\n @if (hasSubAgentLogoURL(subAgent)) {\n <img [src]=\"subAgent.LogoURL\" [alt]=\"subAgent.Name + ' logo'\" class=\"sub-agent-logo\">\n } @else {\n <i [class]=\"getSubAgentIcon(subAgent)\"></i>\n }\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ subAgent.Name || 'Untitled Sub-Agent' }}</div>\n @if (subAgent.Description) {\n <div class=\"item-preview\">{{ subAgent.Description }}</div>\n }\n <div class=\"item-meta\">\n @if (subAgent.Status) {\n <span class=\"status-tag\" [style.background-color]=\"getStatusBadgeColor()\">\n {{ subAgent.Status }}\n </span>\n }\n @if (subAgent.ExecutionMode) {\n <span class=\"meta-tag\">{{ subAgent.ExecutionMode }}</span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n @if (EditMode && UserCanCreateSubAgents) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"primary\" \n size=\"small\"\n (click)=\"openSubAgentAdvancedSettings(subAgent, $event)\"\n title=\"Advanced settings\">\n <i class=\"fa-solid fa-cog\"></i>\n </button>\n }\n @if (EditMode && UserCanDeleteSubAgents) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"error\" \n size=\"small\"\n (click)=\"removeSubAgent(subAgent, $event)\"\n title=\"Remove sub-agent\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (subAgentCount > subAgents.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agents', '')\">\n <span>View all {{ subAgentCount }} sub-agents...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Prompts (With Model Selection) -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-comments\"></i> Prompts{{ promptCount > 0 ? ' (' + promptCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"prompt-controls\">\n <!-- Model Selection Mode Control -->\n <div class=\"model-selection-mode\">\n <label class=\"model-selection-label\">\n <i class=\"fa-solid fa-sliders\"></i>\n Model Selection:\n </label>\n @if (EditMode) {\n <kendo-dropdownlist\n [(ngModel)]=\"record.ModelSelectionMode\"\n name=\"modelSelectionMode\"\n [data]=\"modelSelectionModes\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n class=\"model-selection-dropdown\">\n </kendo-dropdownlist>\n } @else {\n <span class=\"model-selection-value\">{{ record.ModelSelectionMode || 'Agent Type' }}</span>\n }\n </div>\n </div>\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateNewPrompts) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"addPrompt()\">\n <i class=\"fa-solid fa-plus\"></i> Add Prompt\n </button>\n }\n </div>\n </div>\n \n @if (promptCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-comments\"></i>\n <h4>No Prompts Configured</h4>\n <p>Add prompts to define how this agent processes requests and generates responses.</p>\n @if (EditMode && UserCanCreateNewPrompts) {\n <button kendoButton themeColor=\"primary\" (click)=\"addPrompt()\">\n <i class=\"fa-solid fa-plus\"></i> Create First Prompt\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (prompt of agentPrompts; track prompt.ID) {\n <div class=\"entity-item prompt-item\" (click)=\"navigateToEntity('AI Prompts', prompt.ID)\">\n <div class=\"item-icon\">\n <i class=\"fa-solid fa-comment-dots\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ prompt.Name }}</div>\n @if (prompt.TemplateText) {\n <div class=\"item-preview\">{{ prompt.TemplateText.substring(0, 120) }}{{ prompt.TemplateText.length > 120 ? '...' : '' }}</div>\n }\n <div class=\"item-meta\">\n @if (prompt.PromptRole) {\n <span class=\"meta-tag\">{{ prompt.PromptRole }}</span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n @if (EditMode && UserCanCreatePrompts) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"primary\" \n size=\"small\"\n (click)=\"openPromptAdvancedSettings(prompt, $event)\"\n title=\"Advanced settings\">\n <i class=\"fa-solid fa-cog\"></i>\n </button>\n }\n @if (EditMode && UserCanDeletePrompts) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"error\" \n size=\"small\"\n (click)=\"removePrompt(prompt, $event)\"\n title=\"Remove prompt\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (promptCount > agentPrompts.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Prompts', '')\">\n <span>View all {{ promptCount }} prompts...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n\n <!-- Learning & Analytics -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-brain\"></i> Learning Cycles{{ learningCycleCount > 0 ? ' (' + learningCycleCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Monitor and manage learning cycles, training sessions, and performance analytics.\n </div>\n </div>\n \n @if (learningCycleCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-brain\"></i>\n <h4>No Learning Cycles</h4>\n <p>Learning cycles will appear here as the agent processes requests and improves over time.</p>\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (cycle of learningCycles; track cycle.ID) {\n <div class=\"entity-item learning-item\" (click)=\"navigateToEntity('AI Agent Learning Cycles', cycle.ID)\">\n <div class=\"item-icon\">\n <i class=\"fa-solid fa-brain\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">Learning Cycle {{ cycle.ID.substring(0, 8) }}</div>\n <div class=\"item-meta\">\n @if (cycle.StartedAt) {\n <span class=\"meta-tag\">\n <i class=\"fa-solid fa-calendar\"></i>\n {{ cycle.StartedAt | date:'short' }}\n </span>\n }\n @if (cycle.Status) {\n <span class=\"status-tag\">{{ cycle.Status }}</span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (learningCycleCount > learningCycles.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agent Learning Cycles', '')\">\n <span>View all {{ learningCycleCount }} cycles...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Notes & Documentation -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-sticky-note\"></i> Notes{{ noteCount > 0 ? ' (' + noteCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Manage notes, documentation, and annotations for this agent.\n </div>\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateNotes) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"addNote()\">\n <i class=\"fa-solid fa-plus\"></i> Add Note\n </button>\n }\n </div>\n </div>\n \n @if (noteCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-sticky-note\"></i>\n <h4>No Notes</h4>\n <p>Add notes to document important information, observations, or instructions for this agent.</p>\n @if (EditMode && UserCanCreateNotes) {\n <button kendoButton themeColor=\"primary\" (click)=\"addNote()\">\n <i class=\"fa-solid fa-plus\"></i> Create First Note\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (note of agentNotes; track note.ID) {\n <div class=\"entity-item note-item\" (click)=\"navigateToEntity('AI Agent Notes', note.ID)\">\n <div class=\"item-icon\">\n <i class=\"fa-solid fa-sticky-note\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ note.Type || 'Note' }}</div>\n @if (note.Note) {\n <div class=\"item-preview\">{{ note.Note.substring(0, 100) }}{{ note.Note.length > 100 ? '...' : '' }}</div>\n }\n <div class=\"item-meta\">\n @if (note.__mj_CreatedAt) {\n <span class=\"meta-tag\">\n <i class=\"fa-solid fa-calendar\"></i>\n {{ note.__mj_CreatedAt | date:'short' }}\n </span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (noteCount > agentNotes.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agent Notes', '')\">\n <span>View all {{ noteCount }} notes...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n\n\n <!-- Payload -->\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-exchange-alt\"></i> Payload Management\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Configure how this agent handles data payloads, path routing, and validation between parent and child agents.\n </div>\n </div>\n \n <!-- Payload Scope Section -->\n <div class=\"payload-section\">\n <h3 class=\"payload-section-title\">\n <i class=\"fa-solid fa-target\"></i>\n Payload Scope\n </h3>\n \n <div class=\"payload-field-container\">\n <div class=\"payload-field-info\">\n <label class=\"payload-field-label\">Payload Scope Path</label>\n <p class=\"payload-field-description\">\n Specify a path within the parent payload that this sub-agent should operate on. \n Leave empty to receive the entire payload.\n </p>\n </div>\n \n <div class=\"payload-field-input\">\n <mj-form-field \n FieldName=\"PayloadScope\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n <div class=\"payload-field-example\">\n <i class=\"fa-solid fa-lightbulb\"></i>\n <span>Example: <code>/customer/profile</code> or <code>/analysis/results</code></span>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Path Configuration Section -->\n <div class=\"payload-section\">\n <h3 class=\"payload-section-title\">\n <i class=\"fa-solid fa-route\"></i>\n Path Configuration\n </h3>\n \n <div class=\"payload-paths-grid\">\n <!-- Downstream Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon downstream\">\n <i class=\"fa-solid fa-arrow-down\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Downstream Paths</h4>\n <p>JSON array of paths to pass to sub-agents</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadDownstreamPaths || '[&quot;*&quot;]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadDownstreamPaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Use <code>[\"*\"]</code> to pass entire payload or specify paths like <code>[\"user.id\", \"order.*\"]</code>\n </div>\n </div>\n </div>\n\n <!-- Upstream Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon upstream\">\n <i class=\"fa-solid fa-arrow-up\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Upstream Paths</h4>\n <p>JSON array of paths sub-agents can write back</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadUpstreamPaths || '[&quot;*&quot;]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadUpstreamPaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Use <code>[\"*\"]</code> to allow all writes or limit to specific paths\n </div>\n </div>\n </div>\n\n <!-- Self Read Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon self-read\">\n <i class=\"fa-solid fa-eye\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Self Read Paths</h4>\n <p>JSON array of paths this agent can read</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadSelfReadPaths || '[]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadSelfReadPaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Paths this agent's prompts can read from the payload\n </div>\n </div>\n </div>\n\n <!-- Self Write Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon self-write\">\n <i class=\"fa-solid fa-pen\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Self Write Paths</h4>\n <p>JSON array of paths this agent can write to</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadSelfWritePaths || '[]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadSelfWritePaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Paths this agent's prompts can write back to the payload\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Validation Section -->\n <div class=\"payload-section\">\n <h3 class=\"payload-section-title\">\n <i class=\"fa-solid fa-shield-check\"></i>\n Final Payload Validation\n </h3>\n \n <div class=\"payload-validation-container\">\n <div class=\"payload-validation-settings\">\n <div class=\"validation-field-group\">\n <label class=\"validation-field-label\">Validation Mode</label>\n <p class=\"validation-field-description\">How to handle validation failures</p>\n <mj-form-field \n FieldName=\"FinalPayloadValidationMode\" \n Type=\"dropdownlist\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n </div>\n \n <div class=\"validation-field-group\">\n <label class=\"validation-field-label\">Max Retries</label>\n <p class=\"validation-field-description\">Maximum validation retry attempts</p>\n <mj-form-field \n FieldName=\"FinalPayloadValidationMaxRetries\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n </div>\n </div>\n \n <div class=\"payload-validation-schema\">\n <label class=\"validation-schema-label\">\n <i class=\"fa-solid fa-code\"></i>\n Validation Schema\n </label>\n <p class=\"validation-schema-description\">\n JSON schema or validation rules for the final payload structure\n </p>\n <div class=\"validation-schema-editor\">\n <mj-code-editor \n [value]=\"record.FinalPayloadValidation || '{}'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 200px; width: 100%;\"\n (valueChange)=\"updatePayloadField('FinalPayloadValidation', $event)\">\n </mj-code-editor>\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n\n\n\n <!-- Execution Guardrails (New Separate Panel) -->\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-shield-halved\"></i> Execution Guardrails\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Set limits to prevent runaway agent executions and control resource usage.\n </div>\n </div>\n \n <div class=\"form-fields-grid\">\n <mj-form-field \n FieldName=\"MaxCostPerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Cost ($)\"\n Description=\"Maximum cost per run\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n\n <mj-form-field \n FieldName=\"MaxTokensPerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Tokens\"\n Description=\"Maximum tokens per run\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n\n <mj-form-field \n FieldName=\"MaxIterationsPerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Iterations\"\n Description=\"Maximum prompt iterations\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n\n <mj-form-field \n FieldName=\"MaxTimePerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Time (seconds)\"\n Description=\"Maximum execution time\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n\n <!-- Configuration (Settings Panel) -->\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-cogs\"></i> Configuration\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Configure agent behavior, execution settings, and advanced features.\n </div>\n </div>\n \n <!-- Identity & Behavior Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-id-card\"></i>\n Identity & Behavior\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-toggle-on\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Agent Status</h4>\n <p>Current availability and operational status</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n @if (EditMode) {\n <kendo-dropdownlist \n [(ngModel)]=\"record.Status\"\n [data]=\"statusOptions\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n name=\"agentStatus\"\n class=\"config-field-input\">\n </kendo-dropdownlist>\n } @else {\n <span class=\"config-field-display\">{{ record.Status || 'Not Set' }}</span>\n }\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-sitemap\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Agent Type</h4>\n <p>Category and system-level behavior</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n @if (EditMode) {\n <kendo-dropdownlist \n [(ngModel)]=\"record.TypeID\"\n [data]=\"agentTypes\"\n textField=\"Name\"\n valueField=\"ID\"\n [valuePrimitive]=\"true\"\n name=\"agentTypeID\"\n class=\"config-field-input\">\n </kendo-dropdownlist>\n } @else {\n <span class=\"config-field-display\">{{ record.Type || 'Not Set' }}</span>\n }\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-bolt\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Expose as Action</h4>\n <p>Make available as an action for other agents</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ExposeAsAction\" \n Type=\"checkbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card full-width\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-align-left\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Description</h4>\n <p>Detailed agent description and purpose</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"Description\" \n Type=\"textarea\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Execution Settings Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-play\"></i>\n Execution Settings\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-layer-group\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Execution Mode</h4>\n <p>How sub-agents are executed</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ExecutionMode\" \n Type=\"dropdownlist\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-sort-numeric-down\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Execution Order</h4>\n <p>Order when run with siblings</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ExecutionOrder\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-tachometer-alt\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Default Effort Level</h4>\n <p>Default effort level for all prompts (1-100)</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"DefaultPromptEffortLevel\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n <div class=\"config-card-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Higher values request more thorough reasoning (1=minimal, 100=maximum)\n </div>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-code\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Driver Class</h4>\n <p>Custom implementation class</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"DriverClass\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Visual Identity Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-palette\"></i>\n Visual Identity\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-icons\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Icon Class</h4>\n <p>Font Awesome icon class</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"IconClass\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n <div class=\"config-card-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Example: <code>fa-solid fa-robot</code>\n </div>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-image\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Logo URL</h4>\n <p>URL for agent logo image</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"LogoURL\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n <div class=\"config-card-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Takes precedence over Icon Class\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Context Compression Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-compress\"></i>\n Context Compression\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card full-width\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-toggle-on\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Enable Context Compression</h4>\n <p>Automatically compress conversation context when message threshold is reached</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"EnableContextCompression\" \n Type=\"checkbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n (valueChange)=\"onContextCompressionToggle($event)\">\n </mj-form-field>\n </div>\n </div>\n\n @if (record.EnableContextCompression) {\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-hashtag\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Message Threshold</h4>\n <p>Messages before compression triggers</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ContextCompressionMessageThreshold\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-save\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Messages to Keep</h4>\n <p>Recent messages to retain uncompressed</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ContextCompressionMessageRetentionCount\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-comment-dots\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Compression Prompt</h4>\n <p>Prompt used for summarization</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n @if (EditMode) {\n <div class=\"prompt-selector-container\">\n <div class=\"prompt-display\">\n @if (selectedContextCompressionPrompt) {\n <span class=\"prompt-name\">{{ selectedContextCompressionPrompt.Name }}</span>\n } @else {\n <span class=\"no-prompt\">No prompt selected</span>\n }\n </div>\n <div class=\"prompt-actions\">\n <button type=\"button\" \n kendoButton \n fillMode=\"outline\" \n size=\"small\"\n (click)=\"openContextCompressionPromptSelector()\"\n class=\"prompt-select-btn\">\n <i class=\"fa-solid fa-search\"></i>\n {{ selectedContextCompressionPrompt ? 'Change' : 'Select' }} Prompt\n </button>\n @if (selectedContextCompressionPrompt) {\n <button type=\"button\" \n kendoButton \n fillMode=\"flat\" \n size=\"small\"\n (click)=\"clearContextCompressionPrompt()\"\n class=\"prompt-clear-btn\"\n title=\"Clear selection\">\n <i class=\"fa-solid fa-times\"></i>\n </button>\n }\n </div>\n </div>\n } @else {\n <span class=\"config-field-display\">{{ selectedContextCompressionPrompt?.Name || record.ContextCompressionPrompt || 'Not Set' }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n\n\n\n\n </kendo-panelbar>\n </div>\n </form>\n\n</div>", styles: ["/* AI Agent Form - Modern Redesign */\n.record-form-container {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #f5f7fa;\n}\n\n.record-form {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n/* Agent Header Section - Compact Design */\n.agent-header {\n background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);\n border-bottom: 1px solid #e0e6ed;\n padding: 12px 20px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.agent-header-content {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 20px;\n}\n\n.agent-overview {\n display: flex;\n align-items: center;\n gap: 16px;\n flex: 1;\n min-width: 0;\n}\n\n.agent-icon-wrapper {\n width: 48px;\n height: 48px;\n background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.2);\n flex-shrink: 0;\n}\n\n.agent-icon-wrapper i {\n color: white;\n font-size: 24px;\n}\n\n.agent-icon-wrapper img.agent-logo {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 8px;\n}\n\n.agent-info {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name {\n font-size: 22px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n line-height: 1.2;\n}\n\n.agent-name-input {\n font-size: 18px !important;\n font-weight: 500 !important;\n height: 36px !important;\n width: 100% !important;\n max-width: 400px !important;\n}\n\n.agent-meta {\n display: flex;\n align-items: center;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.status-badge {\n padding: 6px 16px;\n border-radius: 20px;\n font-size: 13px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n}\n\n.status-badge.active {\n background: #28a745;\n color: white;\n}\n\n.status-badge.pending {\n background: #ffc107;\n color: #212529;\n}\n\n.status-badge.disabled {\n background: #6c757d;\n color: white;\n}\n\n.execution-mode,\n.parent-agent {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 10px;\n border-radius: 12px;\n}\n\n.execution-mode i,\n.parent-agent i {\n font-size: 12px;\n opacity: 0.8;\n}\n\n/* Prompt Controls Section */\n.prompt-controls {\n flex: 1;\n margin-right: 16px;\n}\n\n.agent-meta-info {\n display: flex;\n gap: 24px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.meta-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.meta-value {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n.agent-description {\n margin-top: 16px;\n color: #6c757d;\n line-height: 1.6;\n font-size: 15px;\n}\n\n.agent-description-input {\n width: 100%;\n max-width: 600px;\n min-height: 80px;\n resize: vertical;\n}\n\n/* Action Buttons Section */\n.agent-actions {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.action-buttons-row {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.action-button {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 20px;\n border-radius: 8px;\n font-weight: 500;\n font-size: 14px;\n transition: all 0.2s ease;\n box-shadow: 0 2px 4px rgba(0,0,0,0.08);\n}\n\n.action-button:hover {\n transform: translateY(-1px);\n box-shadow: 0 4px 8px rgba(0,0,0,0.12);\n}\n\n.action-button.primary {\n background: #2196f3;\n color: white;\n}\n\n.action-button.primary:hover {\n background: #1976d2;\n}\n\n.action-button.secondary {\n background: #6c757d;\n color: white;\n}\n\n.action-button.secondary:hover {\n background: #5a6268;\n}\n\n.action-warnings {\n margin-top: 8px;\n font-size: 13px;\n color: #dc3545;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n/* Panel-Based Form Content */\n.form-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n overflow-x: hidden;\n background: #f5f7fa;\n padding: 12px;\n}\n\n/* Kendo PanelBar Styling */\n::ng-deep .k-panelbar {\n border: none;\n background: transparent;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item {\n border: none;\n border-radius: 12px;\n margin-bottom: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n background: white;\n overflow: hidden;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header {\n background: white;\n border: none;\n padding: 16px 20px;\n border-radius: 12px 12px 0 0;\n color: #2c3e50;\n font-weight: 600;\n font-size: 16px;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header:hover {\n background: #f8f9fa;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header {\n background: #2196f3;\n color: white;\n border-radius: 12px 12px 0 0;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle {\n position: absolute;\n right: 24px;\n color: inherit;\n font-size: 14px;\n transition: transform 0.2s ease;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header .k-panelbar-toggle {\n transform: rotate(180deg);\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle::before {\n content: '\\f107';\n font-family: 'Font Awesome 6 Free';\n font-weight: 900;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-content {\n padding: 0;\n border: none;\n background: white;\n border-radius: 0 0 12px 12px;\n}\n\n::ng-deep .k-panelbar .k-header .k-panelbar-icon {\n font-size: 18px;\n color: #2196f3;\n margin-right: 8px;\n}\n\n::ng-deep .k-panelbar .k-panelbar-expanded .k-header .k-panelbar-icon {\n color: white;\n}\n\n/* Panel Content */\n.panel-content {\n padding: 16px;\n background: white;\n}\n\n.section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.section-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-bottom: 16px;\n}\n\n.header-actions {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-shrink: 0;\n}\n\n.tab-section {\n background: white;\n border-radius: 12px;\n padding: 24px;\n margin-bottom: 24px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n}\n\n.section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n padding-bottom: 16px;\n border-bottom: 2px solid #f0f4f8;\n}\n\n.section-title {\n display: flex;\n align-items: center;\n gap: 12px;\n margin: 0;\n color: #2c3e50;\n font-size: 18px;\n font-weight: 600;\n}\n\n.section-title i {\n color: #2196f3;\n font-size: 20px;\n}\n\n.section-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-top: 8px;\n}\n\n/* Form Fields Grid */\n.form-fields-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 20px;\n margin-top: 20px;\n}\n\n.form-field-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.form-field-label {\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n/* Sub-grids styling (legacy) */\n.sub-grid-container {\n height: 500px;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n display: none; /* Hidden as we now use cards */\n}\n\n/* Empty States */\n.empty-state {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n}\n\n.empty-state i {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state h4 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto;\n}\n\n/* Loading State */\n.loading-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(255, 255, 255, 0.9);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n\n.loading-spinner {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n}\n\n.spinner-icon {\n width: 48px;\n height: 48px;\n border: 4px solid #f3f3f3;\n border-top: 4px solid #2196f3;\n border-radius: 50%;\n animation: spin 1s linear infinite;\n}\n\n@keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n/* Quick Actions */\n.quick-actions {\n display: flex;\n gap: 16px;\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n}\n\n.quick-action-card {\n flex: 1;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n border: 1px solid #e0e6ed;\n cursor: pointer;\n transition: all 0.2s ease;\n text-align: center;\n}\n\n.quick-action-card:hover {\n background: white;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.quick-action-icon {\n font-size: 32px;\n color: #2196f3;\n margin-bottom: 8px;\n}\n\n.quick-action-title {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 4px;\n}\n\n.quick-action-description {\n font-size: 12px;\n color: #6c757d;\n}\n\n/* Header Actions */\n.header-actions {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n\n/* Entity List Interface */\n.entity-list {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.entity-item {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.entity-item:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-1px);\n}\n\n.item-icon {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.prompt-item .item-icon {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-item .item-icon {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.sub-agent-item .item-icon {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.model-item .item-icon {\n background: linear-gradient(135deg, #6f42c1, #563d7c);\n}\n\n.learning-item .item-icon {\n background: linear-gradient(135deg, #e83e8c, #dc3545);\n}\n\n.note-item .item-icon {\n background: linear-gradient(135deg, #fd7e14, #e55a00);\n}\n\n.item-icon i {\n color: #6c757d;\n font-size: 18px;\n}\n\n.prompt-item .item-icon i,\n.action-item .item-icon i,\n.sub-agent-item .item-icon i,\n.model-item .item-icon i,\n.learning-item .item-icon i,\n.note-item .item-icon i {\n color: white;\n}\n\n.item-icon img.sub-agent-logo {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 6px;\n}\n\n.item-content {\n flex: 1;\n min-width: 0;\n}\n\n.item-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n}\n\n.item-preview {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n margin: 4px 0 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.item-meta {\n display: flex;\n gap: 12px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.meta-tag,\n.priority-tag,\n.status-tag {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n padding: 3px 8px;\n border-radius: 6px;\n font-weight: 500;\n}\n\n.meta-tag {\n background: #e9ecef;\n color: #495057;\n}\n\n.priority-tag {\n color: white;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n.status-tag {\n background: #e9ecef;\n color: #495057;\n}\n\n.status-tag.active {\n background: #d4edda;\n color: #28a745;\n}\n\n.status-tag.inactive {\n background: #f8d7da;\n color: #dc3545;\n}\n\n.item-actions {\n opacity: 0;\n transition: opacity 0.2s ease;\n color: #6c757d;\n font-size: 16px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.entity-item:hover .item-actions {\n opacity: 1;\n}\n\n.entity-item:hover .item-actions > i {\n color: #2196f3;\n}\n\n.view-more-item {\n padding: 16px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 10px;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-more-item:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n color: #2196f3;\n}\n\n/* Payload Section Styles */\n.payload-config-section,\n.payload-paths-section,\n.payload-validation-section {\n margin-bottom: 32px;\n}\n\n.subsection-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 16px 0;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.subsection-title i {\n color: #2196f3;\n}\n\n.subsection-divider {\n margin-top: 32px;\n margin-bottom: 16px;\n padding-top: 24px;\n border-top: 1px solid #e0e6ed;\n}\n\n.payload-config-grid {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 16px;\n margin-bottom: 24px;\n}\n\n.payload-field-group {\n margin-bottom: 20px;\n}\n\n.payload-field-label {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n}\n\n.payload-field-label i {\n color: #6c757d;\n font-size: 16px;\n}\n\n.field-description {\n font-size: 12px;\n font-weight: normal;\n color: #6c757d;\n margin-left: auto;\n}\n\n/* Code editor styling */\n.payload-field-group mj-code-editor {\n border: 1px solid #dee2e6;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.payload-field-group mj-code-editor:hover {\n border-color: #2196f3;\n}\n\n/* Payload textarea styling */\n.payload-field-group mj-form-field ::ng-deep textarea {\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 13px;\n line-height: 1.5;\n min-height: 120px;\n resize: vertical;\n}\n\n/* Execution History Panel */\n.execution-history-panel {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n/* Timeline List for Execution History */\n.timeline-list {\n display: flex;\n flex-direction: column;\n gap: 16px;\n margin-top: 16px;\n}\n\n.timeline-item {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.timeline-item:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.timeline-marker {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker i {\n color: white;\n font-size: 14px;\n}\n\n.timeline-content {\n flex: 1;\n min-width: 0;\n}\n\n.timeline-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 16px;\n}\n\n.timeline-date {\n font-size: 12px;\n color: #6c757d;\n background: #e9ecef;\n padding: 2px 8px;\n border-radius: 6px;\n white-space: nowrap;\n flex-shrink: 0;\n}\n\n.timeline-meta {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.timeline-preview {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n/* Modern Card-Based Interface (Legacy - Keep for backward compatibility) */\n.cards-container {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n gap: 20px;\n margin-top: 16px;\n}\n\n.entity-card {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n padding: 20px;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n position: relative;\n overflow: hidden;\n}\n\n.entity-card:hover {\n transform: translateY(-4px);\n box-shadow: 0 8px 24px rgba(0,0,0,0.12);\n border-color: #2196f3;\n}\n\n.entity-card::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 4px;\n background: linear-gradient(90deg, #2196f3, #42a5f5);\n opacity: 0;\n transition: opacity 0.3s ease;\n}\n\n.entity-card:hover::before {\n opacity: 1;\n}\n\n.card-header {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n margin-bottom: 12px;\n}\n\n.card-icon {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.sub-agent-card .card-icon {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.prompt-card .card-icon {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-card .card-icon {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.card-icon i {\n font-size: 18px;\n color: #6c757d;\n}\n\n.sub-agent-card .card-icon i,\n.prompt-card .card-icon i,\n.action-card .card-icon i {\n color: white;\n}\n\n.card-title-section {\n flex: 1;\n min-width: 0;\n}\n\n.card-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n word-wrap: break-word;\n}\n\n.card-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.card-meta {\n display: flex;\n gap: 16px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #6c757d;\n padding: 4px 8px;\n background: #f8f9fa;\n border-radius: 6px;\n}\n\n.meta-item i {\n font-size: 11px;\n opacity: 0.8;\n}\n\n.meta-item.active {\n color: #28a745;\n background: #d4edda;\n}\n\n.meta-item.inactive {\n color: #dc3545;\n background: #f8d7da;\n}\n\n.card-actions {\n opacity: 0;\n transition: opacity 0.3s ease;\n color: #6c757d;\n}\n\n.entity-card:hover .card-actions {\n opacity: 1;\n color: #2196f3;\n}\n\n/* Badge Styles */\n.priority-badge {\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 11px;\n font-weight: 600;\n color: white;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.type-badge {\n padding: 2px 8px;\n border-radius: 6px;\n font-size: 11px;\n font-weight: 500;\n background: #e9ecef;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n/* View All Card */\n.view-all-card {\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 120px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.view-all-card:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n transform: translateY(-2px);\n}\n\n.view-all-content {\n text-align: center;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-all-content i {\n font-size: 24px;\n margin-bottom: 8px;\n display: block;\n}\n\n/* Timeline Interface for History */\n.timeline-container {\n position: relative;\n margin-top: 16px;\n}\n\n.timeline-item {\n display: flex;\n flex-direction: column;\n margin-bottom: 24px;\n transition: all 0.3s ease;\n border-radius: 12px;\n padding: 16px;\n background: transparent;\n border: 1px solid transparent;\n}\n\n.timeline-item:hover {\n background: #f8f9fa;\n border-color: #e0e6ed;\n}\n\n.timeline-item.expanded {\n background: #f8f9fa;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n}\n\n.timeline-item.view-all {\n cursor: pointer;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n}\n\n.timeline-item.view-all:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n}\n\n.timeline-item > div:first-child {\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-marker {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n position: relative;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker::after {\n content: '';\n position: absolute;\n top: 50px;\n left: 50%;\n transform: translateX(-50%);\n width: 2px;\n height: 24px;\n background: #e0e6ed;\n}\n\n.timeline-item:last-child .timeline-marker::after {\n display: none;\n}\n\n.timeline-marker i {\n color: white;\n font-size: 16px;\n}\n\n.timeline-marker.view-all-marker {\n background: #6c757d;\n}\n\n.timeline-content {\n flex: 1;\n min-width: 0;\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-header {\n flex: 1;\n cursor: pointer;\n}\n\n.timeline-header > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 8px;\n gap: 16px;\n}\n\n.expand-icon {\n transition: transform 0.3s ease;\n margin-right: 8px;\n color: #6c757d;\n}\n\n.expand-icon.expanded {\n transform: rotate(90deg);\n}\n\n.timeline-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0;\n line-height: 1.3;\n}\n\n.timeline-date {\n font-size: 12px;\n color: #6c757d;\n white-space: nowrap;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n margin-left: auto;\n}\n\n.timeline-preview {\n font-size: 13px;\n color: #6c757d;\n line-height: 1.5;\n margin-top: 8px;\n padding: 8px 12px;\n background: #f8f9fa;\n border-radius: 6px;\n border: 1px solid #e0e6ed;\n}\n\n.timeline-status {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.execution-time {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n}\n\n.timeline-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n}\n\n.timeline-error {\n color: #dc3545;\n font-size: 13px;\n background: #f8d7da;\n padding: 8px 12px;\n border-radius: 6px;\n margin-top: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.timeline-error i {\n flex-shrink: 0;\n}\n\n/* Expanded Content Styles */\n.timeline-expanded-content {\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n animation: fadeIn 0.3s ease;\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.result-section,\n.error-section {\n margin-bottom: 20px;\n}\n\n.result-section h5,\n.error-section h5 {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section h5 {\n color: #dc3545;\n}\n\n.result-content,\n.error-content {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #495057;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 200px;\n overflow-y: auto;\n}\n\n/* Code editor styling within result section */\n.result-section mj-code-editor {\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.error-content {\n background: #f8d7da;\n border-color: #f5c6cb;\n color: #721c24;\n}\n\n.execution-details {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 16px;\n margin-bottom: 20px;\n}\n\n.detail-row {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n}\n\n.detail-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n min-width: 80px;\n}\n\n.detail-value {\n font-size: 14px;\n color: #495057;\n word-break: break-all;\n}\n\n.timeline-actions {\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.btn-primary {\n padding: 8px 16px;\n background: #2196f3;\n color: white;\n border: none;\n border-radius: 8px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n transition: all 0.2s ease;\n}\n\n.btn-primary:hover {\n background: #1976d2;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(33, 150, 243, 0.3);\n}\n\n.btn-primary i {\n font-size: 12px;\n}\n\n/* Enhanced Empty States */\n.empty-state {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n background: #f8f9fa;\n border-radius: 12px;\n border: 2px dashed #dee2e6;\n margin-top: 16px;\n}\n\n.empty-state i {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state h4 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\n font-size: 18px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 20px auto;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n /* Header Responsiveness */\n .agent-header {\n padding: 16px;\n }\n \n .agent-header-content {\n flex-direction: column;\n gap: 16px;\n }\n \n .agent-overview {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .agent-meta {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .agent-actions {\n width: 100%;\n align-self: stretch;\n }\n \n .action-button {\n flex: 1;\n justify-content: center;\n }\n \n /* Panel Responsiveness */\n .form-content {\n padding: 12px;\n }\n \n ::ng-deep .k-panelbar > .k-panelbar-item > .k-header {\n padding: 16px 20px;\n font-size: 15px;\n }\n \n .panel-content {\n padding: 20px 16px;\n }\n \n .section-header {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .header-actions {\n flex-wrap: wrap;\n align-self: stretch;\n }\n \n /* Entity List Responsiveness */\n .entity-item {\n padding: 12px;\n gap: 12px;\n }\n \n .item-icon {\n width: 36px;\n height: 36px;\n }\n \n .item-icon i {\n font-size: 16px;\n }\n \n .item-title {\n font-size: 15px;\n }\n \n .item-preview {\n font-size: 13px;\n }\n \n .item-meta {\n gap: 8px;\n }\n \n /* Timeline Responsiveness */\n .timeline-item {\n padding: 12px;\n gap: 12px;\n }\n \n .timeline-marker {\n width: 28px;\n height: 28px;\n }\n \n .timeline-marker i {\n font-size: 12px;\n }\n \n .timeline-title {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .timeline-date {\n align-self: flex-start;\n }\n \n /* Form Field Responsiveness */\n .form-fields-grid {\n grid-template-columns: 1fr;\n gap: 16px;\n }\n \n /* Legacy card support */\n .cards-container {\n grid-template-columns: 1fr;\n }\n}\n\n/* Execution History Panel - Max Height and Scroll */\n.execution-history-panel {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n/* Custom scrollbar for execution history */\n.execution-history-panel::-webkit-scrollbar {\n width: 8px;\n}\n\n.execution-history-panel::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 4px;\n}\n\n.execution-history-panel::-webkit-scrollbar-thumb {\n background: #c1c1c1;\n border-radius: 4px;\n}\n\n.execution-history-panel::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n/* New Execution History Card Design */\n.execution-history-list {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.execution-card {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n overflow: hidden;\n transition: all 0.2s ease;\n cursor: pointer;\n}\n\n.execution-card:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n transform: translateY(-1px);\n}\n\n.execution-card.expanded {\n border-color: #2196f3;\n box-shadow: 0 6px 20px rgba(33, 150, 243, 0.15);\n}\n\n.execution-header {\n padding: 16px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n}\n\n.execution-left-section {\n display: flex;\n flex-direction: column;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n\n.execution-status {\n display: flex;\n align-items: center;\n gap: 12px;\n flex-shrink: 0;\n}\n\n.status-indicator {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.status-indicator i {\n color: white;\n font-size: 14px;\n}\n\n.execution-info {\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.execution-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.execution-date {\n font-size: 12px;\n color: #6c757d;\n}\n\n.execution-metrics {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n flex-wrap: wrap;\n margin-left: 44px; /* Align with execution title text, accounting for status indicator + gap */\n}\n\n.metric-item {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n background: #f8f9fa;\n padding: 6px 10px;\n border-radius: 6px;\n color: #495057;\n white-space: nowrap;\n}\n\n.metric-item i {\n color: #6c757d;\n font-size: 12px;\n}\n\n.metric-label {\n font-weight: 500;\n}\n\n.metric-value {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.execution-actions {\n display: flex;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.action-btn {\n width: 32px;\n height: 32px;\n border: none;\n background: #f8f9fa;\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n}\n\n.action-btn:hover {\n background: #2196f3;\n color: white;\n transform: translateY(-1px);\n}\n\n.action-btn i {\n font-size: 12px;\n}\n\n.expand-icon {\n transition: transform 0.2s ease;\n color: #6c757d;\n margin-right: 4px;\n}\n\n.expand-icon.expanded {\n transform: rotate(90deg);\n}\n\n/* Execution Expanded Content */\n.execution-expanded-content {\n padding: 16px;\n border-top: 1px solid #f0f4f8;\n background: #fafbfc;\n animation: slideDown 0.2s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n max-height: 0;\n padding-top: 0;\n padding-bottom: 0;\n }\n to {\n opacity: 1;\n max-height: 500px;\n padding-top: 16px;\n padding-bottom: 16px;\n }\n}\n\n.detailed-metrics {\n margin-bottom: 20px;\n}\n\n.metrics-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.metric-detail {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n}\n\n.metric-detail i {\n color: #2196f3;\n font-size: 16px;\n width: 20px;\n text-align: center;\n}\n\n.metric-info {\n display: flex;\n flex-direction: column;\n gap: 2px;\n flex: 1;\n}\n\n.metric-title {\n font-size: 11px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.metric-data {\n font-size: 14px;\n font-weight: 600;\n color: #2c3e50;\n}\n\n.result-section {\n margin-top: 16px;\n}\n\n.result-section h5 {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section h5 {\n color: #dc3545;\n}\n\n.error-content {\n background: #f8d7da;\n border: 1px solid #f5c6cb;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #721c24;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 150px;\n overflow-y: auto;\n}\n\n/* Responsive adjustments for execution history */\n@media (max-width: 768px) {\n .execution-header {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .execution-left-section {\n width: 100%;\n }\n \n .execution-metrics {\n margin-left: 0; /* Remove left margin on mobile */\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n }\n \n .metric-item {\n font-size: 11px;\n padding: 4px 8px;\n }\n \n .metrics-grid {\n grid-template-columns: 1fr;\n }\n}\n\n/* === PAYLOAD MANAGEMENT SECTION === */\n.payload-section {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.payload-section-title {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.payload-section-title i {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n/* Payload Scope Styling */\n.payload-field-container {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-field-info {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-label {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.payload-field-description {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.5;\n margin: 0;\n}\n\n.payload-field-input {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-example {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.85rem;\n color: #6c757d;\n background: #f8f9fa;\n padding: 0.5rem 0.75rem;\n border-radius: 6px;\n border: 1px solid #e9ecef;\n}\n\n.payload-field-example i {\n color: #ffc107;\n font-size: 0.9rem;\n}\n\n.payload-field-example code {\n background: #e9ecef;\n padding: 0.2rem 0.4rem;\n border-radius: 4px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8rem;\n color: #495057;\n}\n\n/* Path Configuration Grid */\n.payload-paths-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n}\n\n.payload-path-card {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.payload-path-card:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.payload-path-header {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.payload-path-icon {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.payload-path-icon.downstream {\n background: linear-gradient(135deg, #28a745, #20c997);\n}\n\n.payload-path-icon.upstream {\n background: linear-gradient(135deg, #007bff, #6610f2);\n}\n\n.payload-path-icon.self-read {\n background: linear-gradient(135deg, #17a2b8, #20c997);\n}\n\n.payload-path-icon.self-write {\n background: linear-gradient(135deg, #ffc107, #fd7e14);\n}\n\n.payload-path-icon i {\n color: white;\n font-size: 1.2rem;\n}\n\n.payload-path-info h4 {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.payload-path-info p {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-content {\n padding: 1rem;\n}\n\n.json-editor-container {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n margin-bottom: 0.75rem;\n}\n\n.json-editor-container:hover {\n border-color: #2196f3;\n}\n\n.payload-path-hint {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-hint i {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.payload-path-hint code {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n/* Payload Validation Container */\n.payload-validation-container {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-validation-settings {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n.validation-field-group {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.validation-field-label {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.validation-field-description {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0 0 0.5rem 0;\n}\n\n.payload-validation-schema {\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n}\n\n.validation-schema-label {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.validation-schema-label i {\n color: #2196f3;\n}\n\n.validation-schema-description {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0;\n}\n\n.validation-schema-editor {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.validation-schema-editor:hover {\n border-color: #2196f3;\n}\n\n/* === CONFIGURATION SECTION === */\n.config-section {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.config-section-title {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.config-section-title i {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n.config-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n width: 100%;\n}\n\n.config-card {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.config-card:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.config-card.full-width {\n grid-column: 1 / -1;\n}\n\n.config-card-header {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.config-card-icon {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n background: linear-gradient(135deg, #2196f3, #1976d2);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.config-card-icon i {\n color: white;\n font-size: 1.2rem;\n}\n\n.config-card-info h4 {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.config-card-info p {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.config-card-content {\n padding: 1rem;\n}\n\n/* Custom field styling for config cards */\n.config-field-input {\n width: 100%;\n min-width: 250px;\n}\n\n/* Fix numeric textbox cutoff issue */\n.config-card-content ::ng-deep kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-card-content ::ng-deep mj-form-field {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep mj-form-field kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep mj-form-field kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep mj-form-field kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-field-display {\n color: #495057;\n font-size: 14px;\n font-weight: 500;\n padding: 8px 0;\n display: block;\n min-height: 20px;\n}\n\n/* Prompt selector styling */\n.prompt-selector-container {\n display: flex;\n align-items: center;\n gap: 12px;\n width: 100%;\n}\n\n.prompt-display {\n flex: 1;\n min-width: 0;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 6px;\n}\n\n.prompt-name {\n color: #495057;\n font-weight: 500;\n font-size: 14px;\n}\n\n.no-prompt {\n color: #6c757d;\n font-style: italic;\n font-size: 14px;\n}\n\n.prompt-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.prompt-select-btn {\n white-space: nowrap;\n}\n\n.prompt-clear-btn {\n min-width: 32px;\n}\n\n.config-card-hint {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n margin-top: 0.5rem;\n}\n\n.config-card-hint i {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.config-card-hint code {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n\n/* === RESPONSIVE DESIGN === */\n@media (max-width: 768px) {\n .payload-field-container,\n .payload-validation-container {\n grid-template-columns: 1fr;\n gap: 1rem;\n }\n \n .payload-paths-grid {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .config-grid {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .payload-section-title,\n .config-section-title {\n padding: 0.75rem 1rem;\n font-size: 1rem;\n }\n \n .payload-path-header,\n .config-card-header {\n padding: 0.75rem;\n }\n \n .payload-path-content,\n .config-card-content {\n padding: 0.75rem;\n }\n \n .payload-field-container,\n .payload-validation-container {\n padding: 1rem;\n }\n}\n\n"] }]
3714
+ args: [{ selector: 'mj-ai-agent-form', template: "<div class=\"record-form-container\">\n <!-- Dialog container for Kendo dialogs -->\n <div kendoDialogContainer></div>\n <!-- Window container for Kendo windows -->\n <div kendoWindowContainer></div>\n <form *ngIf=\"record\" class=\"record-form\" #form=\"ngForm\">\n <mj-form-toolbar [form]=\"this\"></mj-form-toolbar>\n\n <!-- Compact Header with Agent Overview -->\n <div class=\"agent-header\">\n <div class=\"agent-header-content\">\n <div class=\"agent-overview\">\n <div class=\"agent-icon-wrapper\">\n @if (hasLogoURL()) {\n <img [src]=\"record.LogoURL\" [alt]=\"record.Name + ' logo'\" class=\"agent-logo\">\n } @else {\n <i [class]=\"getAgentIcon()\"></i>\n }\n </div>\n <div class=\"agent-info\">\n @if (EditMode) {\n <kendo-textbox [(ngModel)]=\"record.Name\" \n name=\"agentName\"\n placeholder=\"Enter agent name...\"\n class=\"agent-name-input\">\n </kendo-textbox>\n } @else {\n <h1 class=\"agent-name\">{{ record.Name || 'Untitled AI Agent' }}</h1>\n }\n <div class=\"agent-meta\">\n @if (record.Status) {\n <span class=\"status-badge\" [style.background-color]=\"getStatusBadgeColor()\">\n <i class=\"fa-solid fa-circle\"></i>\n {{ record.Status }}\n </span>\n }\n @if (record.Type) {\n <span class=\"execution-mode\">\n Agent Type: {{ record.Type }}\n </span>\n }\n @if (record.Parent) {\n <span class=\"parent-agent\">\n <i class=\"fa-solid fa-sitemap\"></i>\n Child of {{ record.Parent }}\n </span>\n }\n </div>\n </div>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"agent-actions\">\n @if (record.ID) {\n <button kendoButton themeColor=\"primary\" size=\"large\"\n (click)=\"openTestHarness()\"\n [disabled]=\"record.Status !== 'Active'\"\n title=\"Run this AI agent\">\n <i class=\"fa-solid fa-play\"></i>\n Run\n </button>\n }\n <button kendoButton fillMode=\"outline\" size=\"small\" (click)=\"refreshRelatedData()\" title=\"Refresh all data\">\n <i class=\"fa-solid fa-refresh\"></i>\n </button>\n </div>\n </div>\n </div>\n\n <!-- Single Pane Layout with Expander Panels -->\n <div class=\"form-content\">\n <kendo-panelbar [keepItemContent]=\"true\">\n <!-- Custom Agent Type Section (if defined) -->\n @if (record.ID && agentType && agentType.UIFormSectionKey) {\n <kendo-panelbar-item \n [expanded]=\"agentType.UIFormSectionExpandedByDefault\" \n (stateChange)=\"onCustomSectionStateChange($event)\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-puzzle-piece\"></i> {{ agentType.Name }} Configuration\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content custom-agent-type-section\" [style.display]=\"'block'\">\n <ng-container #customSectionContainer></ng-container>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Requests & History -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-history\"></i> Execution History{{ executionHistoryCount > 0 ? ' (' + executionHistoryCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content execution-history-panel\">\n \n @if (executionHistoryCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-history\"></i>\n <h4>No Execution History</h4>\n <p>This agent hasn't been executed yet. Use the Test Agent button to run the agent and see execution history here.</p>\n </div>\n } @else {\n <div class=\"execution-history-list\">\n @for (execution of recentExecutions; track execution.ID) {\n <div class=\"execution-card\" [class.expanded]=\"expandedExecutions[execution.ID]\">\n <div class=\"execution-header\" (click)=\"toggleExecutionExpanded(execution.ID)\">\n <div class=\"execution-left-section\">\n <div class=\"execution-status\">\n <div class=\"status-indicator\" [style.background-color]=\"getExecutionStatusColor(execution.Status)\">\n <i [class]=\"getExecutionStatusIcon(execution.Status)\"></i>\n </div>\n <div class=\"execution-info\">\n <div class=\"execution-title\">\n <i class=\"fa-solid fa-chevron-right expand-icon\" [class.expanded]=\"expandedExecutions[execution.ID]\"></i>\n Execution #{{ execution.ID.substring(0, 8) }}\n </div>\n <div class=\"execution-date\">{{ execution.__mj_CreatedAt | date:'MMM d, h:mm a' }}</div>\n </div>\n </div>\n \n <div class=\"execution-metrics\">\n @if (execution.Configuration) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-cog\"></i>\n <span class=\"metric-label\">Config:</span>\n <span class=\"metric-value\">{{ execution.Configuration }}</span>\n </div>\n }\n \n @if (execution.CompletedAt) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-stopwatch\"></i>\n <span class=\"metric-label\">Duration:</span>\n <span class=\"metric-value\">{{ formatExecutionTimeFromDates(execution.StartedAt, execution.CompletedAt) }}</span>\n </div>\n } @else if (execution.Status === 'Running') {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-clock\"></i>\n <span class=\"metric-label\">Running:</span>\n <span class=\"metric-value\">{{ getRunningTime(execution.StartedAt) }}</span>\n </div>\n }\n \n @if (execution.TotalTokensUsedRollup || execution.TotalTokensUsed) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-microchip\"></i>\n <span class=\"metric-label\">Tokens:</span>\n <span class=\"metric-value\">{{ formatTokenCount(execution.TotalTokensUsedRollup || execution.TotalTokensUsed) }}</span>\n </div>\n }\n \n @if (execution.TotalCostRollup || execution.TotalCost) {\n <div class=\"metric-item\">\n <i class=\"fa-solid fa-dollar-sign\"></i>\n <span class=\"metric-label\">Cost:</span>\n <span class=\"metric-value\">${{ formatCost(execution.TotalCostRollup || execution.TotalCost) }}</span>\n </div>\n }\n </div>\n </div>\n \n <div class=\"execution-actions\">\n <button class=\"action-btn\" (click)=\"openExecutionRecord(execution.ID); $event.stopPropagation()\" title=\"View details\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n </button>\n </div>\n </div>\n @if (expandedExecutions[execution.ID]) {\n <div class=\"execution-expanded-content\">\n <!-- Detailed Metrics -->\n <div class=\"detailed-metrics\">\n <div class=\"metrics-grid\">\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-clock\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Started</span>\n <span class=\"metric-data\">{{ execution.StartedAt | date:'medium' }}</span>\n </div>\n </div>\n \n @if (execution.CompletedAt) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-check-circle\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Completed</span>\n <span class=\"metric-data\">{{ execution.CompletedAt | date:'medium' }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalTokensUsed) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-microchip\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Direct Tokens</span>\n <span class=\"metric-data\">{{ formatTokenCount(execution.TotalTokensUsed) }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalTokensUsedRollup && execution.TotalTokensUsedRollup !== execution.TotalTokensUsed) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-sitemap\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Total + Sub-agents</span>\n <span class=\"metric-data\">{{ formatTokenCount(execution.TotalTokensUsedRollup) }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalCost) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-dollar-sign\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Direct Cost</span>\n <span class=\"metric-data\">${{ formatCost(execution.TotalCost) }}</span>\n </div>\n </div>\n }\n \n @if (execution.TotalCostRollup && execution.TotalCostRollup !== execution.TotalCost) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-calculator\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Total + Sub-agents</span>\n <span class=\"metric-data\">${{ formatCost(execution.TotalCostRollup) }}</span>\n </div>\n </div>\n }\n \n @if (execution.ConversationID) {\n <div class=\"metric-detail\">\n <i class=\"fa-solid fa-comments\"></i>\n <div class=\"metric-info\">\n <span class=\"metric-title\">Conversation</span>\n <span class=\"metric-data\">{{ execution.ConversationID.substring(0, 8) }}...</span>\n </div>\n </div>\n }\n </div>\n </div>\n \n @if (execution.Result) {\n <div class=\"result-section\">\n <h5><i class=\"fa-solid fa-file-text\"></i> Result</h5>\n <mj-code-editor \n [value]=\"getExecutionResultPreview(execution, false)\"\n [readonly]=\"true\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"max-height: 200px; width: 100%;\">\n </mj-code-editor>\n </div>\n }\n \n @if (execution.ErrorMessage) {\n <div class=\"error-section\">\n <h5><i class=\"fa-solid fa-exclamation-triangle\"></i> Error</h5>\n <div class=\"error-content\">{{ execution.ErrorMessage }}</div>\n </div>\n }\n </div>\n }\n </div>\n }\n @if (executionHistoryCount > recentExecutions.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('MJ: AI Agent Runs', '')\">\n <span>View all {{ executionHistoryCount }} executions...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Actions -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-bolt\"></i> Actions{{ actionCount > 0 ? ' (' + actionCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateActions) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"configureActions()\">\n <i class=\"fa-solid fa-plus\"></i> Add Action\n </button>\n }\n </div>\n </div>\n \n @if (actionCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-bolt\"></i>\n <h4>No Actions Configured</h4>\n <p>Add actions to enable this agent to perform specific tasks and operations.</p>\n @if (EditMode && UserCanCreateActions) {\n <button kendoButton themeColor=\"primary\" (click)=\"configureActions()\">\n <i class=\"fa-solid fa-plus\"></i> Configure First Action\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (action of agentActions; track action.ID) {\n <div class=\"entity-item action-item\" (click)=\"navigateToEntity('Actions', action.ID)\">\n <div class=\"item-icon\">\n <i [class]=\"getActionIcon(action)\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ action.Name || 'Untitled Action' }}</div>\n @if (action.Description) {\n <div class=\"item-preview\">{{ action.Description }}</div>\n }\n <div class=\"item-meta\">\n @if (action.Type) {\n <span class=\"meta-tag\">{{ action.Type }}</span>\n }\n <span class=\"status-tag\" [class.active]=\"action.Status==='Active'\" [class.inactive]=\"action.Status!=='Active'\">\n <i class=\"fa-solid\" [class.fa-check-circle]=\"action.Status==='Active'\" [class.fa-times-circle]=\"action.Status!=='Active'\"></i>\n {{ action.Status }}\n </span>\n </div>\n </div>\n <div class=\"item-actions\">\n @if (EditMode && UserCanDeleteActions) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"error\" \n size=\"small\"\n (click)=\"removeAction(action, $event)\"\n title=\"Remove action\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (actionCount > agentActions.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agent Actions', '')\">\n <span>View all {{ actionCount }} actions...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Sub-Agents -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-sitemap\"></i> Sub-Agents{{ subAgentCount > 0 ? ' (' + subAgentCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Manage hierarchical relationships with child agents that work under this agent.\n </div>\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateSubAgents) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"addSubAgents()\">\n <i class=\"fa-solid fa-plus\"></i> Add Subagent\n </button>\n <button kendoButton themeColor=\"secondary\" size=\"small\" (click)=\"createSubAgent()\">\n <i class=\"fa-solid fa-plus\"></i> Create Sub-Agent\n </button>\n }\n </div>\n </div>\n \n @if (subAgentCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-sitemap\"></i>\n <h4>No Sub-Agents</h4>\n <p>Create sub-agents to build a hierarchical structure for complex workflows.</p>\n @if (EditMode && UserCanCreateSubAgents) {\n <button kendoButton themeColor=\"primary\" (click)=\"addSubAgents()\">\n <i class=\"fa-solid fa-plus\"></i> Add Subagent\n </button>\n <button kendoButton themeColor=\"secondary\" (click)=\"createSubAgent()\">\n <i class=\"fa-solid fa-plus\"></i> Create First Sub-Agent\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (subAgent of subAgents; track subAgent.ID) {\n <div class=\"entity-item sub-agent-item\" (click)=\"navigateToEntity('AI Agents', subAgent.ID)\">\n <div class=\"item-icon\">\n @if (hasSubAgentLogoURL(subAgent)) {\n <img [src]=\"subAgent.LogoURL\" [alt]=\"subAgent.Name + ' logo'\" class=\"sub-agent-logo\">\n } @else {\n <i [class]=\"getSubAgentIcon(subAgent)\"></i>\n }\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ subAgent.Name || 'Untitled Sub-Agent' }}</div>\n @if (subAgent.Description) {\n <div class=\"item-preview\">{{ subAgent.Description }}</div>\n }\n <div class=\"item-meta\">\n @if (subAgent.Status) {\n <span class=\"status-tag\" [style.background-color]=\"getStatusBadgeColor()\">\n {{ subAgent.Status }}\n </span>\n }\n @if (subAgent.ExecutionMode) {\n <span class=\"meta-tag\">{{ subAgent.ExecutionMode }}</span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n @if (EditMode && UserCanCreateSubAgents) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"primary\" \n size=\"small\"\n (click)=\"openSubAgentAdvancedSettings(subAgent, $event)\"\n title=\"Advanced settings\">\n <i class=\"fa-solid fa-cog\"></i>\n </button>\n }\n @if (EditMode && UserCanDeleteSubAgents) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"error\" \n size=\"small\"\n (click)=\"removeSubAgent(subAgent, $event)\"\n title=\"Remove sub-agent\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (subAgentCount > subAgents.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agents', '')\">\n <span>View all {{ subAgentCount }} sub-agents...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Prompts (With Model Selection) -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-comments\"></i> Prompts{{ promptCount > 0 ? ' (' + promptCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"prompt-controls\">\n <!-- Model Selection Mode Control -->\n <div class=\"model-selection-mode\">\n <label class=\"model-selection-label\">\n <i class=\"fa-solid fa-sliders\"></i>\n Model Selection:\n </label>\n @if (EditMode) {\n <kendo-dropdownlist\n [(ngModel)]=\"record.ModelSelectionMode\"\n name=\"modelSelectionMode\"\n [data]=\"modelSelectionModes\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n class=\"model-selection-dropdown\">\n </kendo-dropdownlist>\n } @else {\n <span class=\"model-selection-value\">{{ record.ModelSelectionMode || 'Agent Type' }}</span>\n }\n </div>\n </div>\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateNewPrompts) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"addPrompt()\">\n <i class=\"fa-solid fa-plus\"></i> Add Prompt\n </button>\n }\n </div>\n </div>\n \n @if (promptCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-comments\"></i>\n <h4>No Prompts Configured</h4>\n <p>Add prompts to define how this agent processes requests and generates responses.</p>\n @if (EditMode && UserCanCreateNewPrompts) {\n <button kendoButton themeColor=\"primary\" (click)=\"addPrompt()\">\n <i class=\"fa-solid fa-plus\"></i> Create First Prompt\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (prompt of agentPrompts; track prompt.ID) {\n <div class=\"entity-item prompt-item\" (click)=\"navigateToEntity('AI Prompts', prompt.ID)\">\n <div class=\"item-icon\">\n <i class=\"fa-solid fa-comment-dots\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ prompt.Name }}</div>\n @if (prompt.TemplateText) {\n <div class=\"item-preview\">{{ prompt.TemplateText.substring(0, 120) }}{{ prompt.TemplateText.length > 120 ? '...' : '' }}</div>\n }\n <div class=\"item-meta\">\n @if (prompt.PromptRole) {\n <span class=\"meta-tag\">{{ prompt.PromptRole }}</span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n @if (EditMode && UserCanCreatePrompts) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"primary\" \n size=\"small\"\n (click)=\"openPromptAdvancedSettings(prompt, $event)\"\n title=\"Advanced settings\">\n <i class=\"fa-solid fa-cog\"></i>\n </button>\n }\n @if (EditMode && UserCanDeletePrompts) {\n <button kendoButton\n fillMode=\"flat\" \n themeColor=\"error\" \n size=\"small\"\n (click)=\"removePrompt(prompt, $event)\"\n title=\"Remove prompt\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (promptCount > agentPrompts.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Prompts', '')\">\n <span>View all {{ promptCount }} prompts...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n\n <!-- Learning & Analytics -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-brain\"></i> Learning Cycles{{ learningCycleCount > 0 ? ' (' + learningCycleCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Monitor and manage learning cycles, training sessions, and performance analytics.\n </div>\n </div>\n \n @if (learningCycleCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-brain\"></i>\n <h4>No Learning Cycles</h4>\n <p>Learning cycles will appear here as the agent processes requests and improves over time.</p>\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (cycle of learningCycles; track cycle.ID) {\n <div class=\"entity-item learning-item\" (click)=\"navigateToEntity('AI Agent Learning Cycles', cycle.ID)\">\n <div class=\"item-icon\">\n <i class=\"fa-solid fa-brain\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">Learning Cycle {{ cycle.ID.substring(0, 8) }}</div>\n <div class=\"item-meta\">\n @if (cycle.StartedAt) {\n <span class=\"meta-tag\">\n <i class=\"fa-solid fa-calendar\"></i>\n {{ cycle.StartedAt | date:'short' }}\n </span>\n }\n @if (cycle.Status) {\n <span class=\"status-tag\">{{ cycle.Status }}</span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (learningCycleCount > learningCycles.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agent Learning Cycles', '')\">\n <span>View all {{ learningCycleCount }} cycles...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n <!-- Notes & Documentation -->\n @if (record.ID) {\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-sticky-note\"></i> Notes{{ noteCount > 0 ? ' (' + noteCount + ')' : '' }}\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Manage notes, documentation, and annotations for this agent.\n </div>\n <div class=\"header-actions\">\n @if (EditMode && UserCanCreateNotes) {\n <button kendoButton themeColor=\"primary\" size=\"small\" (click)=\"addNote()\">\n <i class=\"fa-solid fa-plus\"></i> Add Note\n </button>\n }\n </div>\n </div>\n \n @if (noteCount === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-sticky-note\"></i>\n <h4>No Notes</h4>\n <p>Add notes to document important information, observations, or instructions for this agent.</p>\n @if (EditMode && UserCanCreateNotes) {\n <button kendoButton themeColor=\"primary\" (click)=\"addNote()\">\n <i class=\"fa-solid fa-plus\"></i> Create First Note\n </button>\n }\n </div>\n } @else {\n <div class=\"entity-list\">\n @for (note of agentNotes; track note.ID) {\n <div class=\"entity-item note-item\" (click)=\"navigateToEntity('AI Agent Notes', note.ID)\">\n <div class=\"item-icon\">\n <i class=\"fa-solid fa-sticky-note\"></i>\n </div>\n <div class=\"item-content\">\n <div class=\"item-title\">{{ note.Type || 'Note' }}</div>\n @if (note.Note) {\n <div class=\"item-preview\">{{ note.Note.substring(0, 100) }}{{ note.Note.length > 100 ? '...' : '' }}</div>\n }\n <div class=\"item-meta\">\n @if (note.__mj_CreatedAt) {\n <span class=\"meta-tag\">\n <i class=\"fa-solid fa-calendar\"></i>\n {{ note.__mj_CreatedAt | date:'short' }}\n </span>\n }\n </div>\n </div>\n <div class=\"item-actions\">\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n </div>\n }\n @if (noteCount > agentNotes.length) {\n <div class=\"view-more-item\" (click)=\"navigateToEntity('AI Agent Notes', '')\">\n <span>View all {{ noteCount }} notes...</span>\n </div>\n }\n </div>\n }\n </div>\n </ng-template>\n </kendo-panelbar-item>\n }\n\n\n\n <!-- Payload -->\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-exchange-alt\"></i> Payload Management\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Configure how this agent handles data payloads, path routing, and validation between parent and child agents.\n </div>\n </div>\n \n <!-- Payload Scope Section -->\n <div class=\"payload-section\">\n <h3 class=\"payload-section-title\">\n <i class=\"fa-solid fa-target\"></i>\n Payload Scope\n </h3>\n \n <div class=\"payload-field-container\">\n <div class=\"payload-field-info\">\n <label class=\"payload-field-label\">Payload Scope Path</label>\n <p class=\"payload-field-description\">\n Specify a path within the parent payload that this sub-agent should operate on. \n Leave empty to receive the entire payload.\n </p>\n </div>\n \n <div class=\"payload-field-input\">\n <mj-form-field \n FieldName=\"PayloadScope\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n <div class=\"payload-field-example\">\n <i class=\"fa-solid fa-lightbulb\"></i>\n <span>Example: <code>/customer/profile</code> or <code>/analysis/results</code></span>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Path Configuration Section -->\n <div class=\"payload-section\">\n <h3 class=\"payload-section-title\">\n <i class=\"fa-solid fa-route\"></i>\n Path Configuration\n </h3>\n \n <div class=\"payload-paths-grid\">\n <!-- Downstream Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon downstream\">\n <i class=\"fa-solid fa-arrow-down\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Downstream Paths</h4>\n <p>JSON array of paths to pass to sub-agents</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadDownstreamPaths || '[&quot;*&quot;]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadDownstreamPaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Use <code>[\"*\"]</code> to pass entire payload or specify paths like <code>[\"user.id\", \"order.*\"]</code>\n </div>\n </div>\n </div>\n\n <!-- Upstream Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon upstream\">\n <i class=\"fa-solid fa-arrow-up\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Upstream Paths</h4>\n <p>JSON array of paths sub-agents can write back</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadUpstreamPaths || '[&quot;*&quot;]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadUpstreamPaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Use <code>[\"*\"]</code> to allow all writes or limit to specific paths\n </div>\n </div>\n </div>\n\n <!-- Self Read Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon self-read\">\n <i class=\"fa-solid fa-eye\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Self Read Paths</h4>\n <p>JSON array of paths this agent can read</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadSelfReadPaths || '[]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadSelfReadPaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Paths this agent's prompts can read from the payload\n </div>\n </div>\n </div>\n\n <!-- Self Write Paths -->\n <div class=\"payload-path-card\">\n <div class=\"payload-path-header\">\n <div class=\"payload-path-icon self-write\">\n <i class=\"fa-solid fa-pen\"></i>\n </div>\n <div class=\"payload-path-info\">\n <h4>Self Write Paths</h4>\n <p>JSON array of paths this agent can write to</p>\n </div>\n </div>\n <div class=\"payload-path-content\">\n <div class=\"json-editor-container\">\n <mj-code-editor \n [value]=\"record.PayloadSelfWritePaths || '[]'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 100px; width: 100%;\"\n (valueChange)=\"updatePayloadField('PayloadSelfWritePaths', $event)\">\n </mj-code-editor>\n </div>\n <div class=\"payload-path-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Paths this agent's prompts can write back to the payload\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Validation Section -->\n <div class=\"payload-section\">\n <h3 class=\"payload-section-title\">\n <i class=\"fa-solid fa-shield-check\"></i>\n Final Payload Validation\n </h3>\n \n <div class=\"payload-validation-container\">\n <div class=\"payload-validation-settings\">\n <div class=\"validation-field-group\">\n <label class=\"validation-field-label\">Validation Mode</label>\n <p class=\"validation-field-description\">How to handle validation failures</p>\n <mj-form-field \n FieldName=\"FinalPayloadValidationMode\" \n Type=\"dropdownlist\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n </div>\n \n <div class=\"validation-field-group\">\n <label class=\"validation-field-label\">Max Retries</label>\n <p class=\"validation-field-description\">Maximum validation retry attempts</p>\n <mj-form-field \n FieldName=\"FinalPayloadValidationMaxRetries\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n </div>\n </div>\n \n <div class=\"payload-validation-schema\">\n <label class=\"validation-schema-label\">\n <i class=\"fa-solid fa-code\"></i>\n Validation Schema\n </label>\n <p class=\"validation-schema-description\">\n JSON schema or validation rules for the final payload structure\n </p>\n <div class=\"validation-schema-editor\">\n <mj-code-editor \n [value]=\"record.FinalPayloadValidation || '{}'\"\n [readonly]=\"!EditMode\"\n language=\"json\"\n [lineWrapping]=\"true\"\n style=\"height: 200px; width: 100%;\"\n (valueChange)=\"updatePayloadField('FinalPayloadValidation', $event)\">\n </mj-code-editor>\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n\n\n\n <!-- Execution Guardrails (New Separate Panel) -->\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-shield-halved\"></i> Execution Guardrails\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Set limits to prevent runaway agent executions and control resource usage.\n </div>\n </div>\n \n <div class=\"form-fields-grid\">\n <mj-form-field \n FieldName=\"MaxCostPerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Cost ($)\"\n Description=\"Maximum cost per run\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n\n <mj-form-field \n FieldName=\"MaxTokensPerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Tokens\"\n Description=\"Maximum tokens per run\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n\n <mj-form-field \n FieldName=\"MaxIterationsPerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Iterations\"\n Description=\"Maximum prompt iterations\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n\n <mj-form-field \n FieldName=\"MaxTimePerRun\" \n Type=\"numerictextbox\"\n Caption=\"Max Time (seconds)\"\n Description=\"Maximum execution time\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n\n <!-- Configuration (Settings Panel) -->\n <kendo-panelbar-item [expanded]=\"false\">\n <ng-template kendoPanelBarItemTitle>\n <i class=\"fa-solid fa-cogs\"></i> Configuration\n </ng-template>\n <ng-template kendoPanelBarContent>\n <div class=\"panel-content\">\n <div class=\"section-header\">\n <div class=\"section-description\">\n Configure agent behavior, execution settings, and advanced features.\n </div>\n </div>\n \n <!-- Identity & Behavior Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-id-card\"></i>\n Identity & Behavior\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-toggle-on\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Agent Status</h4>\n <p>Current availability and operational status</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n @if (EditMode) {\n <kendo-dropdownlist \n [(ngModel)]=\"record.Status\"\n [data]=\"statusOptions\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n name=\"agentStatus\"\n class=\"config-field-input\">\n </kendo-dropdownlist>\n } @else {\n <span class=\"config-field-display\">{{ record.Status || 'Not Set' }}</span>\n }\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-sitemap\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Agent Type</h4>\n <p>Category and system-level behavior</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n @if (EditMode) {\n <kendo-dropdownlist \n [(ngModel)]=\"record.TypeID\"\n [data]=\"agentTypes\"\n textField=\"Name\"\n valueField=\"ID\"\n [valuePrimitive]=\"true\"\n name=\"agentTypeID\"\n class=\"config-field-input\">\n </kendo-dropdownlist>\n } @else {\n <span class=\"config-field-display\">{{ record.Type || 'Not Set' }}</span>\n }\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-bolt\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Expose as Action</h4>\n <p>Make available as an action for other agents</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ExposeAsAction\" \n Type=\"checkbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card full-width\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-align-left\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Description</h4>\n <p>Detailed agent description and purpose</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"Description\" \n Type=\"textarea\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n style=\"width: 100%;\">\n </mj-form-field>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Execution Settings Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-play\"></i>\n Execution Settings\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-layer-group\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Execution Mode</h4>\n <p>How sub-agents are executed</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ExecutionMode\" \n Type=\"dropdownlist\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-sort-numeric-down\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Execution Order</h4>\n <p>Order when run with siblings</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ExecutionOrder\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-tachometer-alt\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Default Effort Level</h4>\n <p>Default effort level for all prompts (1-100)</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"DefaultPromptEffortLevel\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n <div class=\"config-card-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Higher values request more thorough reasoning (1=minimal, 100=maximum)\n </div>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-code\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Driver Class</h4>\n <p>Custom implementation class</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"DriverClass\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Visual Identity Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-palette\"></i>\n Visual Identity\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-icons\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Icon Class</h4>\n <p>Font Awesome icon class</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"IconClass\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n <div class=\"config-card-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Example: <code>fa-solid fa-robot</code>\n </div>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-image\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Logo URL</h4>\n <p>URL for agent logo image</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"LogoURL\" \n Type=\"textbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n <div class=\"config-card-hint\">\n <i class=\"fa-solid fa-info-circle\"></i>\n Takes precedence over Icon Class\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Context Compression Section -->\n <div class=\"config-section\">\n <h3 class=\"config-section-title\">\n <i class=\"fa-solid fa-compress\"></i>\n Context Compression\n </h3>\n \n <div class=\"config-grid\">\n <div class=\"config-card full-width\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-toggle-on\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Enable Context Compression</h4>\n <p>Automatically compress conversation context when message threshold is reached</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"EnableContextCompression\" \n Type=\"checkbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\"\n (valueChange)=\"onContextCompressionToggle($event)\">\n </mj-form-field>\n </div>\n </div>\n\n @if (record.EnableContextCompression) {\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-hashtag\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Message Threshold</h4>\n <p>Messages before compression triggers</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ContextCompressionMessageThreshold\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-save\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Messages to Keep</h4>\n <p>Recent messages to retain uncompressed</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n <mj-form-field \n FieldName=\"ContextCompressionMessageRetentionCount\" \n Type=\"numerictextbox\"\n Caption=\"\"\n [EditMode]=\"EditMode\"\n [record]=\"record\">\n </mj-form-field>\n </div>\n </div>\n\n <div class=\"config-card\">\n <div class=\"config-card-header\">\n <div class=\"config-card-icon\">\n <i class=\"fa-solid fa-comment-dots\"></i>\n </div>\n <div class=\"config-card-info\">\n <h4>Compression Prompt</h4>\n <p>Prompt used for summarization</p>\n </div>\n </div>\n <div class=\"config-card-content\">\n @if (EditMode) {\n <div class=\"prompt-selector-container\">\n <div class=\"prompt-display\">\n @if (selectedContextCompressionPrompt) {\n <span class=\"prompt-name\">{{ selectedContextCompressionPrompt.Name }}</span>\n } @else {\n <span class=\"no-prompt\">No prompt selected</span>\n }\n </div>\n <div class=\"prompt-actions\">\n <button type=\"button\" \n kendoButton \n fillMode=\"outline\" \n size=\"small\"\n (click)=\"openContextCompressionPromptSelector()\"\n class=\"prompt-select-btn\">\n <i class=\"fa-solid fa-search\"></i>\n {{ selectedContextCompressionPrompt ? 'Change' : 'Select' }} Prompt\n </button>\n @if (selectedContextCompressionPrompt) {\n <button type=\"button\" \n kendoButton \n fillMode=\"flat\" \n size=\"small\"\n (click)=\"clearContextCompressionPrompt()\"\n class=\"prompt-clear-btn\"\n title=\"Clear selection\">\n <i class=\"fa-solid fa-times\"></i>\n </button>\n }\n </div>\n </div>\n } @else {\n <span class=\"config-field-display\">{{ selectedContextCompressionPrompt?.Name || record.ContextCompressionPrompt || 'Not Set' }}</span>\n }\n </div>\n </div>\n }\n </div>\n </div>\n </div>\n </ng-template>\n </kendo-panelbar-item>\n\n\n\n\n </kendo-panelbar>\n </div>\n </form>\n\n</div>", styles: ["/* AI Agent Form - Modern Redesign */\n.record-form-container {\n height: 100%;\n display: flex;\n flex-direction: column;\n background: #f5f7fa;\n}\n\n.record-form {\n height: 100%;\n display: flex;\n flex-direction: column;\n}\n\n/* Agent Header Section - Compact Design */\n.agent-header {\n background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);\n border-bottom: 1px solid #e0e6ed;\n padding: 12px 20px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.agent-header-content {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 20px;\n}\n\n.agent-overview {\n display: flex;\n align-items: center;\n gap: 16px;\n flex: 1;\n min-width: 0;\n}\n\n.agent-icon-wrapper {\n width: 48px;\n height: 48px;\n background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.2);\n flex-shrink: 0;\n}\n\n.agent-icon-wrapper i {\n color: white;\n font-size: 24px;\n}\n\n.agent-icon-wrapper img.agent-logo {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 8px;\n}\n\n.agent-info {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name {\n font-size: 22px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n line-height: 1.2;\n}\n\n.agent-name-input {\n font-size: 18px !important;\n font-weight: 500 !important;\n height: 36px !important;\n width: 100% !important;\n max-width: 400px !important;\n}\n\n.agent-meta {\n display: flex;\n align-items: center;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.status-badge {\n padding: 6px 16px;\n border-radius: 20px;\n font-size: 13px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n}\n\n.status-badge.active {\n background: #28a745;\n color: white;\n}\n\n.status-badge.pending {\n background: #ffc107;\n color: #212529;\n}\n\n.status-badge.disabled {\n background: #6c757d;\n color: white;\n}\n\n.execution-mode,\n.parent-agent {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 13px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 10px;\n border-radius: 12px;\n}\n\n.execution-mode i,\n.parent-agent i {\n font-size: 12px;\n opacity: 0.8;\n}\n\n/* Prompt Controls Section */\n.prompt-controls {\n flex: 1;\n margin-right: 16px;\n}\n\n.agent-meta-info {\n display: flex;\n gap: 24px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.meta-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.meta-value {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n.agent-description {\n margin-top: 16px;\n color: #6c757d;\n line-height: 1.6;\n font-size: 15px;\n}\n\n.agent-description-input {\n width: 100%;\n max-width: 600px;\n min-height: 80px;\n resize: vertical;\n}\n\n/* Action Buttons Section */\n.agent-actions {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.action-buttons-row {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.action-button {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 10px 20px;\n border-radius: 8px;\n font-weight: 500;\n font-size: 14px;\n transition: all 0.2s ease;\n box-shadow: 0 2px 4px rgba(0,0,0,0.08);\n}\n\n.action-button:hover {\n transform: translateY(-1px);\n box-shadow: 0 4px 8px rgba(0,0,0,0.12);\n}\n\n.action-button.primary {\n background: #2196f3;\n color: white;\n}\n\n.action-button.primary:hover {\n background: #1976d2;\n}\n\n.action-button.secondary {\n background: #6c757d;\n color: white;\n}\n\n.action-button.secondary:hover {\n background: #5a6268;\n}\n\n.action-warnings {\n margin-top: 8px;\n font-size: 13px;\n color: #dc3545;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n/* Panel-Based Form Content */\n.form-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n overflow-x: hidden;\n background: #f5f7fa;\n padding: 12px;\n}\n\n/* Kendo PanelBar Styling */\n::ng-deep .k-panelbar {\n border: none;\n background: transparent;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item {\n border: none;\n border-radius: 12px;\n margin-bottom: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n background: white;\n overflow: hidden;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header {\n background: white;\n border: none;\n padding: 16px 20px;\n border-radius: 12px 12px 0 0;\n color: #2c3e50;\n font-weight: 600;\n font-size: 16px;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header:hover {\n background: #f8f9fa;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header {\n background: #2196f3;\n color: white;\n border-radius: 12px 12px 0 0;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle {\n position: absolute;\n right: 24px;\n color: inherit;\n font-size: 14px;\n transition: transform 0.2s ease;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item.k-panelbar-expanded > .k-header .k-panelbar-toggle {\n transform: rotate(180deg);\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-header .k-panelbar-toggle::before {\n content: '\\f107';\n font-family: 'Font Awesome 6 Free';\n font-weight: 900;\n}\n\n::ng-deep .k-panelbar > .k-panelbar-item > .k-content {\n padding: 0;\n border: none;\n background: white;\n border-radius: 0 0 12px 12px;\n}\n\n::ng-deep .k-panelbar .k-header .k-panelbar-icon {\n font-size: 18px;\n color: #2196f3;\n margin-right: 8px;\n}\n\n::ng-deep .k-panelbar .k-panelbar-expanded .k-header .k-panelbar-icon {\n color: white;\n}\n\n/* Panel Content */\n.panel-content {\n padding: 16px;\n background: white;\n}\n\n.section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n gap: 16px;\n flex-wrap: wrap;\n}\n\n.section-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-bottom: 16px;\n}\n\n.header-actions {\n display: flex;\n gap: 8px;\n align-items: center;\n flex-shrink: 0;\n}\n\n.tab-section {\n background: white;\n border-radius: 12px;\n padding: 24px;\n margin-bottom: 24px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n}\n\n.section-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 20px;\n padding-bottom: 16px;\n border-bottom: 2px solid #f0f4f8;\n}\n\n.section-title {\n display: flex;\n align-items: center;\n gap: 12px;\n margin: 0;\n color: #2c3e50;\n font-size: 18px;\n font-weight: 600;\n}\n\n.section-title i {\n color: #2196f3;\n font-size: 20px;\n}\n\n.section-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.6;\n margin-top: 8px;\n}\n\n/* Form Fields Grid */\n.form-fields-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 20px;\n margin-top: 20px;\n}\n\n.form-field-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.form-field-label {\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n/* Sub-grids styling (legacy) */\n.sub-grid-container {\n height: 500px;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n display: none; /* Hidden as we now use cards */\n}\n\n/* Empty States */\n.empty-state {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n}\n\n.empty-state i {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state h4 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto;\n}\n\n/* Loading State */\n.loading-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(255, 255, 255, 0.9);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n}\n\n.loading-spinner {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n}\n\n.spinner-icon {\n width: 48px;\n height: 48px;\n border: 4px solid #f3f3f3;\n border-top: 4px solid #2196f3;\n border-radius: 50%;\n animation: spin 1s linear infinite;\n}\n\n@keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n/* Quick Actions */\n.quick-actions {\n display: flex;\n gap: 16px;\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n}\n\n.quick-action-card {\n flex: 1;\n padding: 16px;\n background: #f8f9fa;\n border-radius: 8px;\n border: 1px solid #e0e6ed;\n cursor: pointer;\n transition: all 0.2s ease;\n text-align: center;\n}\n\n.quick-action-card:hover {\n background: white;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.quick-action-icon {\n font-size: 32px;\n color: #2196f3;\n margin-bottom: 8px;\n}\n\n.quick-action-title {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 4px;\n}\n\n.quick-action-description {\n font-size: 12px;\n color: #6c757d;\n}\n\n/* Header Actions */\n.header-actions {\n display: flex;\n gap: 8px;\n align-items: center;\n}\n\n/* Entity List Interface */\n.entity-list {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.entity-item {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.entity-item:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n transform: translateY(-1px);\n}\n\n.item-icon {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.prompt-item .item-icon {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-item .item-icon {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.sub-agent-item .item-icon {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.model-item .item-icon {\n background: linear-gradient(135deg, #6f42c1, #563d7c);\n}\n\n.learning-item .item-icon {\n background: linear-gradient(135deg, #e83e8c, #dc3545);\n}\n\n.note-item .item-icon {\n background: linear-gradient(135deg, #fd7e14, #e55a00);\n}\n\n.item-icon i {\n color: #6c757d;\n font-size: 18px;\n}\n\n.prompt-item .item-icon i,\n.action-item .item-icon i,\n.sub-agent-item .item-icon i,\n.model-item .item-icon i,\n.learning-item .item-icon i,\n.note-item .item-icon i {\n color: white;\n}\n\n.item-icon img.sub-agent-logo {\n width: 100%;\n height: 100%;\n object-fit: cover;\n border-radius: 6px;\n}\n\n.item-content {\n flex: 1;\n min-width: 0;\n}\n\n.item-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n}\n\n.item-preview {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n margin: 4px 0 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.item-meta {\n display: flex;\n gap: 12px;\n align-items: center;\n flex-wrap: wrap;\n}\n\n.meta-tag,\n.priority-tag,\n.status-tag {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n padding: 3px 8px;\n border-radius: 6px;\n font-weight: 500;\n}\n\n.meta-tag {\n background: #e9ecef;\n color: #495057;\n}\n\n.priority-tag {\n color: white;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n.status-tag {\n background: #e9ecef;\n color: #495057;\n}\n\n.status-tag.active {\n background: #d4edda;\n color: #28a745;\n}\n\n.status-tag.inactive {\n background: #f8d7da;\n color: #dc3545;\n}\n\n.item-actions {\n opacity: 0;\n transition: opacity 0.2s ease;\n color: #6c757d;\n font-size: 16px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.entity-item:hover .item-actions {\n opacity: 1;\n}\n\n.entity-item:hover .item-actions > i {\n color: #2196f3;\n}\n\n.view-more-item {\n padding: 16px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 10px;\n text-align: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-more-item:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n color: #2196f3;\n}\n\n/* Payload Section Styles */\n.payload-config-section,\n.payload-paths-section,\n.payload-validation-section {\n margin-bottom: 32px;\n}\n\n.subsection-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 16px 0;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.subsection-title i {\n color: #2196f3;\n}\n\n.subsection-divider {\n margin-top: 32px;\n margin-bottom: 16px;\n padding-top: 24px;\n border-top: 1px solid #e0e6ed;\n}\n\n.payload-config-grid {\n display: grid;\n grid-template-columns: 1fr 1fr 1fr;\n gap: 16px;\n margin-bottom: 24px;\n}\n\n.payload-field-group {\n margin-bottom: 20px;\n}\n\n.payload-field-label {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n}\n\n.payload-field-label i {\n color: #6c757d;\n font-size: 16px;\n}\n\n.field-description {\n font-size: 12px;\n font-weight: normal;\n color: #6c757d;\n margin-left: auto;\n}\n\n/* Code editor styling */\n.payload-field-group mj-code-editor {\n border: 1px solid #dee2e6;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.payload-field-group mj-code-editor:hover {\n border-color: #2196f3;\n}\n\n/* Payload textarea styling */\n.payload-field-group mj-form-field ::ng-deep textarea {\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 13px;\n line-height: 1.5;\n min-height: 120px;\n resize: vertical;\n}\n\n/* Execution History Panel */\n.execution-history-panel {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n/* Timeline List for Execution History */\n.timeline-list {\n display: flex;\n flex-direction: column;\n gap: 16px;\n margin-top: 16px;\n}\n\n.timeline-item {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e0e6ed;\n border-radius: 10px;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.timeline-item:hover {\n background: white;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.timeline-marker {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker i {\n color: white;\n font-size: 14px;\n}\n\n.timeline-content {\n flex: 1;\n min-width: 0;\n}\n\n.timeline-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 8px 0;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 16px;\n}\n\n.timeline-date {\n font-size: 12px;\n color: #6c757d;\n background: #e9ecef;\n padding: 2px 8px;\n border-radius: 6px;\n white-space: nowrap;\n flex-shrink: 0;\n}\n\n.timeline-meta {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.timeline-preview {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.4;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n/* Modern Card-Based Interface (Legacy - Keep for backward compatibility) */\n.cards-container {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n gap: 20px;\n margin-top: 16px;\n}\n\n.entity-card {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n padding: 20px;\n cursor: pointer;\n transition: all 0.3s ease;\n box-shadow: 0 2px 8px rgba(0,0,0,0.06);\n position: relative;\n overflow: hidden;\n}\n\n.entity-card:hover {\n transform: translateY(-4px);\n box-shadow: 0 8px 24px rgba(0,0,0,0.12);\n border-color: #2196f3;\n}\n\n.entity-card::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 4px;\n background: linear-gradient(90deg, #2196f3, #42a5f5);\n opacity: 0;\n transition: opacity 0.3s ease;\n}\n\n.entity-card:hover::before {\n opacity: 1;\n}\n\n.card-header {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n margin-bottom: 12px;\n}\n\n.card-icon {\n width: 40px;\n height: 40px;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.sub-agent-card .card-icon {\n background: linear-gradient(135deg, #2196f3, #1976d2);\n}\n\n.prompt-card .card-icon {\n background: linear-gradient(135deg, #20c997, #17a673);\n}\n\n.action-card .card-icon {\n background: linear-gradient(135deg, #ffc107, #e0a800);\n}\n\n.card-icon i {\n font-size: 18px;\n color: #6c757d;\n}\n\n.sub-agent-card .card-icon i,\n.prompt-card .card-icon i,\n.action-card .card-icon i {\n color: white;\n}\n\n.card-title-section {\n flex: 1;\n min-width: 0;\n}\n\n.card-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0 0 4px 0;\n line-height: 1.3;\n word-wrap: break-word;\n}\n\n.card-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n}\n\n.card-meta {\n display: flex;\n gap: 16px;\n margin-top: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n color: #6c757d;\n padding: 4px 8px;\n background: #f8f9fa;\n border-radius: 6px;\n}\n\n.meta-item i {\n font-size: 11px;\n opacity: 0.8;\n}\n\n.meta-item.active {\n color: #28a745;\n background: #d4edda;\n}\n\n.meta-item.inactive {\n color: #dc3545;\n background: #f8d7da;\n}\n\n.card-actions {\n opacity: 0;\n transition: opacity 0.3s ease;\n color: #6c757d;\n}\n\n.entity-card:hover .card-actions {\n opacity: 1;\n color: #2196f3;\n}\n\n/* Badge Styles */\n.priority-badge {\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 11px;\n font-weight: 600;\n color: white;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.type-badge {\n padding: 2px 8px;\n border-radius: 6px;\n font-size: 11px;\n font-weight: 500;\n background: #e9ecef;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.3px;\n}\n\n/* View All Card */\n.view-all-card {\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n border-radius: 12px;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 120px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.view-all-card:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n transform: translateY(-2px);\n}\n\n.view-all-content {\n text-align: center;\n color: #6c757d;\n font-weight: 500;\n}\n\n.view-all-content i {\n font-size: 24px;\n margin-bottom: 8px;\n display: block;\n}\n\n/* Timeline Interface for History */\n.timeline-container {\n position: relative;\n margin-top: 16px;\n}\n\n.timeline-item {\n display: flex;\n flex-direction: column;\n margin-bottom: 24px;\n transition: all 0.3s ease;\n border-radius: 12px;\n padding: 16px;\n background: transparent;\n border: 1px solid transparent;\n}\n\n.timeline-item:hover {\n background: #f8f9fa;\n border-color: #e0e6ed;\n}\n\n.timeline-item.expanded {\n background: #f8f9fa;\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n}\n\n.timeline-item.view-all {\n cursor: pointer;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border: 2px dashed #dee2e6;\n}\n\n.timeline-item.view-all:hover {\n background: linear-gradient(135deg, #e9ecef, #dee2e6);\n border-color: #2196f3;\n}\n\n.timeline-item > div:first-child {\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-marker {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n position: relative;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.timeline-marker::after {\n content: '';\n position: absolute;\n top: 50px;\n left: 50%;\n transform: translateX(-50%);\n width: 2px;\n height: 24px;\n background: #e0e6ed;\n}\n\n.timeline-item:last-child .timeline-marker::after {\n display: none;\n}\n\n.timeline-marker i {\n color: white;\n font-size: 16px;\n}\n\n.timeline-marker.view-all-marker {\n background: #6c757d;\n}\n\n.timeline-content {\n flex: 1;\n min-width: 0;\n display: flex;\n align-items: flex-start;\n}\n\n.timeline-header {\n flex: 1;\n cursor: pointer;\n}\n\n.timeline-header > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 8px;\n gap: 16px;\n}\n\n.expand-icon {\n transition: transform 0.3s ease;\n margin-right: 8px;\n color: #6c757d;\n}\n\n.expand-icon.expanded {\n transform: rotate(90deg);\n}\n\n.timeline-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin: 0;\n line-height: 1.3;\n}\n\n.timeline-date {\n font-size: 12px;\n color: #6c757d;\n white-space: nowrap;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n margin-left: auto;\n}\n\n.timeline-preview {\n font-size: 13px;\n color: #6c757d;\n line-height: 1.5;\n margin-top: 8px;\n padding: 8px 12px;\n background: #f8f9fa;\n border-radius: 6px;\n border: 1px solid #e0e6ed;\n}\n\n.timeline-status {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 8px;\n}\n\n.execution-time {\n display: flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n color: #6c757d;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 6px;\n}\n\n.timeline-description {\n color: #6c757d;\n font-size: 14px;\n line-height: 1.5;\n margin: 8px 0;\n}\n\n.timeline-error {\n color: #dc3545;\n font-size: 13px;\n background: #f8d7da;\n padding: 8px 12px;\n border-radius: 6px;\n margin-top: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.timeline-error i {\n flex-shrink: 0;\n}\n\n/* Expanded Content Styles */\n.timeline-expanded-content {\n margin-top: 20px;\n padding-top: 20px;\n border-top: 1px solid #e0e6ed;\n animation: fadeIn 0.3s ease;\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.result-section,\n.error-section {\n margin-bottom: 20px;\n}\n\n.result-section h5,\n.error-section h5 {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section h5 {\n color: #dc3545;\n}\n\n.result-content,\n.error-content {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #495057;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 200px;\n overflow-y: auto;\n}\n\n/* Code editor styling within result section */\n.result-section mj-code-editor {\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.error-content {\n background: #f8d7da;\n border-color: #f5c6cb;\n color: #721c24;\n}\n\n.execution-details {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 16px;\n margin-bottom: 20px;\n}\n\n.detail-row {\n display: flex;\n align-items: flex-start;\n gap: 8px;\n}\n\n.detail-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n min-width: 80px;\n}\n\n.detail-value {\n font-size: 14px;\n color: #495057;\n word-break: break-all;\n}\n\n.timeline-actions {\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.btn-primary {\n padding: 8px 16px;\n background: #2196f3;\n color: white;\n border: none;\n border-radius: 8px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n transition: all 0.2s ease;\n}\n\n.btn-primary:hover {\n background: #1976d2;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(33, 150, 243, 0.3);\n}\n\n.btn-primary i {\n font-size: 12px;\n}\n\n/* Enhanced Empty States */\n.empty-state {\n text-align: center;\n padding: 60px 20px;\n color: #6c757d;\n background: #f8f9fa;\n border-radius: 12px;\n border: 2px dashed #dee2e6;\n margin-top: 16px;\n}\n\n.empty-state i {\n font-size: 48px;\n color: #dee2e6;\n margin-bottom: 16px;\n}\n\n.empty-state h4 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 8px;\n font-size: 18px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 20px auto;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n /* Header Responsiveness */\n .agent-header {\n padding: 16px;\n }\n \n .agent-header-content {\n flex-direction: column;\n gap: 16px;\n }\n \n .agent-overview {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .agent-meta {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .agent-actions {\n width: 100%;\n align-self: stretch;\n }\n \n .action-button {\n flex: 1;\n justify-content: center;\n }\n \n /* Panel Responsiveness */\n .form-content {\n padding: 12px;\n }\n \n ::ng-deep .k-panelbar > .k-panelbar-item > .k-header {\n padding: 16px 20px;\n font-size: 15px;\n }\n \n .panel-content {\n padding: 20px 16px;\n }\n \n .section-header {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .header-actions {\n flex-wrap: wrap;\n align-self: stretch;\n }\n \n /* Entity List Responsiveness */\n .entity-item {\n padding: 12px;\n gap: 12px;\n }\n \n .item-icon {\n width: 36px;\n height: 36px;\n }\n \n .item-icon i {\n font-size: 16px;\n }\n \n .item-title {\n font-size: 15px;\n }\n \n .item-preview {\n font-size: 13px;\n }\n \n .item-meta {\n gap: 8px;\n }\n \n /* Timeline Responsiveness */\n .timeline-item {\n padding: 12px;\n gap: 12px;\n }\n \n .timeline-marker {\n width: 28px;\n height: 28px;\n }\n \n .timeline-marker i {\n font-size: 12px;\n }\n \n .timeline-title {\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n }\n \n .timeline-date {\n align-self: flex-start;\n }\n \n /* Form Field Responsiveness */\n .form-fields-grid {\n grid-template-columns: 1fr;\n gap: 16px;\n }\n \n /* Legacy card support */\n .cards-container {\n grid-template-columns: 1fr;\n }\n}\n\n/* Execution History Panel - Max Height and Scroll */\n.execution-history-panel {\n max-height: 500px;\n overflow-y: auto;\n overflow-x: hidden;\n}\n\n/* Custom scrollbar for execution history */\n.execution-history-panel::-webkit-scrollbar {\n width: 8px;\n}\n\n.execution-history-panel::-webkit-scrollbar-track {\n background: #f1f1f1;\n border-radius: 4px;\n}\n\n.execution-history-panel::-webkit-scrollbar-thumb {\n background: #c1c1c1;\n border-radius: 4px;\n}\n\n.execution-history-panel::-webkit-scrollbar-thumb:hover {\n background: #a0a0a0;\n}\n\n/* New Execution History Card Design */\n.execution-history-list {\n display: flex;\n flex-direction: column;\n gap: 12px;\n margin-top: 16px;\n}\n\n.execution-card {\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 12px;\n overflow: hidden;\n transition: all 0.2s ease;\n cursor: pointer;\n}\n\n.execution-card:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.1);\n transform: translateY(-1px);\n}\n\n.execution-card.expanded {\n border-color: #2196f3;\n box-shadow: 0 6px 20px rgba(33, 150, 243, 0.15);\n}\n\n.execution-header {\n padding: 16px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n}\n\n.execution-left-section {\n display: flex;\n flex-direction: column;\n gap: 12px;\n flex: 1;\n min-width: 0;\n}\n\n.execution-status {\n display: flex;\n align-items: center;\n gap: 12px;\n flex-shrink: 0;\n}\n\n.status-indicator {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n box-shadow: 0 2px 8px rgba(0,0,0,0.1);\n}\n\n.status-indicator i {\n color: white;\n font-size: 14px;\n}\n\n.execution-info {\n display: flex;\n flex-direction: column;\n gap: 2px;\n}\n\n.execution-title {\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.execution-date {\n font-size: 12px;\n color: #6c757d;\n}\n\n.execution-metrics {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n flex-wrap: wrap;\n margin-left: 44px; /* Align with execution title text, accounting for status indicator + gap */\n}\n\n.metric-item {\n display: flex;\n align-items: center;\n gap: 6px;\n font-size: 12px;\n background: #f8f9fa;\n padding: 6px 10px;\n border-radius: 6px;\n color: #495057;\n white-space: nowrap;\n}\n\n.metric-item i {\n color: #6c757d;\n font-size: 12px;\n}\n\n.metric-label {\n font-weight: 500;\n}\n\n.metric-value {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.execution-actions {\n display: flex;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.action-btn {\n width: 32px;\n height: 32px;\n border: none;\n background: #f8f9fa;\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n color: #6c757d;\n}\n\n.action-btn:hover {\n background: #2196f3;\n color: white;\n transform: translateY(-1px);\n}\n\n.action-btn i {\n font-size: 12px;\n}\n\n.expand-icon {\n transition: transform 0.2s ease;\n color: #6c757d;\n margin-right: 4px;\n}\n\n.expand-icon.expanded {\n transform: rotate(90deg);\n}\n\n/* Execution Expanded Content */\n.execution-expanded-content {\n padding: 16px;\n border-top: 1px solid #f0f4f8;\n background: #fafbfc;\n animation: slideDown 0.2s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n max-height: 0;\n padding-top: 0;\n padding-bottom: 0;\n }\n to {\n opacity: 1;\n max-height: 500px;\n padding-top: 16px;\n padding-bottom: 16px;\n }\n}\n\n.detailed-metrics {\n margin-bottom: 20px;\n}\n\n.metrics-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.metric-detail {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px;\n background: white;\n border: 1px solid #e0e6ed;\n border-radius: 8px;\n}\n\n.metric-detail i {\n color: #2196f3;\n font-size: 16px;\n width: 20px;\n text-align: center;\n}\n\n.metric-info {\n display: flex;\n flex-direction: column;\n gap: 2px;\n flex: 1;\n}\n\n.metric-title {\n font-size: 11px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.metric-data {\n font-size: 14px;\n font-weight: 600;\n color: #2c3e50;\n}\n\n.result-section {\n margin-top: 16px;\n}\n\n.result-section h5 {\n font-size: 14px;\n font-weight: 600;\n color: #495057;\n margin-bottom: 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.error-section h5 {\n color: #dc3545;\n}\n\n.error-content {\n background: #f8d7da;\n border: 1px solid #f5c6cb;\n border-radius: 8px;\n padding: 12px 16px;\n font-size: 14px;\n line-height: 1.6;\n color: #721c24;\n white-space: pre-wrap;\n word-break: break-word;\n max-height: 150px;\n overflow-y: auto;\n}\n\n/* Responsive adjustments for execution history */\n@media (max-width: 768px) {\n .execution-header {\n flex-direction: column;\n align-items: flex-start;\n gap: 12px;\n }\n \n .execution-left-section {\n width: 100%;\n }\n \n .execution-metrics {\n margin-left: 0; /* Remove left margin on mobile */\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n }\n \n .metric-item {\n font-size: 11px;\n padding: 4px 8px;\n }\n \n .metrics-grid {\n grid-template-columns: 1fr;\n }\n}\n\n/* === PAYLOAD MANAGEMENT SECTION === */\n.payload-section {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.payload-section-title {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.payload-section-title i {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n/* Payload Scope Styling */\n.payload-field-container {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-field-info {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-label {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.payload-field-description {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.5;\n margin: 0;\n}\n\n.payload-field-input {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.payload-field-example {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n font-size: 0.85rem;\n color: #6c757d;\n background: #f8f9fa;\n padding: 0.5rem 0.75rem;\n border-radius: 6px;\n border: 1px solid #e9ecef;\n}\n\n.payload-field-example i {\n color: #ffc107;\n font-size: 0.9rem;\n}\n\n.payload-field-example code {\n background: #e9ecef;\n padding: 0.2rem 0.4rem;\n border-radius: 4px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.8rem;\n color: #495057;\n}\n\n/* Path Configuration Grid */\n.payload-paths-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n}\n\n.payload-path-card {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.payload-path-card:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.payload-path-header {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.payload-path-icon {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.payload-path-icon.downstream {\n background: linear-gradient(135deg, #28a745, #20c997);\n}\n\n.payload-path-icon.upstream {\n background: linear-gradient(135deg, #007bff, #6610f2);\n}\n\n.payload-path-icon.self-read {\n background: linear-gradient(135deg, #17a2b8, #20c997);\n}\n\n.payload-path-icon.self-write {\n background: linear-gradient(135deg, #ffc107, #fd7e14);\n}\n\n.payload-path-icon i {\n color: white;\n font-size: 1.2rem;\n}\n\n.payload-path-info h4 {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.payload-path-info p {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-content {\n padding: 1rem;\n}\n\n.json-editor-container {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n margin-bottom: 0.75rem;\n}\n\n.json-editor-container:hover {\n border-color: #2196f3;\n}\n\n.payload-path-hint {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.payload-path-hint i {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.payload-path-hint code {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n/* Payload Validation Container */\n.payload-validation-container {\n padding: 1.5rem;\n display: grid;\n grid-template-columns: 1fr 2fr;\n gap: 2rem;\n align-items: start;\n}\n\n.payload-validation-settings {\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n}\n\n.validation-field-group {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.validation-field-label {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n}\n\n.validation-field-description {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0 0 0.5rem 0;\n}\n\n.payload-validation-schema {\n display: flex;\n flex-direction: column;\n gap: 0.75rem;\n}\n\n.validation-schema-label {\n font-weight: 600;\n color: #495057;\n font-size: 0.95rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.validation-schema-label i {\n color: #2196f3;\n}\n\n.validation-schema-description {\n color: #6c757d;\n font-size: 0.9rem;\n line-height: 1.4;\n margin: 0;\n}\n\n.validation-schema-editor {\n border: 1px solid #dee2e6;\n border-radius: 6px;\n overflow: hidden;\n}\n\n.validation-schema-editor:hover {\n border-color: #2196f3;\n}\n\n/* === CONFIGURATION SECTION === */\n.config-section {\n margin-bottom: 2rem;\n background: white;\n border-radius: 12px;\n border: 1px solid #e0e0e0;\n overflow: hidden;\n}\n\n.config-section-title {\n margin: 0;\n padding: 1rem 1.5rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n color: #495057;\n font-size: 1.1rem;\n font-weight: 600;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.config-section-title i {\n color: #2196f3;\n font-size: 1.2rem;\n}\n\n.config-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));\n gap: 1.5rem;\n padding: 1.5rem;\n width: 100%;\n}\n\n.config-card {\n background: white;\n border: 1px solid #e0e0e0;\n border-radius: 8px;\n overflow: hidden;\n transition: all 0.2s ease;\n}\n\n.config-card:hover {\n border-color: #2196f3;\n box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);\n}\n\n.config-card.full-width {\n grid-column: 1 / -1;\n}\n\n.config-card-header {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 1rem;\n background: linear-gradient(135deg, #f8f9fa, #e9ecef);\n border-bottom: 1px solid #e0e0e0;\n}\n\n.config-card-icon {\n width: 40px;\n height: 40px;\n border-radius: 8px;\n background: linear-gradient(135deg, #2196f3, #1976d2);\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.config-card-icon i {\n color: white;\n font-size: 1.2rem;\n}\n\n.config-card-info h4 {\n margin: 0 0 0.25rem 0;\n font-size: 1rem;\n font-weight: 600;\n color: #495057;\n}\n\n.config-card-info p {\n margin: 0;\n font-size: 0.85rem;\n color: #6c757d;\n line-height: 1.4;\n}\n\n.config-card-content {\n padding: 1rem;\n}\n\n/* Custom field styling for config cards */\n.config-field-input {\n width: 100%;\n min-width: 250px;\n}\n\n/* Fix numeric textbox cutoff issue */\n.config-card-content ::ng-deep kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-card-content ::ng-deep mj-form-field {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep mj-form-field kendo-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep mj-form-field kendo-numerictextbox .k-numerictextbox {\n width: 100% !important;\n}\n\n.config-card-content ::ng-deep mj-form-field kendo-numerictextbox .k-input {\n width: 100% !important;\n min-width: 200px !important;\n}\n\n.config-field-display {\n color: #495057;\n font-size: 14px;\n font-weight: 500;\n padding: 8px 0;\n display: block;\n min-height: 20px;\n}\n\n/* Prompt selector styling */\n.prompt-selector-container {\n display: flex;\n align-items: center;\n gap: 12px;\n width: 100%;\n}\n\n.prompt-display {\n flex: 1;\n min-width: 0;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 6px;\n}\n\n.prompt-name {\n color: #495057;\n font-weight: 500;\n font-size: 14px;\n}\n\n.no-prompt {\n color: #6c757d;\n font-style: italic;\n font-size: 14px;\n}\n\n.prompt-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n flex-shrink: 0;\n}\n\n.prompt-select-btn {\n white-space: nowrap;\n}\n\n.prompt-clear-btn {\n min-width: 32px;\n}\n\n.config-card-hint {\n display: flex;\n align-items: flex-start;\n gap: 0.5rem;\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.4;\n margin-top: 0.5rem;\n}\n\n.config-card-hint i {\n color: #17a2b8;\n margin-top: 0.1rem;\n flex-shrink: 0;\n}\n\n.config-card-hint code {\n background: #e9ecef;\n padding: 0.1rem 0.3rem;\n border-radius: 3px;\n font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;\n font-size: 0.75rem;\n color: #495057;\n}\n\n\n/* === RESPONSIVE DESIGN === */\n@media (max-width: 768px) {\n .payload-field-container,\n .payload-validation-container {\n grid-template-columns: 1fr;\n gap: 1rem;\n }\n \n .payload-paths-grid {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .config-grid {\n grid-template-columns: 1fr;\n gap: 1rem;\n padding: 1rem;\n }\n \n .payload-section-title,\n .config-section-title {\n padding: 0.75rem 1rem;\n font-size: 1rem;\n }\n \n .payload-path-header,\n .config-card-header {\n padding: 0.75rem;\n }\n \n .payload-path-content,\n .config-card-content {\n padding: 0.75rem;\n }\n \n .payload-field-container,\n .payload-validation-container {\n padding: 1rem;\n }\n}\n\n"] }]
3715
3715
  }], () => [{ type: i0.ElementRef }, { type: i1.SharedService }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: i0.ChangeDetectorRef }, { type: i3.DialogService }, { type: i0.ViewContainerRef }, { type: i4.AIAgentManagementService }, { type: i5.AITestHarnessDialogService }], { customSectionContainer: [{
3716
3716
  type: ViewChild,
3717
3717
  args: ['customSectionContainer', { read: ViewContainerRef }]