@memberjunction/ng-dashboards 2.53.0 → 2.55.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 (26) hide show
  1. package/dist/AI/ai-dashboard.component.d.ts.map +1 -1
  2. package/dist/AI/ai-dashboard.component.js +47 -47
  3. package/dist/AI/ai-dashboard.component.js.map +1 -1
  4. package/dist/AI/components/agents/agent-configuration.component.d.ts +8 -3
  5. package/dist/AI/components/agents/agent-configuration.component.d.ts.map +1 -1
  6. package/dist/AI/components/agents/agent-configuration.component.js +99 -67
  7. package/dist/AI/components/agents/agent-configuration.component.js.map +1 -1
  8. package/dist/AI/components/models/model-management-v2.component.js +3 -5
  9. package/dist/AI/components/models/model-management-v2.component.js.map +1 -1
  10. package/dist/AI/components/prompts/prompt-management-v2.component.d.ts +3 -0
  11. package/dist/AI/components/prompts/prompt-management-v2.component.d.ts.map +1 -1
  12. package/dist/AI/components/prompts/prompt-management-v2.component.js +148 -105
  13. package/dist/AI/components/prompts/prompt-management-v2.component.js.map +1 -1
  14. package/dist/Actions/actions-management-dashboard.component.d.ts +1 -0
  15. package/dist/Actions/actions-management-dashboard.component.d.ts.map +1 -1
  16. package/dist/Actions/actions-management-dashboard.component.js +31 -16
  17. package/dist/Actions/actions-management-dashboard.component.js.map +1 -1
  18. package/dist/Actions/components/actions-overview.component.d.ts +3 -1
  19. package/dist/Actions/components/actions-overview.component.d.ts.map +1 -1
  20. package/dist/Actions/components/actions-overview.component.js +97 -77
  21. package/dist/Actions/components/actions-overview.component.js.map +1 -1
  22. package/dist/module.d.ts +10 -6
  23. package/dist/module.d.ts.map +1 -1
  24. package/dist/module.js +22 -3
  25. package/dist/module.js.map +1 -1
  26. package/package.json +12 -7
package/dist/AI/components/prompts/prompt-management-v2.component.js CHANGED
@@ -6,14 +6,15 @@ import * as i0 from "@angular/core";
6
6
  import * as i1 from "@memberjunction/ng-shared";
7
7
  import * as i2 from "@angular/forms";
8
8
  import * as i3 from "@progress/kendo-angular-layout";
9
- import * as i4 from "@memberjunction/ng-container-directives";
10
- import * as i5 from "./model-prompt-priority-matrix.component";
9
+ import * as i4 from "@progress/kendo-angular-dialog";
10
+ import * as i5 from "@memberjunction/ng-ai-test-harness";
11
+ import * as i6 from "./model-prompt-priority-matrix.component";
11
12
  const _forTrack0 = ($index, $item) => $item.ID;
12
13
  function PromptManagementV2Component_Conditional_1_Template(rf, ctx) { if (rf & 1) {
13
- i0.ɵɵelementStart(0, "div", 1)(1, "div", 2)(2, "div", 3);
14
- i0.ɵɵelement(3, "div", 4)(4, "div", 4)(5, "div", 4);
14
+ i0.ɵɵelementStart(0, "div", 1)(1, "div", 3)(2, "div", 4);
15
+ i0.ɵɵelement(3, "div", 5)(4, "div", 5)(5, "div", 5);
15
16
  i0.ɵɵelementEnd();
16
- i0.ɵɵelementStart(6, "div", 5);
17
+ i0.ɵɵelementStart(6, "div", 6);
17
18
  i0.ɵɵtext(7);
18
19
  i0.ɵɵelementEnd()()();
19
20
  } if (rf & 2) {
@@ -28,7 +29,7 @@ function PromptManagementV2Component_Conditional_2_Conditional_8_Template(rf, ct
28
29
  i0.ɵɵtext(0, " Show Filters ");
29
30
  } }
30
31
  function PromptManagementV2Component_Conditional_2_Conditional_23_For_26_Template(rf, ctx) { if (rf & 1) {
31
- i0.ɵɵelementStart(0, "option", 42);
32
+ i0.ɵɵelementStart(0, "option", 43);
32
33
  i0.ɵɵtext(1);
33
34
  i0.ɵɵelementEnd();
34
35
  } if (rf & 2) {
@@ -38,7 +39,7 @@ function PromptManagementV2Component_Conditional_2_Conditional_23_For_26_Templat
38
39
  i0.ɵɵtextInterpolate(category_r4.Name);
39
40
  } }
40
41
  function PromptManagementV2Component_Conditional_2_Conditional_23_For_35_Template(rf, ctx) { if (rf & 1) {
41
- i0.ɵɵelementStart(0, "option", 42);
42
+ i0.ɵɵelementStart(0, "option", 43);
42
43
  i0.ɵɵtext(1);
43
44
  i0.ɵɵelementEnd();
44
45
  } if (rf & 2) {
@@ -49,66 +50,66 @@ function PromptManagementV2Component_Conditional_2_Conditional_23_For_35_Templat
49
50
  } }
50
51
  function PromptManagementV2Component_Conditional_2_Conditional_23_Template(rf, ctx) { if (rf & 1) {
51
52
  const _r3 = i0.ɵɵgetCurrentView();
52
- i0.ɵɵelementStart(0, "kendo-splitter-pane", 24)(1, "div", 27)(2, "div", 28)(3, "h3");
53
+ i0.ɵɵelementStart(0, "kendo-splitter-pane", 25)(1, "div", 28)(2, "div", 29)(3, "h3");
53
54
  i0.ɵɵtext(4, "Prompt Filters");
54
55
  i0.ɵɵelementEnd();
55
- i0.ɵɵelementStart(5, "div", 29)(6, "span", 30);
56
+ i0.ɵɵelementStart(5, "div", 30)(6, "span", 31);
56
57
  i0.ɵɵtext(7);
57
58
  i0.ɵɵelementEnd();
58
- i0.ɵɵelementStart(8, "span", 31);
59
+ i0.ɵɵelementStart(8, "span", 32);
59
60
  i0.ɵɵtext(9);
60
61
  i0.ɵɵelementEnd()();
61
- i0.ɵɵelementStart(10, "button", 32);
62
+ i0.ɵɵelementStart(10, "button", 33);
62
63
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_23_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.toggleFilterPanel()); });
63
- i0.ɵɵelement(11, "span", 33);
64
+ i0.ɵɵelement(11, "span", 34);
64
65
  i0.ɵɵelementEnd()();
65
- i0.ɵɵelementStart(12, "div", 34)(13, "div", 35)(14, "label", 36);
66
- i0.ɵɵelement(15, "span", 37);
66
+ i0.ɵɵelementStart(12, "div", 35)(13, "div", 36)(14, "label", 37);
67
+ i0.ɵɵelement(15, "span", 38);
67
68
  i0.ɵɵtext(16, " Name ");
68
69
  i0.ɵɵelementEnd();
69
- i0.ɵɵelementStart(17, "input", 38);
70
+ i0.ɵɵelementStart(17, "input", 39);
70
71
  i0.ɵɵlistener("input", function PromptManagementV2Component_Conditional_2_Conditional_23_Template_input_input_17_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onSearchChange($event.target.value)); });
71
72
  i0.ɵɵelementEnd()();
72
- i0.ɵɵelementStart(18, "div", 35)(19, "label", 36);
73
- i0.ɵɵelement(20, "span", 39);
73
+ i0.ɵɵelementStart(18, "div", 36)(19, "label", 37);
74
+ i0.ɵɵelement(20, "span", 40);
74
75
  i0.ɵɵtext(21, " Category ");
75
76
  i0.ɵɵelementEnd();
76
- i0.ɵɵelementStart(22, "select", 40);
77
+ i0.ɵɵelementStart(22, "select", 41);
77
78
  i0.ɵɵlistener("change", function PromptManagementV2Component_Conditional_2_Conditional_23_Template_select_change_22_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onCategoryChange($event.target.value)); });
78
- i0.ɵɵelementStart(23, "option", 41);
79
+ i0.ɵɵelementStart(23, "option", 42);
79
80
  i0.ɵɵtext(24, "All Categories");
80
81
  i0.ɵɵelementEnd();
81
- i0.ɵɵrepeaterCreate(25, PromptManagementV2Component_Conditional_2_Conditional_23_For_26_Template, 2, 2, "option", 42, _forTrack0);
82
+ i0.ɵɵrepeaterCreate(25, PromptManagementV2Component_Conditional_2_Conditional_23_For_26_Template, 2, 2, "option", 43, _forTrack0);
82
83
  i0.ɵɵelementEnd()();
83
- i0.ɵɵelementStart(27, "div", 35)(28, "label", 36);
84
- i0.ɵɵelement(29, "span", 43);
84
+ i0.ɵɵelementStart(27, "div", 36)(28, "label", 37);
85
+ i0.ɵɵelement(29, "span", 44);
85
86
  i0.ɵɵtext(30, " Type ");
86
87
  i0.ɵɵelementEnd();
87
- i0.ɵɵelementStart(31, "select", 40);
88
+ i0.ɵɵelementStart(31, "select", 41);
88
89
  i0.ɵɵlistener("change", function PromptManagementV2Component_Conditional_2_Conditional_23_Template_select_change_31_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onTypeChange($event.target.value)); });
89
- i0.ɵɵelementStart(32, "option", 41);
90
+ i0.ɵɵelementStart(32, "option", 42);
90
91
  i0.ɵɵtext(33, "All Types");
91
92
  i0.ɵɵelementEnd();
92
- i0.ɵɵrepeaterCreate(34, PromptManagementV2Component_Conditional_2_Conditional_23_For_35_Template, 2, 2, "option", 42, _forTrack0);
93
+ i0.ɵɵrepeaterCreate(34, PromptManagementV2Component_Conditional_2_Conditional_23_For_35_Template, 2, 2, "option", 43, _forTrack0);
93
94
  i0.ɵɵelementEnd()();
94
- i0.ɵɵelementStart(36, "div", 35)(37, "label", 36);
95
- i0.ɵɵelement(38, "span", 44);
95
+ i0.ɵɵelementStart(36, "div", 36)(37, "label", 37);
96
+ i0.ɵɵelement(38, "span", 45);
96
97
  i0.ɵɵtext(39, " Status ");
97
98
  i0.ɵɵelementEnd();
98
- i0.ɵɵelementStart(40, "select", 40);
99
+ i0.ɵɵelementStart(40, "select", 41);
99
100
  i0.ɵɵlistener("change", function PromptManagementV2Component_Conditional_2_Conditional_23_Template_select_change_40_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onStatusChange($event.target.value)); });
100
- i0.ɵɵelementStart(41, "option", 41);
101
+ i0.ɵɵelementStart(41, "option", 42);
101
102
  i0.ɵɵtext(42, "All Statuses");
102
103
  i0.ɵɵelementEnd();
103
- i0.ɵɵelementStart(43, "option", 45);
104
+ i0.ɵɵelementStart(43, "option", 46);
104
105
  i0.ɵɵtext(44, "Active");
105
106
  i0.ɵɵelementEnd();
106
- i0.ɵɵelementStart(45, "option", 46);
107
+ i0.ɵɵelementStart(45, "option", 47);
107
108
  i0.ɵɵtext(46, "Inactive");
108
109
  i0.ɵɵelementEnd()()();
109
- i0.ɵɵelementStart(47, "div", 47)(48, "button", 48);
110
+ i0.ɵɵelementStart(47, "div", 48)(48, "button", 49);
110
111
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_23_Template_button_click_48_listener() { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.clearFilters()); });
111
- i0.ɵɵelement(49, "span", 49);
112
+ i0.ɵɵelement(49, "span", 50);
112
113
  i0.ɵɵtext(50, " Reset Filters ");
113
114
  i0.ɵɵelementEnd()()()()();
114
115
  } if (rf & 2) {
@@ -132,22 +133,22 @@ function PromptManagementV2Component_Conditional_2_Conditional_23_Template(rf, c
132
133
  } }
133
134
  function PromptManagementV2Component_Conditional_2_Conditional_26_Conditional_6_Template(rf, ctx) { if (rf & 1) {
134
135
  const _r6 = i0.ɵɵgetCurrentView();
135
- i0.ɵɵelementStart(0, "button", 52);
136
+ i0.ɵɵelementStart(0, "button", 53);
136
137
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_26_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.createNewPrompt()); });
137
- i0.ɵɵelement(1, "i", 22);
138
+ i0.ɵɵelement(1, "i", 23);
138
139
  i0.ɵɵtext(2, " Create First Prompt ");
139
140
  i0.ɵɵelementEnd();
140
141
  } }
141
142
  function PromptManagementV2Component_Conditional_2_Conditional_26_Template(rf, ctx) { if (rf & 1) {
142
- i0.ɵɵelementStart(0, "div", 26);
143
- i0.ɵɵelement(1, "i", 50);
143
+ i0.ɵɵelementStart(0, "div", 27);
144
+ i0.ɵɵelement(1, "i", 51);
144
145
  i0.ɵɵelementStart(2, "h3");
145
146
  i0.ɵɵtext(3, "No prompts found");
146
147
  i0.ɵɵelementEnd();
147
148
  i0.ɵɵelementStart(4, "p");
148
149
  i0.ɵɵtext(5);
149
150
  i0.ɵɵelementEnd();
150
- i0.ɵɵtemplate(6, PromptManagementV2Component_Conditional_2_Conditional_26_Conditional_6_Template, 3, 0, "button", 51);
151
+ i0.ɵɵtemplate(6, PromptManagementV2Component_Conditional_2_Conditional_26_Conditional_6_Template, 3, 0, "button", 52);
151
152
  i0.ɵɵelementEnd();
152
153
  } if (rf & 2) {
153
154
  const ctx_r0 = i0.ɵɵnextContext(2);
@@ -157,7 +158,7 @@ function PromptManagementV2Component_Conditional_2_Conditional_26_Template(rf, c
157
158
  i0.ɵɵconditional(!ctx_r0.hasActiveFilters ? 6 : -1);
158
159
  } }
159
160
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
160
- i0.ɵɵelementStart(0, "p", 62);
161
+ i0.ɵɵelementStart(0, "p", 63);
161
162
  i0.ɵɵtext(1);
162
163
  i0.ɵɵelementEnd();
163
164
  } if (rf & 2) {
@@ -166,49 +167,54 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_C
166
167
  i0.ɵɵtextInterpolate(prompt_r8.Description);
167
168
  } }
168
169
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Conditional_22_Template(rf, ctx) { if (rf & 1) {
169
- i0.ɵɵelement(0, "i", 74);
170
+ i0.ɵɵelement(0, "i", 77);
170
171
  i0.ɵɵtext(1, " Yes ");
171
172
  } }
172
173
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Conditional_23_Template(rf, ctx) { if (rf & 1) {
173
- i0.ɵɵelement(0, "i", 75);
174
+ i0.ɵɵelement(0, "i", 78);
174
175
  i0.ɵɵtext(1, " No ");
175
176
  } }
176
177
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Template(rf, ctx) { if (rf & 1) {
177
178
  const _r9 = i0.ɵɵgetCurrentView();
178
- i0.ɵɵelementStart(0, "div", 64)(1, "div", 65)(2, "div", 66)(3, "span", 67);
179
+ i0.ɵɵelementStart(0, "div", 65)(1, "div", 66)(2, "div", 67)(3, "span", 68);
179
180
  i0.ɵɵtext(4, "Category");
180
181
  i0.ɵɵelementEnd();
181
- i0.ɵɵelementStart(5, "span", 68);
182
+ i0.ɵɵelementStart(5, "span", 69);
182
183
  i0.ɵɵtext(6);
183
184
  i0.ɵɵelementEnd()();
184
- i0.ɵɵelementStart(7, "div", 66)(8, "span", 67);
185
+ i0.ɵɵelementStart(7, "div", 67)(8, "span", 68);
185
186
  i0.ɵɵtext(9, "Type");
186
187
  i0.ɵɵelementEnd();
187
- i0.ɵɵelementStart(10, "span", 68);
188
+ i0.ɵɵelementStart(10, "span", 69);
188
189
  i0.ɵɵtext(11);
189
190
  i0.ɵɵelementEnd()();
190
- i0.ɵɵelementStart(12, "div", 66)(13, "span", 67);
191
+ i0.ɵɵelementStart(12, "div", 67)(13, "span", 68);
191
192
  i0.ɵɵtext(14, "Status");
192
193
  i0.ɵɵelementEnd();
193
- i0.ɵɵelementStart(15, "span", 69);
194
+ i0.ɵɵelementStart(15, "span", 70);
194
195
  i0.ɵɵtext(16);
195
196
  i0.ɵɵelementEnd()()();
196
- i0.ɵɵelementStart(17, "div", 70)(18, "div", 66)(19, "span", 67);
197
+ i0.ɵɵelementStart(17, "div", 71)(18, "div", 67)(19, "span", 68);
197
198
  i0.ɵɵtext(20, "Template");
198
199
  i0.ɵɵelementEnd();
199
- i0.ɵɵelementStart(21, "span", 68);
200
+ i0.ɵɵelementStart(21, "span", 69);
200
201
  i0.ɵɵtemplate(22, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Conditional_22_Template, 2, 0)(23, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Conditional_23_Template, 2, 0);
201
202
  i0.ɵɵelementEnd()();
202
- i0.ɵɵelementStart(24, "div", 66)(25, "span", 67);
203
+ i0.ɵɵelementStart(24, "div", 67)(25, "span", 68);
203
204
  i0.ɵɵtext(26, "Contents");
204
205
  i0.ɵɵelementEnd();
205
- i0.ɵɵelementStart(27, "span", 68);
206
+ i0.ɵɵelementStart(27, "span", 69);
206
207
  i0.ɵɵtext(28);
207
208
  i0.ɵɵelementEnd()()();
208
- i0.ɵɵelementStart(29, "div", 71)(30, "button", 72);
209
- i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Template_button_click_30_listener($event) { i0.ɵɵrestoreView(_r9); const prompt_r8 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(4); ctx_r0.openPrompt(prompt_r8.ID); return i0.ɵɵresetView($event.stopPropagation()); });
210
- i0.ɵɵelement(31, "i", 73);
211
- i0.ɵɵtext(32, " Edit ");
209
+ i0.ɵɵelementStart(29, "div", 72)(30, "button", 73);
210
+ i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Template_button_click_30_listener($event) { i0.ɵɵrestoreView(_r9); const prompt_r8 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r0.testPrompt(prompt_r8.ID, $event)); });
211
+ i0.ɵɵelement(31, "i", 74);
212
+ i0.ɵɵtext(32, " Run ");
213
+ i0.ɵɵelementEnd();
214
+ i0.ɵɵelementStart(33, "button", 75);
215
+ i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Template_button_click_33_listener($event) { i0.ɵɵrestoreView(_r9); const prompt_r8 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(4); ctx_r0.openPrompt(prompt_r8.ID); return i0.ɵɵresetView($event.stopPropagation()); });
216
+ i0.ɵɵelement(34, "i", 76);
217
+ i0.ɵɵtext(35, " Open ");
212
218
  i0.ɵɵelementEnd()()();
213
219
  } if (rf & 2) {
214
220
  const prompt_r8 = i0.ɵɵnextContext().$implicit;
@@ -225,22 +231,24 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_C
225
231
  i0.ɵɵconditional(prompt_r8.TemplateEntity ? 22 : 23);
226
232
  i0.ɵɵadvance(6);
227
233
  i0.ɵɵtextInterpolate((prompt_r8.TemplateContents == null ? null : prompt_r8.TemplateContents.length) || 0);
234
+ i0.ɵɵadvance(2);
235
+ i0.ɵɵproperty("disabled", prompt_r8.Status !== "Active");
228
236
  } }
229
237
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Template(rf, ctx) { if (rf & 1) {
230
238
  const _r7 = i0.ɵɵgetCurrentView();
231
- i0.ɵɵelementStart(0, "div", 57)(1, "div", 58);
239
+ i0.ɵɵelementStart(0, "div", 58)(1, "div", 59);
232
240
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Template_div_click_1_listener() { const prompt_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r0 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r0.togglePromptExpansion(prompt_r8.ID)); });
233
- i0.ɵɵelementStart(2, "div", 59);
241
+ i0.ɵɵelementStart(2, "div", 60);
234
242
  i0.ɵɵelement(3, "i");
235
243
  i0.ɵɵelementEnd();
236
- i0.ɵɵelementStart(4, "div", 60)(5, "h4", 61);
244
+ i0.ɵɵelementStart(4, "div", 61)(5, "h4", 62);
237
245
  i0.ɵɵtext(6);
238
246
  i0.ɵɵelementEnd();
239
- i0.ɵɵtemplate(7, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_7_Template, 2, 1, "p", 62);
247
+ i0.ɵɵtemplate(7, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_7_Template, 2, 1, "p", 63);
240
248
  i0.ɵɵelementEnd();
241
- i0.ɵɵelement(8, "i", 63);
249
+ i0.ɵɵelement(8, "i", 64);
242
250
  i0.ɵɵelementEnd();
243
- i0.ɵɵtemplate(9, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Template, 33, 7, "div", 64);
251
+ i0.ɵɵtemplate(9, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Conditional_9_Template, 36, 8, "div", 65);
244
252
  i0.ɵɵelementEnd();
245
253
  } if (rf & 2) {
246
254
  const prompt_r8 = ctx.$implicit;
@@ -258,8 +266,8 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_T
258
266
  i0.ɵɵconditional(ctx_r0.expandedPromptId === prompt_r8.ID ? 9 : -1);
259
267
  } }
260
268
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_Template(rf, ctx) { if (rf & 1) {
261
- i0.ɵɵelementStart(0, "div", 53);
262
- i0.ɵɵrepeaterCreate(1, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Template, 10, 9, "div", 56, _forTrack0);
269
+ i0.ɵɵelementStart(0, "div", 54);
270
+ i0.ɵɵrepeaterCreate(1, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_For_2_Template, 10, 9, "div", 57, _forTrack0);
263
271
  i0.ɵɵelementEnd();
264
272
  } if (rf & 2) {
265
273
  const ctx_r0 = i0.ɵɵnextContext(3);
@@ -267,14 +275,14 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_Templat
267
275
  i0.ɵɵrepeater(ctx_r0.filteredPrompts);
268
276
  } }
269
277
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Conditional_13_Template(rf, ctx) { if (rf & 1) {
270
- i0.ɵɵelement(0, "i", 74);
278
+ i0.ɵɵelement(0, "i", 77);
271
279
  } }
272
280
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Conditional_14_Template(rf, ctx) { if (rf & 1) {
273
- i0.ɵɵelement(0, "i", 75);
281
+ i0.ɵɵelement(0, "i", 78);
274
282
  } }
275
283
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Template(rf, ctx) { if (rf & 1) {
276
284
  const _r10 = i0.ɵɵgetCurrentView();
277
- i0.ɵɵelementStart(0, "tr")(1, "td")(2, "div", 77);
285
+ i0.ɵɵelementStart(0, "tr")(1, "td")(2, "div", 80);
278
286
  i0.ɵɵelement(3, "i");
279
287
  i0.ɵɵtext(4);
280
288
  i0.ɵɵelementEnd()();
@@ -284,15 +292,19 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_
284
292
  i0.ɵɵelementStart(7, "td");
285
293
  i0.ɵɵtext(8);
286
294
  i0.ɵɵelementEnd();
287
- i0.ɵɵelementStart(9, "td")(10, "span", 78);
295
+ i0.ɵɵelementStart(9, "td")(10, "span", 81);
288
296
  i0.ɵɵtext(11);
289
297
  i0.ɵɵelementEnd()();
290
298
  i0.ɵɵelementStart(12, "td");
291
- i0.ɵɵtemplate(13, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Conditional_13_Template, 1, 0, "i", 74)(14, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Conditional_14_Template, 1, 0, "i", 75);
299
+ i0.ɵɵtemplate(13, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Conditional_13_Template, 1, 0, "i", 77)(14, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Conditional_14_Template, 1, 0, "i", 78);
300
+ i0.ɵɵelementEnd();
301
+ i0.ɵɵelementStart(15, "td")(16, "button", 82);
302
+ i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Template_button_click_16_listener($event) { const prompt_r11 = i0.ɵɵrestoreView(_r10).$implicit; const ctx_r0 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r0.testPrompt(prompt_r11.ID, $event)); });
303
+ i0.ɵɵelement(17, "i", 74);
292
304
  i0.ɵɵelementEnd();
293
- i0.ɵɵelementStart(15, "td")(16, "button", 79);
294
- i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Template_button_click_16_listener() { const prompt_r11 = i0.ɵɵrestoreView(_r10).$implicit; const ctx_r0 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r0.openPrompt(prompt_r11.ID)); });
295
- i0.ɵɵelement(17, "i", 73);
305
+ i0.ɵɵelementStart(18, "button", 83);
306
+ i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Template_button_click_18_listener() { const prompt_r11 = i0.ɵɵrestoreView(_r10).$implicit; const ctx_r0 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r0.openPrompt(prompt_r11.ID)); });
307
+ i0.ɵɵelement(19, "i", 76);
296
308
  i0.ɵɵelementEnd()()();
297
309
  } if (rf & 2) {
298
310
  const prompt_r11 = ctx.$implicit;
@@ -311,9 +323,11 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_
311
323
  i0.ɵɵtextInterpolate1(" ", prompt_r11.Status, " ");
312
324
  i0.ɵɵadvance(2);
313
325
  i0.ɵɵconditional(prompt_r11.TemplateEntity ? 13 : 14);
326
+ i0.ɵɵadvance(3);
327
+ i0.ɵɵproperty("disabled", prompt_r11.Status !== "Active");
314
328
  } }
315
329
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_Template(rf, ctx) { if (rf & 1) {
316
- i0.ɵɵelementStart(0, "div", 54)(1, "table", 76)(2, "thead")(3, "tr")(4, "th");
330
+ i0.ɵɵelementStart(0, "div", 55)(1, "table", 79)(2, "thead")(3, "tr")(4, "th");
317
331
  i0.ɵɵtext(5, "Name");
318
332
  i0.ɵɵelementEnd();
319
333
  i0.ɵɵelementStart(6, "th");
@@ -332,7 +346,7 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_Templat
332
346
  i0.ɵɵtext(15, "Actions");
333
347
  i0.ɵɵelementEnd()()();
334
348
  i0.ɵɵelementStart(16, "tbody");
335
- i0.ɵɵrepeaterCreate(17, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Template, 18, 9, "tr", null, _forTrack0);
349
+ i0.ɵɵrepeaterCreate(17, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_For_18_Template, 20, 10, "tr", null, _forTrack0);
336
350
  i0.ɵɵelementEnd()()();
337
351
  } if (rf & 2) {
338
352
  const ctx_r0 = i0.ɵɵnextContext(3);
@@ -341,7 +355,7 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_Templat
341
355
  } }
342
356
  function PromptManagementV2Component_Conditional_2_Conditional_27_Case_2_Template(rf, ctx) { if (rf & 1) {
343
357
  const _r12 = i0.ɵɵgetCurrentView();
344
- i0.ɵɵelementStart(0, "div", 55)(1, "app-model-prompt-priority-matrix", 80);
358
+ i0.ɵɵelementStart(0, "div", 56)(1, "app-model-prompt-priority-matrix", 84);
345
359
  i0.ɵɵlistener("promptSelected", function PromptManagementV2Component_Conditional_2_Conditional_27_Case_2_Template_app_model_prompt_priority_matrix_promptSelected_1_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.openPrompt($event.ID)); });
346
360
  i0.ɵɵelementEnd()();
347
361
  } if (rf & 2) {
@@ -350,7 +364,7 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Case_2_Templat
350
364
  i0.ɵɵproperty("selectedPrompts", ctx_r0.filteredPromptsAsEntities);
351
365
  } }
352
366
  function PromptManagementV2Component_Conditional_2_Conditional_27_Template(rf, ctx) { if (rf & 1) {
353
- i0.ɵɵtemplate(0, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_Template, 3, 0, "div", 53)(1, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_Template, 19, 0, "div", 54)(2, PromptManagementV2Component_Conditional_2_Conditional_27_Case_2_Template, 2, 1, "div", 55);
367
+ i0.ɵɵtemplate(0, PromptManagementV2Component_Conditional_2_Conditional_27_Case_0_Template, 3, 0, "div", 54)(1, PromptManagementV2Component_Conditional_2_Conditional_27_Case_1_Template, 19, 0, "div", 55)(2, PromptManagementV2Component_Conditional_2_Conditional_27_Case_2_Template, 2, 1, "div", 56);
354
368
  } if (rf & 2) {
355
369
  let tmp_2_0;
356
370
  const ctx_r0 = i0.ɵɵnextContext(2);
@@ -358,39 +372,39 @@ function PromptManagementV2Component_Conditional_2_Conditional_27_Template(rf, c
358
372
  } }
359
373
  function PromptManagementV2Component_Conditional_2_Template(rf, ctx) { if (rf & 1) {
360
374
  const _r2 = i0.ɵɵgetCurrentView();
361
- i0.ɵɵelementStart(0, "div", 6)(1, "div", 7)(2, "h2", 8);
362
- i0.ɵɵelement(3, "i", 9);
375
+ i0.ɵɵelementStart(0, "div", 7)(1, "div", 8)(2, "h2", 9);
376
+ i0.ɵɵelement(3, "i", 10);
363
377
  i0.ɵɵtext(4, " AI Prompts ");
364
378
  i0.ɵɵelementEnd();
365
- i0.ɵɵelementStart(5, "button", 10);
379
+ i0.ɵɵelementStart(5, "button", 11);
366
380
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.toggleFilters()); });
367
- i0.ɵɵelement(6, "i", 11);
381
+ i0.ɵɵelement(6, "i", 12);
368
382
  i0.ɵɵtemplate(7, PromptManagementV2Component_Conditional_2_Conditional_7_Template, 1, 0)(8, PromptManagementV2Component_Conditional_2_Conditional_8_Template, 1, 0);
369
383
  i0.ɵɵelementEnd();
370
- i0.ɵɵelementStart(9, "span", 12);
384
+ i0.ɵɵelementStart(9, "span", 13);
371
385
  i0.ɵɵtext(10);
372
386
  i0.ɵɵelementEnd()();
373
- i0.ɵɵelementStart(11, "div", 13)(12, "div", 14)(13, "button", 15);
387
+ i0.ɵɵelementStart(11, "div", 14)(12, "div", 15)(13, "button", 16);
374
388
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setViewMode("grid")); });
375
- i0.ɵɵelement(14, "i", 16);
389
+ i0.ɵɵelement(14, "i", 17);
376
390
  i0.ɵɵelementEnd();
377
- i0.ɵɵelementStart(15, "button", 17);
391
+ i0.ɵɵelementStart(15, "button", 18);
378
392
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Template_button_click_15_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setViewMode("list")); });
379
- i0.ɵɵelement(16, "i", 18);
393
+ i0.ɵɵelement(16, "i", 19);
380
394
  i0.ɵɵelementEnd();
381
- i0.ɵɵelementStart(17, "button", 19);
395
+ i0.ɵɵelementStart(17, "button", 20);
382
396
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setViewMode("priority-matrix")); });
383
- i0.ɵɵelement(18, "i", 20);
397
+ i0.ɵɵelement(18, "i", 21);
384
398
  i0.ɵɵelementEnd()();
385
- i0.ɵɵelementStart(19, "button", 21);
399
+ i0.ɵɵelementStart(19, "button", 22);
386
400
  i0.ɵɵlistener("click", function PromptManagementV2Component_Conditional_2_Template_button_click_19_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.createNewPrompt()); });
387
- i0.ɵɵelement(20, "i", 22);
401
+ i0.ɵɵelement(20, "i", 23);
388
402
  i0.ɵɵtext(21, " New Prompt ");
389
403
  i0.ɵɵelementEnd()()();
390
- i0.ɵɵelementStart(22, "kendo-splitter", 23);
391
- i0.ɵɵtemplate(23, PromptManagementV2Component_Conditional_2_Conditional_23_Template, 51, 6, "kendo-splitter-pane", 24);
392
- i0.ɵɵelementStart(24, "kendo-splitter-pane")(25, "div", 25);
393
- i0.ɵɵtemplate(26, PromptManagementV2Component_Conditional_2_Conditional_26_Template, 7, 2, "div", 26)(27, PromptManagementV2Component_Conditional_2_Conditional_27_Template, 3, 1);
404
+ i0.ɵɵelementStart(22, "kendo-splitter", 24);
405
+ i0.ɵɵtemplate(23, PromptManagementV2Component_Conditional_2_Conditional_23_Template, 51, 6, "kendo-splitter-pane", 25);
406
+ i0.ɵɵelementStart(24, "kendo-splitter-pane")(25, "div", 26);
407
+ i0.ɵɵtemplate(26, PromptManagementV2Component_Conditional_2_Conditional_26_Template, 7, 2, "div", 27)(27, PromptManagementV2Component_Conditional_2_Conditional_27_Template, 3, 1);
394
408
  i0.ɵɵelementEnd()()();
395
409
  } if (rf & 2) {
396
410
  const ctx_r0 = i0.ɵɵnextContext();
@@ -409,6 +423,20 @@ function PromptManagementV2Component_Conditional_2_Template(rf, ctx) { if (rf &
409
423
  i0.ɵɵadvance(3);
410
424
  i0.ɵɵconditional(ctx_r0.filteredPrompts.length === 0 ? 26 : 27);
411
425
  } }
426
+ function PromptManagementV2Component_Conditional_3_Template(rf, ctx) { if (rf & 1) {
427
+ const _r13 = i0.ɵɵgetCurrentView();
428
+ i0.ɵɵelementStart(0, "kendo-window", 85);
429
+ i0.ɵɵlistener("close", function PromptManagementV2Component_Conditional_3_Template_kendo_window_close_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.closeTestHarness()); });
430
+ i0.ɵɵelementStart(1, "mj-ai-test-harness", 86);
431
+ i0.ɵɵlistener("visibilityChange", function PromptManagementV2Component_Conditional_3_Template_mj_ai_test_harness_visibilityChange_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.closeTestHarness()); });
432
+ i0.ɵɵelementEnd()();
433
+ } if (rf & 2) {
434
+ const ctx_r0 = i0.ɵɵnextContext();
435
+ i0.ɵɵpropertyInterpolate1("title", "Run AI Prompt - ", ctx_r0.selectedPromptForTest.Name || "Untitled", "");
436
+ i0.ɵɵproperty("width", 1200)("height", 800)("minWidth", 800)("minHeight", 600)("draggable", true)("resizable", true)("state", "default");
437
+ i0.ɵɵadvance();
438
+ i0.ɵɵproperty("mode", "prompt")("entity", ctx_r0.selectedPromptForTest)("isVisible", true);
439
+ } }
412
440
  export class PromptManagementV2Component {
413
441
  sharedService;
414
442
  openEntityRecord = new EventEmitter();
@@ -441,6 +469,7 @@ export class PromptManagementV2Component {
441
469
  loadingMessageIndex = 0;
442
470
  loadingMessageInterval;
443
471
  destroy$ = new Subject();
472
+ selectedPromptForTest = null;
444
473
  constructor(sharedService) {
445
474
  this.sharedService = sharedService;
446
475
  }
@@ -522,17 +551,15 @@ export class PromptManagementV2Component {
522
551
  });
523
552
  const categoryMap = new Map(this.categories.map(c => [c.ID, c.Name]));
524
553
  const typeMap = new Map(this.types.map(t => [t.ID, t.Name]));
525
- // Combine the data
554
+ // Combine the data - keep the actual entity objects
526
555
  this.prompts = promptResults.Results.map(prompt => {
527
556
  const template = templateMap.get(prompt.ID);
528
- // Use GetAll() to get all properties as a plain object since BaseEntity uses getters
529
- return {
530
- ...prompt.GetAll(),
531
- TemplateEntity: template,
532
- TemplateContents: template ? (templateContentMap.get(template.ID) || []) : [],
533
- CategoryName: prompt.CategoryID ? categoryMap.get(prompt.CategoryID) || 'Unknown' : 'Uncategorized',
534
- TypeName: prompt.TypeID ? typeMap.get(prompt.TypeID) || 'Unknown' : 'Untyped'
535
- };
557
+ // Add the extra properties directly to the entity
558
+ prompt.TemplateEntity = template;
559
+ prompt.TemplateContents = template ? (templateContentMap.get(template.ID) || []) : [];
560
+ prompt.CategoryName = prompt.CategoryID ? categoryMap.get(prompt.CategoryID) || 'Unknown' : 'Uncategorized';
561
+ prompt.TypeName = prompt.TypeID ? typeMap.get(prompt.TypeID) || 'Unknown' : 'Untyped';
562
+ return prompt;
536
563
  });
537
564
  this.filteredPrompts = [...this.prompts];
538
565
  this.applyFilters();
@@ -632,6 +659,19 @@ export class PromptManagementV2Component {
632
659
  recordId: promptId
633
660
  });
634
661
  }
662
+ testPrompt(promptId, event) {
663
+ if (event) {
664
+ event.stopPropagation();
665
+ }
666
+ // Find the prompt to test - it's already an AIPromptEntity
667
+ const prompt = this.prompts.find(p => p.ID === promptId);
668
+ if (prompt) {
669
+ this.selectedPromptForTest = prompt;
670
+ }
671
+ }
672
+ closeTestHarness() {
673
+ this.selectedPromptForTest = null;
674
+ }
635
675
  async createNewPrompt() {
636
676
  try {
637
677
  const md = new Metadata();
@@ -687,7 +727,7 @@ export class PromptManagementV2Component {
687
727
  this.selectedStatus !== 'all';
688
728
  }
689
729
  get filteredPromptsAsEntities() {
690
- // Cast PromptWithTemplate[] to AIPromptEntity[] for the priority matrix
730
+ // The prompts are already AIPromptEntity instances with extra properties
691
731
  return this.filteredPrompts;
692
732
  }
693
733
  clearFilters() {
@@ -699,18 +739,21 @@ export class PromptManagementV2Component {
699
739
  this.applyFilters();
700
740
  }
701
741
  static ɵfac = function PromptManagementV2Component_Factory(t) { return new (t || PromptManagementV2Component)(i0.ɵɵdirectiveInject(i1.SharedService)); };
702
- static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PromptManagementV2Component, selectors: [["app-prompt-management-v2"]], inputs: { initialState: "initialState" }, outputs: { openEntityRecord: "openEntityRecord", stateChange: "stateChange" }, decls: 3, vars: 1, consts: [[1, "prompt-management-v2"], [1, "loading-container"], [1, "loading-content"], [1, "loading-spinner"], [1, "spinner-ring"], [1, "loading-text"], [1, "dashboard-header", 2, "display", "flex !important", "justify-content", "space-between !important", "align-items", "center !important", "padding", "16px 24px !important", "background", "white !important"], [1, "header-info", 2, "display", "flex !important", "align-items", "center !important", "gap", "16px !important", "flex", "1 !important"], [1, "dashboard-title", 2, "margin", "0 !important", "display", "flex !important", "align-items", "center !important", "gap", "8px !important"], [1, "fa-solid", "fa-message"], ["type", "button", "title", "Toggle Filters", 1, "filter-toggle-btn", 3, "click"], [1, "fa-solid", "fa-filter"], [1, "item-count"], [1, "header-controls", 2, "display", "flex !important", "align-items", "center !important", "gap", "16px !important"], [1, "view-toggle"], ["type", "button", "title", "Grid View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["type", "button", "title", "List View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["type", "button", "title", "Priority Matrix", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-chart-scatter"], ["type", "button", "title", "Create New Prompt", 1, "control-btn", "primary", 3, "click"], [1, "fa-solid", "fa-plus"], ["mjFillContainer", "", "orientation", "horizontal"], ["size", "320", "min", "250", "max", "400"], [1, "content-area"], [1, "empty-state"], [1, "filter-panel"], [1, "filter-panel-header"], [1, "filter-summary-inline"], [1, "summary-value"], [1, "summary-label"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "filter-content"], [1, "filter-group"], [1, "filter-label"], [1, "fa-solid", "fa-search"], ["type", "text", "placeholder", "Search prompts...", 1, "filter-input", 3, "input", "value"], [1, "fa-solid", "fa-folder"], [1, "filter-select", 3, "change", "value"], ["value", "all"], [3, "value"], [1, "fa-solid", "fa-tag"], [1, "fa-solid", "fa-toggle-on"], ["value", "active"], ["value", "inactive"], [1, "filter-actions"], ["title", "Reset all filters", 1, "reset-btn", 3, "click"], [1, "fa-solid", "fa-undo"], [1, "fa-solid", "fa-comment-dots", "fa-4x"], [1, "primary-action"], [1, "primary-action", 3, "click"], [1, "prompt-grid"], [1, "prompt-list"], [1, "priority-matrix-container"], [1, "prompt-card", 3, "expanded"], [1, "prompt-card"], [1, "card-header", 3, "click"], [1, "card-icon"], [1, "card-info"], [1, "prompt-name"], [1, "card-description"], [1, "fa-solid", "fa-chevron-down", "expand-icon"], [1, "card-content"], [1, "stats-grid"], [1, "stat"], [1, "stat-label"], [1, "stat-value"], [1, "stat-value", "status-badge"], [1, "stats-grid", 2, "margin-top", "12px"], [1, "card-footer"], [1, "action-button", 3, "click"], [1, "fa-solid", "fa-edit"], [1, "fa-solid", "fa-check-circle", "text-success"], [1, "fa-solid", "fa-times-circle", "text-muted"], [1, "data-table"], [1, "name-cell"], [1, "status-badge"], [1, "action-button", "small", 3, "click"], [3, "promptSelected", "selectedPrompts"]], template: function PromptManagementV2Component_Template(rf, ctx) { if (rf & 1) {
742
+ static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PromptManagementV2Component, selectors: [["app-prompt-management-v2"]], inputs: { initialState: "initialState" }, outputs: { openEntityRecord: "openEntityRecord", stateChange: "stateChange" }, decls: 4, vars: 2, consts: [[1, "prompt-management-v2"], [1, "loading-container"], [3, "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [1, "loading-content"], [1, "loading-spinner"], [1, "spinner-ring"], [1, "loading-text"], [1, "dashboard-header", 2, "display", "flex !important", "justify-content", "space-between !important", "align-items", "center !important", "padding", "16px 24px !important", "background", "white !important"], [1, "header-info", 2, "display", "flex !important", "align-items", "center !important", "gap", "16px !important", "flex", "1 !important"], [1, "dashboard-title", 2, "margin", "0 !important", "display", "flex !important", "align-items", "center !important", "gap", "8px !important"], [1, "fa-solid", "fa-message"], ["type", "button", "title", "Toggle Filters", 1, "filter-toggle-btn", 3, "click"], [1, "fa-solid", "fa-filter"], [1, "item-count"], [1, "header-controls", 2, "display", "flex !important", "align-items", "center !important", "gap", "16px !important"], [1, "view-toggle"], ["type", "button", "title", "Grid View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["type", "button", "title", "List View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["type", "button", "title", "Priority Matrix", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-chart-scatter"], ["type", "button", "title", "Create New Prompt", 1, "control-btn", "primary", 3, "click"], [1, "fa-solid", "fa-plus"], ["orientation", "horizontal"], ["size", "320", "min", "250", "max", "400"], [1, "content-area"], [1, "empty-state"], [1, "filter-panel"], [1, "filter-panel-header"], [1, "filter-summary-inline"], [1, "summary-value"], [1, "summary-label"], [1, "close-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "filter-content"], [1, "filter-group"], [1, "filter-label"], [1, "fa-solid", "fa-search"], ["type", "text", "placeholder", "Search prompts...", 1, "filter-input", 3, "input", "value"], [1, "fa-solid", "fa-folder"], [1, "filter-select", 3, "change", "value"], ["value", "all"], [3, "value"], [1, "fa-solid", "fa-tag"], [1, "fa-solid", "fa-toggle-on"], ["value", "active"], ["value", "inactive"], [1, "filter-actions"], ["title", "Reset all filters", 1, "reset-btn", 3, "click"], [1, "fa-solid", "fa-undo"], [1, "fa-solid", "fa-comment-dots", "fa-4x"], [1, "primary-action"], [1, "primary-action", 3, "click"], [1, "prompt-grid"], [1, "prompt-list"], [1, "priority-matrix-container"], [1, "prompt-card", 3, "expanded"], [1, "prompt-card"], [1, "card-header", 3, "click"], [1, "card-icon"], [1, "card-info"], [1, "prompt-name"], [1, "card-description"], [1, "fa-solid", "fa-chevron-down", "expand-icon"], [1, "card-content"], [1, "stats-grid"], [1, "stat"], [1, "stat-label"], [1, "stat-value"], [1, "stat-value", "status-badge"], [1, "stats-grid", 2, "margin-top", "12px"], [1, "card-footer"], ["title", "Run Prompt", 1, "action-button", "primary", 3, "click", "disabled"], [1, "fa-solid", "fa-play"], ["title", "Edit Prompt", 1, "action-button", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], [1, "fa-solid", "fa-check-circle", "text-success"], [1, "fa-solid", "fa-times-circle", "text-muted"], [1, "data-table"], [1, "name-cell"], [1, "status-badge"], ["title", "Run Prompt", 1, "action-button", "small", "primary", 3, "click", "disabled"], ["title", "Edit Prompt", 1, "action-button", "small", 3, "click"], [3, "promptSelected", "selectedPrompts"], [3, "close", "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [3, "visibilityChange", "mode", "entity", "isVisible"]], template: function PromptManagementV2Component_Template(rf, ctx) { if (rf & 1) {
703
743
  i0.ɵɵelementStart(0, "div", 0);
704
744
  i0.ɵɵtemplate(1, PromptManagementV2Component_Conditional_1_Template, 8, 1, "div", 1)(2, PromptManagementV2Component_Conditional_2_Template, 28, 10);
705
745
  i0.ɵɵelementEnd();
746
+ i0.ɵɵtemplate(3, PromptManagementV2Component_Conditional_3_Template, 2, 12, "kendo-window", 2);
706
747
  } if (rf & 2) {
707
748
  i0.ɵɵadvance();
708
749
  i0.ɵɵconditional(ctx.isLoading ? 1 : 2);
709
- } }, dependencies: [i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i3.SplitterComponent, i3.SplitterPaneComponent, i4.FillContainer, i5.ModelPromptPriorityMatrixComponent], styles: [".prompt-management-v2[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n background-color: #f5f7fa;\n}\n\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] state\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n background-color: #f5f7fa;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n position: relative;\n width: 80px;\n height: 80px;\n margin: 0 auto 20px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n position: absolute;\n width: 100%;\n height: 100%;\n border: 3px solid transparent;\n border-top-color: #17a2b8;\n border-radius: 50%;\n animation: _ngcontent-%COMP%_spin 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;\n \n &:nth-child(2) {\n animation-delay: 0.15s;\n width: 70%;\n height: 70%;\n top: 15%;\n left: 15%;\n border-top-color: #28a745;\n }\n \n &:nth-child(3) {\n animation-delay: 0.3s;\n width: 40%;\n height: 40%;\n top: 30%;\n left: 30%;\n border-top-color: #ffc107;\n }\n}\n\n@keyframes _ngcontent-%COMP%_spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 16px;\n animation: _ngcontent-%COMP%_pulse 2s ease-in-out infinite;\n}\n\n@keyframes _ngcontent-%COMP%_pulse {\n 0%, 100% { opacity: 0.6; }\n 50% { opacity: 1; }\n}\n\n//[_ngcontent-%COMP%] Dashboard[_ngcontent-%COMP%] Header\n.dashboard-header[_ngcontent-%COMP%] {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n//[_ngcontent-%COMP%] View[_ngcontent-%COMP%] Toggle\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n color: #495057;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n//[_ngcontent-%COMP%] Control[_ngcontent-%COMP%] Buttons\n.control-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 10px 20px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.control-btn.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary[_ngcontent-%COMP%]:hover {\n background: #138496;\n border-color: #117a8b;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n//[_ngcontent-%COMP%] Splitter[_ngcontent-%COMP%] content\nkendo-splitter[_ngcontent-%COMP%] {\n flex: 1;\n background-color: #f5f7fa;\n margin-top: 8px;\n}\n\n//[_ngcontent-%COMP%] Filter[_ngcontent-%COMP%] panel\n.filter-panel[_ngcontent-%COMP%] {\n height: 100%;\n background: white;\n border-right: 1px solid #e0e0e0;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n}\n\n.filter-panel-header[_ngcontent-%COMP%] {\n padding: 16px;\n border-bottom: 1px solid #f0f0f0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-shrink: 0;\n \n h3 {\n margin: 0;\n font-size: 16px;\n font-weight: 500;\n color: #333;\n flex: 1;\n }\n \n .filter-summary-inline {\n display: flex;\n align-items: baseline;\n gap: 4px;\n margin-right: 12px;\n font-size: 12px;\n \n .summary-value {\n font-weight: 600;\n color: #2196f3;\n }\n \n .summary-label {\n color: #666;\n }\n }\n \n .close-btn {\n background: none;\n border: none;\n padding: 4px;\n cursor: pointer;\n color: #666;\n border-radius: 3px;\n transition: all 0.2s;\n \n &:hover {\n background: #f0f0f0;\n color: #333;\n }\n \n .fa-solid {\n font-size: 12px;\n }\n }\n}\n\n.filter-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 12px;\n}\n\n.filter-group[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n \n .filter-label {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 500;\n color: #555;\n \n .fa-solid {\n font-size: 11px;\n color: #2196f3;\n width: 12px;\n }\n }\n}\n\n.filter-input[_ngcontent-%COMP%], .filter-select[_ngcontent-%COMP%] {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 10px;\n border: 1px solid #ddd;\n border-radius: 4px;\n font-size: 12px;\n background: white;\n transition: border-color 0.2s;\n box-sizing: border-box;\n \n &:focus {\n outline: none;\n border-color: #2196f3;\n }\n \n &::placeholder {\n color: #999;\n }\n}\n\n.filter-select[_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.filter-actions[_ngcontent-%COMP%] {\n margin-top: 24px;\n padding-top: 16px;\n border-top: 1px solid #f0f0f0;\n \n .reset-btn {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n color: #666;\n font-size: 12px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n transition: all 0.2s;\n box-sizing: border-box;\n \n &:hover {\n background: #e9ecef;\n border-color: #ccc;\n color: #333;\n }\n \n .fa-solid {\n font-size: 11px;\n }\n }\n}\n\n//[_ngcontent-%COMP%] Content[_ngcontent-%COMP%] area\n.content-area[_ngcontent-%COMP%] {\n height: 100%;\n padding: 24px;\n overflow-y: auto;\n background: #f5f7fa;\n}\n\n//[_ngcontent-%COMP%] Empty[_ngcontent-%COMP%] state\n.empty-state[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n text-align: center;\n color: #6c757d;\n \n i {\n margin-bottom: 24px;\n opacity: 0.3;\n }\n \n h3 {\n margin: 0 0 8px 0;\n font-size: 20px;\n font-weight: 600;\n color: #495057;\n }\n \n p {\n margin: 0 0 24px 0;\n font-size: 16px;\n }\n}\n\n//[_ngcontent-%COMP%] Grid[_ngcontent-%COMP%] view\n.prompt-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.prompt-card[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n \n &:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n }\n \n &.expanded {\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);\n .expand-icon {\n transform: rotate(180deg);\n }\n }\n}\n\n.card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n padding: 20px;\n cursor: pointer;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n}\n\n.card-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n background-color: #e3f2fd;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n \n i {\n font-size: 24px;\n color: #17a2b8;\n }\n}\n\n.card-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n \n .prompt-name {\n margin: 0 0 4px 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n }\n\n .card-description {\n margin: 0;\n font-size: 13px;\n color: #6c757d;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n line-height: 1.4;\n }\n}\n\n\n.expand-icon[_ngcontent-%COMP%] {\n color: #adb5bd;\n transition: transform 0.3s ease;\n margin-left: 12px;\n}\n\n.card-content[_ngcontent-%COMP%] {\n padding: 0 20px 20px;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.description-section[_ngcontent-%COMP%] {\n margin-bottom: 16px;\n \n h5 {\n margin: 0 0 8px 0;\n font-size: 13px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n \n p {\n margin: 0;\n font-size: 14px;\n color: #495057;\n line-height: 1.6;\n }\n}\n\n.stats-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 16px;\n margin-bottom: 16px;\n}\n\n.stat[_ngcontent-%COMP%] {\n text-align: center;\n \n .stat-label {\n display: block;\n font-size: 12px;\n color: #6c757d;\n margin-bottom: 4px;\n }\n \n .stat-value {\n display: block;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n }\n}\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n font-weight: 500;\n \n &.active {\n background-color: #d4edda;\n color: #155724;\n }\n \n &.inactive {\n background-color: #f8d7da;\n color: #721c24;\n }\n}\n\n.card-footer[_ngcontent-%COMP%] {\n padding-top: 16px;\n border-top: 1px solid #e9ecef;\n display: flex;\n gap: 8px;\n}\n\n.action-button[_ngcontent-%COMP%] {\n padding: 6px 12px;\n background-color: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 4px;\n color: #495057;\n font-size: 13px;\n cursor: pointer;\n transition: all 0.2s ease;\n \n &:hover {\n background-color: #e9ecef;\n border-color: #adb5bd;\n color: #212529;\n }\n \n &.small {\n padding: 4px 8px;\n font-size: 12px;\n }\n \n i {\n margin-right: 4px;\n }\n}\n\n//[_ngcontent-%COMP%] List[_ngcontent-%COMP%] view\n.prompt-list[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.data-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n \n thead {\n background-color: #f8f9fa;\n \n tr {\n border-bottom: 2px solid #dee2e6;\n }\n \n th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n }\n \n tbody {\n tr {\n border-bottom: 1px solid #e9ecef;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n \n &:last-child {\n border-bottom: none;\n }\n }\n \n td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n }\n }\n}\n\n.name-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-weight: 500;\n color: #2c3e50;\n \n i {\n color: #17a2b8;\n }\n}\n\n//[_ngcontent-%COMP%] Priority[_ngcontent-%COMP%] matrix[_ngcontent-%COMP%] container\n.priority-matrix-container[_ngcontent-%COMP%] {\n height: 100%;\n background-color: white;\n border-radius: 12px;\n padding: 24px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n}\n\n//[_ngcontent-%COMP%] Responsive\n@media[_ngcontent-%COMP%] (max-width[_ngcontent-%COMP%]: 768px)[_ngcontent-%COMP%] {\n .prompt-header {\n flex-wrap: wrap;\n gap: 16px;\n }\n \n .header-right {\n width: 100%;\n justify-content: space-between;\n }\n \n .prompt-grid {\n grid-template-columns: 1fr;\n }\n \n .stats-grid {\n grid-template-columns: 1fr;\n }\n}\n\n//[_ngcontent-%COMP%] Text[_ngcontent-%COMP%] utility[_ngcontent-%COMP%] classes\n.text-success[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.text-muted[_ngcontent-%COMP%] {\n color: #6c757d;\n}"] });
750
+ i0.ɵɵadvance(2);
751
+ i0.ɵɵconditional(ctx.selectedPromptForTest ? 3 : -1);
752
+ } }, dependencies: [i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i3.SplitterComponent, i3.SplitterPaneComponent, i4.WindowComponent, i5.AITestHarnessComponent, i6.ModelPromptPriorityMatrixComponent], styles: [".prompt-management-v2[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n background-color: #f5f7fa;\n}\n\n//[_ngcontent-%COMP%] Loading[_ngcontent-%COMP%] state\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n background-color: #f5f7fa;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n position: relative;\n width: 80px;\n height: 80px;\n margin: 0 auto 20px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n position: absolute;\n width: 100%;\n height: 100%;\n border: 3px solid transparent;\n border-top-color: #17a2b8;\n border-radius: 50%;\n animation: _ngcontent-%COMP%_spin 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;\n \n &:nth-child(2) {\n animation-delay: 0.15s;\n width: 70%;\n height: 70%;\n top: 15%;\n left: 15%;\n border-top-color: #28a745;\n }\n \n &:nth-child(3) {\n animation-delay: 0.3s;\n width: 40%;\n height: 40%;\n top: 30%;\n left: 30%;\n border-top-color: #ffc107;\n }\n}\n\n@keyframes _ngcontent-%COMP%_spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 16px;\n animation: _ngcontent-%COMP%_pulse 2s ease-in-out infinite;\n}\n\n@keyframes _ngcontent-%COMP%_pulse {\n 0%, 100% { opacity: 0.6; }\n 50% { opacity: 1; }\n}\n\n//[_ngcontent-%COMP%] Dashboard[_ngcontent-%COMP%] Header\n.dashboard-header[_ngcontent-%COMP%] {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n//[_ngcontent-%COMP%] View[_ngcontent-%COMP%] Toggle\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n color: #495057;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n//[_ngcontent-%COMP%] Control[_ngcontent-%COMP%] Buttons\n.control-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 10px 20px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.control-btn.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary[_ngcontent-%COMP%]:hover {\n background: #138496;\n border-color: #117a8b;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n//[_ngcontent-%COMP%] Splitter[_ngcontent-%COMP%] content\nkendo-splitter[_ngcontent-%COMP%] {\n flex: 1;\n background-color: #f5f7fa;\n margin-top: 8px;\n}\n\n//[_ngcontent-%COMP%] Filter[_ngcontent-%COMP%] panel\n.filter-panel[_ngcontent-%COMP%] {\n height: 100%;\n background: white;\n border-right: 1px solid #e0e0e0;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n}\n\n.filter-panel-header[_ngcontent-%COMP%] {\n padding: 16px;\n border-bottom: 1px solid #f0f0f0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-shrink: 0;\n \n h3 {\n margin: 0;\n font-size: 16px;\n font-weight: 500;\n color: #333;\n flex: 1;\n }\n \n .filter-summary-inline {\n display: flex;\n align-items: baseline;\n gap: 4px;\n margin-right: 12px;\n font-size: 12px;\n \n .summary-value {\n font-weight: 600;\n color: #2196f3;\n }\n \n .summary-label {\n color: #666;\n }\n }\n \n .close-btn {\n background: none;\n border: none;\n padding: 4px;\n cursor: pointer;\n color: #666;\n border-radius: 3px;\n transition: all 0.2s;\n \n &:hover {\n background: #f0f0f0;\n color: #333;\n }\n \n .fa-solid {\n font-size: 12px;\n }\n }\n}\n\n.filter-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 12px;\n}\n\n.filter-group[_ngcontent-%COMP%] {\n margin-bottom: 20px;\n \n .filter-label {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 500;\n color: #555;\n \n .fa-solid {\n font-size: 11px;\n color: #2196f3;\n width: 12px;\n }\n }\n}\n\n.filter-input[_ngcontent-%COMP%], .filter-select[_ngcontent-%COMP%] {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 10px;\n border: 1px solid #ddd;\n border-radius: 4px;\n font-size: 12px;\n background: white;\n transition: border-color 0.2s;\n box-sizing: border-box;\n \n &:focus {\n outline: none;\n border-color: #2196f3;\n }\n \n &::placeholder {\n color: #999;\n }\n}\n\n.filter-select[_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.filter-actions[_ngcontent-%COMP%] {\n margin-top: 24px;\n padding-top: 16px;\n border-top: 1px solid #f0f0f0;\n \n .reset-btn {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n color: #666;\n font-size: 12px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n transition: all 0.2s;\n box-sizing: border-box;\n \n &:hover {\n background: #e9ecef;\n border-color: #ccc;\n color: #333;\n }\n \n .fa-solid {\n font-size: 11px;\n }\n }\n}\n\n//[_ngcontent-%COMP%] Content[_ngcontent-%COMP%] area\n.content-area[_ngcontent-%COMP%] {\n height: 100%;\n padding: 24px;\n overflow-y: auto;\n background: #f5f7fa;\n}\n\n//[_ngcontent-%COMP%] Empty[_ngcontent-%COMP%] state\n.empty-state[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n text-align: center;\n color: #6c757d;\n \n i {\n margin-bottom: 24px;\n opacity: 0.3;\n }\n \n h3 {\n margin: 0 0 8px 0;\n font-size: 20px;\n font-weight: 600;\n color: #495057;\n }\n \n p {\n margin: 0 0 24px 0;\n font-size: 16px;\n }\n}\n\n//[_ngcontent-%COMP%] Grid[_ngcontent-%COMP%] view\n.prompt-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.prompt-card[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n \n &:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n }\n \n &.expanded {\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);\n .expand-icon {\n transform: rotate(180deg);\n }\n }\n}\n\n.card-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n padding: 20px;\n cursor: pointer;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n}\n\n.card-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n background-color: #e3f2fd;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n \n i {\n font-size: 24px;\n color: #17a2b8;\n }\n}\n\n.card-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n \n .prompt-name {\n margin: 0 0 4px 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n }\n\n .card-description {\n margin: 0;\n font-size: 13px;\n color: #6c757d;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n line-height: 1.4;\n }\n}\n\n\n.expand-icon[_ngcontent-%COMP%] {\n color: #adb5bd;\n transition: transform 0.3s ease;\n margin-left: 12px;\n}\n\n.card-content[_ngcontent-%COMP%] {\n padding: 0 20px 20px;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.description-section[_ngcontent-%COMP%] {\n margin-bottom: 16px;\n \n h5 {\n margin: 0 0 8px 0;\n font-size: 13px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n \n p {\n margin: 0;\n font-size: 14px;\n color: #495057;\n line-height: 1.6;\n }\n}\n\n.stats-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 16px;\n margin-bottom: 16px;\n}\n\n.stat[_ngcontent-%COMP%] {\n text-align: center;\n \n .stat-label {\n display: block;\n font-size: 12px;\n color: #6c757d;\n margin-bottom: 4px;\n }\n \n .stat-value {\n display: block;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n }\n}\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n font-weight: 500;\n \n &.active {\n background-color: #d4edda;\n color: #155724;\n }\n \n &.inactive {\n background-color: #f8d7da;\n color: #721c24;\n }\n}\n\n.card-footer[_ngcontent-%COMP%] {\n padding-top: 16px;\n border-top: 1px solid #e9ecef;\n display: flex;\n gap: 8px;\n}\n\n.action-button[_ngcontent-%COMP%] {\n padding: 6px 12px;\n background-color: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 4px;\n color: #495057;\n font-size: 13px;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n \n &:hover {\n background-color: #e9ecef;\n border-color: #adb5bd;\n color: #212529;\n }\n \n &.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n \n &:hover:not(:disabled) {\n background: #1485a3;\n border-color: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n }\n \n &:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n \n &:hover {\n transform: none;\n box-shadow: none;\n background: #17a2b8;\n }\n }\n }\n \n &.small {\n padding: 4px 8px;\n font-size: 12px;\n \n &.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n \n &:hover:not(:disabled) {\n background: #1485a3;\n border-color: #1485a3;\n }\n }\n }\n \n &:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n}\n\n//[_ngcontent-%COMP%] List[_ngcontent-%COMP%] view\n.prompt-list[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.data-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n \n thead {\n background-color: #f8f9fa;\n \n tr {\n border-bottom: 2px solid #dee2e6;\n }\n \n th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n }\n \n tbody {\n tr {\n border-bottom: 1px solid #e9ecef;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n \n &:last-child {\n border-bottom: none;\n }\n }\n \n td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n }\n }\n}\n\n.name-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n font-weight: 500;\n color: #2c3e50;\n \n i {\n color: #17a2b8;\n }\n}\n\n//[_ngcontent-%COMP%] Priority[_ngcontent-%COMP%] matrix[_ngcontent-%COMP%] container\n.priority-matrix-container[_ngcontent-%COMP%] {\n height: 100%;\n background-color: white;\n border-radius: 12px;\n padding: 24px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n}\n\n//[_ngcontent-%COMP%] Responsive\n@media[_ngcontent-%COMP%] (max-width[_ngcontent-%COMP%]: 768px)[_ngcontent-%COMP%] {\n .prompt-header {\n flex-wrap: wrap;\n gap: 16px;\n }\n \n .header-right {\n width: 100%;\n justify-content: space-between;\n }\n \n .prompt-grid {\n grid-template-columns: 1fr;\n }\n \n .stats-grid {\n grid-template-columns: 1fr;\n }\n}\n\n//[_ngcontent-%COMP%] Text[_ngcontent-%COMP%] utility[_ngcontent-%COMP%] classes\n.text-success[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.text-muted[_ngcontent-%COMP%] {\n color: #6c757d;\n}"] });
710
753
  }
711
754
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PromptManagementV2Component, [{
712
755
  type: Component,
713
- args: [{ selector: 'app-prompt-management-v2', template: "<div class=\"prompt-management-v2\">\n @if (isLoading) {\n <div class=\"loading-container\">\n <div class=\"loading-content\">\n <div class=\"loading-spinner\">\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n </div>\n <div class=\"loading-text\">{{ currentLoadingMessage }}</div>\n </div>\n </div>\n } @else {\n <div class=\"dashboard-header\" style=\"display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 16px 24px !important; background: white !important;\">\n <div class=\"header-info\" style=\"display: flex !important; align-items: center !important; gap: 16px !important; flex: 1 !important;\">\n <h2 class=\"dashboard-title\" style=\"margin: 0 !important; display: flex !important; align-items: center !important; gap: 8px !important;\">\n <i class=\"fa-solid fa-message\"></i>\n AI Prompts\n </h2>\n <button \n type=\"button\" \n class=\"filter-toggle-btn\"\n (click)=\"toggleFilters()\"\n title=\"Toggle Filters\">\n <i class=\"fa-solid fa-filter\"></i>\n @if (showFilters) {\n Hide Filters\n } @else {\n Show Filters\n }\n </button>\n <span class=\"item-count\">{{ filteredPrompts.length }} prompts</span>\n </div>\n \n <div class=\"header-controls\" style=\"display: flex !important; align-items: center !important; gap: 16px !important;\">\n <div class=\"view-toggle\">\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"setViewMode('grid')\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-grip\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"setViewMode('list')\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'priority-matrix'\"\n (click)=\"setViewMode('priority-matrix')\"\n title=\"Priority Matrix\">\n <i class=\"fa-solid fa-chart-scatter\"></i>\n </button>\n </div>\n \n <button \n type=\"button\" \n class=\"control-btn primary\"\n (click)=\"createNewPrompt()\"\n title=\"Create New Prompt\">\n <i class=\"fa-solid fa-plus\"></i>\n New Prompt\n </button>\n </div>\n </div>\n\n <kendo-splitter mjFillContainer orientation=\"horizontal\">\n @if (showFilters) {\n <kendo-splitter-pane size=\"320\" min=\"250\" max=\"400\">\n <div class=\"filter-panel\">\n <div class=\"filter-panel-header\">\n <h3>Prompt Filters</h3>\n <div class=\"filter-summary-inline\">\n <span class=\"summary-value\">{{ filteredPrompts.length }}</span>\n <span class=\"summary-label\">of {{ prompts.length }}</span>\n </div>\n <button class=\"close-btn\" (click)=\"toggleFilterPanel()\">\n <span class=\"fa-solid fa-times\"></span>\n </button>\n </div>\n \n <div class=\"filter-content\">\n <!-- Search Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-search\"></span>\n Name\n </label>\n <input \n type=\"text\"\n class=\"filter-input\"\n placeholder=\"Search prompts...\"\n [value]=\"searchTerm\"\n (input)=\"onSearchChange($any($event.target).value)\"\n />\n </div>\n\n <!-- Category Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-folder\"></span>\n Category\n </label>\n <select class=\"filter-select\" [value]=\"selectedCategory\" (change)=\"onCategoryChange($any($event.target).value)\">\n <option value=\"all\">All Categories</option>\n @for (category of categories; track category.ID) {\n <option [value]=\"category.ID\">{{ category.Name }}</option>\n }\n </select>\n </div>\n\n <!-- Type Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-tag\"></span>\n Type\n </label>\n <select class=\"filter-select\" [value]=\"selectedType\" (change)=\"onTypeChange($any($event.target).value)\">\n <option value=\"all\">All Types</option>\n @for (type of types; track type.ID) {\n <option [value]=\"type.ID\">{{ type.Name }}</option>\n }\n </select>\n </div>\n\n <!-- Status Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-toggle-on\"></span>\n Status\n </label>\n <select class=\"filter-select\" [value]=\"selectedStatus\" (change)=\"onStatusChange($any($event.target).value)\">\n <option value=\"all\">All Statuses</option>\n <option value=\"active\">Active</option>\n <option value=\"inactive\">Inactive</option>\n </select>\n </div>\n\n <!-- Reset Button -->\n <div class=\"filter-actions\">\n <button class=\"reset-btn\" (click)=\"clearFilters()\" title=\"Reset all filters\">\n <span class=\"fa-solid fa-undo\"></span>\n Reset Filters\n </button>\n </div>\n </div>\n </div>\n </kendo-splitter-pane>\n }\n\n <kendo-splitter-pane>\n <div class=\"content-area\">\n @if (filteredPrompts.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-comment-dots fa-4x\"></i>\n <h3>No prompts found</h3>\n <p>{{ hasActiveFilters ? 'Try adjusting your filters' : 'Create your first AI prompt to get started' }}</p>\n @if (!hasActiveFilters) {\n <button class=\"primary-action\" (click)=\"createNewPrompt()\">\n <i class=\"fa-solid fa-plus\"></i>\n Create First Prompt\n </button>\n }\n </div>\n } @else {\n @switch (viewMode) {\n @case ('grid') {\n <div class=\"prompt-grid\">\n @for (prompt of filteredPrompts; track prompt.ID) {\n <div class=\"prompt-card\" [class.expanded]=\"expandedPromptId === prompt.ID\">\n <div class=\"card-header\" (click)=\"togglePromptExpansion(prompt.ID)\">\n <div class=\"card-icon\">\n <i [class]=\"getPromptIcon(prompt)\"></i>\n </div>\n <div class=\"card-info\">\n <h4 class=\"prompt-name\">{{ prompt.Name || 'Unnamed Prompt' }}</h4>\n @if (prompt.Description) {\n <p class=\"card-description\">{{ prompt.Description }}</p>\n }\n </div>\n <i class=\"fa-solid fa-chevron-down expand-icon\" [class.rotated]=\"expandedPromptId === prompt.ID\"></i>\n </div>\n\n @if (expandedPromptId === prompt.ID) {\n <div class=\"card-content\">\n <div class=\"stats-grid\">\n <div class=\"stat\">\n <span class=\"stat-label\">Category</span>\n <span class=\"stat-value\">{{ prompt.CategoryName }}</span>\n </div>\n <div class=\"stat\">\n <span class=\"stat-label\">Type</span>\n <span class=\"stat-value\">{{ prompt.TypeName }}</span>\n </div>\n <div class=\"stat\">\n <span class=\"stat-label\">Status</span>\n <span class=\"stat-value status-badge\" [class]=\"getStatusClass(prompt.Status)\">\n {{ prompt.Status }}\n </span>\n </div>\n </div>\n\n <div class=\"stats-grid\" style=\"margin-top: 12px;\">\n <div class=\"stat\">\n <span class=\"stat-label\">Template</span>\n <span class=\"stat-value\">\n @if (prompt.TemplateEntity) {\n <i class=\"fa-solid fa-check-circle text-success\"></i> Yes\n } @else {\n <i class=\"fa-solid fa-times-circle text-muted\"></i> No\n }\n </span>\n </div>\n <div class=\"stat\">\n <span class=\"stat-label\">Contents</span>\n <span class=\"stat-value\">{{ prompt.TemplateContents?.length || 0 }}</span>\n </div>\n </div>\n\n <div class=\"card-footer\">\n <button class=\"action-button\" (click)=\"openPrompt(prompt.ID); $event.stopPropagation()\">\n <i class=\"fa-solid fa-edit\"></i>\n Edit\n </button>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n \n @case ('list') {\n <div class=\"prompt-list\">\n <table class=\"data-table\">\n <thead>\n <tr>\n <th>Name</th>\n <th>Category</th>\n <th>Type</th>\n <th>Status</th>\n <th>Template</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (prompt of filteredPrompts; track prompt.ID) {\n <tr>\n <td>\n <div class=\"name-cell\">\n <i [class]=\"getPromptIcon(prompt)\"></i>\n {{ prompt.Name }}\n </div>\n </td>\n <td>{{ prompt.CategoryName }}</td>\n <td>{{ prompt.TypeName }}</td>\n <td>\n <span class=\"status-badge\" [class]=\"getStatusClass(prompt.Status)\">\n {{ prompt.Status }}\n </span>\n </td>\n <td>\n @if (prompt.TemplateEntity) {\n <i class=\"fa-solid fa-check-circle text-success\"></i>\n } @else {\n <i class=\"fa-solid fa-times-circle text-muted\"></i>\n }\n </td>\n <td>\n <button class=\"action-button small\" (click)=\"openPrompt(prompt.ID)\">\n <i class=\"fa-solid fa-edit\"></i>\n </button>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n \n @case ('priority-matrix') {\n <div class=\"priority-matrix-container\">\n <app-model-prompt-priority-matrix \n [selectedPrompts]=\"filteredPromptsAsEntities\"\n (promptSelected)=\"openPrompt($event.ID)\">\n </app-model-prompt-priority-matrix>\n </div>\n }\n }\n }\n </div>\n </kendo-splitter-pane>\n </kendo-splitter>\n }\n</div>", styles: [".prompt-management-v2 {\n height: 100%;\n display: flex;\n flex-direction: column;\n background-color: #f5f7fa;\n}\n\n// Loading state\n.loading-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n background-color: #f5f7fa;\n}\n\n.loading-content {\n text-align: center;\n}\n\n.loading-spinner {\n position: relative;\n width: 80px;\n height: 80px;\n margin: 0 auto 20px;\n}\n\n.spinner-ring {\n position: absolute;\n width: 100%;\n height: 100%;\n border: 3px solid transparent;\n border-top-color: #17a2b8;\n border-radius: 50%;\n animation: spin 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;\n \n &:nth-child(2) {\n animation-delay: 0.15s;\n width: 70%;\n height: 70%;\n top: 15%;\n left: 15%;\n border-top-color: #28a745;\n }\n \n &:nth-child(3) {\n animation-delay: 0.3s;\n width: 40%;\n height: 40%;\n top: 30%;\n left: 30%;\n border-top-color: #ffc107;\n }\n}\n\n@keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n.loading-text {\n color: #6c757d;\n font-size: 16px;\n animation: pulse 2s ease-in-out infinite;\n}\n\n@keyframes pulse {\n 0%, 100% { opacity: 0.6; }\n 50% { opacity: 1; }\n}\n\n// Dashboard Header\n.dashboard-header {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title i {\n color: #17a2b8;\n}\n\n.filter-toggle-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n// View Toggle\n.view-toggle {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn:hover {\n color: #495057;\n}\n\n.view-btn.active {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n// Control Buttons\n.control-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 10px 20px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.control-btn.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary:hover {\n background: #138496;\n border-color: #117a8b;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n// Splitter content\nkendo-splitter {\n flex: 1;\n background-color: #f5f7fa;\n margin-top: 8px;\n}\n\n// Filter panel\n.filter-panel {\n height: 100%;\n background: white;\n border-right: 1px solid #e0e0e0;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n}\n\n.filter-panel-header {\n padding: 16px;\n border-bottom: 1px solid #f0f0f0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-shrink: 0;\n \n h3 {\n margin: 0;\n font-size: 16px;\n font-weight: 500;\n color: #333;\n flex: 1;\n }\n \n .filter-summary-inline {\n display: flex;\n align-items: baseline;\n gap: 4px;\n margin-right: 12px;\n font-size: 12px;\n \n .summary-value {\n font-weight: 600;\n color: #2196f3;\n }\n \n .summary-label {\n color: #666;\n }\n }\n \n .close-btn {\n background: none;\n border: none;\n padding: 4px;\n cursor: pointer;\n color: #666;\n border-radius: 3px;\n transition: all 0.2s;\n \n &:hover {\n background: #f0f0f0;\n color: #333;\n }\n \n .fa-solid {\n font-size: 12px;\n }\n }\n}\n\n.filter-content {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 12px;\n}\n\n.filter-group {\n margin-bottom: 20px;\n \n .filter-label {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 500;\n color: #555;\n \n .fa-solid {\n font-size: 11px;\n color: #2196f3;\n width: 12px;\n }\n }\n}\n\n.filter-input, .filter-select {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 10px;\n border: 1px solid #ddd;\n border-radius: 4px;\n font-size: 12px;\n background: white;\n transition: border-color 0.2s;\n box-sizing: border-box;\n \n &:focus {\n outline: none;\n border-color: #2196f3;\n }\n \n &::placeholder {\n color: #999;\n }\n}\n\n.filter-select {\n cursor: pointer;\n}\n\n.filter-actions {\n margin-top: 24px;\n padding-top: 16px;\n border-top: 1px solid #f0f0f0;\n \n .reset-btn {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n color: #666;\n font-size: 12px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n transition: all 0.2s;\n box-sizing: border-box;\n \n &:hover {\n background: #e9ecef;\n border-color: #ccc;\n color: #333;\n }\n \n .fa-solid {\n font-size: 11px;\n }\n }\n}\n\n// Content area\n.content-area {\n height: 100%;\n padding: 24px;\n overflow-y: auto;\n background: #f5f7fa;\n}\n\n// Empty state\n.empty-state {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n text-align: center;\n color: #6c757d;\n \n i {\n margin-bottom: 24px;\n opacity: 0.3;\n }\n \n h3 {\n margin: 0 0 8px 0;\n font-size: 20px;\n font-weight: 600;\n color: #495057;\n }\n \n p {\n margin: 0 0 24px 0;\n font-size: 16px;\n }\n}\n\n// Grid view\n.prompt-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.prompt-card {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n \n &:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n }\n \n &.expanded {\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);\n .expand-icon {\n transform: rotate(180deg);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n padding: 20px;\n cursor: pointer;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n}\n\n.card-icon {\n width: 48px;\n height: 48px;\n background-color: #e3f2fd;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n \n i {\n font-size: 24px;\n color: #17a2b8;\n }\n}\n\n.card-info {\n flex: 1;\n min-width: 0;\n \n .prompt-name {\n margin: 0 0 4px 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n }\n\n .card-description {\n margin: 0;\n font-size: 13px;\n color: #6c757d;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n line-height: 1.4;\n }\n}\n\n\n.expand-icon {\n color: #adb5bd;\n transition: transform 0.3s ease;\n margin-left: 12px;\n}\n\n.card-content {\n padding: 0 20px 20px;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.description-section {\n margin-bottom: 16px;\n \n h5 {\n margin: 0 0 8px 0;\n font-size: 13px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n \n p {\n margin: 0;\n font-size: 14px;\n color: #495057;\n line-height: 1.6;\n }\n}\n\n.stats-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 16px;\n margin-bottom: 16px;\n}\n\n.stat {\n text-align: center;\n \n .stat-label {\n display: block;\n font-size: 12px;\n color: #6c757d;\n margin-bottom: 4px;\n }\n \n .stat-value {\n display: block;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n }\n}\n\n.status-badge {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n font-weight: 500;\n \n &.active {\n background-color: #d4edda;\n color: #155724;\n }\n \n &.inactive {\n background-color: #f8d7da;\n color: #721c24;\n }\n}\n\n.card-footer {\n padding-top: 16px;\n border-top: 1px solid #e9ecef;\n display: flex;\n gap: 8px;\n}\n\n.action-button {\n padding: 6px 12px;\n background-color: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 4px;\n color: #495057;\n font-size: 13px;\n cursor: pointer;\n transition: all 0.2s ease;\n \n &:hover {\n background-color: #e9ecef;\n border-color: #adb5bd;\n color: #212529;\n }\n \n &.small {\n padding: 4px 8px;\n font-size: 12px;\n }\n \n i {\n margin-right: 4px;\n }\n}\n\n// List view\n.prompt-list {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.data-table {\n width: 100%;\n border-collapse: collapse;\n \n thead {\n background-color: #f8f9fa;\n \n tr {\n border-bottom: 2px solid #dee2e6;\n }\n \n th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n }\n \n tbody {\n tr {\n border-bottom: 1px solid #e9ecef;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n \n &:last-child {\n border-bottom: none;\n }\n }\n \n td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n }\n }\n}\n\n.name-cell {\n display: flex;\n align-items: center;\n gap: 8px;\n font-weight: 500;\n color: #2c3e50;\n \n i {\n color: #17a2b8;\n }\n}\n\n// Priority matrix container\n.priority-matrix-container {\n height: 100%;\n background-color: white;\n border-radius: 12px;\n padding: 24px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n}\n\n// Responsive\n@media (max-width: 768px) {\n .prompt-header {\n flex-wrap: wrap;\n gap: 16px;\n }\n \n .header-right {\n width: 100%;\n justify-content: space-between;\n }\n \n .prompt-grid {\n grid-template-columns: 1fr;\n }\n \n .stats-grid {\n grid-template-columns: 1fr;\n }\n}\n\n// Text utility classes\n.text-success {\n color: #28a745;\n}\n\n.text-muted {\n color: #6c757d;\n}"] }]
756
+ args: [{ selector: 'app-prompt-management-v2', template: "<div class=\"prompt-management-v2\">\n @if (isLoading) {\n <div class=\"loading-container\">\n <div class=\"loading-content\">\n <div class=\"loading-spinner\">\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n </div>\n <div class=\"loading-text\">{{ currentLoadingMessage }}</div>\n </div>\n </div>\n } @else {\n <div class=\"dashboard-header\" style=\"display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 16px 24px !important; background: white !important;\">\n <div class=\"header-info\" style=\"display: flex !important; align-items: center !important; gap: 16px !important; flex: 1 !important;\">\n <h2 class=\"dashboard-title\" style=\"margin: 0 !important; display: flex !important; align-items: center !important; gap: 8px !important;\">\n <i class=\"fa-solid fa-message\"></i>\n AI Prompts\n </h2>\n <button \n type=\"button\" \n class=\"filter-toggle-btn\"\n (click)=\"toggleFilters()\"\n title=\"Toggle Filters\">\n <i class=\"fa-solid fa-filter\"></i>\n @if (showFilters) {\n Hide Filters\n } @else {\n Show Filters\n }\n </button>\n <span class=\"item-count\">{{ filteredPrompts.length }} prompts</span>\n </div>\n \n <div class=\"header-controls\" style=\"display: flex !important; align-items: center !important; gap: 16px !important;\">\n <div class=\"view-toggle\">\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"setViewMode('grid')\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-grip\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"setViewMode('list')\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'priority-matrix'\"\n (click)=\"setViewMode('priority-matrix')\"\n title=\"Priority Matrix\">\n <i class=\"fa-solid fa-chart-scatter\"></i>\n </button>\n </div>\n \n <button \n type=\"button\" \n class=\"control-btn primary\"\n (click)=\"createNewPrompt()\"\n title=\"Create New Prompt\">\n <i class=\"fa-solid fa-plus\"></i>\n New Prompt\n </button>\n </div>\n </div>\n\n <kendo-splitter orientation=\"horizontal\">\n @if (showFilters) {\n <kendo-splitter-pane size=\"320\" min=\"250\" max=\"400\">\n <div class=\"filter-panel\">\n <div class=\"filter-panel-header\">\n <h3>Prompt Filters</h3>\n <div class=\"filter-summary-inline\">\n <span class=\"summary-value\">{{ filteredPrompts.length }}</span>\n <span class=\"summary-label\">of {{ prompts.length }}</span>\n </div>\n <button class=\"close-btn\" (click)=\"toggleFilterPanel()\">\n <span class=\"fa-solid fa-times\"></span>\n </button>\n </div>\n \n <div class=\"filter-content\">\n <!-- Search Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-search\"></span>\n Name\n </label>\n <input \n type=\"text\"\n class=\"filter-input\"\n placeholder=\"Search prompts...\"\n [value]=\"searchTerm\"\n (input)=\"onSearchChange($any($event.target).value)\"\n />\n </div>\n\n <!-- Category Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-folder\"></span>\n Category\n </label>\n <select class=\"filter-select\" [value]=\"selectedCategory\" (change)=\"onCategoryChange($any($event.target).value)\">\n <option value=\"all\">All Categories</option>\n @for (category of categories; track category.ID) {\n <option [value]=\"category.ID\">{{ category.Name }}</option>\n }\n </select>\n </div>\n\n <!-- Type Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-tag\"></span>\n Type\n </label>\n <select class=\"filter-select\" [value]=\"selectedType\" (change)=\"onTypeChange($any($event.target).value)\">\n <option value=\"all\">All Types</option>\n @for (type of types; track type.ID) {\n <option [value]=\"type.ID\">{{ type.Name }}</option>\n }\n </select>\n </div>\n\n <!-- Status Filter -->\n <div class=\"filter-group\">\n <label class=\"filter-label\">\n <span class=\"fa-solid fa-toggle-on\"></span>\n Status\n </label>\n <select class=\"filter-select\" [value]=\"selectedStatus\" (change)=\"onStatusChange($any($event.target).value)\">\n <option value=\"all\">All Statuses</option>\n <option value=\"active\">Active</option>\n <option value=\"inactive\">Inactive</option>\n </select>\n </div>\n\n <!-- Reset Button -->\n <div class=\"filter-actions\">\n <button class=\"reset-btn\" (click)=\"clearFilters()\" title=\"Reset all filters\">\n <span class=\"fa-solid fa-undo\"></span>\n Reset Filters\n </button>\n </div>\n </div>\n </div>\n </kendo-splitter-pane>\n }\n\n <kendo-splitter-pane>\n <div class=\"content-area\">\n @if (filteredPrompts.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-comment-dots fa-4x\"></i>\n <h3>No prompts found</h3>\n <p>{{ hasActiveFilters ? 'Try adjusting your filters' : 'Create your first AI prompt to get started' }}</p>\n @if (!hasActiveFilters) {\n <button class=\"primary-action\" (click)=\"createNewPrompt()\">\n <i class=\"fa-solid fa-plus\"></i>\n Create First Prompt\n </button>\n }\n </div>\n } @else {\n @switch (viewMode) {\n @case ('grid') {\n <div class=\"prompt-grid\">\n @for (prompt of filteredPrompts; track prompt.ID) {\n <div class=\"prompt-card\" [class.expanded]=\"expandedPromptId === prompt.ID\">\n <div class=\"card-header\" (click)=\"togglePromptExpansion(prompt.ID)\">\n <div class=\"card-icon\">\n <i [class]=\"getPromptIcon(prompt)\"></i>\n </div>\n <div class=\"card-info\">\n <h4 class=\"prompt-name\">{{ prompt.Name || 'Unnamed Prompt' }}</h4>\n @if (prompt.Description) {\n <p class=\"card-description\">{{ prompt.Description }}</p>\n }\n </div>\n <i class=\"fa-solid fa-chevron-down expand-icon\" [class.rotated]=\"expandedPromptId === prompt.ID\"></i>\n </div>\n\n @if (expandedPromptId === prompt.ID) {\n <div class=\"card-content\">\n <div class=\"stats-grid\">\n <div class=\"stat\">\n <span class=\"stat-label\">Category</span>\n <span class=\"stat-value\">{{ prompt.CategoryName }}</span>\n </div>\n <div class=\"stat\">\n <span class=\"stat-label\">Type</span>\n <span class=\"stat-value\">{{ prompt.TypeName }}</span>\n </div>\n <div class=\"stat\">\n <span class=\"stat-label\">Status</span>\n <span class=\"stat-value status-badge\" [class]=\"getStatusClass(prompt.Status)\">\n {{ prompt.Status }}\n </span>\n </div>\n </div>\n\n <div class=\"stats-grid\" style=\"margin-top: 12px;\">\n <div class=\"stat\">\n <span class=\"stat-label\">Template</span>\n <span class=\"stat-value\">\n @if (prompt.TemplateEntity) {\n <i class=\"fa-solid fa-check-circle text-success\"></i> Yes\n } @else {\n <i class=\"fa-solid fa-times-circle text-muted\"></i> No\n }\n </span>\n </div>\n <div class=\"stat\">\n <span class=\"stat-label\">Contents</span>\n <span class=\"stat-value\">{{ prompt.TemplateContents?.length || 0 }}</span>\n </div>\n </div>\n\n <div class=\"card-footer\">\n <button class=\"action-button primary\" (click)=\"testPrompt(prompt.ID, $event)\" [disabled]=\"prompt.Status !== 'Active'\" title=\"Run Prompt\">\n <i class=\"fa-solid fa-play\"></i>\n Run\n </button>\n <button class=\"action-button\" (click)=\"openPrompt(prompt.ID); $event.stopPropagation()\" title=\"Edit Prompt\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n Open\n </button>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n \n @case ('list') {\n <div class=\"prompt-list\">\n <table class=\"data-table\">\n <thead>\n <tr>\n <th>Name</th>\n <th>Category</th>\n <th>Type</th>\n <th>Status</th>\n <th>Template</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (prompt of filteredPrompts; track prompt.ID) {\n <tr>\n <td>\n <div class=\"name-cell\">\n <i [class]=\"getPromptIcon(prompt)\"></i>\n {{ prompt.Name }}\n </div>\n </td>\n <td>{{ prompt.CategoryName }}</td>\n <td>{{ prompt.TypeName }}</td>\n <td>\n <span class=\"status-badge\" [class]=\"getStatusClass(prompt.Status)\">\n {{ prompt.Status }}\n </span>\n </td>\n <td>\n @if (prompt.TemplateEntity) {\n <i class=\"fa-solid fa-check-circle text-success\"></i>\n } @else {\n <i class=\"fa-solid fa-times-circle text-muted\"></i>\n }\n </td>\n <td>\n <button class=\"action-button small primary\" (click)=\"testPrompt(prompt.ID, $event)\" [disabled]=\"prompt.Status !== 'Active'\" title=\"Run Prompt\">\n <i class=\"fa-solid fa-play\"></i>\n </button>\n <button class=\"action-button small\" (click)=\"openPrompt(prompt.ID)\" title=\"Edit Prompt\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n </button>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n \n @case ('priority-matrix') {\n <div class=\"priority-matrix-container\">\n <app-model-prompt-priority-matrix \n [selectedPrompts]=\"filteredPromptsAsEntities\"\n (promptSelected)=\"openPrompt($event.ID)\">\n </app-model-prompt-priority-matrix>\n </div>\n }\n }\n }\n </div>\n </kendo-splitter-pane>\n </kendo-splitter>\n }\n</div>\n\n<!-- AI Prompt Test Harness -->\n@if (selectedPromptForTest) {\n <kendo-window \n [width]=\"1200\" \n [height]=\"800\" \n [minWidth]=\"800\"\n [minHeight]=\"600\"\n [draggable]=\"true\"\n [resizable]=\"true\"\n [state]=\"'default'\"\n (close)=\"closeTestHarness()\"\n title=\"Run AI Prompt - {{ selectedPromptForTest.Name || 'Untitled' }}\">\n <mj-ai-test-harness\n [mode]=\"'prompt'\"\n [entity]=\"selectedPromptForTest\"\n [isVisible]=\"true\"\n (visibilityChange)=\"closeTestHarness()\">\n </mj-ai-test-harness>\n </kendo-window>\n}", styles: [".prompt-management-v2 {\n height: 100%;\n display: flex;\n flex-direction: column;\n background-color: #f5f7fa;\n}\n\n// Loading state\n.loading-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n background-color: #f5f7fa;\n}\n\n.loading-content {\n text-align: center;\n}\n\n.loading-spinner {\n position: relative;\n width: 80px;\n height: 80px;\n margin: 0 auto 20px;\n}\n\n.spinner-ring {\n position: absolute;\n width: 100%;\n height: 100%;\n border: 3px solid transparent;\n border-top-color: #17a2b8;\n border-radius: 50%;\n animation: spin 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;\n \n &:nth-child(2) {\n animation-delay: 0.15s;\n width: 70%;\n height: 70%;\n top: 15%;\n left: 15%;\n border-top-color: #28a745;\n }\n \n &:nth-child(3) {\n animation-delay: 0.3s;\n width: 40%;\n height: 40%;\n top: 30%;\n left: 30%;\n border-top-color: #ffc107;\n }\n}\n\n@keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n.loading-text {\n color: #6c757d;\n font-size: 16px;\n animation: pulse 2s ease-in-out infinite;\n}\n\n@keyframes pulse {\n 0%, 100% { opacity: 0.6; }\n 50% { opacity: 1; }\n}\n\n// Dashboard Header\n.dashboard-header {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title i {\n color: #17a2b8;\n}\n\n.filter-toggle-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n// View Toggle\n.view-toggle {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn:hover {\n color: #495057;\n}\n\n.view-btn.active {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n// Control Buttons\n.control-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 10px 20px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.control-btn.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary:hover {\n background: #138496;\n border-color: #117a8b;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n// Splitter content\nkendo-splitter {\n flex: 1;\n background-color: #f5f7fa;\n margin-top: 8px;\n}\n\n// Filter panel\n.filter-panel {\n height: 100%;\n background: white;\n border-right: 1px solid #e0e0e0;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n}\n\n.filter-panel-header {\n padding: 16px;\n border-bottom: 1px solid #f0f0f0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-shrink: 0;\n \n h3 {\n margin: 0;\n font-size: 16px;\n font-weight: 500;\n color: #333;\n flex: 1;\n }\n \n .filter-summary-inline {\n display: flex;\n align-items: baseline;\n gap: 4px;\n margin-right: 12px;\n font-size: 12px;\n \n .summary-value {\n font-weight: 600;\n color: #2196f3;\n }\n \n .summary-label {\n color: #666;\n }\n }\n \n .close-btn {\n background: none;\n border: none;\n padding: 4px;\n cursor: pointer;\n color: #666;\n border-radius: 3px;\n transition: all 0.2s;\n \n &:hover {\n background: #f0f0f0;\n color: #333;\n }\n \n .fa-solid {\n font-size: 12px;\n }\n }\n}\n\n.filter-content {\n flex: 1;\n overflow-y: auto;\n overflow-x: hidden;\n padding: 12px;\n}\n\n.filter-group {\n margin-bottom: 20px;\n \n .filter-label {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-bottom: 6px;\n font-size: 12px;\n font-weight: 500;\n color: #555;\n \n .fa-solid {\n font-size: 11px;\n color: #2196f3;\n width: 12px;\n }\n }\n}\n\n.filter-input, .filter-select {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 10px;\n border: 1px solid #ddd;\n border-radius: 4px;\n font-size: 12px;\n background: white;\n transition: border-color 0.2s;\n box-sizing: border-box;\n \n &:focus {\n outline: none;\n border-color: #2196f3;\n }\n \n &::placeholder {\n color: #999;\n }\n}\n\n.filter-select {\n cursor: pointer;\n}\n\n.filter-actions {\n margin-top: 24px;\n padding-top: 16px;\n border-top: 1px solid #f0f0f0;\n \n .reset-btn {\n width: calc(100% - 4px);\n max-width: 100%;\n padding: 8px 12px;\n background: #f8f9fa;\n border: 1px solid #e0e0e0;\n border-radius: 4px;\n color: #666;\n font-size: 12px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 6px;\n transition: all 0.2s;\n box-sizing: border-box;\n \n &:hover {\n background: #e9ecef;\n border-color: #ccc;\n color: #333;\n }\n \n .fa-solid {\n font-size: 11px;\n }\n }\n}\n\n// Content area\n.content-area {\n height: 100%;\n padding: 24px;\n overflow-y: auto;\n background: #f5f7fa;\n}\n\n// Empty state\n.empty-state {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n text-align: center;\n color: #6c757d;\n \n i {\n margin-bottom: 24px;\n opacity: 0.3;\n }\n \n h3 {\n margin: 0 0 8px 0;\n font-size: 20px;\n font-weight: 600;\n color: #495057;\n }\n \n p {\n margin: 0 0 24px 0;\n font-size: 16px;\n }\n}\n\n// Grid view\n.prompt-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.prompt-card {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n \n &:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);\n }\n \n &.expanded {\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);\n .expand-icon {\n transform: rotate(180deg);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n padding: 20px;\n cursor: pointer;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n}\n\n.card-icon {\n width: 48px;\n height: 48px;\n background-color: #e3f2fd;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin-right: 16px;\n flex-shrink: 0;\n \n i {\n font-size: 24px;\n color: #17a2b8;\n }\n}\n\n.card-info {\n flex: 1;\n min-width: 0;\n \n .prompt-name {\n margin: 0 0 4px 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n }\n\n .card-description {\n margin: 0;\n font-size: 13px;\n color: #6c757d;\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n line-height: 1.4;\n }\n}\n\n\n.expand-icon {\n color: #adb5bd;\n transition: transform 0.3s ease;\n margin-left: 12px;\n}\n\n.card-content {\n padding: 0 20px 20px;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.description-section {\n margin-bottom: 16px;\n \n h5 {\n margin: 0 0 8px 0;\n font-size: 13px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n \n p {\n margin: 0;\n font-size: 14px;\n color: #495057;\n line-height: 1.6;\n }\n}\n\n.stats-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 16px;\n margin-bottom: 16px;\n}\n\n.stat {\n text-align: center;\n \n .stat-label {\n display: block;\n font-size: 12px;\n color: #6c757d;\n margin-bottom: 4px;\n }\n \n .stat-value {\n display: block;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n }\n}\n\n.status-badge {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n font-weight: 500;\n \n &.active {\n background-color: #d4edda;\n color: #155724;\n }\n \n &.inactive {\n background-color: #f8d7da;\n color: #721c24;\n }\n}\n\n.card-footer {\n padding-top: 16px;\n border-top: 1px solid #e9ecef;\n display: flex;\n gap: 8px;\n}\n\n.action-button {\n padding: 6px 12px;\n background-color: #f8f9fa;\n border: 1px solid #dee2e6;\n border-radius: 4px;\n color: #495057;\n font-size: 13px;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n \n &:hover {\n background-color: #e9ecef;\n border-color: #adb5bd;\n color: #212529;\n }\n \n &.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n \n &:hover:not(:disabled) {\n background: #1485a3;\n border-color: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n }\n \n &:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n \n &:hover {\n transform: none;\n box-shadow: none;\n background: #17a2b8;\n }\n }\n }\n \n &.small {\n padding: 4px 8px;\n font-size: 12px;\n \n &.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n \n &:hover:not(:disabled) {\n background: #1485a3;\n border-color: #1485a3;\n }\n }\n }\n \n &:disabled {\n opacity: 0.6;\n cursor: not-allowed;\n }\n}\n\n// List view\n.prompt-list {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.data-table {\n width: 100%;\n border-collapse: collapse;\n \n thead {\n background-color: #f8f9fa;\n \n tr {\n border-bottom: 2px solid #dee2e6;\n }\n \n th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n }\n \n tbody {\n tr {\n border-bottom: 1px solid #e9ecef;\n transition: background-color 0.2s ease;\n \n &:hover {\n background-color: #f8f9fa;\n }\n \n &:last-child {\n border-bottom: none;\n }\n }\n \n td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n }\n }\n}\n\n.name-cell {\n display: flex;\n align-items: center;\n gap: 8px;\n font-weight: 500;\n color: #2c3e50;\n \n i {\n color: #17a2b8;\n }\n}\n\n// Priority matrix container\n.priority-matrix-container {\n height: 100%;\n background-color: white;\n border-radius: 12px;\n padding: 24px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);\n}\n\n// Responsive\n@media (max-width: 768px) {\n .prompt-header {\n flex-wrap: wrap;\n gap: 16px;\n }\n \n .header-right {\n width: 100%;\n justify-content: space-between;\n }\n \n .prompt-grid {\n grid-template-columns: 1fr;\n }\n \n .stats-grid {\n grid-template-columns: 1fr;\n }\n}\n\n// Text utility classes\n.text-success {\n color: #28a745;\n}\n\n.text-muted {\n color: #6c757d;\n}"] }]
714
757
  }], () => [{ type: i1.SharedService }], { openEntityRecord: [{
715
758
  type: Output
716
759
  }], stateChange: [{