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

package/dist/lib/custom/Actions/action-form.component.js

@@ -12,6 +12,8 @@ import { RunView, CompositeKey } from '@memberjunction/core';
 import { MJActionFormComponent } from '../../generated/Entities/MJAction/mjaction.form.component';
 import { MJDialogService } from '@memberjunction/ng-ui-components';
 import { ActionParamDialogComponent, ActionResultCodeDialogComponent } from '@memberjunction/ng-actions';
+import { JoinHeroSummary, CountLabel } from '../../shared/phone-hero';
+import { PhoneSectionsState } from '../../shared/phone-sections-state';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/forms";
 import * as i2 from "@memberjunction/ng-ui-components";
@@ -34,7 +36,7 @@ const _forTrack1 = ($index, $item) => $item.id;
 const _forTrack2 = ($index, $item) => $item.name;
 function MJActionFormComponentExtended_Conditional_0_Conditional_9_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "input", 34);
+    i0.ɵɵelementStart(0, "input", 41);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_9_Template_input_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Name, $event) || (ctx_r1.record.Name = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -42,8 +44,8 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_9_Template(rf,
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.Name);
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_10_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 37);
-    i0.ɵɵelement(1, "i", 38);
+    i0.ɵɵelementStart(0, "span", 44);
+    i0.ɵɵelement(1, "i", 45);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -56,13 +58,13 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_10_Conditional_
     i0.ɵɵtextInterpolate1(" ", ctx_r1.record.CodeApprovalStatus, " ");
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "h4", 35);
+    i0.ɵɵelementStart(0, "h4", 42);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "span", 36);
+    i0.ɵɵelementStart(2, "span", 43);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(4, MJActionFormComponentExtended_Conditional_0_Conditional_10_Conditional_4_Template, 3, 5, "span", 37);
+    i0.ɵɵconditionalCreate(4, MJActionFormComponentExtended_Conditional_0_Conditional_10_Conditional_4_Template, 3, 5, "span", 44);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
@@ -76,11 +78,11 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_10_Template(rf,
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_11_Conditional_17_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "label", 39);
-    i0.ɵɵelement(2, "i", 38);
+    i0.ɵɵelementStart(0, "div")(1, "label", 46);
+    i0.ɵɵelement(2, "i", 45);
     i0.ɵɵtext(3, " Code Approval ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "mj-dropdown", 44);
+    i0.ɵɵelementStart(4, "mj-dropdown", 51);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_11_Conditional_17_Template_mj_dropdown_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.CodeApprovalStatus, $event) || (ctx_r1.record.CodeApprovalStatus = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -94,26 +96,26 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_11_Conditional_
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_11_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 12)(1, "div")(2, "label", 39);
+    i0.ɵɵelementStart(0, "div", 12)(1, "div")(2, "label", 46);
     i0.ɵɵtext(3, "Status");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "mj-dropdown", 40);
+    i0.ɵɵelementStart(4, "mj-dropdown", 47);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_11_Template_mj_dropdown_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Status, $event) || (ctx_r1.record.Status = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "div")(6, "label", 39);
+    i0.ɵɵelementStart(5, "div")(6, "label", 46);
     i0.ɵɵtext(7, " Type ");
-    i0.ɵɵelementStart(8, "span", 41);
+    i0.ɵɵelementStart(8, "span", 48);
     i0.ɵɵtext(9, "*");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(10, "mj-dropdown", 42);
+    i0.ɵɵelementStart(10, "mj-dropdown", 49);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_11_Template_mj_dropdown_ngModelChange_10_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Type, $event) || (ctx_r1.record.Type = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(11, "div")(12, "label", 39);
+    i0.ɵɵelementStart(11, "div")(12, "label", 46);
     i0.ɵɵtext(13, " Category ");
-    i0.ɵɵelementStart(14, "span", 41);
+    i0.ɵɵelementStart(14, "span", 48);
     i0.ɵɵtext(15, "*");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(16, "mj-dropdown", 43);
+    i0.ɵɵelementStart(16, "mj-dropdown", 50);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_11_Template_mj_dropdown_ngModelChange_16_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.CategoryID, $event) || (ctx_r1.record.CategoryID = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
     i0.ɵɵconditionalCreate(17, MJActionFormComponentExtended_Conditional_0_Conditional_11_Conditional_17_Template, 5, 14, "div");
@@ -134,7 +136,7 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_11_Template(rf,
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_12_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "textarea", 45);
+    i0.ɵɵelementStart(0, "textarea", 52);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_12_Template_textarea_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Description, $event) || (ctx_r1.record.Description = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵtext(1, "                                ");
     i0.ɵɵelementEnd();
@@ -155,14 +157,14 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_13_Template(rf,
 function MJActionFormComponentExtended_Conditional_0_Conditional_15_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 16);
-    i0.ɵɵelement(1, "i", 46);
+    i0.ɵɵelement(1, "i", 53);
     i0.ɵɵelementStart(2, "span", 18);
     i0.ɵɵtext(3, "Category:");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "span", 47);
+    i0.ɵɵelementStart(4, "span", 54);
     i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_15_Template_span_click_4_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.navigateToCategory()); });
     i0.ɵɵtext(5);
-    i0.ɵɵelement(6, "i", 48);
+    i0.ɵɵelement(6, "i", 55);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -175,7 +177,7 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_22_Template(rf,
     i0.ɵɵelementStart(2, "span", 18);
     i0.ɵɵtext(3, "Code:");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "span", 49);
+    i0.ɵɵelementStart(4, "span", 56);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -190,7 +192,7 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_22_Template(rf,
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_23_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 16);
-    i0.ɵɵelement(1, "i", 50);
+    i0.ɵɵelement(1, "i", 57);
     i0.ɵɵelementStart(2, "span", 19);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd()();
@@ -201,9 +203,9 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_23_Template(rf,
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_26_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 51);
+    i0.ɵɵelementStart(0, "button", 58);
     i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_26_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openTestHarness()); });
-    i0.ɵɵelement(1, "i", 52);
+    i0.ɵɵelement(1, "i", 59);
     i0.ɵɵtext(2, " Run ");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -212,9 +214,9 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_26_Template(rf,
 } }
 function MJActionFormComponentExtended_Conditional_0_Conditional_27_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 53);
+    i0.ɵɵelementStart(0, "button", 60);
     i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_27_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.regenerateCode()); });
-    i0.ɵɵelement(1, "i", 54);
+    i0.ɵɵelement(1, "i", 61);
     i0.ɵɵtext(2, " Regenerate ");
     i0.ɵɵelementEnd();
 } }
@@ -223,8 +225,23 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_28_Template(rf,
     i0.ɵɵtext(1, " Action must be Active to execute ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_ng_template_31_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 56);
+function MJActionFormComponentExtended_Conditional_0_Conditional_29_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 62);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_29_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ToggleHeroDetails()); });
+    i0.ɵɵelementStart(1, "span", 63);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(3, "i", 64);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵattribute("aria-expanded", ctx_r1.HeroDetailsOpen);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.HeroSummary);
+} }
+function MJActionFormComponentExtended_Conditional_0_ng_template_33_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 66);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -232,235 +249,235 @@ function MJActionFormComponentExtended_Conditional_0_ng_template_31_Conditional_
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", ctx_r1.actionParams.length, " ");
 } }
-function MJActionFormComponentExtended_Conditional_0_ng_template_31_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 55);
-    i0.ɵɵelement(1, "i", 50);
+function MJActionFormComponentExtended_Conditional_0_ng_template_33_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 65);
+    i0.ɵɵelement(1, "i", 57);
     i0.ɵɵtext(2, " Parameters ");
-    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_ng_template_31_Conditional_3_Template, 2, 1, "span", 56);
+    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_ng_template_33_Conditional_3_Template, 2, 1, "span", 66);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.actionParams.length > 0 ? 3 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_33_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 29);
-    i0.ɵɵelement(1, "i", 57);
+function MJActionFormComponentExtended_Conditional_0_Conditional_35_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 31);
+    i0.ɵɵelement(1, "i", 67);
     i0.ɵɵtext(2, " Loading parameters... ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_34_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-empty-state", 30);
+function MJActionFormComponentExtended_Conditional_0_Conditional_36_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-empty-state", 32);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("Message", ctx_r1.EditMode && ctx_r1.record.IsSaved ? "Add parameters to define inputs and outputs for this action" : "");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 67);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.addParameter("Input")); });
-    i0.ɵɵelement(1, "i", 68);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 77);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.addParameter("Input")); });
+    i0.ɵɵelement(1, "i", 78);
     i0.ɵɵtext(2, " Add Input ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-empty-state", 62);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-empty-state", 72);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 74);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 84);
     i0.ɵɵtext(1, "Required");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 75);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 85);
     i0.ɵɵtext(1, "Array");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    const _r13 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 80);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_7_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r13); const param_r12 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.editParameter(param_r12)); });
-    i0.ɵɵelement(1, "i", 81);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 90);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_7_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r14); const param_r13 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.editParameter(param_r13)); });
+    i0.ɵɵelement(1, "i", 91);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "button", 82);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_7_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r13); const param_r12 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.deleteParameter(param_r12)); });
-    i0.ɵɵelement(3, "i", 83);
+    i0.ɵɵelementStart(2, "button", 92);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_7_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r14); const param_r13 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.deleteParameter(param_r13)); });
+    i0.ɵɵelement(3, "i", 93);
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 78);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 88);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const param_r12 = i0.ɵɵnextContext().$implicit;
+    const param_r13 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(param_r12.Description);
+    i0.ɵɵtextInterpolate(param_r13.Description);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 79)(1, "span", 84);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 89)(1, "span", 94);
     i0.ɵɵtext(2, "Default:");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(3, "code");
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const param_r12 = i0.ɵɵnextContext().$implicit;
+    const param_r13 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(param_r12.DefaultValue);
+    i0.ɵɵtextInterpolate(param_r13.DefaultValue);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 70);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Template_div_click_0_listener($event) { const param_r12 = i0.ɵɵrestoreView(_r11).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onParamClick(param_r12, $event)); });
-    i0.ɵɵelementStart(1, "div", 71)(2, "span", 72);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 80);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Template_div_click_0_listener($event) { const param_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onParamClick(param_r13, $event)); });
+    i0.ɵɵelementStart(1, "div", 81)(2, "span", 82);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 73);
-    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_5_Template, 2, 0, "span", 74);
-    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_6_Template, 2, 0, "span", 75);
-    i0.ɵɵconditionalCreate(7, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_7_Template, 4, 0);
+    i0.ɵɵelementStart(4, "div", 83);
+    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_5_Template, 2, 0, "span", 84);
+    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_6_Template, 2, 0, "span", 85);
+    i0.ɵɵconditionalCreate(7, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_7_Template, 4, 0);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "div", 76)(9, "div", 77);
+    i0.ɵɵelementStart(8, "div", 86)(9, "div", 87);
     i0.ɵɵtext(10);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(11, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_11_Template, 2, 1, "div", 78);
-    i0.ɵɵconditionalCreate(12, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Conditional_12_Template, 5, 1, "div", 79);
+    i0.ɵɵconditionalCreate(11, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_11_Template, 2, 1, "div", 88);
+    i0.ɵɵconditionalCreate(12, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Conditional_12_Template, 5, 1, "div", 89);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const param_r12 = ctx.$implicit;
+    const param_r13 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵclassProp("required", param_r12.IsRequired)("clickable", true);
+    i0.ɵɵclassProp("required", param_r13.IsRequired)("clickable", true);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(param_r12.Name);
+    i0.ɵɵtextInterpolate(param_r13.Name);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(param_r12.IsRequired ? 5 : -1);
+    i0.ɵɵconditional(param_r13.IsRequired ? 5 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r12.IsArray ? 6 : -1);
+    i0.ɵɵconditional(param_r13.IsArray ? 6 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.EditMode ? 7 : -1);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(param_r12.ValueType);
+    i0.ɵɵtextInterpolate(param_r13.ValueType);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r12.Description ? 11 : -1);
+    i0.ɵɵconditional(param_r13.Description ? 11 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r12.DefaultValue ? 12 : -1);
+    i0.ɵɵconditional(param_r13.DefaultValue ? 12 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 63);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_For_2_Template, 13, 11, "div", 69, _forTrack0);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 73);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_For_2_Template, 13, 11, "div", 79, _forTrack0);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.getInputParams());
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 67);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_13_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.addParameter("Output")); });
-    i0.ɵɵelement(1, "i", 68);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 77);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_13_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.addParameter("Output")); });
+    i0.ɵɵelement(1, "i", 78);
     i0.ɵɵtext(2, " Add Output ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-empty-state", 66);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-empty-state", 76);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 75);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 85);
     i0.ɵɵtext(1, "Array");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 80);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r17); const param_r16 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.editParameter(param_r16)); });
-    i0.ɵɵelement(1, "i", 81);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    const _r18 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 90);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r18); const param_r17 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.editParameter(param_r17)); });
+    i0.ɵɵelement(1, "i", 91);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(2, "button", 82);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_6_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r17); const param_r16 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.deleteParameter(param_r16)); });
-    i0.ɵɵelement(3, "i", 83);
+    i0.ɵɵelementStart(2, "button", 92);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_6_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r18); const param_r17 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.deleteParameter(param_r17)); });
+    i0.ɵɵelement(3, "i", 93);
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 78);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 88);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const param_r16 = i0.ɵɵnextContext().$implicit;
+    const param_r17 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(param_r16.Description);
+    i0.ɵɵtextInterpolate(param_r17.Description);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 79)(1, "span", 84);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 89)(1, "span", 94);
     i0.ɵɵtext(2, "Default:");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(3, "code");
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const param_r16 = i0.ɵɵnextContext().$implicit;
+    const param_r17 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(param_r16.DefaultValue);
+    i0.ɵɵtextInterpolate(param_r17.DefaultValue);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r15 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 70);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Template_div_click_0_listener($event) { const param_r16 = i0.ɵɵrestoreView(_r15).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onParamClick(param_r16, $event)); });
-    i0.ɵɵelementStart(1, "div", 71)(2, "span", 72);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r16 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 80);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Template_div_click_0_listener($event) { const param_r17 = i0.ɵɵrestoreView(_r16).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onParamClick(param_r17, $event)); });
+    i0.ɵɵelementStart(1, "div", 81)(2, "span", 82);
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 73);
-    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_5_Template, 2, 0, "span", 75);
-    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_6_Template, 4, 0);
+    i0.ɵɵelementStart(4, "div", 83);
+    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_5_Template, 2, 0, "span", 85);
+    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_6_Template, 4, 0);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 76)(8, "div", 77);
+    i0.ɵɵelementStart(7, "div", 86)(8, "div", 87);
     i0.ɵɵtext(9);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(10, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_10_Template, 2, 1, "div", 78);
-    i0.ɵɵconditionalCreate(11, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Conditional_11_Template, 5, 1, "div", 79);
+    i0.ɵɵconditionalCreate(10, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_10_Template, 2, 1, "div", 88);
+    i0.ɵɵconditionalCreate(11, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Conditional_11_Template, 5, 1, "div", 89);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const param_r16 = ctx.$implicit;
+    const param_r17 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵclassProp("clickable", true);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(param_r16.Name);
+    i0.ɵɵtextInterpolate(param_r17.Name);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(param_r16.IsArray ? 5 : -1);
+    i0.ɵɵconditional(param_r17.IsArray ? 5 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.EditMode ? 6 : -1);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(param_r16.ValueType);
+    i0.ɵɵtextInterpolate(param_r17.ValueType);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r16.Description ? 10 : -1);
+    i0.ɵɵconditional(param_r17.Description ? 10 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r16.DefaultValue ? 11 : -1);
+    i0.ɵɵconditional(param_r17.DefaultValue ? 11 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 63);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_For_2_Template, 12, 8, "div", 85, _forTrack0);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 73);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_For_2_Template, 12, 8, "div", 95, _forTrack0);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.getOutputParams());
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_35_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 58)(1, "div", 59)(2, "h3");
-    i0.ɵɵelement(3, "i", 60);
+function MJActionFormComponentExtended_Conditional_0_Conditional_37_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 68)(1, "div", 69)(2, "h3");
+    i0.ɵɵelement(3, "i", 70);
     i0.ɵɵtext(4, " Input Parameters");
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_5_Template, 3, 0, "button", 61);
+    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_5_Template, 3, 0, "button", 71);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_6_Template, 1, 0, "mj-empty-state", 62)(7, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_7_Template, 3, 0, "div", 63);
+    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_6_Template, 1, 0, "mj-empty-state", 72)(7, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_7_Template, 3, 0, "div", 73);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "div", 64)(9, "div", 59)(10, "h3");
-    i0.ɵɵelement(11, "i", 65);
+    i0.ɵɵelementStart(8, "div", 74)(9, "div", 69)(10, "h3");
+    i0.ɵɵelement(11, "i", 75);
     i0.ɵɵtext(12, " Output Parameters");
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(13, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_13_Template, 3, 0, "button", 61);
+    i0.ɵɵconditionalCreate(13, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_13_Template, 3, 0, "button", 71);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(14, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_14_Template, 1, 0, "mj-empty-state", 66)(15, MJActionFormComponentExtended_Conditional_0_Conditional_35_Conditional_15_Template, 3, 0, "div", 63);
+    i0.ɵɵconditionalCreate(14, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_14_Template, 1, 0, "mj-empty-state", 76)(15, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_15_Template, 3, 0, "div", 73);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -475,47 +492,47 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_35_Template(rf,
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.getOutputParams().length === 0 ? 14 : 15);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_36_ng_template_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 96);
-    i0.ɵɵelement(1, "i", 97);
+function MJActionFormComponentExtended_Conditional_0_Conditional_38_ng_template_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 106);
+    i0.ɵɵelement(1, "i", 107);
     i0.ɵɵtext(2, " Locked ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_36_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 55);
-    i0.ɵɵelement(1, "i", 95);
+function MJActionFormComponentExtended_Conditional_0_Conditional_38_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 65);
+    i0.ɵɵelement(1, "i", 105);
     i0.ɵɵtext(2, " Code & Generation ");
-    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_36_ng_template_1_Conditional_3_Template, 3, 0, "span", 96);
+    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_38_ng_template_1_Conditional_3_Template, 3, 0, "span", 106);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.record.CodeLocked ? 3 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 86)(1, "h3");
-    i0.ɵɵelement(2, "i", 54);
+function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 96)(1, "h3");
+    i0.ɵɵelement(2, "i", 61);
     i0.ɵɵtext(3, " AI Generation");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 98)(5, "label");
+    i0.ɵɵelementStart(4, "div", 108)(5, "label");
     i0.ɵɵtext(6, "User Prompt");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "textarea", 99);
-    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_3_Template_textarea_ngModelChange_7_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.UserPrompt, $event) || (ctx_r1.record.UserPrompt = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(7, "textarea", 109);
+    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_3_Template_textarea_ngModelChange_7_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.UserPrompt, $event) || (ctx_r1.record.UserPrompt = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵtext(8, "                                            ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "div", 100)(10, "label");
+    i0.ɵɵelementStart(9, "div", 110)(10, "label");
     i0.ɵɵtext(11, "Internal Comments (not sent to AI)");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "textarea", 101);
-    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_3_Template_textarea_ngModelChange_12_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.UserComments, $event) || (ctx_r1.record.UserComments = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(12, "textarea", 111);
+    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_3_Template_textarea_ngModelChange_12_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.UserComments, $event) || (ctx_r1.record.UserComments = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵtext(13, "                                            ");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(14, "div", 102)(15, "mj-switch", 103);
-    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_3_Template_mj_switch_ngModelChange_15_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.CodeLocked, $event) || (ctx_r1.record.CodeLocked = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(14, "div", 112)(15, "mj-switch", 113);
+    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_3_Template_mj_switch_ngModelChange_15_listener($event) { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.CodeLocked, $event) || (ctx_r1.record.CodeLocked = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(16, "label", 104);
+    i0.ɵɵelementStart(16, "label", 114);
     i0.ɵɵtext(17, "Lock Code (prevent regeneration)");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -529,11 +546,11 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_
     i0.ɵɵadvance(3);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.CodeLocked);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    const _r20 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 67);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r20); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleCodeComments()); });
-    i0.ɵɵelement(1, "i", 105);
+function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    const _r21 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 77);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.toggleCodeComments()); });
+    i0.ɵɵelement(1, "i", 115);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -541,9 +558,9 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", ctx_r1.showCodeComments ? "Hide" : "Show", " AI Comments ");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 93)(1, "h4");
-    i0.ɵɵelement(2, "i", 54);
+function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 103)(1, "h4");
+    i0.ɵɵelement(2, "i", 61);
     i0.ɵɵtext(3, " AI Explanation");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "p");
@@ -554,13 +571,13 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(ctx_r1.record.CodeComments);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_16_Template(rf, ctx) { if (rf & 1) {
-    const _r21 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 94)(1, "label");
+function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 104)(1, "label");
     i0.ɵɵtext(2, "Rejection Comments");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "textarea", 106);
-    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_16_Template_textarea_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r21); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.CodeApprovalComments, $event) || (ctx_r1.record.CodeApprovalComments = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(3, "textarea", 116);
+    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_16_Template_textarea_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r22); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.CodeApprovalComments, $event) || (ctx_r1.record.CodeApprovalComments = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵtext(4, "                                            ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -569,28 +586,28 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.CodeApprovalComments);
     i0.ɵɵproperty("rows", 2);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_36_Template(rf, ctx) { if (rf & 1) {
-    const _r18 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-accordion-panel", 26);
-    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_36_ng_template_1_Template, 4, 1, "ng-template", 27);
-    i0.ɵɵelementStart(2, "div", 28);
-    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_3_Template, 18, 5, "div", 86);
-    i0.ɵɵelementStart(4, "div", 87)(5, "div", 88)(6, "h3");
-    i0.ɵɵelement(7, "i", 89);
+function MJActionFormComponentExtended_Conditional_0_Conditional_38_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-accordion-panel", 33);
+    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_38_ng_template_1_Template, 4, 1, "ng-template", 29);
+    i0.ɵɵelementStart(2, "div", 30);
+    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_3_Template, 18, 5, "div", 96);
+    i0.ɵɵelementStart(4, "div", 97)(5, "div", 98)(6, "h3");
+    i0.ɵɵelement(7, "i", 99);
     i0.ɵɵtext(8, " Action Code");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "div", 90);
-    i0.ɵɵconditionalCreate(10, MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_10_Template, 3, 1, "button", 61);
-    i0.ɵɵelementStart(11, "button", 67);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_36_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.copyToClipboard(ctx_r1.record.Code || "")); });
-    i0.ɵɵelement(12, "i", 91);
+    i0.ɵɵelementStart(9, "div", 100);
+    i0.ɵɵconditionalCreate(10, MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_10_Template, 3, 1, "button", 71);
+    i0.ɵɵelementStart(11, "button", 77);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_38_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.copyToClipboard(ctx_r1.record.Code || "")); });
+    i0.ɵɵelement(12, "i", 101);
     i0.ɵɵtext(13, " Copy ");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(14, "mj-code-editor", 92);
-    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_36_Template_mj_code_editor_ngModelChange_14_listener($event) { i0.ɵɵrestoreView(_r18); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Code, $event) || (ctx_r1.record.Code = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(14, "mj-code-editor", 102);
+    i0.ɵɵtwoWayListener("ngModelChange", function MJActionFormComponentExtended_Conditional_0_Conditional_38_Template_mj_code_editor_ngModelChange_14_listener($event) { i0.ɵɵrestoreView(_r19); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.record.Code, $event) || (ctx_r1.record.Code = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(15, MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_15_Template, 6, 1, "div", 93);
-    i0.ɵɵconditionalCreate(16, MJActionFormComponentExtended_Conditional_0_Conditional_36_Conditional_16_Template, 5, 2, "div", 94);
+    i0.ɵɵconditionalCreate(15, MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_15_Template, 6, 1, "div", 103);
+    i0.ɵɵconditionalCreate(16, MJActionFormComponentExtended_Conditional_0_Conditional_38_Conditional_16_Template, 5, 2, "div", 104);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -607,11 +624,11 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_36_Template(rf,
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.record.CodeApprovalStatus === "Rejected" ? 16 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 55);
-    i0.ɵɵelement(1, "i", 112);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 65);
+    i0.ɵɵelement(1, "i", 122);
     i0.ɵɵtext(2, " Runtime Configuration & Permissions ");
-    i0.ɵɵelementStart(3, "span", 113);
+    i0.ɵɵelementStart(3, "span", 123);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -619,34 +636,34 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_37_ng_template_
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate1(" (", ctx_r1.getRuntimeConfigSummary(), ") ");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "mj-alert", 107)(1, "strong");
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-alert", 117)(1, "strong");
     i0.ɵɵtext(2, "Missing or malformed RuntimeActionConfiguration.");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(3, " This Runtime action cannot run until a valid configuration is supplied. Approval should not be granted in this state. ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "strong");
     i0.ɵɵtext(1, "allowAnyEntity");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Conditional_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "strong");
     i0.ɵɵtext(1, "allowAnyAction");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "strong");
     i0.ɵɵtext(1, "allowAnyAgent");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "mj-alert", 114)(1, "div", 125);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-alert", 124)(1, "div", 135);
     i0.ɵɵtext(2, " This runtime action has one or more wildcard flags set that bypass the specific allowlists below: ");
-    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Conditional_3_Template, 2, 0, "strong");
-    i0.ɵɵconditionalCreate(4, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Conditional_4_Template, 2, 0, "strong");
-    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Conditional_5_Template, 2, 0, "strong");
+    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Conditional_3_Template, 2, 0, "strong");
+    i0.ɵɵconditionalCreate(4, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Conditional_4_Template, 2, 0, "strong");
+    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Conditional_5_Template, 2, 0, "strong");
     i0.ɵɵtext(6, " . Approving grants this action unrestricted access to that namespace on behalf of any user who invokes it. Only approve if the action is framework-authored or you have personally reviewed every place it touches those resources. ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -658,76 +675,76 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.getWildcardFlags().agent ? 5 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 119);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 129);
     i0.ɵɵtext(1, "None requested");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 128);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_7_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 138);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const e_r22 = ctx.$implicit;
+    const e_r23 = ctx.$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", e_r22.name, " ");
+    i0.ɵɵtextInterpolate1(" ", e_r23.name, " ");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 120);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_7_For_2_Template, 2, 1, "span", 128, _forTrack1);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 130);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_7_For_2_Template, 2, 1, "span", 138, _forTrack1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.getAllowedEntities());
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 119);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 129);
     i0.ɵɵtext(1, "None requested");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_13_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 128);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_13_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 138);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const a_r23 = ctx.$implicit;
+    const a_r24 = ctx.$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", a_r23.name, " ");
+    i0.ɵɵtextInterpolate1(" ", a_r24.name, " ");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 120);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_13_For_2_Template, 2, 1, "span", 128, _forTrack1);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 130);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_13_For_2_Template, 2, 1, "span", 138, _forTrack1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.getAllowedActions());
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_18_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 119);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 129);
     i0.ɵɵtext(1, "None requested");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_19_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 128);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_19_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 138);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const g_r24 = ctx.$implicit;
+    const g_r25 = ctx.$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", g_r24.name, " ");
+    i0.ɵɵtextInterpolate1(" ", g_r25.name, " ");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 120);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_19_For_2_Template, 2, 1, "span", 128, _forTrack1);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 130);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_19_For_2_Template, 2, 1, "span", 138, _forTrack1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.getAllowedAgents());
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_30_Template(rf, ctx) { if (rf & 1) {
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_30_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div");
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
@@ -736,78 +753,78 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1("Max execution time: ", ctx_r1.record.MaxExecutionTimeMS, " ms");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_35_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 119);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_35_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 129);
     i0.ɵɵtext(1, "None (only default set: lodash, date-fns, uuid, validator)");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_36_For_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_36_For_2_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 18);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const lib_r25 = i0.ɵɵnextContext().$implicit;
+    const lib_r26 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" @", lib_r25.version);
+    i0.ɵɵtextInterpolate1(" @", lib_r26.version);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_36_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 129);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_36_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 139);
     i0.ɵɵtext(1);
-    i0.ɵɵconditionalCreate(2, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_36_For_2_Conditional_2_Template, 2, 1, "span", 18);
+    i0.ɵɵconditionalCreate(2, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_36_For_2_Conditional_2_Template, 2, 1, "span", 18);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const lib_r25 = ctx.$implicit;
+    const lib_r26 = ctx.$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", lib_r25.name);
+    i0.ɵɵtextInterpolate1(" ", lib_r26.name);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(lib_r25.version ? 2 : -1);
+    i0.ɵɵconditional(lib_r26.version ? 2 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_36_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 127);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_36_For_2_Template, 3, 2, "span", 129, _forTrack2);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_36_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 137);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_36_For_2_Template, 3, 2, "span", 139, _forTrack2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.getRequestedLibraries());
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_0_Template, 7, 3, "mj-alert", 114);
-    i0.ɵɵelementStart(1, "div", 115)(2, "div", 116)(3, "div", 117);
-    i0.ɵɵelement(4, "i", 118);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_0_Template, 7, 3, "mj-alert", 124);
+    i0.ɵɵelementStart(1, "div", 125)(2, "div", 126)(3, "div", 127);
+    i0.ɵɵelement(4, "i", 128);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_6_Template, 2, 0, "div", 119)(7, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_7_Template, 3, 0, "div", 120);
+    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_6_Template, 2, 0, "div", 129)(7, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_7_Template, 3, 0, "div", 130);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "div", 116)(9, "div", 117);
-    i0.ɵɵelement(10, "i", 121);
+    i0.ɵɵelementStart(8, "div", 126)(9, "div", 127);
+    i0.ɵɵelement(10, "i", 131);
     i0.ɵɵtext(11);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(12, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_12_Template, 2, 0, "div", 119)(13, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_13_Template, 3, 0, "div", 120);
+    i0.ɵɵconditionalCreate(12, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_12_Template, 2, 0, "div", 129)(13, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_13_Template, 3, 0, "div", 130);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(14, "div", 116)(15, "div", 117);
-    i0.ɵɵelement(16, "i", 122);
+    i0.ɵɵelementStart(14, "div", 126)(15, "div", 127);
+    i0.ɵɵelement(16, "i", 132);
     i0.ɵɵtext(17);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(18, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_18_Template, 2, 0, "div", 119)(19, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_19_Template, 3, 0, "div", 120);
+    i0.ɵɵconditionalCreate(18, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_18_Template, 2, 0, "div", 129)(19, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_19_Template, 3, 0, "div", 130);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(20, "div", 123)(21, "div")(22, "div", 108);
-    i0.ɵɵelement(23, "i", 124);
+    i0.ɵɵelementStart(20, "div", 133)(21, "div")(22, "div", 118);
+    i0.ɵɵelement(23, "i", 134);
     i0.ɵɵtext(24, " Resource Limits ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(25, "div", 125)(26, "div");
+    i0.ɵɵelementStart(25, "div", 135)(26, "div");
     i0.ɵɵtext(27);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(28, "div");
     i0.ɵɵtext(29);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(30, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_30_Template, 2, 1, "div");
+    i0.ɵɵconditionalCreate(30, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_30_Template, 2, 1, "div");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(31, "div")(32, "div", 108);
-    i0.ɵɵelement(33, "i", 126);
+    i0.ɵɵelementStart(31, "div")(32, "div", 118);
+    i0.ɵɵelement(33, "i", 136);
     i0.ɵɵtext(34, " Additional Libraries ");
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(35, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_35_Template, 2, 0, "div", 119)(36, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Conditional_36_Template, 3, 0, "div", 127);
+    i0.ɵɵconditionalCreate(35, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_35_Template, 2, 0, "div", 129)(36, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Conditional_36_Template, 3, 0, "div", 137);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
@@ -833,35 +850,35 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_
     i0.ɵɵadvance(5);
     i0.ɵɵconditional(ctx_r1.getRequestedLibraries().length === 0 ? 35 : 36);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    const _r26 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-alert", 111)(1, "div", 130);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    const _r27 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-alert", 121)(1, "div", 140);
     i0.ɵɵtext(2, " Approving grants this action the permissions listed above on behalf of any user who invokes it. Review the code and permissions carefully before approving. ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 21)(4, "button", 131);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_12_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r26); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.approveCode()); });
-    i0.ɵɵelement(5, "i", 132);
+    i0.ɵɵelementStart(3, "div", 21)(4, "button", 141);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_12_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r27); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.approveCode()); });
+    i0.ɵɵelement(5, "i", 142);
     i0.ɵɵtext(6, " Approve ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "button", 133);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_12_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r26); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.rejectCode()); });
-    i0.ɵɵelement(8, "i", 134);
+    i0.ɵɵelementStart(7, "button", 143);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_12_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r27); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.rejectCode()); });
+    i0.ɵɵelement(8, "i", 144);
     i0.ɵɵtext(9, " Reject ");
     i0.ɵɵelementEnd()()();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_37_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "mj-accordion-panel", 26);
-    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_37_ng_template_1_Template, 5, 1, "ng-template", 27);
-    i0.ɵɵelementStart(2, "div", 28);
-    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_3_Template, 4, 0, "mj-alert", 107)(4, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_4_Template, 37, 11);
-    i0.ɵɵelementStart(5, "div")(6, "div", 108);
-    i0.ɵɵelement(7, "i", 109);
+function MJActionFormComponentExtended_Conditional_0_Conditional_39_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-accordion-panel", 34);
+    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_39_ng_template_1_Template, 5, 1, "ng-template", 29);
+    i0.ɵɵelementStart(2, "div", 30);
+    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_3_Template, 4, 0, "mj-alert", 117)(4, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_4_Template, 37, 11);
+    i0.ɵɵelementStart(5, "div")(6, "div", 118);
+    i0.ɵɵelement(7, "i", 119);
     i0.ɵɵtext(8, " JavaScript Payload ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "pre", 110)(10, "code");
+    i0.ɵɵelementStart(9, "pre", 120)(10, "code");
     i0.ɵɵtext(11);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵconditionalCreate(12, MJActionFormComponentExtended_Conditional_0_Conditional_37_Conditional_12_Template, 10, 0, "mj-alert", 111);
+    i0.ɵɵconditionalCreate(12, MJActionFormComponentExtended_Conditional_0_Conditional_39_Conditional_12_Template, 10, 0, "mj-alert", 121);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -873,8 +890,8 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_37_Template(rf,
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.record.CodeApprovalStatus === "Pending" ? 12 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_ng_template_39_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 136);
+function MJActionFormComponentExtended_Conditional_0_ng_template_41_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 146);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -882,184 +899,184 @@ function MJActionFormComponentExtended_Conditional_0_ng_template_39_Conditional_
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", ctx_r1.resultCodes.length, " ");
 } }
-function MJActionFormComponentExtended_Conditional_0_ng_template_39_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 55);
-    i0.ɵɵelement(1, "i", 135);
+function MJActionFormComponentExtended_Conditional_0_ng_template_41_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 65);
+    i0.ɵɵelement(1, "i", 145);
     i0.ɵɵtext(2, " Result Codes ");
-    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_ng_template_39_Conditional_3_Template, 2, 1, "span", 136);
+    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_ng_template_41_Conditional_3_Template, 2, 1, "span", 146);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.resultCodes.length > 0 ? 3 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_41_Template(rf, ctx) { if (rf & 1) {
-    const _r27 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 31)(1, "button", 137);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_41_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r27); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.addResultCode()); });
-    i0.ɵɵelement(2, "i", 68);
+function MJActionFormComponentExtended_Conditional_0_Conditional_43_Template(rf, ctx) { if (rf & 1) {
+    const _r28 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 36)(1, "button", 147);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_43_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r28); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.addResultCode()); });
+    i0.ɵɵelement(2, "i", 78);
     i0.ɵɵtext(3, " Add Result Code ");
     i0.ɵɵelementEnd()();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_42_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 29);
-    i0.ɵɵelement(1, "i", 57);
+function MJActionFormComponentExtended_Conditional_0_Conditional_44_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 31);
+    i0.ɵɵelement(1, "i", 67);
     i0.ɵɵtext(2, " Loading result codes... ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_43_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-empty-state", 32);
+function MJActionFormComponentExtended_Conditional_0_Conditional_45_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-empty-state", 37);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("Message", ctx_r1.EditMode && ctx_r1.record.IsSaved ? "Add result codes to define possible outcomes" : "");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 143);
+function MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 153);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const code_r29 = i0.ɵɵnextContext().$implicit;
+    const code_r30 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(code_r29.Description);
+    i0.ɵɵtextInterpolate(code_r30.Description);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    const _r30 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 144)(1, "button", 145);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Conditional_7_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r30); const code_r29 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); ctx_r1.editResultCode(code_r29); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelement(2, "i", 81);
+function MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    const _r31 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 154)(1, "button", 155);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Conditional_7_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r31); const code_r30 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); ctx_r1.editResultCode(code_r30); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(2, "i", 91);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 146);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Conditional_7_Template_button_click_3_listener($event) { i0.ɵɵrestoreView(_r30); const code_r29 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); ctx_r1.deleteResultCode(code_r29); return i0.ɵɵresetView($event.stopPropagation()); });
-    i0.ɵɵelement(4, "i", 83);
+    i0.ɵɵelementStart(3, "button", 156);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Conditional_7_Template_button_click_3_listener($event) { i0.ɵɵrestoreView(_r31); const code_r30 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(3); ctx_r1.deleteResultCode(code_r30); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelement(4, "i", 93);
     i0.ɵɵelementEnd()();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r28 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 139);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Template_div_click_0_listener($event) { const code_r29 = i0.ɵɵrestoreView(_r28).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onResultCodeClick(code_r29, $event)); });
-    i0.ɵɵelementStart(1, "div", 140);
+function MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r29 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 149);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Template_div_click_0_listener($event) { const code_r30 = i0.ɵɵrestoreView(_r29).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onResultCodeClick(code_r30, $event)); });
+    i0.ɵɵelementStart(1, "div", 150);
     i0.ɵɵelement(2, "i");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 141)(4, "div", 142);
+    i0.ɵɵelementStart(3, "div", 151)(4, "div", 152);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Conditional_6_Template, 2, 1, "div", 143);
+    i0.ɵɵconditionalCreate(6, MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Conditional_6_Template, 2, 1, "div", 153);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(7, MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Conditional_7_Template, 5, 0, "div", 144);
+    i0.ɵɵconditionalCreate(7, MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Conditional_7_Template, 5, 0, "div", 154);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const code_r29 = ctx.$implicit;
+    const code_r30 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵclassProp("success", code_r29.IsSuccess)("failure", !code_r29.IsSuccess)("clickable", true);
+    i0.ɵɵclassProp("success", code_r30.IsSuccess)("failure", !code_r30.IsSuccess)("clickable", true);
     i0.ɵɵadvance(2);
-    i0.ɵɵclassMap(code_r29.IsSuccess ? "fa-solid fa-check-circle" : "fa-solid fa-times-circle");
+    i0.ɵɵclassMap(code_r30.IsSuccess ? "fa-solid fa-check-circle" : "fa-solid fa-times-circle");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(code_r29.ResultCode);
+    i0.ɵɵtextInterpolate(code_r30.ResultCode);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(code_r29.Description ? 6 : -1);
+    i0.ɵɵconditional(code_r30.Description ? 6 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.EditMode ? 7 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_44_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 33);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_44_For_2_Template, 8, 11, "div", 138, _forTrack0);
+function MJActionFormComponentExtended_Conditional_0_Conditional_46_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 38);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_46_For_2_Template, 8, 11, "div", 148, _forTrack0);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.resultCodes);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 55);
-    i0.ɵɵelement(1, "i", 148);
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 65);
+    i0.ɵɵelement(1, "i", 158);
     i0.ɵɵtext(2, " Execution & Monitoring ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 29);
-    i0.ɵɵelement(1, "i", 57);
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 31);
+    i0.ɵɵelement(1, "i", 67);
     i0.ɵɵtext(2, " Loading executions... ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-empty-state", 147);
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-empty-state", 157);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_For_41_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_For_41_Conditional_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
 } if (rf & 2) {
-    const execution_r32 = i0.ɵɵnextContext().$implicit;
+    const execution_r33 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatDuration(ctx_r1.getExecutionDuration(execution_r32)), " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatDuration(ctx_r1.getExecutionDuration(execution_r33)), " ");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_For_41_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 163);
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_For_41_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 173);
     i0.ɵɵtext(1, "Running...");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_For_41_Template(rf, ctx) { if (rf & 1) {
-    const _r31 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "tr", 162)(1, "td");
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_For_41_Template(rf, ctx) { if (rf & 1) {
+    const _r32 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "tr", 172)(1, "td");
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "date");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "td");
-    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_For_41_Conditional_5_Template, 1, 1)(6, MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_For_41_Conditional_6_Template, 2, 0, "span", 163);
+    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_For_41_Conditional_5_Template, 1, 1)(6, MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_For_41_Conditional_6_Template, 2, 0, "span", 173);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(7, "td");
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "td")(10, "span", 142);
+    i0.ɵɵelementStart(9, "td")(10, "span", 152);
     i0.ɵɵtext(11);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(12, "td")(13, "button", 67);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_For_41_Template_button_click_13_listener() { const execution_r32 = i0.ɵɵrestoreView(_r31).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.navigateToExecution(execution_r32.ID)); });
-    i0.ɵɵelement(14, "i", 164);
+    i0.ɵɵelementStart(12, "td")(13, "button", 77);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_For_41_Template_button_click_13_listener() { const execution_r33 = i0.ɵɵrestoreView(_r32).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.navigateToExecution(execution_r33.ID)); });
+    i0.ɵɵelement(14, "i", 174);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const execution_r32 = ctx.$implicit;
+    const execution_r33 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵclassProp("success", ctx_r1.isExecutionSuccess(execution_r32));
+    i0.ɵɵclassProp("success", ctx_r1.isExecutionSuccess(execution_r33));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(3, 10, execution_r32.StartedAt, "short"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(3, 10, execution_r33.StartedAt, "short"));
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(execution_r32.EndedAt ? 5 : 6);
+    i0.ɵɵconditional(execution_r33.EndedAt ? 5 : 6);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(execution_r32.User);
+    i0.ɵɵtextInterpolate(execution_r33.User);
     i0.ɵɵadvance(2);
-    i0.ɵɵclassProp("success", ctx_r1.isExecutionSuccess(execution_r32))("failure", !ctx_r1.isExecutionSuccess(execution_r32));
+    i0.ɵɵclassProp("success", ctx_r1.isExecutionSuccess(execution_r33))("failure", !ctx_r1.isExecutionSuccess(execution_r33));
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", execution_r32.ResultCode, " ");
+    i0.ɵɵtextInterpolate1(" ", execution_r33.ResultCode, " ");
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 149)(1, "div", 150);
-    i0.ɵɵelement(2, "i", 151);
-    i0.ɵɵelementStart(3, "div", 152)(4, "div", 153);
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 159)(1, "div", 160);
+    i0.ɵɵelement(2, "i", 161);
+    i0.ɵɵelementStart(3, "div", 162)(4, "div", 163);
     i0.ɵɵtext(5, "Avg Duration");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 154);
+    i0.ɵɵelementStart(6, "div", 164);
     i0.ɵɵtext(7);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(8, "div", 150);
-    i0.ɵɵelement(9, "i", 155);
-    i0.ɵɵelementStart(10, "div", 152)(11, "div", 153);
+    i0.ɵɵelementStart(8, "div", 160);
+    i0.ɵɵelement(9, "i", 165);
+    i0.ɵɵelementStart(10, "div", 162)(11, "div", 163);
     i0.ɵɵtext(12, "Success Rate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(13, "div", 156);
+    i0.ɵɵelementStart(13, "div", 166);
     i0.ɵɵtext(14);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(15, "div", 150);
-    i0.ɵɵelement(16, "i", 157);
-    i0.ɵɵelementStart(17, "div", 152)(18, "div", 153);
+    i0.ɵɵelementStart(15, "div", 160);
+    i0.ɵɵelement(16, "i", 167);
+    i0.ɵɵelementStart(17, "div", 162)(18, "div", 163);
     i0.ɵɵtext(19, "Total Runs");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(20, "div", 154);
+    i0.ɵɵelementStart(20, "div", 164);
     i0.ɵɵtext(21);
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(22, "h3", 158);
-    i0.ɵɵelement(23, "i", 159);
+    i0.ɵɵelementStart(22, "h3", 168);
+    i0.ɵɵelement(23, "i", 169);
     i0.ɵɵtext(24, " Recent Executions");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(25, "div", 160)(26, "table")(27, "thead")(28, "tr")(29, "th");
+    i0.ɵɵelementStart(25, "div", 170)(26, "table")(27, "thead")(28, "tr")(29, "th");
     i0.ɵɵtext(30, "Started");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(31, "th");
@@ -1075,7 +1092,7 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_
     i0.ɵɵtext(38, "Actions");
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementStart(39, "tbody");
-    i0.ɵɵrepeaterCreate(40, MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_For_41_Template, 15, 13, "tr", 161, _forTrack0);
+    i0.ɵɵrepeaterCreate(40, MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_For_41_Template, 15, 13, "tr", 171, _forTrack0);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
@@ -1092,11 +1109,11 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_
     i0.ɵɵadvance(19);
     i0.ɵɵrepeater(ctx_r1.recentExecutions);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_45_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "mj-accordion-panel", 26);
-    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_45_ng_template_1_Template, 3, 0, "ng-template", 27);
-    i0.ɵɵelementStart(2, "div", 28);
-    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_3_Template, 3, 0, "div", 29)(4, MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_4_Template, 1, 0, "mj-empty-state", 147)(5, MJActionFormComponentExtended_Conditional_0_Conditional_45_Conditional_5_Template, 42, 7);
+function MJActionFormComponentExtended_Conditional_0_Conditional_47_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-accordion-panel", 39);
+    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_47_ng_template_1_Template, 3, 0, "ng-template", 29);
+    i0.ɵɵelementStart(2, "div", 30);
+    i0.ɵɵconditionalCreate(3, MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_3_Template, 3, 0, "div", 31)(4, MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_4_Template, 1, 0, "mj-empty-state", 157)(5, MJActionFormComponentExtended_Conditional_0_Conditional_47_Conditional_5_Template, 42, 7);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1104,100 +1121,100 @@ function MJActionFormComponentExtended_Conditional_0_Conditional_45_Template(rf,
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.isLoadingExecutions ? 3 : ctx_r1.recentExecutions.length === 0 ? 4 : 5);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_46_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 55);
-    i0.ɵɵelement(1, "i", 176);
+function MJActionFormComponentExtended_Conditional_0_Conditional_48_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 65);
+    i0.ɵɵelement(1, "i", 186);
     i0.ɵɵtext(2, " Related Configuration ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 29);
-    i0.ɵɵelement(1, "i", 57);
+function MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 31);
+    i0.ɵɵelement(1, "i", 67);
     i0.ɵɵtext(2, " Loading libraries... ");
     i0.ɵɵelementEnd();
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-empty-state", 167);
+function MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-empty-state", 177);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_9_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 181);
+function MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_9_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 191);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ɵ$index_777_r35 = i0.ɵɵnextContext().$index;
+    const ɵ$index_787_r36 = i0.ɵɵnextContext().$index;
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.actionLibraries[ɵ$index_777_r35].ItemsUsed);
+    i0.ɵɵtextInterpolate(ctx_r1.actionLibraries[ɵ$index_787_r36].ItemsUsed);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_9_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r33 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 178);
-    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_9_For_2_Template_div_click_0_listener() { const lib_r34 = i0.ɵɵrestoreView(_r33).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.navigateToLibrary(lib_r34.ID)); });
-    i0.ɵɵelement(1, "i", 166);
-    i0.ɵɵelementStart(2, "div", 179)(3, "div", 180);
+function MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_9_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r34 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 188);
+    i0.ɵɵlistener("click", function MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_9_For_2_Template_div_click_0_listener() { const lib_r35 = i0.ɵɵrestoreView(_r34).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.navigateToLibrary(lib_r35.ID)); });
+    i0.ɵɵelement(1, "i", 176);
+    i0.ɵɵelementStart(2, "div", 189)(3, "div", 190);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_9_For_2_Conditional_5_Template, 2, 1, "div", 181);
+    i0.ɵɵconditionalCreate(5, MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_9_For_2_Conditional_5_Template, 2, 1, "div", 191);
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(6, "i", 164);
+    i0.ɵɵelement(6, "i", 174);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const lib_r34 = ctx.$implicit;
-    const ɵ$index_777_r35 = ctx.$index;
+    const lib_r35 = ctx.$implicit;
+    const ɵ$index_787_r36 = ctx.$index;
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(lib_r34.Name);
+    i0.ɵɵtextInterpolate(lib_r35.Name);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.actionLibraries[ɵ$index_777_r35].ItemsUsed ? 5 : -1);
+    i0.ɵɵconditional(ctx_r1.actionLibraries[ɵ$index_787_r36].ItemsUsed ? 5 : -1);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 168);
-    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_9_For_2_Template, 7, 2, "div", 177, _forTrack0);
+function MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 178);
+    i0.ɵɵrepeaterCreate(1, MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_9_For_2_Template, 7, 2, "div", 187, _forTrack0);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
     i0.ɵɵrepeater(ctx_r1.libraries);
 } }
-function MJActionFormComponentExtended_Conditional_0_Conditional_46_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "mj-accordion-panel", 26);
-    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_46_ng_template_1_Template, 3, 0, "ng-template", 27);
-    i0.ɵɵelementStart(2, "div", 28)(3, "div", 165)(4, "h3");
-    i0.ɵɵelement(5, "i", 166);
+function MJActionFormComponentExtended_Conditional_0_Conditional_48_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-accordion-panel", 40);
+    i0.ɵɵtemplate(1, MJActionFormComponentExtended_Conditional_0_Conditional_48_ng_template_1_Template, 3, 0, "ng-template", 29);
+    i0.ɵɵelementStart(2, "div", 30)(3, "div", 175)(4, "h3");
+    i0.ɵɵelement(5, "i", 176);
     i0.ɵɵtext(6, " Libraries");
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(7, MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_7_Template, 3, 0, "div", 29)(8, MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_8_Template, 1, 0, "mj-empty-state", 167)(9, MJActionFormComponentExtended_Conditional_0_Conditional_46_Conditional_9_Template, 3, 0, "div", 168);
+    i0.ɵɵconditionalCreate(7, MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_7_Template, 3, 0, "div", 31)(8, MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_8_Template, 1, 0, "mj-empty-state", 177)(9, MJActionFormComponentExtended_Conditional_0_Conditional_48_Conditional_9_Template, 3, 0, "div", 178);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "div", 169)(11, "div", 170);
-    i0.ɵɵelement(12, "i", 171);
+    i0.ɵɵelementStart(10, "div", 179)(11, "div", 180);
+    i0.ɵɵelement(12, "i", 181);
     i0.ɵɵelementStart(13, "span");
     i0.ɵɵtext(14, "Authorizations");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(15, "span", 172);
+    i0.ɵɵelementStart(15, "span", 182);
     i0.ɵɵtext(16, "View");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(17, "div", 170);
-    i0.ɵɵelement(18, "i", 173);
+    i0.ɵɵelementStart(17, "div", 180);
+    i0.ɵɵelement(18, "i", 183);
     i0.ɵɵelementStart(19, "span");
     i0.ɵɵtext(20, "Contexts");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(21, "span", 172);
+    i0.ɵɵelementStart(21, "span", 182);
     i0.ɵɵtext(22, "View");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(23, "div", 170);
-    i0.ɵɵelement(24, "i", 174);
+    i0.ɵɵelementStart(23, "div", 180);
+    i0.ɵɵelement(24, "i", 184);
     i0.ɵɵelementStart(25, "span");
     i0.ɵɵtext(26, "Scheduled Actions");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(27, "span", 172);
+    i0.ɵɵelementStart(27, "span", 182);
     i0.ɵɵtext(28, "View");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(29, "div", 170);
-    i0.ɵɵelement(30, "i", 175);
+    i0.ɵɵelementStart(29, "div", 180);
+    i0.ɵɵelement(30, "i", 185);
     i0.ɵɵelementStart(31, "span");
     i0.ɵɵtext(32, "Entity Actions");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(33, "span", 172);
+    i0.ɵɵelementStart(33, "span", 182);
     i0.ɵɵtext(34, "View");
     i0.ɵɵelementEnd()()()()();
 } if (rf & 2) {
@@ -1234,27 +1251,33 @@ function MJActionFormComponentExtended_Conditional_0_Template(rf, ctx) { if (rf
     i0.ɵɵconditionalCreate(27, MJActionFormComponentExtended_Conditional_0_Conditional_27_Template, 3, 0, "button", 23);
     i0.ɵɵelementEnd();
     i0.ɵɵconditionalCreate(28, MJActionFormComponentExtended_Conditional_0_Conditional_28_Template, 2, 0, "div", 24);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(29, "div", 25)(30, "mj-accordion-panel", 26);
-    i0.ɵɵtemplate(31, MJActionFormComponentExtended_Conditional_0_ng_template_31_Template, 4, 1, "ng-template", 27);
-    i0.ɵɵelementStart(32, "div", 28);
-    i0.ɵɵconditionalCreate(33, MJActionFormComponentExtended_Conditional_0_Conditional_33_Template, 3, 0, "div", 29)(34, MJActionFormComponentExtended_Conditional_0_Conditional_34_Template, 1, 1, "mj-empty-state", 30)(35, MJActionFormComponentExtended_Conditional_0_Conditional_35_Template, 16, 6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(36, MJActionFormComponentExtended_Conditional_0_Conditional_36_Template, 17, 9, "mj-accordion-panel", 26);
-    i0.ɵɵconditionalCreate(37, MJActionFormComponentExtended_Conditional_0_Conditional_37_Template, 13, 4, "mj-accordion-panel", 26);
-    i0.ɵɵelementStart(38, "mj-accordion-panel", 26);
-    i0.ɵɵtemplate(39, MJActionFormComponentExtended_Conditional_0_ng_template_39_Template, 4, 1, "ng-template", 27);
-    i0.ɵɵelementStart(40, "div", 28);
-    i0.ɵɵconditionalCreate(41, MJActionFormComponentExtended_Conditional_0_Conditional_41_Template, 4, 0, "div", 31);
-    i0.ɵɵconditionalCreate(42, MJActionFormComponentExtended_Conditional_0_Conditional_42_Template, 3, 0, "div", 29)(43, MJActionFormComponentExtended_Conditional_0_Conditional_43_Template, 1, 1, "mj-empty-state", 32)(44, MJActionFormComponentExtended_Conditional_0_Conditional_44_Template, 3, 0, "div", 33);
+    i0.ɵɵconditionalCreate(29, MJActionFormComponentExtended_Conditional_0_Conditional_29_Template, 4, 2, "button", 25);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(30, "div", 26)(31, "mj-accordion-sections", 27);
+    i0.ɵɵlistener("ActiveKeyChange", function MJActionFormComponentExtended_Conditional_0_Template_mj_accordion_sections_ActiveKeyChange_31_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.Phone.Pick($event)); });
+    i0.ɵɵelementStart(32, "mj-accordion-panel", 28);
+    i0.ɵɵtemplate(33, MJActionFormComponentExtended_Conditional_0_ng_template_33_Template, 4, 1, "ng-template", 29);
+    i0.ɵɵelementStart(34, "div", 30);
+    i0.ɵɵconditionalCreate(35, MJActionFormComponentExtended_Conditional_0_Conditional_35_Template, 3, 0, "div", 31)(36, MJActionFormComponentExtended_Conditional_0_Conditional_36_Template, 1, 1, "mj-empty-state", 32)(37, MJActionFormComponentExtended_Conditional_0_Conditional_37_Template, 16, 6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(45, MJActionFormComponentExtended_Conditional_0_Conditional_45_Template, 6, 2, "mj-accordion-panel", 26);
-    i0.ɵɵconditionalCreate(46, MJActionFormComponentExtended_Conditional_0_Conditional_46_Template, 35, 2, "mj-accordion-panel", 26);
-    i0.ɵɵelementEnd()()()();
+    i0.ɵɵconditionalCreate(38, MJActionFormComponentExtended_Conditional_0_Conditional_38_Template, 17, 9, "mj-accordion-panel", 33);
+    i0.ɵɵconditionalCreate(39, MJActionFormComponentExtended_Conditional_0_Conditional_39_Template, 13, 4, "mj-accordion-panel", 34);
+    i0.ɵɵelementStart(40, "mj-accordion-panel", 35);
+    i0.ɵɵtemplate(41, MJActionFormComponentExtended_Conditional_0_ng_template_41_Template, 4, 1, "ng-template", 29);
+    i0.ɵɵelementStart(42, "div", 30);
+    i0.ɵɵconditionalCreate(43, MJActionFormComponentExtended_Conditional_0_Conditional_43_Template, 4, 0, "div", 36);
+    i0.ɵɵconditionalCreate(44, MJActionFormComponentExtended_Conditional_0_Conditional_44_Template, 3, 0, "div", 31)(45, MJActionFormComponentExtended_Conditional_0_Conditional_45_Template, 1, 1, "mj-empty-state", 37)(46, MJActionFormComponentExtended_Conditional_0_Conditional_46_Template, 3, 0, "div", 38);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(47, MJActionFormComponentExtended_Conditional_0_Conditional_47_Template, 6, 2, "mj-accordion-panel", 39);
+    i0.ɵɵconditionalCreate(48, MJActionFormComponentExtended_Conditional_0_Conditional_48_Template, 35, 2, "mj-accordion-panel", 40);
+    i0.ɵɵelementEnd()()()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("Record", ctx_r1.record)("FormComponent", ctx_r1)("ToolbarConfig", ctx_r1.toolbarConfig)("WidthMode", "full-width");
-    i0.ɵɵadvance(8);
+    i0.ɵɵadvance(4);
+    i0.ɵɵclassProp("hero-view", !ctx_r1.EditMode)("hero-compact", !ctx_r1.EditMode && !ctx_r1.HeroDetailsOpen);
+    i0.ɵɵadvance(4);
     i0.ɵɵclassMap(ctx_r1.getActionIcon());
     i0.ɵɵstyleProp("color", ctx_r1.getTypeColor());
     i0.ɵɵadvance();
@@ -1277,28 +1300,36 @@ function MJActionFormComponentExtended_Conditional_0_Template(rf, ctx) { if (rf
     i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.record.Type === "Generated" ? 27 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(!ctx_r1.EditMode && ctx_r1.record.Status !== "Active" && ctx_r1.record.ID ? 28 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.EditMode && ctx_r1.HeroSummary ? 29 : -1);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("Expanded", true);
+    i0.ɵɵproperty("Enabled", ctx_r1.Phone.IsPhone)("ActiveKey", ctx_r1.Phone.Section);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("SectionCount", ctx_r1.ActionParams.length)("Expanded", true);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.isLoadingParams ? 33 : ctx_r1.actionParams.length === 0 ? 34 : 35);
+    i0.ɵɵconditional(ctx_r1.isLoadingParams ? 35 : ctx_r1.actionParams.length === 0 ? 36 : 37);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.record.Type === "Generated" ? 36 : -1);
+    i0.ɵɵconditional(ctx_r1.record.Type === "Generated" ? 38 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.isRuntimeAction ? 37 : -1);
+    i0.ɵɵconditional(ctx_r1.isRuntimeAction ? 39 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("Expanded", ctx_r1.expandedSections.resultCodes);
+    i0.ɵɵproperty("SectionCount", ctx_r1.ResultCodes.length)("Expanded", ctx_r1.expandedSections.resultCodes);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.record.IsSaved ? 41 : -1);
+    i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.record.IsSaved ? 43 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.isLoadingResultCodes ? 42 : ctx_r1.resultCodes.length === 0 ? 43 : 44);
+    i0.ɵɵconditional(ctx_r1.isLoadingResultCodes ? 44 : ctx_r1.resultCodes.length === 0 ? 45 : 46);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.record.IsSaved ? 45 : -1);
+    i0.ɵɵconditional(ctx_r1.record.IsSaved ? 47 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.record.IsSaved ? 46 : -1);
+    i0.ɵɵconditional(ctx_r1.record.IsSaved ? 48 : -1);
 } }
 let MJActionFormComponentExtended = class MJActionFormComponentExtended extends MJActionFormComponent {
     constructor() {
         super(...arguments);
+        /** Phone width shows the stacked accordions as sections behind one picker (design call 7A). */
+        this.Phone = new PhoneSectionsState(() => this.cdr.markForCheck());
+        /** Phone hero (6A): whether the summary line is expanded to show the rest of the hero. */
+        this.HeroDetailsOpen = false;
         // This form has a fully custom layout (header panel + accordion
         // sections we manage ourselves), so the toolbar's section-search,
         // expand/collapse, manage-sections, and width-toggle widgets don't
@@ -1349,6 +1380,24 @@ let MJActionFormComponentExtended = class MJActionFormComponentExtended extends
         this.viewContainerRef = inject(ViewContainerRef);
         this.sharedService = inject(SharedService);
     }
+    ngOnDestroy() {
+        super.ngOnDestroy();
+        this.Phone.Stop();
+    }
+    /** Toggles the phone hero between its compact identity row and the full hero. */
+    ToggleHeroDetails() {
+        this.HeroDetailsOpen = !this.HeroDetailsOpen;
+        this.cdr.markForCheck();
+    }
+    /** The phone hero's one-line summary of what the compact hero leaves out. */
+    get HeroSummary() {
+        return JoinHeroSummary([
+            this.category?.Name,
+            this.record.Type,
+            CountLabel(this.ActionParams.length, 'param'),
+            this.HasCodeApproval && this.record.CodeApprovalStatus ? `Code ${this.record.CodeApprovalStatus.toLowerCase()}` : null,
+        ]);
+    }
     /** @deprecated Use {@link ToolbarConfig}. */
     get toolbarConfig() {
         return this.ToolbarConfig;
@@ -2561,8 +2610,8 @@ let MJActionFormComponentExtended = class MJActionFormComponentExtended extends
         return this.DeleteParameter(param);
     }
     static { this.ɵfac = /*@__PURE__*/ (() => { let ɵMJActionFormComponentExtended_BaseFactory; return function MJActionFormComponentExtended_Factory(__ngFactoryType__) { return (ɵMJActionFormComponentExtended_BaseFactory || (ɵMJActionFormComponentExtended_BaseFactory = i0.ɵɵgetInheritedFactory(MJActionFormComponentExtended)))(__ngFactoryType__ || MJActionFormComponentExtended); }; })(); }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJActionFormComponentExtended, selectors: [["mj-action-form"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 4, consts: [["form", "ngForm"], [3, "Record", "FormComponent", "ToolbarConfig", "WidthMode"], [3, "Close", "Action", "ActionParams", "IsOpen"], [3, "Navigate", "DeleteRequested", "FavoriteToggled", "HistoryRequested", "ListManagementRequested", "Record", "FormComponent", "ToolbarConfig", "WidthMode"], [1, "record-form", 2, "display", "flex", "flex-direction", "column", "height", "100%", "overflow", "hidden"], [1, "action-main-area", 2, "display", "flex", "flex-direction", "column", "flex", "1", "min-height", "0", "overflow-y", "auto"], [1, "action-header", 2, "flex-shrink", "0", "padding", "20px", "background", "var(--mj-bg-surface-card)", "border-bottom", "2px solid var(--mj-border-default)"], [2, "display", "flex", "justify-content", "space-between", "align-items", "flex-start", "gap", "20px"], [2, "flex", "1", "min-width", "0"], [2, "display", "flex", "align-items", "center", "gap", "12px", "margin-bottom", "8px"], [2, "font-size", "1.4em"], ["type", "text", "name", "actionName", "placeholder", "Enter action name...", 1, "mj-input", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModel"], [2, "display", "flex", "gap", "16px", "margin-bottom", "12px", "flex-wrap", "wrap"], ["name", "actionDescription", "placeholder", "Enter action description...", 1, "mj-textarea", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModel", "rows"], [2, "margin", "0 0 12px 0", "color", "var(--mj-text-muted)", "font-size", "0.9em", "line-height", "1.4"], [1, "quick-config", 2, "display", "flex", "align-items", "center", "gap", "16px", "flex-wrap", "wrap"], [1, "config-item", 2, "display", "flex", "align-items", "center", "gap", "6px", "font-size", "0.85em"], [1, "fa-solid", "fa-cube", 2, "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-secondary)", "font-weight", "500"], [1, "action-buttons", 2, "display", "flex", "flex-direction", "column", "gap", "8px", "align-items", "flex-end"], [2, "display", "flex", "gap", "8px"], ["mjButton", "", "variant", "primary", "size", "lg", "title", "Open Run Harness", 3, "disabled"], ["mjButton", "", "variant", "outline", "size", "md", "title", "Regenerate Code"], [2, "font-size", "0.75em", "color", "var(--mj-status-error)", "text-align", "right"], [1, "configuration-sections", 2, "flex", "1", "background", "var(--mj-bg-surface-card)", "border-top", "2px solid var(--mj-border-default)", "padding", "16px", "min-height", "0"], [2, "margin-bottom", "12px", 3, "Expanded"], ["mjAccordionTitle", ""], [2, "padding", "16px"], [1, "loading-state"], ["Size", "compact", "Icon", "fa-solid fa-sliders", "Title", "No parameters defined", 3, "Message"], [2, "display", "flex", "justify-content", "flex-end", "margin-bottom", "12px"], ["Size", "compact", "Icon", "fa-solid fa-flag-checkered", "Title", "No result codes defined", 3, "Message"], [1, "result-codes-grid"], ["type", "text", "name", "actionName", "placeholder", "Enter action name...", 1, "mj-input", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModelChange", "ngModel"], [2, "margin", "0", "color", "var(--mj-text-secondary)", "font-weight", "600", "flex", "1"], [1, "status-chip"], [1, "status-chip", 3, "title"], [2, "margin-right", "4px"], [2, "display", "block", "margin-bottom", "4px", "font-weight", "600", "color", "var(--mj-text-secondary)", "font-size", "0.9em"], ["name", "actionStatus", "TextField", "text", "ValueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "Data", "ValuePrimitive"], [2, "color", "var(--mj-status-error)"], ["name", "actionType", "TextField", "text", "ValueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "Data", "ValuePrimitive"], ["name", "categoryID", "Placeholder", "Select category...", 2, "width", "200px", 3, "ngModelChange", "ngModel", "Data"], ["name", "codeApprovalStatus", "TextField", "text", "ValueField", "value", 2, "width", "160px", 3, "ngModelChange", "ngModel", "Data", "ValuePrimitive"], ["name", "actionDescription", "placeholder", "Enter action description...", 1, "mj-textarea", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModelChange", "ngModel", "rows"], [1, "fa-solid", "fa-folder", 2, "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-secondary)", "font-weight", "500", "cursor", "pointer", 3, "click"], [1, "fa-solid", "fa-external-link", 2, "font-size", "0.75em", "margin-left", "4px"], [2, "font-weight", "500"], [1, "fa-solid", "fa-sliders", 2, "color", "var(--mj-text-muted)"], ["mjButton", "", "variant", "primary", "size", "lg", "title", "Open Run Harness", 3, "click", "disabled"], [1, "fa-solid", "fa-play"], ["mjButton", "", "variant", "outline", "size", "md", "title", "Regenerate Code", 3, "click"], [1, "fa-solid", "fa-robot"], [2, "display", "flex", "align-items", "center", "gap", "8px", "font-weight", "600"], [2, "background", "var(--mj-status-info)", "color", "var(--mj-text-inverse)", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "params-section"], [1, "params-header"], [1, "fa-solid", "fa-sign-in-alt"], ["mjButton", "", "variant", "flat", "size", "sm"], ["Size", "compact", "Icon", "fa-solid fa-inbox", "Title", "No input parameters defined"], [1, "params-grid"], [1, "params-section", 2, "margin-top", "24px"], [1, "fa-solid", "fa-sign-out-alt"], ["Size", "compact", "Icon", "fa-solid fa-inbox", "Title", "No output parameters defined"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "param-card", 3, "required", "clickable"], [1, "param-card", 3, "click"], [1, "param-header"], [1, "param-name"], [1, "param-badges"], [1, "required-badge"], [1, "array-badge"], [1, "param-details"], [1, "param-type"], [1, "param-description"], [1, "param-default"], ["title", "Edit parameter", 1, "param-edit-btn", 3, "click"], [1, "fa-solid", "fa-edit"], ["title", "Delete parameter", 1, "param-delete-btn", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "default-label"], [1, "param-card", 3, "clickable"], [1, "generation-panel"], [1, "code-editor-section"], [1, "code-toolbar"], [1, "fa-solid", "fa-file-code"], [1, "code-actions"], [1, "fa-solid", "fa-copy"], ["name", "actionCode", 2, "height", "400px", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"], [1, "code-comments"], [1, "approval-comments"], [1, "fa-solid", "fa-code", 2, "color", "var(--mj-text-muted)"], [2, "background", "var(--mj-status-warning)", "color", "var(--mj-color-warning-800)", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [1, "fa-solid", "fa-lock"], [1, "prompt-section"], ["name", "userPrompt", "placeholder", "Describe what this action should do...", 1, "mj-textarea", 2, "width", "100%", "min-height", "120px", 3, "ngModelChange", "ngModel", "rows"], [1, "comments-section"], ["name", "userComments", "placeholder", "Internal notes...", 1, "mj-textarea", 2, "width", "100%", 3, "ngModelChange", "ngModel", "rows"], [1, "generation-controls"], ["name", "codeLocked", 3, "ngModelChange", "ngModel"], [2, "margin-left", "8px"], [1, "fa-solid", "fa-comment"], ["name", "codeApprovalComments", "placeholder", "Explain why the code was rejected...", 1, "mj-textarea", 2, "width", "100%", 3, "ngModelChange", "ngModel", "rows"], ["Variant", "error"], [2, "font-weight", "600", "margin-bottom", "6px", "color", "var(--mj-text-primary)"], [1, "fa-solid", "fa-code", 2, "margin-right", "6px", "color", "var(--mj-text-muted)"], [2, "background", "var(--mj-bg-surface-sunken)", "color", "var(--mj-text-primary)", "padding", "12px", "border-radius", "4px", "overflow-x", "auto", "max-height", "400px", "font-family", "'SF Mono', Monaco, Consolas, monospace", "font-size", "0.85em", "margin", "0"], ["Variant", "warning", "Title", "Approval required before this Runtime action can execute.", 1, "approval-required-alert"], [1, "fa-solid", "fa-wand-magic-sparkles", 2, "color", "var(--mj-status-warning)"], [2, "color", "var(--mj-text-muted)", "font-weight", "400", "font-size", "0.85em"], ["Variant", "warning", "Title", "Wildcard permissions enabled"], [2, "display", "grid", "grid-template-columns", "repeat(auto-fit, minmax(280px, 1fr))", "gap", "16px", "margin-bottom", "20px"], [2, "border", "1px solid var(--mj-border-default)", "border-radius", "6px", "padding", "12px", "background", "var(--mj-bg-surface-card)"], [2, "font-weight", "600", "margin-bottom", "8px", "color", "var(--mj-text-primary)"], [1, "fa-solid", "fa-database", 2, "margin-right", "6px", "color", "var(--mj-brand-primary)"], [2, "color", "var(--mj-text-muted)", "font-style", "italic"], [2, "display", "flex", "flex-direction", "column", "gap", "4px"], [1, "fa-solid", "fa-bolt", 2, "margin-right", "6px", "color", "var(--mj-brand-primary)"], [1, "fa-solid", "fa-robot", 2, "margin-right", "6px", "color", "var(--mj-brand-primary)"], [2, "display", "grid", "grid-template-columns", "1fr 1fr", "gap", "16px", "margin-bottom", "16px"], [1, "fa-solid", "fa-gauge-high", 2, "margin-right", "6px", "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-secondary)", "font-size", "0.9em"], [1, "fa-solid", "fa-book", 2, "margin-right", "6px", "color", "var(--mj-text-muted)"], [2, "display", "flex", "flex-wrap", "wrap", "gap", "4px"], [2, "background", "var(--mj-bg-surface-sunken)", "padding", "4px 8px", "border-radius", "4px", "font-size", "0.9em", "color", "var(--mj-text-primary)"], [2, "background", "var(--mj-bg-surface-sunken)", "padding", "2px 8px", "border-radius", "10px", "font-size", "0.85em"], [2, "color", "var(--mj-text-secondary)", "font-size", "0.9em", "margin-bottom", "12px"], [1, "mj-button", "mj-button-primary", 3, "click"], [1, "fa-solid", "fa-check"], [1, "mj-button", 3, "click"], [1, "fa-solid", "fa-ban"], [1, "fa-solid", "fa-flag-checkered", 2, "color", "var(--mj-text-muted)"], [2, "background", "var(--mj-status-success)", "color", "var(--mj-text-inverse)", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], ["mjButton", "", "variant", "primary", "size", "sm", 3, "click"], [1, "result-code-card", 3, "success", "failure", "clickable"], [1, "result-code-card", 3, "click"], [1, "result-icon"], [1, "result-content"], [1, "result-code"], [1, "result-description"], [1, "result-actions"], ["title", "Edit result code", 1, "result-edit-btn", 3, "click"], ["title", "Delete result code", 1, "result-delete-btn", 3, "click"], ["Size", "compact", "Icon", "fa-solid fa-chart-line", "Title", "No executions yet"], [1, "fa-solid", "fa-chart-line", 2, "color", "var(--mj-text-muted)"], [1, "execution-stats-row"], [1, "stat-box"], [1, "fa-solid", "fa-tachometer-alt"], [1, "stat-info"], [1, "stat-label", 2, "color", "var(--mj-text-primary)"], [1, "stat-value", 2, "color", "var(--mj-text-primary)"], [1, "fa-solid", "fa-check-circle"], [1, "stat-value", 2, "font-weight", "600"], [1, "fa-solid", "fa-play-circle"], [2, "margin-top", "24px"], [1, "fa-solid", "fa-history"], [1, "executions-table"], [1, "execution-row", 3, "success"], [1, "execution-row"], [1, "running"], [1, "fa-solid", "fa-external-link"], [1, "config-subsection"], [1, "fa-solid", "fa-book"], ["Size", "compact", "Icon", "fa-solid fa-book", "Title", "No libraries configured"], [1, "library-cards"], [1, "related-entities-grid"], [1, "related-entity-link"], [1, "fa-solid", "fa-shield-alt"], [1, "entity-count"], [1, "fa-solid", "fa-layer-group"], [1, "fa-solid", "fa-calendar"], [1, "fa-solid", "fa-cube"], [1, "fa-solid", "fa-cogs", 2, "color", "var(--mj-text-muted)"], [1, "library-card"], [1, "library-card", 3, "click"], [1, "library-info"], [1, "library-name"], [1, "library-items"]], template: function MJActionFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵconditionalCreate(0, MJActionFormComponentExtended_Conditional_0_Template, 47, 27, "mj-record-form-container", 1);
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJActionFormComponentExtended, selectors: [["mj-action-form"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 4, consts: [["form", "ngForm"], [3, "Record", "FormComponent", "ToolbarConfig", "WidthMode"], [3, "Close", "Action", "ActionParams", "IsOpen"], [3, "Navigate", "DeleteRequested", "FavoriteToggled", "HistoryRequested", "ListManagementRequested", "Record", "FormComponent", "ToolbarConfig", "WidthMode"], [1, "record-form", 2, "display", "flex", "flex-direction", "column", "height", "100%", "overflow", "hidden"], [1, "action-main-area", 2, "display", "flex", "flex-direction", "column", "flex", "1", "min-height", "0", "overflow-y", "auto"], [1, "action-header", "phone-hero", 2, "flex-shrink", "0", "padding", "20px", "background", "var(--mj-bg-surface-card)", "border-bottom", "2px solid var(--mj-border-default)"], [1, "hero-header-row"], [2, "flex", "1", "min-width", "0"], [2, "display", "flex", "align-items", "center", "gap", "12px", "margin-bottom", "8px"], [2, "font-size", "1.4em"], ["type", "text", "name", "actionName", "placeholder", "Enter action name...", 1, "mj-input", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModel"], [2, "display", "flex", "gap", "16px", "margin-bottom", "12px", "flex-wrap", "wrap"], ["name", "actionDescription", "placeholder", "Enter action description...", 1, "mj-textarea", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModel", "rows"], [1, "phone-hero-detail", 2, "margin", "0 0 12px 0", "color", "var(--mj-text-muted)", "font-size", "0.9em", "line-height", "1.4"], [1, "quick-config", "phone-hero-detail", 2, "display", "flex", "align-items", "center", "gap", "16px", "flex-wrap", "wrap"], [1, "config-item", 2, "display", "flex", "align-items", "center", "gap", "6px", "font-size", "0.85em"], [1, "fa-solid", "fa-cube", 2, "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-secondary)", "font-weight", "500"], [1, "action-buttons"], [2, "display", "flex", "gap", "8px"], ["mjButton", "", "variant", "primary", "size", "lg", "title", "Open Run Harness", 1, "phone-hero-run", 3, "disabled"], ["mjButton", "", "variant", "outline", "size", "md", "title", "Regenerate Code"], [2, "font-size", "0.75em", "color", "var(--mj-status-error)", "text-align", "right"], ["type", "button", 1, "phone-hero-summary"], [1, "configuration-sections", 2, "flex", "1", "background", "var(--mj-bg-surface-card)", "border-top", "2px solid var(--mj-border-default)", "padding", "16px", "min-height", "0"], [3, "ActiveKeyChange", "Enabled", "ActiveKey"], ["SectionKey", "parameters", "SectionTitle", "Parameters", "SectionIcon", "fa-solid fa-sliders", 2, "margin-bottom", "12px", 3, "SectionCount", "Expanded"], ["mjAccordionTitle", ""], [1, "phone-flush-x", 2, "padding", "16px"], [1, "loading-state"], ["Size", "compact", "Icon", "fa-solid fa-sliders", "Title", "No parameters defined", 3, "Message"], ["SectionKey", "code", "SectionTitle", "Code & Generation", "SectionIcon", "fa-solid fa-code", 2, "margin-bottom", "12px", 3, "Expanded"], ["SectionKey", "runtime", "SectionTitle", "Runtime Configuration & Permissions", "SectionIcon", "fa-solid fa-wand-magic-sparkles", 2, "margin-bottom", "12px", 3, "Expanded"], ["SectionKey", "result-codes", "SectionTitle", "Result Codes", "SectionIcon", "fa-solid fa-flag-checkered", 2, "margin-bottom", "12px", 3, "SectionCount", "Expanded"], [2, "display", "flex", "justify-content", "flex-end", "margin-bottom", "12px"], ["Size", "compact", "Icon", "fa-solid fa-flag-checkered", "Title", "No result codes defined", 3, "Message"], [1, "result-codes-grid"], ["SectionKey", "execution", "SectionTitle", "Execution & Monitoring", "SectionIcon", "fa-solid fa-chart-line", 2, "margin-bottom", "12px", 3, "Expanded"], ["SectionKey", "related", "SectionTitle", "Related Configuration", "SectionIcon", "fa-solid fa-cogs", 2, "margin-bottom", "12px", 3, "Expanded"], ["type", "text", "name", "actionName", "placeholder", "Enter action name...", 1, "mj-input", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModelChange", "ngModel"], [2, "margin", "0", "color", "var(--mj-text-secondary)", "font-weight", "600", "flex", "1"], [1, "status-chip"], [1, "status-chip", "phone-hero-detail", 3, "title"], [2, "margin-right", "4px"], [2, "display", "block", "margin-bottom", "4px", "font-weight", "600", "color", "var(--mj-text-secondary)", "font-size", "0.9em"], ["name", "actionStatus", "TextField", "text", "ValueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "Data", "ValuePrimitive"], [2, "color", "var(--mj-status-error)"], ["name", "actionType", "TextField", "text", "ValueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "Data", "ValuePrimitive"], ["name", "categoryID", "Placeholder", "Select category...", 2, "width", "200px", 3, "ngModelChange", "ngModel", "Data"], ["name", "codeApprovalStatus", "TextField", "text", "ValueField", "value", 2, "width", "160px", 3, "ngModelChange", "ngModel", "Data", "ValuePrimitive"], ["name", "actionDescription", "placeholder", "Enter action description...", 1, "mj-textarea", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModelChange", "ngModel", "rows"], [1, "fa-solid", "fa-folder", 2, "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-secondary)", "font-weight", "500", "cursor", "pointer", 3, "click"], [1, "fa-solid", "fa-external-link", 2, "font-size", "0.75em", "margin-left", "4px"], [2, "font-weight", "500"], [1, "fa-solid", "fa-sliders", 2, "color", "var(--mj-text-muted)"], ["mjButton", "", "variant", "primary", "size", "lg", "title", "Open Run Harness", 1, "phone-hero-run", 3, "click", "disabled"], [1, "fa-solid", "fa-play"], ["mjButton", "", "variant", "outline", "size", "md", "title", "Regenerate Code", 3, "click"], [1, "fa-solid", "fa-robot"], ["type", "button", 1, "phone-hero-summary", 3, "click"], [1, "phone-hero-summary-text"], ["aria-hidden", "true", 1, "fa-solid", "fa-chevron-down"], [2, "display", "flex", "align-items", "center", "gap", "8px", "font-weight", "600"], [2, "background", "var(--mj-status-info)", "color", "var(--mj-text-inverse)", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "params-section"], [1, "params-header"], [1, "fa-solid", "fa-sign-in-alt"], ["mjButton", "", "variant", "flat", "size", "sm"], ["Size", "compact", "Icon", "fa-solid fa-inbox", "Title", "No input parameters defined"], [1, "params-grid"], [1, "params-section", 2, "margin-top", "24px"], [1, "fa-solid", "fa-sign-out-alt"], ["Size", "compact", "Icon", "fa-solid fa-inbox", "Title", "No output parameters defined"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "param-card", 3, "required", "clickable"], [1, "param-card", 3, "click"], [1, "param-header"], [1, "param-name"], [1, "param-badges"], [1, "required-badge"], [1, "array-badge"], [1, "param-details"], [1, "param-type"], [1, "param-description"], [1, "param-default"], ["title", "Edit parameter", 1, "param-edit-btn", 3, "click"], [1, "fa-solid", "fa-edit"], ["title", "Delete parameter", 1, "param-delete-btn", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "default-label"], [1, "param-card", 3, "clickable"], [1, "generation-panel"], [1, "code-editor-section"], [1, "code-toolbar"], [1, "fa-solid", "fa-file-code"], [1, "code-actions"], [1, "fa-solid", "fa-copy"], ["name", "actionCode", 2, "height", "400px", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"], [1, "code-comments"], [1, "approval-comments"], [1, "fa-solid", "fa-code", 2, "color", "var(--mj-text-muted)"], [2, "background", "var(--mj-status-warning)", "color", "var(--mj-color-warning-800)", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [1, "fa-solid", "fa-lock"], [1, "prompt-section"], ["name", "userPrompt", "placeholder", "Describe what this action should do...", 1, "mj-textarea", 2, "width", "100%", "min-height", "120px", 3, "ngModelChange", "ngModel", "rows"], [1, "comments-section"], ["name", "userComments", "placeholder", "Internal notes...", 1, "mj-textarea", 2, "width", "100%", 3, "ngModelChange", "ngModel", "rows"], [1, "generation-controls"], ["name", "codeLocked", 3, "ngModelChange", "ngModel"], [2, "margin-left", "8px"], [1, "fa-solid", "fa-comment"], ["name", "codeApprovalComments", "placeholder", "Explain why the code was rejected...", 1, "mj-textarea", 2, "width", "100%", 3, "ngModelChange", "ngModel", "rows"], ["Variant", "error"], [2, "font-weight", "600", "margin-bottom", "6px", "color", "var(--mj-text-primary)"], [1, "fa-solid", "fa-code", 2, "margin-right", "6px", "color", "var(--mj-text-muted)"], [2, "background", "var(--mj-bg-surface-sunken)", "color", "var(--mj-text-primary)", "padding", "12px", "border-radius", "4px", "overflow-x", "auto", "max-height", "400px", "font-family", "'SF Mono', Monaco, Consolas, monospace", "font-size", "0.85em", "margin", "0"], ["Variant", "warning", "Title", "Approval required before this Runtime action can execute.", 1, "approval-required-alert"], [1, "fa-solid", "fa-wand-magic-sparkles", 2, "color", "var(--mj-status-warning)"], [2, "color", "var(--mj-text-muted)", "font-weight", "400", "font-size", "0.85em"], ["Variant", "warning", "Title", "Wildcard permissions enabled"], [2, "display", "grid", "grid-template-columns", "repeat(auto-fit, minmax(280px, 1fr))", "gap", "16px", "margin-bottom", "20px"], [2, "border", "1px solid var(--mj-border-default)", "border-radius", "6px", "padding", "12px", "background", "var(--mj-bg-surface-card)"], [2, "font-weight", "600", "margin-bottom", "8px", "color", "var(--mj-text-primary)"], [1, "fa-solid", "fa-database", 2, "margin-right", "6px", "color", "var(--mj-brand-primary)"], [2, "color", "var(--mj-text-muted)", "font-style", "italic"], [2, "display", "flex", "flex-direction", "column", "gap", "4px"], [1, "fa-solid", "fa-bolt", 2, "margin-right", "6px", "color", "var(--mj-brand-primary)"], [1, "fa-solid", "fa-robot", 2, "margin-right", "6px", "color", "var(--mj-brand-primary)"], [2, "display", "grid", "grid-template-columns", "1fr 1fr", "gap", "16px", "margin-bottom", "16px"], [1, "fa-solid", "fa-gauge-high", 2, "margin-right", "6px", "color", "var(--mj-text-muted)"], [2, "color", "var(--mj-text-secondary)", "font-size", "0.9em"], [1, "fa-solid", "fa-book", 2, "margin-right", "6px", "color", "var(--mj-text-muted)"], [2, "display", "flex", "flex-wrap", "wrap", "gap", "4px"], [2, "background", "var(--mj-bg-surface-sunken)", "padding", "4px 8px", "border-radius", "4px", "font-size", "0.9em", "color", "var(--mj-text-primary)"], [2, "background", "var(--mj-bg-surface-sunken)", "padding", "2px 8px", "border-radius", "10px", "font-size", "0.85em"], [2, "color", "var(--mj-text-secondary)", "font-size", "0.9em", "margin-bottom", "12px"], [1, "mj-button", "mj-button-primary", 3, "click"], [1, "fa-solid", "fa-check"], [1, "mj-button", 3, "click"], [1, "fa-solid", "fa-ban"], [1, "fa-solid", "fa-flag-checkered", 2, "color", "var(--mj-text-muted)"], [2, "background", "var(--mj-status-success)", "color", "var(--mj-text-inverse)", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], ["mjButton", "", "variant", "primary", "size", "sm", 3, "click"], [1, "result-code-card", 3, "success", "failure", "clickable"], [1, "result-code-card", 3, "click"], [1, "result-icon"], [1, "result-content"], [1, "result-code"], [1, "result-description"], [1, "result-actions"], ["title", "Edit result code", 1, "result-edit-btn", 3, "click"], ["title", "Delete result code", 1, "result-delete-btn", 3, "click"], ["Size", "compact", "Icon", "fa-solid fa-chart-line", "Title", "No executions yet"], [1, "fa-solid", "fa-chart-line", 2, "color", "var(--mj-text-muted)"], [1, "execution-stats-row"], [1, "stat-box"], [1, "fa-solid", "fa-tachometer-alt"], [1, "stat-info"], [1, "stat-label", 2, "color", "var(--mj-text-primary)"], [1, "stat-value", 2, "color", "var(--mj-text-primary)"], [1, "fa-solid", "fa-check-circle"], [1, "stat-value", 2, "font-weight", "600"], [1, "fa-solid", "fa-play-circle"], [2, "margin-top", "24px"], [1, "fa-solid", "fa-history"], [1, "executions-table"], [1, "execution-row", 3, "success"], [1, "execution-row"], [1, "running"], [1, "fa-solid", "fa-external-link"], [1, "config-subsection"], [1, "fa-solid", "fa-book"], ["Size", "compact", "Icon", "fa-solid fa-book", "Title", "No libraries configured"], [1, "library-cards"], [1, "related-entities-grid"], [1, "related-entity-link"], [1, "fa-solid", "fa-shield-alt"], [1, "entity-count"], [1, "fa-solid", "fa-layer-group"], [1, "fa-solid", "fa-calendar"], [1, "fa-solid", "fa-cube"], [1, "fa-solid", "fa-cogs", 2, "color", "var(--mj-text-muted)"], [1, "library-card"], [1, "library-card", 3, "click"], [1, "library-info"], [1, "library-name"], [1, "library-items"]], template: function MJActionFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵconditionalCreate(0, MJActionFormComponentExtended_Conditional_0_Template, 49, 36, "mj-record-form-container", 1);
             i0.ɵɵelementStart(1, "mj-action-test-harness-dialog", 2);
             i0.ɵɵlistener("Close", function MJActionFormComponentExtended_Template_mj_action_test_harness_dialog_Close_1_listener() { return ctx.onTestHarnessVisibilityChanged(false); });
             i0.ɵɵelementEnd();
@@ -2570,7 +2619,7 @@ let MJActionFormComponentExtended = class MJActionFormComponentExtended extends
             i0.ɵɵconditional(ctx.record ? 0 : -1);
             i0.ɵɵadvance();
             i0.ɵɵproperty("Action", ctx.record)("ActionParams", ctx.actionParams)("IsOpen", ctx.showTestHarness);
-        } }, dependencies: [i1.ɵNgNoValidate, i1.DefaultValueAccessor, i1.NgControlStatus, i1.NgControlStatusGroup, i1.NgModel, i1.NgForm, i2.MJEmptyStateComponent, i2.MJAlertComponent, i2.MJButtonDirective, i2.MJAccordionPanelComponent, i2.MJAccordionTitleDirective, i2.MJDropdownComponent, i2.MJSwitchComponent, i3.MjRecordFormContainerComponent, i4.CodeEditorComponent, i5.ActionTestHarnessDialogComponent, i6.DatePipe], styles: ["\n[_nghost-%COMP%] {\n    display: block;\n    height: 100%;\n}\n\n\n.approval-required-alert[_ngcontent-%COMP%] { margin-top: 16px; }\n\n.record-form-container[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form[_ngcontent-%COMP%] {\n    min-height: 0 !important;\n}\n\n\n.action-hero-header[_ngcontent-%COMP%] {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 32px;\n    margin: -20px -20px 24px -20px;\n    border-radius: 0 0 var(--mj-radius-lg) var(--mj-radius-lg);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.hero-content[_ngcontent-%COMP%] {\n    max-width: 1400px;\n    margin: 0 auto;\n}\n\n.action-identity[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-start;\n    gap: 24px;\n    margin-bottom: 24px;\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%] {\n    width: 80px;\n    height: 80px;\n    border-radius: var(--mj-radius-lg);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-4xl);\n}\n\n.action-info[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.action-title-row[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    margin-bottom: 12px;\n    flex-wrap: wrap;\n}\n\n.action-title[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 2em;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-inverse);\n}\n\n.action-name-input[_ngcontent-%COMP%] {\n    font-size: 1.8em;\n    font-weight: var(--mj-font-semibold);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    padding: 8px 16px;\n    border-radius: var(--mj-radius-md);\n    min-width: 400px;\n}\n\n.action-name-input[_ngcontent-%COMP%]::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n.action-badges[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n    flex-wrap: wrap;\n}\n\n.status-badge[_ngcontent-%COMP%], .type-badge[_ngcontent-%COMP%], .approval-badge[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 6px 14px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n}\n\n.action-category[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 0.95em;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    margin-bottom: 12px;\n}\n\n.action-category[_ngcontent-%COMP%]:hover {\n    color: var(--mj-text-inverse);\n    transform: translateX(4px);\n}\n\n.action-description[_ngcontent-%COMP%] {\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 1.05em;\n    line-height: var(--mj-leading-relaxed);\n    margin: 0;\n}\n\n.action-description-input[_ngcontent-%COMP%] {\n    width: 100%;\n    max-width: 600px;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    border-radius: var(--mj-radius-md);\n}\n\n.action-description-input[_ngcontent-%COMP%]::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n\n.action-stats[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 24px;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n}\n\n.stat-card[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-text-inverse) 10%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border-radius: var(--mj-radius-lg);\n    padding: 16px 24px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    min-width: 160px;\n}\n\n.stat-card[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-2xl);\n    color: color-mix(in srgb, var(--mj-text-inverse) 80%, transparent);\n}\n\n.stat-content[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n    font-size: 1.4em;\n    font-weight: var(--mj-font-bold);\n    color: var(--mj-text-inverse);\n}\n\n.stat-label[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-sm);\n    color: color-mix(in srgb, var(--mj-text-inverse) 70%, transparent);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n\n.hero-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 12px;\n    flex-wrap: wrap;\n}\n\n.hero-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n    backdrop-filter: blur(10px);\n}\n\n\n.action-content[_ngcontent-%COMP%] {\n    padding: 0 20px 20px;\n}\n\n.content-section[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-lg);\n    margin-bottom: 20px;\n    overflow: hidden;\n    transition: all var(--mj-transition-base);\n}\n\n.content-section[_ngcontent-%COMP%]:hover {\n    box-shadow: var(--mj-shadow-md);\n}\n\n.section-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 20px;\n    background: var(--mj-bg-surface-elevated);\n    cursor: pointer;\n    user-select: none;\n    transition: background var(--mj-transition-base);\n}\n\n.section-header[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.section-header[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 1.3em;\n    color: var(--mj-text-primary);\n    flex: 1;\n}\n\n.section-header[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:first-child {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.section-count[_ngcontent-%COMP%] {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 2px 8px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n}\n\n.toggle-icon[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    transition: transform 0.3s;\n}\n\n.toggle-icon.rotated[_ngcontent-%COMP%] {\n    transform: rotate(-90deg);\n}\n\n.section-content[_ngcontent-%COMP%] {\n    padding: 24px;\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\n.overview-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n    gap: 20px;\n}\n\n.overview-field[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.overview-field[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.required[_ngcontent-%COMP%] {\n    color: var(--mj-status-error);\n}\n\n.full-width[_ngcontent-%COMP%] {\n    width: 100%;\n}\n\n.overview-display[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 24px;\n}\n\n.display-field[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.display-field[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-sm);\n    color: var(--mj-text-muted);\n    font-weight: var(--mj-font-semibold);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.display-value[_ngcontent-%COMP%] {\n    font-size: 1.1em;\n    color: var(--mj-text-primary);\n}\n\n.display-value.code[_ngcontent-%COMP%] {\n    font-family: 'Courier New', monospace;\n    background: var(--mj-bg-surface-sunken);\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n}\n\n.approval-date[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-left: 8px;\n}\n\n\n.generation-panel[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    margin-bottom: 24px;\n}\n\n.generation-panel[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0 0 16px 0;\n    color: var(--mj-color-indigo-500);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.prompt-section[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%] {\n    margin-bottom: 16px;\n}\n\n.prompt-section[_ngcontent-%COMP%]   label[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n}\n\n.generation-controls[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding-top: 12px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.code-locked-badge[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 4px 10px;\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.code-editor-section[_ngcontent-%COMP%] {\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    overflow: hidden;\n}\n\n.code-toolbar[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 16px;\n    background: var(--mj-bg-surface-sunken);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.code-toolbar[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 1.1em;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    margin-top: 16px;\n}\n\n.code-comments[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n    margin: 0 0 8px 0;\n    color: var(--mj-status-info);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    line-height: var(--mj-leading-relaxed);\n}\n\n.approval-comments[_ngcontent-%COMP%] {\n    margin-top: 16px;\n}\n\n.approval-comments[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-status-error);\n}\n\n\n.params-section[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    border-radius: var(--mj-radius-lg);\n    padding: 20px;\n}\n\n.params-section.params-section-compact[_ngcontent-%COMP%] {\n    padding: 12px 20px;\n}\n\n.params-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 16px;\n}\n\n.params-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.params-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.param-card[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface);\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    transition: all var(--mj-transition-base);\n}\n\n.param-card[_ngcontent-%COMP%]:hover {\n    border-color: var(--mj-brand-primary);\n    box-shadow: var(--mj-shadow-sm);\n}\n\n.param-card.required[_ngcontent-%COMP%] {\n    border-color: var(--mj-status-warning);\n}\n\n.param-card.clickable[_ngcontent-%COMP%] {\n    cursor: pointer;\n}\n\n.param-card.clickable[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n    border-color: var(--mj-brand-primary);\n    transform: translateY(-1px);\n}\n\n.param-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 8px;\n}\n\n.param-name[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n}\n\n.param-badges[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.param-edit-btn[_ngcontent-%COMP%], \n.param-delete-btn[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    padding: 4px 8px;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    border-radius: var(--mj-radius-sm);\n    transition: all var(--mj-transition-base);\n}\n\n.param-edit-btn[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-info);\n}\n\n.param-delete-btn[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n.param-details[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.required-badge[_ngcontent-%COMP%] {\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.array-badge[_ngcontent-%COMP%] {\n    background: var(--mj-color-indigo-500);\n    color: var(--mj-text-inverse);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.param-type[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-bottom: 8px;\n}\n\n.param-description[_ngcontent-%COMP%] {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n    margin-bottom: 8px;\n}\n\n.param-default[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    margin-top: 8px;\n    padding-top: 8px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.default-label[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n}\n\n.param-default[_ngcontent-%COMP%]   code[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-family: 'Courier New', monospace;\n    color: var(--mj-color-error-400);\n}\n\n\n\n.result-codes-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.result-code-card[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-start;\n    gap: 16px;\n    padding: 16px;\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    background: var(--mj-bg-surface);\n    transition: all var(--mj-transition-base);\n    position: relative;\n}\n\n.result-code-card.clickable[_ngcontent-%COMP%] {\n    cursor: pointer;\n}\n\n.result-code-card[_ngcontent-%COMP%]:hover {\n    transform: translateY(-2px);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.result-code-card.success[_ngcontent-%COMP%] {\n    border-color: var(--mj-status-success);\n    background: color-mix(in srgb, var(--mj-status-success) 10%, var(--mj-bg-surface));\n}\n\n.result-code-card.failure[_ngcontent-%COMP%] {\n    border-color: var(--mj-status-error);\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n}\n\n.result-actions[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 8px;\n    right: 8px;\n    display: flex;\n    gap: 4px;\n    opacity: 0;\n    transition: opacity var(--mj-transition-base);\n}\n\n.result-code-card[_ngcontent-%COMP%]:hover   .result-actions[_ngcontent-%COMP%] {\n    opacity: 1;\n}\n\n.result-edit-btn[_ngcontent-%COMP%], \n.result-delete-btn[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 4px 8px;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    font-size: var(--mj-text-sm);\n}\n\n.result-edit-btn[_ngcontent-%COMP%]:hover {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-brand-primary);\n}\n\n.result-delete-btn[_ngcontent-%COMP%]:hover {\n    background: var(--mj-status-error);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-status-error);\n}\n\n.result-icon[_ngcontent-%COMP%] {\n    font-size: 1.5em;\n    flex-shrink: 0;\n}\n\n.result-code-card.success[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n}\n\n.result-code-card.failure[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] {\n    color: var(--mj-status-error);\n}\n\n.result-content[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.result-code[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n    font-family: 'Courier New', monospace;\n}\n\n.result-description[_ngcontent-%COMP%] {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n}\n\n\n.execution-stats-row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 20px;\n    margin-bottom: 32px;\n    flex-wrap: wrap;\n}\n\n.stat-box[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 200px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.stat-box[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 2em;\n    color: var(--mj-text-muted);\n}\n\n.stat-info[_ngcontent-%COMP%] {\n    flex: 1;\n}\n\n.executions-table[_ngcontent-%COMP%] {\n    overflow-x: auto;\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n}\n\n.executions-table[_ngcontent-%COMP%]   table[_ngcontent-%COMP%] {\n    width: 100%;\n    border-collapse: collapse;\n}\n\n.executions-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    padding: 12px;\n    text-align: left;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    border-bottom: 2px solid var(--mj-border-default);\n}\n\n.executions-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n    padding: 12px;\n    border-bottom: 1px solid var(--mj-border-default);\n    color: var(--mj-text-primary);\n}\n\n.execution-row[_ngcontent-%COMP%] {\n    transition: background var(--mj-transition-base);\n}\n\n.execution-row[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.execution-row.success[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-success) 5%, transparent);\n}\n\n.running[_ngcontent-%COMP%] {\n    color: var(--mj-status-warning);\n    font-style: italic;\n}\n\n.result-code[_ngcontent-%COMP%] {\n    display: inline-block;\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    font-family: 'Courier New', monospace;\n}\n\n.result-code.success[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-success);\n}\n\n.result-code.failure[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n\n.config-subsection[_ngcontent-%COMP%] {\n    margin-bottom: 32px;\n}\n\n.config-subsection[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0 0 16px 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.library-cards[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.library-card[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.library-card[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    transform: translateX(4px);\n}\n\n.library-card[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:first-child {\n    font-size: 1.5em;\n    color: var(--mj-text-muted);\n}\n\n.library-info[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.library-name[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n}\n\n.library-items[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 12px;\n}\n\n.related-entity-link[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.related-entity-link[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-brand-primary);\n}\n\n.related-entity-link[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.related-entity-link[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:first-of-type {\n    flex: 1;\n    font-weight: var(--mj-font-medium);\n    color: var(--mj-text-secondary);\n}\n\n.entity-count[_ngcontent-%COMP%] {\n    color: var(--mj-brand-primary);\n    font-size: var(--mj-text-sm);\n}\n\n\n.loading-state[_ngcontent-%COMP%] {\n    text-align: center;\n    padding: 60px;\n    color: var(--mj-text-muted);\n}\n\n.loading-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 2em;\n    margin-bottom: 12px;\n}\n\n\n@media (max-width: 768px) {\n    .action-hero-header[_ngcontent-%COMP%] {\n        padding: 20px;\n    }\n\n    .action-identity[_ngcontent-%COMP%] {\n        flex-direction: column;\n        text-align: center;\n    }\n\n    .action-icon-wrapper[_ngcontent-%COMP%] {\n        margin: 0 auto;\n    }\n\n    .action-title-row[_ngcontent-%COMP%] {\n        justify-content: center;\n    }\n\n    .action-stats[_ngcontent-%COMP%] {\n        justify-content: center;\n    }\n\n    .params-grid[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n}"] }); }
+        } }, dependencies: [i1.ɵNgNoValidate, i1.DefaultValueAccessor, i1.NgControlStatus, i1.NgControlStatusGroup, i1.NgModel, i1.NgForm, i2.MJEmptyStateComponent, i2.MJAlertComponent, i2.MJAccordionSectionsComponent, i2.MJButtonDirective, i2.MJAccordionPanelComponent, i2.MJAccordionTitleDirective, i2.MJDropdownComponent, i2.MJSwitchComponent, i3.MjRecordFormContainerComponent, i4.CodeEditorComponent, i5.ActionTestHarnessDialogComponent, i6.DatePipe], styles: ["\n[_nghost-%COMP%] {\n    display: block;\n    height: 100%;\n}\n\n\n.approval-required-alert[_ngcontent-%COMP%] { margin-top: 16px; }\n\n.record-form-container[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form[_ngcontent-%COMP%] {\n    min-height: 0 !important;\n}\n\n\n.action-hero-header[_ngcontent-%COMP%] {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 32px;\n    margin: -20px -20px 24px -20px;\n    border-radius: 0 0 var(--mj-radius-lg) var(--mj-radius-lg);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.hero-content[_ngcontent-%COMP%] {\n    max-width: 1400px;\n    margin: 0 auto;\n}\n\n.action-identity[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-start;\n    gap: 24px;\n    margin-bottom: 24px;\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%] {\n    width: 80px;\n    height: 80px;\n    border-radius: var(--mj-radius-lg);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-4xl);\n}\n\n.action-info[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.action-title-row[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    margin-bottom: 12px;\n    flex-wrap: wrap;\n}\n\n.action-title[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 2em;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-inverse);\n}\n\n.action-name-input[_ngcontent-%COMP%] {\n    font-size: 1.8em;\n    font-weight: var(--mj-font-semibold);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    padding: 8px 16px;\n    border-radius: var(--mj-radius-md);\n    min-width: 400px;\n}\n\n.action-name-input[_ngcontent-%COMP%]::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n.action-badges[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n    flex-wrap: wrap;\n}\n\n.status-badge[_ngcontent-%COMP%], .type-badge[_ngcontent-%COMP%], .approval-badge[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 6px 14px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n}\n\n.action-category[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 0.95em;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    margin-bottom: 12px;\n}\n\n.action-category[_ngcontent-%COMP%]:hover {\n    color: var(--mj-text-inverse);\n    transform: translateX(4px);\n}\n\n.action-description[_ngcontent-%COMP%] {\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 1.05em;\n    line-height: var(--mj-leading-relaxed);\n    margin: 0;\n}\n\n.action-description-input[_ngcontent-%COMP%] {\n    width: 100%;\n    max-width: 600px;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    border-radius: var(--mj-radius-md);\n}\n\n.action-description-input[_ngcontent-%COMP%]::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n\n.action-stats[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 24px;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n}\n\n.stat-card[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-text-inverse) 10%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border-radius: var(--mj-radius-lg);\n    padding: 16px 24px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    min-width: 160px;\n}\n\n.stat-card[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-2xl);\n    color: color-mix(in srgb, var(--mj-text-inverse) 80%, transparent);\n}\n\n.stat-content[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n    font-size: 1.4em;\n    font-weight: var(--mj-font-bold);\n    color: var(--mj-text-inverse);\n}\n\n.stat-label[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-sm);\n    color: color-mix(in srgb, var(--mj-text-inverse) 70%, transparent);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n\n.hero-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 12px;\n    flex-wrap: wrap;\n}\n\n.hero-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n    backdrop-filter: blur(10px);\n}\n\n\n.action-content[_ngcontent-%COMP%] {\n    padding: 0 20px 20px;\n}\n\n.content-section[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-lg);\n    margin-bottom: 20px;\n    overflow: hidden;\n    transition: all var(--mj-transition-base);\n}\n\n.content-section[_ngcontent-%COMP%]:hover {\n    box-shadow: var(--mj-shadow-md);\n}\n\n.section-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 20px;\n    background: var(--mj-bg-surface-elevated);\n    cursor: pointer;\n    user-select: none;\n    transition: background var(--mj-transition-base);\n}\n\n.section-header[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.section-header[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 1.3em;\n    color: var(--mj-text-primary);\n    flex: 1;\n}\n\n.section-header[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:first-child {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.section-count[_ngcontent-%COMP%] {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 2px 8px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n}\n\n.toggle-icon[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    transition: transform 0.3s;\n}\n\n.toggle-icon.rotated[_ngcontent-%COMP%] {\n    transform: rotate(-90deg);\n}\n\n.section-content[_ngcontent-%COMP%] {\n    padding: 24px;\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\n.overview-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n    gap: 20px;\n}\n\n.overview-field[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.overview-field[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.required[_ngcontent-%COMP%] {\n    color: var(--mj-status-error);\n}\n\n.full-width[_ngcontent-%COMP%] {\n    width: 100%;\n}\n\n.overview-display[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 24px;\n}\n\n.display-field[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.display-field[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    font-size: var(--mj-text-sm);\n    color: var(--mj-text-muted);\n    font-weight: var(--mj-font-semibold);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.display-value[_ngcontent-%COMP%] {\n    font-size: 1.1em;\n    color: var(--mj-text-primary);\n}\n\n.display-value.code[_ngcontent-%COMP%] {\n    font-family: 'Courier New', monospace;\n    background: var(--mj-bg-surface-sunken);\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n}\n\n.approval-date[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-left: 8px;\n}\n\n\n.generation-panel[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    margin-bottom: 24px;\n}\n\n.generation-panel[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0 0 16px 0;\n    color: var(--mj-color-indigo-500);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.prompt-section[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%] {\n    margin-bottom: 16px;\n}\n\n.prompt-section[_ngcontent-%COMP%]   label[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n}\n\n.generation-controls[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding-top: 12px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.code-locked-badge[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 4px 10px;\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.code-editor-section[_ngcontent-%COMP%] {\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    overflow: hidden;\n}\n\n.code-toolbar[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 16px;\n    background: var(--mj-bg-surface-sunken);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.code-toolbar[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0;\n    font-size: 1.1em;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    margin-top: 16px;\n}\n\n.code-comments[_ngcontent-%COMP%]   h4[_ngcontent-%COMP%] {\n    margin: 0 0 8px 0;\n    color: var(--mj-status-info);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    line-height: var(--mj-leading-relaxed);\n}\n\n.approval-comments[_ngcontent-%COMP%] {\n    margin-top: 16px;\n}\n\n.approval-comments[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-status-error);\n}\n\n\n.params-section[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    border-radius: var(--mj-radius-lg);\n    padding: 20px;\n}\n\n.params-section.params-section-compact[_ngcontent-%COMP%] {\n    padding: 12px 20px;\n}\n\n.params-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 16px;\n}\n\n.params-header[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.params-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.param-card[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface);\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    transition: all var(--mj-transition-base);\n}\n\n.param-card[_ngcontent-%COMP%]:hover {\n    border-color: var(--mj-brand-primary);\n    box-shadow: var(--mj-shadow-sm);\n}\n\n.param-card.required[_ngcontent-%COMP%] {\n    border-color: var(--mj-status-warning);\n}\n\n.param-card.clickable[_ngcontent-%COMP%] {\n    cursor: pointer;\n}\n\n.param-card.clickable[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n    border-color: var(--mj-brand-primary);\n    transform: translateY(-1px);\n}\n\n.param-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 8px;\n}\n\n.param-name[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n}\n\n.param-badges[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.param-edit-btn[_ngcontent-%COMP%], \n.param-delete-btn[_ngcontent-%COMP%] {\n    background: none;\n    border: none;\n    padding: 4px 8px;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    border-radius: var(--mj-radius-sm);\n    transition: all var(--mj-transition-base);\n}\n\n.param-edit-btn[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-info);\n}\n\n.param-delete-btn[_ngcontent-%COMP%]:hover {\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n.param-details[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.required-badge[_ngcontent-%COMP%] {\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.array-badge[_ngcontent-%COMP%] {\n    background: var(--mj-color-indigo-500);\n    color: var(--mj-text-inverse);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.param-type[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-bottom: 8px;\n}\n\n.param-description[_ngcontent-%COMP%] {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n    margin-bottom: 8px;\n}\n\n.param-default[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    margin-top: 8px;\n    padding-top: 8px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.default-label[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n}\n\n.param-default[_ngcontent-%COMP%]   code[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-family: 'Courier New', monospace;\n    color: var(--mj-color-error-400);\n}\n\n\n\n.result-codes-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n\n@media (max-width: 768px) {\n    .result-codes-grid[_ngcontent-%COMP%] {\n        grid-template-columns: minmax(0, 1fr);\n    }\n}\n\n.result-code-card[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-start;\n    gap: 16px;\n    padding: 16px;\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    background: var(--mj-bg-surface);\n    transition: all var(--mj-transition-base);\n    position: relative;\n}\n\n.result-code-card.clickable[_ngcontent-%COMP%] {\n    cursor: pointer;\n}\n\n.result-code-card[_ngcontent-%COMP%]:hover {\n    transform: translateY(-2px);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.result-code-card.success[_ngcontent-%COMP%] {\n    border-color: var(--mj-status-success);\n    background: color-mix(in srgb, var(--mj-status-success) 10%, var(--mj-bg-surface));\n}\n\n.result-code-card.failure[_ngcontent-%COMP%] {\n    border-color: var(--mj-status-error);\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n}\n\n.result-actions[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 8px;\n    right: 8px;\n    display: flex;\n    gap: 4px;\n    opacity: 0;\n    transition: opacity var(--mj-transition-base);\n}\n\n.result-code-card[_ngcontent-%COMP%]:hover   .result-actions[_ngcontent-%COMP%] {\n    opacity: 1;\n}\n\n.result-edit-btn[_ngcontent-%COMP%], \n.result-delete-btn[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 4px 8px;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    font-size: var(--mj-text-sm);\n}\n\n.result-edit-btn[_ngcontent-%COMP%]:hover {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-brand-primary);\n}\n\n.result-delete-btn[_ngcontent-%COMP%]:hover {\n    background: var(--mj-status-error);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-status-error);\n}\n\n.result-icon[_ngcontent-%COMP%] {\n    font-size: 1.5em;\n    flex-shrink: 0;\n}\n\n.result-code-card.success[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n}\n\n.result-code-card.failure[_ngcontent-%COMP%]   .result-icon[_ngcontent-%COMP%] {\n    color: var(--mj-status-error);\n}\n\n.result-content[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.result-code[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n    font-family: 'Courier New', monospace;\n}\n\n.result-description[_ngcontent-%COMP%] {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n}\n\n\n.execution-stats-row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 20px;\n    margin-bottom: 32px;\n    flex-wrap: wrap;\n}\n\n.stat-box[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 200px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.stat-box[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 2em;\n    color: var(--mj-text-muted);\n}\n\n.stat-info[_ngcontent-%COMP%] {\n    flex: 1;\n}\n\n.executions-table[_ngcontent-%COMP%] {\n    overflow-x: auto;\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n}\n\n.executions-table[_ngcontent-%COMP%]   table[_ngcontent-%COMP%] {\n    width: 100%;\n    border-collapse: collapse;\n}\n\n.executions-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-sunken);\n    padding: 12px;\n    text-align: left;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    border-bottom: 2px solid var(--mj-border-default);\n}\n\n.executions-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n    padding: 12px;\n    border-bottom: 1px solid var(--mj-border-default);\n    color: var(--mj-text-primary);\n}\n\n.execution-row[_ngcontent-%COMP%] {\n    transition: background var(--mj-transition-base);\n}\n\n.execution-row[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.execution-row.success[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-success) 5%, transparent);\n}\n\n.running[_ngcontent-%COMP%] {\n    color: var(--mj-status-warning);\n    font-style: italic;\n}\n\n.result-code[_ngcontent-%COMP%] {\n    display: inline-block;\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    font-family: 'Courier New', monospace;\n}\n\n.result-code.success[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-success);\n}\n\n.result-code.failure[_ngcontent-%COMP%] {\n    background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n\n.config-subsection[_ngcontent-%COMP%] {\n    margin-bottom: 32px;\n}\n\n.config-subsection[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n    margin: 0 0 16px 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.library-cards[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.library-card[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.library-card[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    transform: translateX(4px);\n}\n\n.library-card[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:first-child {\n    font-size: 1.5em;\n    color: var(--mj-text-muted);\n}\n\n.library-info[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.library-name[_ngcontent-%COMP%] {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n}\n\n.library-items[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 12px;\n}\n\n.related-entity-link[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.related-entity-link[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-brand-primary);\n}\n\n.related-entity-link[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.related-entity-link[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:first-of-type {\n    flex: 1;\n    font-weight: var(--mj-font-medium);\n    color: var(--mj-text-secondary);\n}\n\n.entity-count[_ngcontent-%COMP%] {\n    color: var(--mj-brand-primary);\n    font-size: var(--mj-text-sm);\n}\n\n\n.loading-state[_ngcontent-%COMP%] {\n    text-align: center;\n    padding: 60px;\n    color: var(--mj-text-muted);\n}\n\n.loading-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 2em;\n    margin-bottom: 12px;\n}\n\n\n@media (max-width: 768px) {\n    .action-hero-header[_ngcontent-%COMP%] {\n        padding: 20px;\n    }\n\n    .action-identity[_ngcontent-%COMP%] {\n        flex-direction: column;\n        text-align: center;\n    }\n\n    .action-icon-wrapper[_ngcontent-%COMP%] {\n        margin: 0 auto;\n    }\n\n    .action-title-row[_ngcontent-%COMP%] {\n        justify-content: center;\n    }\n\n    .action-stats[_ngcontent-%COMP%] {\n        justify-content: center;\n    }\n\n    .params-grid[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n}\n\n\n.hero-header-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    gap: 20px;\n}\n\n.action-buttons[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    align-items: flex-end;\n}\n\n@media (max-width: 768px) {\n    .hero-header-row[_ngcontent-%COMP%] {\n        flex-direction: column;\n    }\n\n    .action-buttons[_ngcontent-%COMP%] {\n        width: 100%;\n        align-items: stretch;\n    }\n\n    .action-buttons[_ngcontent-%COMP%]    > div[_ngcontent-%COMP%] {\n        display: flex;\n        gap: 8px;\n    }\n\n    .action-buttons[_ngcontent-%COMP%]    > div[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%] {\n        flex: 1;\n    }\n}\n\n\n\n@media (max-width: 768px) {\n    .configuration-sections[_ngcontent-%COMP%] {\n        padding: 12px 0 !important;\n        border-top: 0 !important;\n        background: transparent !important;\n    }\n\n    .phone-flush-x[_ngcontent-%COMP%] {\n        padding-left: 0 !important;\n        padding-right: 0 !important;\n    }\n}", "\n\n\n\n\n\n\n\n\n\n\n\n\n\n.phone-hero-summary[_ngcontent-%COMP%], \n.phone-hero-only[_ngcontent-%COMP%] {\n    display: none;\n}\n\n@media (max-width: 768px) {\n    .phone-hero[_ngcontent-%COMP%] {\n        padding: 12px !important;\n    }\n\n    \n    .phone-hero.hero-compact[_ngcontent-%COMP%]   .phone-hero-detail[_ngcontent-%COMP%], \n   .phone-hero.hero-view[_ngcontent-%COMP%]   .phone-hero-hide[_ngcontent-%COMP%] {\n        display: none !important;\n    }\n\n    .phone-hero-only[_ngcontent-%COMP%] {\n        display: inline-flex;\n    }\n\n    \n    .phone-hero[_ngcontent-%COMP%]   .phone-hero-stats[_ngcontent-%COMP%] {\n        display: grid !important;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 8px;\n    }\n\n    .phone-hero-status[_ngcontent-%COMP%] {\n        align-items: center;\n        gap: 4px;\n        margin-left: 8px;\n        padding: 2px 8px;\n        border-radius: var(--mj-radius-full, 999px);\n        color: var(--mj-text-secondary);\n        background: var(--mj-bg-surface-sunken);\n        font-size: var(--mj-text-xs);\n        font-weight: var(--mj-font-semibold);\n        vertical-align: middle;\n        white-space: nowrap;\n    }\n\n    \n    .phone-hero-status[data-status=\"running\"][_ngcontent-%COMP%] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n    .phone-hero-status[data-status=\"success\"][_ngcontent-%COMP%] { color: var(--mj-status-success-text); background: var(--mj-status-success-bg); }\n    .phone-hero-status[data-status=\"error\"][_ngcontent-%COMP%]   { color: var(--mj-status-error-text);   background: var(--mj-status-error-bg); }\n    .phone-hero-status[data-status=\"info\"][_ngcontent-%COMP%]    { color: var(--mj-status-info-text);    background: var(--mj-status-info-bg); }\n\n    .phone-hero-top[_ngcontent-%COMP%] {\n        flex-direction: column;\n        align-items: stretch;\n        gap: 10px;\n    }\n\n    .phone-hero-actions[_ngcontent-%COMP%] {\n        width: 100%;\n    }\n\n    .phone-hero[_ngcontent-%COMP%]   .phone-hero-run[_ngcontent-%COMP%] {\n        width: 100%;\n        min-height: 44px;\n        justify-content: center;\n    }\n\n    \n\n    .phone-hero-summary[_ngcontent-%COMP%] {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        width: 100%;\n        min-height: 44px;\n        margin-top: 8px;\n        padding: 0 4px;\n        border: 0;\n        border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent);\n        background: transparent;\n        color: inherit;\n        font: inherit;\n        font-size: var(--mj-text-sm);\n        text-align: left;\n        cursor: pointer;\n        opacity: 0.85;\n    }\n\n    .phone-hero-summary[_ngcontent-%COMP%]:focus-visible {\n        outline: none;\n        box-shadow: var(--mj-focus-ring);\n    }\n\n    .phone-hero-summary-text[_ngcontent-%COMP%] {\n        flex: 1 1 auto;\n        min-width: 0;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n\n    .phone-hero-summary[_ngcontent-%COMP%]    > i[_ngcontent-%COMP%] {\n        flex-shrink: 0;\n        transition: transform 0.15s ease;\n    }\n\n    .phone-hero-summary[aria-expanded=\"true\"][_ngcontent-%COMP%]    > i[_ngcontent-%COMP%] {\n        transform: rotate(180deg);\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .phone-hero-summary[_ngcontent-%COMP%]    > i[_ngcontent-%COMP%] {\n        transition: none;\n    }\n}"] }); }
 };
 MJActionFormComponentExtended = __decorate([
     RegisterClass(BaseFormComponent, 'MJ: Actions')
@@ -2578,7 +2627,7 @@ MJActionFormComponentExtended = __decorate([
 export { MJActionFormComponentExtended };
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJActionFormComponentExtended, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-action-form', template: "<!--\n    NOTE: We wrap the form content in <mj-record-form-container> rather than\n    using <mj-form-toolbar> directly. The container owns the toolbar AND the\n    panels behind History/Tags/List buttons \u2014 without it those buttons emit\n    events that nothing listens to and the features silently break. Follow\n    this pattern for every custom entity form \u2014 see packages/Angular/CLAUDE.md.\n-->\n@if (record) {\n<mj-record-form-container [Record]=\"record\" [FormComponent]=\"this\"\n    [ToolbarConfig]=\"toolbarConfig\"\n    [WidthMode]=\"'full-width'\"\n    (Navigate)=\"OnFormNavigate($event)\"\n    (DeleteRequested)=\"OnDeleteRequested()\"\n    (FavoriteToggled)=\"OnFavoriteToggled()\"\n    (HistoryRequested)=\"OnHistoryRequested()\"\n    (ListManagementRequested)=\"OnListManagementRequested()\">\n        <form class=\"record-form\" #form=\"ngForm\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n\n            <!-- Main Content Area -->\n            <div class=\"action-main-area\" style=\"display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto;\">\n                \n                <!-- Header Section -->\n                <div class=\"action-header\" style=\"flex-shrink: 0; padding: 20px; background: var(--mj-bg-surface-card); border-bottom: 2px solid var(--mj-border-default);\">\n                    <div style=\"display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;\">\n                        \n                        <!-- Left: Action Info -->\n                        <div style=\"flex: 1; min-width: 0;\">\n                            <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 8px;\">\n                                <i [class]=\"getActionIcon()\" [style.color]=\"getTypeColor()\" style=\"font-size: 1.4em;\"></i>\n                                @if (EditMode) {\n                                    <input type=\"text\" class=\"mj-input\"\n                                           [(ngModel)]=\"record.Name\"\n                                           name=\"actionName\"\n                                           placeholder=\"Enter action name...\"\n                                           style=\"font-size: 1.2em; font-weight: 600; min-width: 300px; flex: 1;\" />\n                                } @else {\n                                    <h4 style=\"margin: 0; color: var(--mj-text-secondary); font-weight: 600; flex: 1;\">{{ record.Name || 'Untitled Action' }}</h4>\n                                    <span class=\"status-chip\"\n                                          [attr.data-color]=\"record.Status === 'Active' ? 'success' : record.Status === 'Pending' ? 'warning' : 'error'\">\n                                        {{ record.Status }}\n                                    </span>\n                                    @if (hasCodeApproval && record.CodeApprovalStatus) {\n                                        <span class=\"status-chip\"\n                                              [attr.data-color]=\"record.CodeApprovalStatus === 'Approved' ? 'success' : record.CodeApprovalStatus === 'Pending' ? 'warning' : 'error'\"\n                                              [title]=\"'Code ' + record.CodeApprovalStatus\">\n                                            <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" style=\"margin-right: 4px;\"></i>\n                                            {{ record.CodeApprovalStatus }}\n                                        </span>\n                                    }\n                                }\n                            </div>\n                            \n                            <!-- Status and Type Editors when in edit mode -->\n                            @if (EditMode) {\n                                <div style=\"display: flex; gap: 16px; margin-bottom: 12px; flex-wrap: wrap;\">\n                                    <div>\n                                        <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">Status</label>\n                                        <mj-dropdown [(ngModel)]=\"record.Status\"\n                                                     name=\"actionStatus\"\n                                                     [Data]=\"[{text: 'Active', value: 'Active'}, {text: 'Pending', value: 'Pending'}, {text: 'Disabled', value: 'Disabled'}]\"\n                                                     TextField=\"text\"\n                                                     ValueField=\"value\"\n                                                     [ValuePrimitive]=\"true\"\n                                                     style=\"width: 150px;\">\n                                        </mj-dropdown>\n                                    </div>\n                                    <div>\n                                        <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                            Type <span style=\"color: var(--mj-status-error);\">*</span>\n                                        </label>\n                                        <mj-dropdown [(ngModel)]=\"record.Type\"\n                                                     name=\"actionType\"\n                                                     [Data]=\"[{text: 'Generated', value: 'Generated'}, {text: 'Custom', value: 'Custom'}]\"\n                                                     TextField=\"text\"\n                                                     ValueField=\"value\"\n                                                     [ValuePrimitive]=\"true\"\n                                                     style=\"width: 150px;\">\n                                        </mj-dropdown>\n                                    </div>\n                                    <div>\n                                        <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                            Category <span style=\"color: var(--mj-status-error);\">*</span>\n                                        </label>\n                                        <mj-dropdown [(ngModel)]=\"record.CategoryID\"\n                                                     name=\"categoryID\"\n                                                     [Data]=\"[]\"\n                                                     Placeholder=\"Select category...\"\n                                                     style=\"width: 200px;\">\n                                        </mj-dropdown>\n                                    </div>\n                                    @if (hasCodeApproval) {\n                                        <div>\n                                            <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                                <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" [style.color]=\"getApprovalStatusColor()\" style=\"margin-right: 4px;\"></i>\n                                                Code Approval\n                                            </label>\n                                            <mj-dropdown [(ngModel)]=\"record.CodeApprovalStatus\"\n                                                         name=\"codeApprovalStatus\"\n                                                         [Data]=\"[{text: 'Approved', value: 'Approved'}, {text: 'Pending', value: 'Pending'}, {text: 'Rejected', value: 'Rejected'}]\"\n                                                         TextField=\"text\"\n                                                         ValueField=\"value\"\n                                                         [ValuePrimitive]=\"true\"\n                                                         style=\"width: 160px;\">\n                                            </mj-dropdown>\n                                        </div>\n                                    }\n                                </div>\n                            }\n                            \n                            @if (EditMode) {\n                                <textarea class=\"mj-textarea\" [(ngModel)]=\"record.Description\" \n                                               name=\"actionDescription\"\n                                               [rows]=\"2\"\n                                               placeholder=\"Enter action description...\"\n                                               style=\"width: 100%; max-width: 600px; margin-bottom: 12px;\">\n                                </textarea>\n                            } @else if (record.Description) {\n                                <p style=\"margin: 0 0 12px 0; color: var(--mj-text-muted); font-size: 0.9em; line-height: 1.4;\">{{ record.Description }}</p>\n                            }\n                            \n                            <!-- Quick Config Row -->\n                            <div class=\"quick-config\" style=\"display: flex; align-items: center; gap: 16px; flex-wrap: wrap;\">\n                                @if (category) {\n                                    <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                        <i class=\"fa-solid fa-folder\" style=\"color: var(--mj-text-muted);\"></i>\n                                        <span style=\"color: var(--mj-text-muted);\">Category:</span>\n                                        <span style=\"color: var(--mj-text-secondary); font-weight: 500; cursor: pointer;\" (click)=\"navigateToCategory()\">\n                                            {{ category.Name }}\n                                            <i class=\"fa-solid fa-external-link\" style=\"font-size: 0.75em; margin-left: 4px;\"></i>\n                                        </span>\n                                    </div>\n                                }\n                                \n                                <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-cube\" style=\"color: var(--mj-text-muted);\"></i>\n                                    <span style=\"color: var(--mj-text-muted);\">Type:</span>\n                                    <span style=\"color: var(--mj-text-secondary); font-weight: 500;\">{{ record.Type }}</span>\n                                </div>\n                                \n                                @if (hasCodeApproval && record.CodeApprovalStatus) {\n                                    <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                        <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" [style.color]=\"getApprovalStatusColor()\"></i>\n                                        <span style=\"color: var(--mj-text-muted);\">Code:</span>\n                                        <span [style.color]=\"getApprovalStatusColor()\" style=\"font-weight: 500;\">{{ record.CodeApprovalStatus }}</span>\n                                    </div>\n                                }\n                                \n                                @if (actionParams.length > 0) {\n                                    <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                        <i class=\"fa-solid fa-sliders\" style=\"color: var(--mj-text-muted);\"></i>\n                                        <span style=\"color: var(--mj-text-secondary); font-weight: 500;\">{{ actionParams.length }} Parameters</span>\n                                    </div>\n                                }\n                            </div>\n                        </div>\n                        \n                        <!-- Right: Action Buttons -->\n                        <div class=\"action-buttons\" style=\"display: flex; flex-direction: column; gap: 8px; align-items: flex-end;\">\n                            <div style=\"display: flex; gap: 8px;\">\n                                @if (record.ID && !EditMode) {\n                                    <button mjButton variant=\"primary\" size=\"lg\"\n                                                (click)=\"openTestHarness()\"\n                                                title=\"Open Run Harness\"\n                                                [disabled]=\"record.Status !== 'Active'\">\n                                        <i class=\"fa-solid fa-play\"></i> Run\n                                    </button>\n                                }\n                                @if (EditMode && record.Type === 'Generated') {\n                                    <button mjButton variant=\"outline\" size=\"md\"\n                                                (click)=\"regenerateCode()\"\n                                                title=\"Regenerate Code\">\n                                        <i class=\"fa-solid fa-robot\"></i> Regenerate\n                                    </button>\n                                }\n                            </div>\n                            \n                            @if (!EditMode && record.Status !== 'Active' && record.ID) {\n                                <div style=\"font-size: 0.75em; color: var(--mj-status-error); text-align: right;\">\n                                    Action must be Active to execute\n                                </div>\n                            }\n                        </div>\n                    </div>\n                </div>\n\n                <!-- Configuration Sections with Expansion Panels -->\n                <div class=\"configuration-sections\" style=\"flex: 1; background: var(--mj-bg-surface-card); border-top: 2px solid var(--mj-border-default); padding: 16px; min-height: 0;\">\n                    \n                    <!-- Parameters Section (FIRST) -->\n                    <mj-accordion-panel\n                        [Expanded]=\"true\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template mjAccordionTitle>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-sliders\" style=\"color: var(--mj-text-muted);\"></i>\n                                Parameters\n                                @if (actionParams.length > 0) {\n                                    <span style=\"background: var(--mj-status-info); color: var(--mj-text-inverse); padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                        {{ actionParams.length }}\n                                    </span>\n                                }\n                            </span>\n                        </ng-template>\n                        \n                        <div style=\"padding: 16px;\">\n                            @if (isLoadingParams) {\n                                <div class=\"loading-state\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                    Loading parameters...\n                                </div>\n                            } @else if (actionParams.length === 0) {\n                                <mj-empty-state\n                                    Size=\"compact\"\n                                    Icon=\"fa-solid fa-sliders\"\n                                    Title=\"No parameters defined\"\n                                    [Message]=\"EditMode && record.IsSaved ? 'Add parameters to define inputs and outputs for this action' : ''\" />\n                            } @else {\n                                <!-- Input Parameters Grid -->\n                                <div class=\"params-section\">\n                                    <div class=\"params-header\">\n                                        <h3><i class=\"fa-solid fa-sign-in-alt\"></i> Input Parameters</h3>\n                                        @if (EditMode && record.IsSaved) {\n                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"addParameter('Input')\">\n                                                <i class=\"fa-solid fa-plus\"></i> Add Input\n                                            </button>\n                                        }\n                                    </div>\n                                    \n                                    @if (getInputParams().length === 0) {\n                                        <mj-empty-state\n                                            Size=\"compact\"\n                                            Icon=\"fa-solid fa-inbox\"\n                                            Title=\"No input parameters defined\" />\n                                    } @else {\n                                        <div class=\"params-grid\">\n                                            @for (param of getInputParams(); track param.ID) {\n                                                <div class=\"param-card\" [class.required]=\"param.IsRequired\" \n                                                     [class.clickable]=\"true\"\n                                                     (click)=\"onParamClick(param, $event)\">\n                                                    <div class=\"param-header\">\n                                                        <span class=\"param-name\">{{ param.Name }}</span>\n                                                        <div class=\"param-badges\">\n                                                            @if (param.IsRequired) {\n                                                                <span class=\"required-badge\">Required</span>\n                                                            }\n                                                            @if (param.IsArray) {\n                                                                <span class=\"array-badge\">Array</span>\n                                                            }\n                                                            @if (EditMode) {\n                                                                <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n                                                                    <i class=\"fa-solid fa-edit\"></i>\n                                                                </button>\n                                                                <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n                                                                    <i class=\"fa-solid fa-trash\"></i>\n                                                                </button>\n                                                            }\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"param-details\">\n                                                        <div class=\"param-type\">{{ param.ValueType }}</div>\n                                                        @if (param.Description) {\n                                                            <div class=\"param-description\">{{ param.Description }}</div>\n                                                        }\n                                                        @if (param.DefaultValue) {\n                                                            <div class=\"param-default\">\n                                                                <span class=\"default-label\">Default:</span>\n                                                                <code>{{ param.DefaultValue }}</code>\n                                                            </div>\n                                                        }\n                                                    </div>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n\n                                <!-- Output Parameters Grid -->\n                                <div class=\"params-section\" style=\"margin-top: 24px;\" \n                                     [class.params-section-compact]=\"getOutputParams().length === 0\">\n                                    <div class=\"params-header\">\n                                        <h3><i class=\"fa-solid fa-sign-out-alt\"></i> Output Parameters</h3>\n                                        @if (EditMode && record.IsSaved) {\n                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"addParameter('Output')\">\n                                                <i class=\"fa-solid fa-plus\"></i> Add Output\n                                            </button>\n                                        }\n                                    </div>\n                                    \n                                    @if (getOutputParams().length === 0) {\n                                        <mj-empty-state\n                                            Size=\"compact\"\n                                            Icon=\"fa-solid fa-inbox\"\n                                            Title=\"No output parameters defined\" />\n                                    } @else {\n                                        <div class=\"params-grid\">\n                                            @for (param of getOutputParams(); track param.ID) {\n                                                <div class=\"param-card\"\n                                                     [class.clickable]=\"true\"\n                                                     (click)=\"onParamClick(param, $event)\">\n                                                    <div class=\"param-header\">\n                                                        <span class=\"param-name\">{{ param.Name }}</span>\n                                                        <div class=\"param-badges\">\n                                                            @if (param.IsArray) {\n                                                                <span class=\"array-badge\">Array</span>\n                                                            }\n                                                            @if (EditMode) {\n                                                                <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n                                                                    <i class=\"fa-solid fa-edit\"></i>\n                                                                </button>\n                                                                <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n                                                                    <i class=\"fa-solid fa-trash\"></i>\n                                                                </button>\n                                                            }\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"param-details\">\n                                                        <div class=\"param-type\">{{ param.ValueType }}</div>\n                                                        @if (param.Description) {\n                                                            <div class=\"param-description\">{{ param.Description }}</div>\n                                                        }\n                                                        @if (param.DefaultValue) {\n                                                            <div class=\"param-default\">\n                                                                <span class=\"default-label\">Default:</span>\n                                                                <code>{{ param.DefaultValue }}</code>\n                                                            </div>\n                                                        }\n                                                    </div>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n                            }\n                        </div>\n                    </mj-accordion-panel>\n\n                    <!-- Code & Generation Section (Only for Generated type) -->\n                    @if (record.Type === 'Generated') {\n                        <mj-accordion-panel\n                            [Expanded]=\"expandedSections.code\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-code\" style=\"color: var(--mj-text-muted);\"></i>\n                                    Code &amp; Generation\n                                    @if (record.CodeLocked) {\n                                        <span style=\"background: var(--mj-status-warning); color: var(--mj-color-warning-800); padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                            <i class=\"fa-solid fa-lock\"></i> Locked\n                                        </span>\n                                    }\n                                </span>\n                            </ng-template>\n                            \n                            <div style=\"padding: 16px;\">\n                                @if (EditMode) {\n                                    <div class=\"generation-panel\">\n                                        <h3><i class=\"fa-solid fa-robot\"></i> AI Generation</h3>\n                                        <div class=\"prompt-section\">\n                                            <label>User Prompt</label>\n                                            <textarea class=\"mj-textarea\" [(ngModel)]=\"record.UserPrompt\"\n                                                           name=\"userPrompt\"\n                                                           [rows]=\"8\"\n                                                           placeholder=\"Describe what this action should do...\"\n                                                           style=\"width: 100%; min-height: 120px;\">\n                                            </textarea>\n                                        </div>\n                                        <div class=\"comments-section\">\n                                            <label>Internal Comments (not sent to AI)</label>\n                                            <textarea class=\"mj-textarea\" [(ngModel)]=\"record.UserComments\"\n                                                           name=\"userComments\"\n                                                           [rows]=\"2\"\n                                                           placeholder=\"Internal notes...\"\n                                                           style=\"width: 100%;\">\n                                            </textarea>\n                                        </div>\n                                        <div class=\"generation-controls\">\n                                            <mj-switch [(ngModel)]=\"record.CodeLocked\"\n                                                       name=\"codeLocked\">\n                                            </mj-switch>\n                                            <label style=\"margin-left: 8px;\">Lock Code (prevent regeneration)</label>\n                                        </div>\n                                    </div>\n                                }\n                                \n                                <div class=\"code-editor-section\">\n                                    <div class=\"code-toolbar\">\n                                        <h3><i class=\"fa-solid fa-file-code\"></i> Action Code</h3>\n                                        <div class=\"code-actions\">\n                                            @if (record.CodeComments) {\n                                                <button mjButton variant=\"flat\" size=\"sm\" (click)=\"toggleCodeComments()\">\n                                                    <i class=\"fa-solid fa-comment\"></i> \n                                                    {{ showCodeComments ? 'Hide' : 'Show' }} AI Comments\n                                                </button>\n                                            }\n                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"copyToClipboard(record.Code || '')\">\n                                                <i class=\"fa-solid fa-copy\"></i> Copy\n                                            </button>\n                                        </div>\n                                    </div>\n                                    <mj-code-editor \n                                        [(ngModel)]=\"record.Code\"\n                                        name=\"actionCode\"\n                                        [readonly]=\"!EditMode || record.CodeLocked\"\n                                        [language]=\"codeLanguage\"\n                                        [lineWrapping]=\"true\"\n                                        style=\"height: 400px; width: 100%;\">\n                                    </mj-code-editor>\n                                    \n                                    @if (showCodeComments && record.CodeComments) {\n                                        <div class=\"code-comments\">\n                                            <h4><i class=\"fa-solid fa-robot\"></i> AI Explanation</h4>\n                                            <p>{{ record.CodeComments }}</p>\n                                        </div>\n                                    }\n                                    \n                                    @if (EditMode && record.CodeApprovalStatus === 'Rejected') {\n                                        <div class=\"approval-comments\">\n                                            <label>Rejection Comments</label>\n                                            <textarea class=\"mj-textarea\" [(ngModel)]=\"record.CodeApprovalComments\"\n                                                           name=\"codeApprovalComments\"\n                                                           [rows]=\"2\"\n                                                           placeholder=\"Explain why the code was rejected...\"\n                                                           style=\"width: 100%;\">\n                                            </textarea>\n                                        </div>\n                                    }\n                                </div>\n                            </div>\n                        </mj-accordion-panel>\n                    }\n\n                    <!-- Runtime Action Configuration Section (only for Type='Runtime') -->\n                    @if (isRuntimeAction) {\n                        <mj-accordion-panel\n                            [Expanded]=\"true\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-wand-magic-sparkles\" style=\"color: var(--mj-status-warning);\"></i>\n                                    Runtime Configuration &amp; Permissions\n                                    <span style=\"color: var(--mj-text-muted); font-weight: 400; font-size: 0.85em;\">\n                                        ({{ getRuntimeConfigSummary() }})\n                                    </span>\n                                </span>\n                            </ng-template>\n\n                            <div style=\"padding: 16px;\">\n                                @if (!runtimeConfig) {\n                                    <mj-alert Variant=\"error\">\n                                        <strong>Missing or malformed RuntimeActionConfiguration.</strong>\n                                        This Runtime action cannot run until a valid configuration is supplied. Approval should not be granted in this state.\n                                    </mj-alert>\n                                } @else {\n                                    @if (getWildcardFlags().any) {\n                                        <mj-alert Variant=\"warning\" Title=\"Wildcard permissions enabled\">\n                                            <div style=\"color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                                This runtime action has one or more wildcard flags set that bypass the specific allowlists below:\n                                                @if (getWildcardFlags().entity) { <strong>allowAnyEntity</strong> }\n                                                @if (getWildcardFlags().action) { <strong>allowAnyAction</strong> }\n                                                @if (getWildcardFlags().agent) { <strong>allowAnyAgent</strong> }\n                                                . Approving grants this action unrestricted access to that namespace on behalf of any user who invokes it. Only approve if the action is framework-authored or you have personally reviewed every place it touches those resources.\n                                            </div>\n                                        </mj-alert>\n                                    }\n                                    <!-- Declared permissions \u2014 the security contract an approver is blessing -->\n                                    <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-bottom: 20px;\">\n                                        <!-- Entities -->\n                                        <div style=\"border: 1px solid var(--mj-border-default); border-radius: 6px; padding: 12px; background: var(--mj-bg-surface-card);\">\n                                            <div style=\"font-weight: 600; margin-bottom: 8px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-database\" style=\"margin-right: 6px; color: var(--mj-brand-primary);\"></i>\n                                                Allowed Entities ({{ getAllowedEntities().length }})\n                                            </div>\n                                            @if (getAllowedEntities().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None requested</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-direction: column; gap: 4px;\">\n                                                    @for (e of getAllowedEntities(); track e.id) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 4px 8px; border-radius: 4px; font-size: 0.9em; color: var(--mj-text-primary);\">\n                                                            {{ e.name }}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n\n                                        <!-- Actions -->\n                                        <div style=\"border: 1px solid var(--mj-border-default); border-radius: 6px; padding: 12px; background: var(--mj-bg-surface-card);\">\n                                            <div style=\"font-weight: 600; margin-bottom: 8px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-bolt\" style=\"margin-right: 6px; color: var(--mj-brand-primary);\"></i>\n                                                Allowed Actions ({{ getAllowedActions().length }})\n                                            </div>\n                                            @if (getAllowedActions().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None requested</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-direction: column; gap: 4px;\">\n                                                    @for (a of getAllowedActions(); track a.id) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 4px 8px; border-radius: 4px; font-size: 0.9em; color: var(--mj-text-primary);\">\n                                                            {{ a.name }}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n\n                                        <!-- Agents -->\n                                        <div style=\"border: 1px solid var(--mj-border-default); border-radius: 6px; padding: 12px; background: var(--mj-bg-surface-card);\">\n                                            <div style=\"font-weight: 600; margin-bottom: 8px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-robot\" style=\"margin-right: 6px; color: var(--mj-brand-primary);\"></i>\n                                                Allowed Agents ({{ getAllowedAgents().length }})\n                                            </div>\n                                            @if (getAllowedAgents().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None requested</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-direction: column; gap: 4px;\">\n                                                    @for (g of getAllowedAgents(); track g.id) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 4px 8px; border-radius: 4px; font-size: 0.9em; color: var(--mj-text-primary);\">\n                                                            {{ g.name }}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n                                    </div>\n\n                                    <!-- Limits + libraries -->\n                                    <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px;\">\n                                        <div>\n                                            <div style=\"font-weight: 600; margin-bottom: 6px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-gauge-high\" style=\"margin-right: 6px; color: var(--mj-text-muted);\"></i>\n                                                Resource Limits\n                                            </div>\n                                            <div style=\"color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                                <div>Max memory: {{ getRuntimeLimits().maxMemoryMB }} MB</div>\n                                                <div>Max bridge calls: {{ getRuntimeLimits().maxBridgeCalls }}</div>\n                                                @if (record.MaxExecutionTimeMS) {\n                                                    <div>Max execution time: {{ record.MaxExecutionTimeMS }} ms</div>\n                                                }\n                                            </div>\n                                        </div>\n                                        <div>\n                                            <div style=\"font-weight: 600; margin-bottom: 6px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-book\" style=\"margin-right: 6px; color: var(--mj-text-muted);\"></i>\n                                                Additional Libraries\n                                            </div>\n                                            @if (getRequestedLibraries().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None (only default set: lodash, date-fns, uuid, validator)</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-wrap: wrap; gap: 4px;\">\n                                                    @for (lib of getRequestedLibraries(); track lib.name) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 2px 8px; border-radius: 10px; font-size: 0.85em;\">\n                                                            {{ lib.name }}@if (lib.version) {<span style=\"color: var(--mj-text-muted);\"> @{{ lib.version }}</span>}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n                                    </div>\n                                }\n\n                                <!-- Code payload -->\n                                <div>\n                                    <div style=\"font-weight: 600; margin-bottom: 6px; color: var(--mj-text-primary);\">\n                                        <i class=\"fa-solid fa-code\" style=\"margin-right: 6px; color: var(--mj-text-muted);\"></i>\n                                        JavaScript Payload\n                                    </div>\n                                    <pre style=\"background: var(--mj-bg-surface-sunken); color: var(--mj-text-primary); padding: 12px; border-radius: 4px; overflow-x: auto; max-height: 400px; font-family: 'SF Mono', Monaco, Consolas, monospace; font-size: 0.85em; margin: 0;\"><code>{{ record.Code }}</code></pre>\n                                </div>\n\n                                <!-- Approval actions (Runtime-specific labels) -->\n                                @if (EditMode && record.CodeApprovalStatus === 'Pending') {\n                                    <mj-alert Variant=\"warning\" Title=\"Approval required before this Runtime action can execute.\" class=\"approval-required-alert\">\n                                        <div style=\"color: var(--mj-text-secondary); font-size: 0.9em; margin-bottom: 12px;\">\n                                            Approving grants this action the permissions listed above on behalf of any user who invokes it. Review the code and permissions carefully before approving.\n                                        </div>\n                                        <div style=\"display: flex; gap: 8px;\">\n                                            <button class=\"mj-button mj-button-primary\" (click)=\"approveCode()\">\n                                                <i class=\"fa-solid fa-check\"></i> Approve\n                                            </button>\n                                            <button class=\"mj-button\" (click)=\"rejectCode()\">\n                                                <i class=\"fa-solid fa-ban\"></i> Reject\n                                            </button>\n                                        </div>\n                                    </mj-alert>\n                                }\n                            </div>\n                        </mj-accordion-panel>\n                    }\n\n                    <!-- Result Codes Section -->\n                    <mj-accordion-panel\n                        [Expanded]=\"expandedSections.resultCodes\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template mjAccordionTitle>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-flag-checkered\" style=\"color: var(--mj-text-muted);\"></i>\n                                Result Codes\n                                @if (resultCodes.length > 0) {\n                                    <span style=\"background: var(--mj-status-success); color: var(--mj-text-inverse); padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                        {{ resultCodes.length }}\n                                    </span>\n                                }\n                            </span>\n                        </ng-template>\n                        \n                        <div style=\"padding: 16px;\">\n                            <!-- Add Result Code Button -->\n                            @if (EditMode && record.IsSaved) {\n                                <div style=\"display: flex; justify-content: flex-end; margin-bottom: 12px;\">\n                                    <button mjButton variant=\"primary\" size=\"sm\" (click)=\"addResultCode()\">\n                                        <i class=\"fa-solid fa-plus\"></i> Add Result Code\n                                    </button>\n                                </div>\n                            }\n                            \n                            @if (isLoadingResultCodes) {\n                                <div class=\"loading-state\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                    Loading result codes...\n                                </div>\n                            } @else if (resultCodes.length === 0) {\n                                <mj-empty-state\n                                    Size=\"compact\"\n                                    Icon=\"fa-solid fa-flag-checkered\"\n                                    Title=\"No result codes defined\"\n                                    [Message]=\"EditMode && record.IsSaved ? 'Add result codes to define possible outcomes' : ''\" />\n                            } @else {\n                                <div class=\"result-codes-grid\">\n                                    @for (code of resultCodes; track code.ID) {\n                                        <div class=\"result-code-card\" \n                                             [class.success]=\"code.IsSuccess\" \n                                             [class.failure]=\"!code.IsSuccess\"\n                                             [class.clickable]=\"true\"\n                                             (click)=\"onResultCodeClick(code, $event)\">\n                                            <div class=\"result-icon\">\n                                                <i [class]=\"code.IsSuccess ? 'fa-solid fa-check-circle' : 'fa-solid fa-times-circle'\"></i>\n                                            </div>\n                                            <div class=\"result-content\">\n                                                <div class=\"result-code\">{{ code.ResultCode }}</div>\n                                                @if (code.Description) {\n                                                    <div class=\"result-description\">{{ code.Description }}</div>\n                                                }\n                                            </div>\n                                            @if (EditMode) {\n                                                <div class=\"result-actions\">\n                                                    <button class=\"result-edit-btn\" (click)=\"editResultCode(code); $event.stopPropagation()\" title=\"Edit result code\">\n                                                        <i class=\"fa-solid fa-edit\"></i>\n                                                    </button>\n                                                    <button class=\"result-delete-btn\" (click)=\"deleteResultCode(code); $event.stopPropagation()\" title=\"Delete result code\">\n                                                        <i class=\"fa-solid fa-trash\"></i>\n                                                    </button>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n                            }\n                        </div>\n                    </mj-accordion-panel>\n\n                    <!-- Execution & Monitoring Section -->\n                    @if (record.IsSaved) {\n                        <mj-accordion-panel\n                            [Expanded]=\"expandedSections.execution\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-chart-line\" style=\"color: var(--mj-text-muted);\"></i>\n                                    Execution &amp; Monitoring\n                                </span>\n                            </ng-template>\n                            \n                            <div style=\"padding: 16px;\">\n                                @if (isLoadingExecutions) {\n                                    <div class=\"loading-state\">\n                                        <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                        Loading executions...\n                                    </div>\n                                } @else if (recentExecutions.length === 0) {\n                                    <mj-empty-state\n                                        Size=\"compact\"\n                                        Icon=\"fa-solid fa-chart-line\"\n                                        Title=\"No executions yet\" />\n                                } @else {\n                                    <div class=\"execution-stats-row\">\n                                        <div class=\"stat-box\">\n                                            <i class=\"fa-solid fa-tachometer-alt\"></i>\n                                            <div class=\"stat-info\">\n                                                <div class=\"stat-label\" style=\"color: var(--mj-text-primary);\">Avg Duration</div>\n                                                <div class=\"stat-value\" style=\"color: var(--mj-text-primary);\">{{ formatDuration(executionStats.avgDuration) }}</div>\n                                            </div>\n                                        </div>\n                                        <div class=\"stat-box\">\n                                            <i class=\"fa-solid fa-check-circle\" [style.color]=\"getSuccessRateColor()\"></i>\n                                            <div class=\"stat-info\">\n                                                <div class=\"stat-label\" style=\"color: var(--mj-text-primary);\">Success Rate</div>\n                                                <div class=\"stat-value\" [style.color]=\"getSuccessRateColor()\" style=\"font-weight: 600;\">{{ executionStats.successRate.toFixed(0) }}%</div>\n                                            </div>\n                                        </div>\n                                        <div class=\"stat-box\">\n                                            <i class=\"fa-solid fa-play-circle\"></i>\n                                            <div class=\"stat-info\">\n                                                <div class=\"stat-label\" style=\"color: var(--mj-text-primary);\">Total Runs</div>\n                                                <div class=\"stat-value\" style=\"color: var(--mj-text-primary);\">{{ executionStats.totalRuns }}</div>\n                                            </div>\n                                        </div>\n                                    </div>\n\n                                    <h3 style=\"margin-top: 24px;\"><i class=\"fa-solid fa-history\"></i> Recent Executions</h3>\n                                    <div class=\"executions-table\">\n                                        <table>\n                                            <thead>\n                                                <tr>\n                                                    <th>Started</th>\n                                                    <th>Duration</th>\n                                                    <th>User</th>\n                                                    <th>Result</th>\n                                                    <th>Actions</th>\n                                                </tr>\n                                            </thead>\n                                            <tbody>\n                                                @for (execution of recentExecutions; track execution.ID) {\n                                                    <tr class=\"execution-row\" [class.success]=\"isExecutionSuccess(execution)\">\n                                                        <td>{{ execution.StartedAt | date:'short' }}</td>\n                                                        <td>\n                                                            @if (execution.EndedAt) {\n                                                                {{ formatDuration(getExecutionDuration(execution)) }}\n                                                            } @else {\n                                                                <span class=\"running\">Running...</span>\n                                                            }\n                                                        </td>\n                                                        <td>{{ execution.User }}</td>\n                                                        <td>\n                                                            <span class=\"result-code\" \n                                                                  [class.success]=\"isExecutionSuccess(execution)\"\n                                                                  [class.failure]=\"!isExecutionSuccess(execution)\">\n                                                                {{ execution.ResultCode }}\n                                                            </span>\n                                                        </td>\n                                                        <td>\n                                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"navigateToExecution(execution.ID)\">\n                                                                <i class=\"fa-solid fa-external-link\"></i>\n                                                            </button>\n                                                        </td>\n                                                    </tr>\n                                                }\n                                            </tbody>\n                                        </table>\n                                    </div>\n                                }\n                            </div>\n                        </mj-accordion-panel>\n                    }\n\n                    <!-- Related Configuration Section -->\n                    @if (record.IsSaved) {\n                        <mj-accordion-panel\n                            [Expanded]=\"expandedSections.configuration\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-cogs\" style=\"color: var(--mj-text-muted);\"></i>\n                                    Related Configuration\n                                </span>\n                            </ng-template>\n                            \n                            <div style=\"padding: 16px;\">\n                                <!-- Libraries -->\n                                <div class=\"config-subsection\">\n                                    <h3><i class=\"fa-solid fa-book\"></i> Libraries</h3>\n                                    @if (isLoadingLibraries) {\n                                        <div class=\"loading-state\">\n                                            <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                            Loading libraries...\n                                        </div>\n                                    } @else if (actionLibraries.length === 0) {\n                                        <mj-empty-state\n                                            Size=\"compact\"\n                                            Icon=\"fa-solid fa-book\"\n                                            Title=\"No libraries configured\" />\n                                    } @else {\n                                        <div class=\"library-cards\">\n                                            @for (lib of libraries; track lib.ID; let i = $index) {\n                                                <div class=\"library-card\" (click)=\"navigateToLibrary(lib.ID)\">\n                                                    <i class=\"fa-solid fa-book\"></i>\n                                                    <div class=\"library-info\">\n                                                        <div class=\"library-name\">{{ lib.Name }}</div>\n                                                        @if (actionLibraries[i].ItemsUsed) {\n                                                            <div class=\"library-items\">{{ actionLibraries[i].ItemsUsed }}</div>\n                                                        }\n                                                    </div>\n                                                    <i class=\"fa-solid fa-external-link\"></i>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n\n                                <!-- Other Related Entities -->\n                                <div class=\"related-entities-grid\">\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-shield-alt\"></i>\n                                        <span>Authorizations</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-layer-group\"></i>\n                                        <span>Contexts</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-calendar\"></i>\n                                        <span>Scheduled Actions</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-cube\"></i>\n                                        <span>Entity Actions</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                </div>\n                            </div>\n                        </mj-accordion-panel>\n                    }\n                </div>\n            </div>\n        </form>\n</mj-record-form-container>\n}\n\n<!-- Action Test Harness Dialog -->\n<mj-action-test-harness-dialog\n    [Action]=\"record\"\n    [ActionParams]=\"actionParams\"\n    [IsOpen]=\"showTestHarness\"\n    (Close)=\"onTestHarnessVisibilityChanged(false)\">\n</mj-action-test-harness-dialog>", styles: ["/* Enable flex layout for full-height scrolling */\n:host {\n    display: block;\n    height: 100%;\n}\n\n/* positions the Runtime-action approval alert (mj-alert is margin-less but for bottom) */\n.approval-required-alert { margin-top: 16px; }\n\n.record-form-container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form {\n    min-height: 0 !important;\n}\n\n/* Hero Header Section */\n.action-hero-header {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 32px;\n    margin: -20px -20px 24px -20px;\n    border-radius: 0 0 var(--mj-radius-lg) var(--mj-radius-lg);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.hero-content {\n    max-width: 1400px;\n    margin: 0 auto;\n}\n\n.action-identity {\n    display: flex;\n    align-items: flex-start;\n    gap: 24px;\n    margin-bottom: 24px;\n}\n\n.action-icon-wrapper {\n    width: 80px;\n    height: 80px;\n    border-radius: var(--mj-radius-lg);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper i {\n    font-size: var(--mj-text-4xl);\n}\n\n.action-info {\n    flex: 1;\n    min-width: 0;\n}\n\n.action-title-row {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    margin-bottom: 12px;\n    flex-wrap: wrap;\n}\n\n.action-title {\n    margin: 0;\n    font-size: 2em;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-inverse);\n}\n\n.action-name-input {\n    font-size: 1.8em;\n    font-weight: var(--mj-font-semibold);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    padding: 8px 16px;\n    border-radius: var(--mj-radius-md);\n    min-width: 400px;\n}\n\n.action-name-input::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n.action-badges {\n    display: flex;\n    gap: 8px;\n    flex-wrap: wrap;\n}\n\n.status-badge, .type-badge, .approval-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 6px 14px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n}\n\n.action-category {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 0.95em;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    margin-bottom: 12px;\n}\n\n.action-category:hover {\n    color: var(--mj-text-inverse);\n    transform: translateX(4px);\n}\n\n.action-description {\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 1.05em;\n    line-height: var(--mj-leading-relaxed);\n    margin: 0;\n}\n\n.action-description-input {\n    width: 100%;\n    max-width: 600px;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    border-radius: var(--mj-radius-md);\n}\n\n.action-description-input::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n/* Quick Stats */\n.action-stats {\n    display: flex;\n    gap: 24px;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n}\n\n.stat-card {\n    background: color-mix(in srgb, var(--mj-text-inverse) 10%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border-radius: var(--mj-radius-lg);\n    padding: 16px 24px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    min-width: 160px;\n}\n\n.stat-card i {\n    font-size: var(--mj-text-2xl);\n    color: color-mix(in srgb, var(--mj-text-inverse) 80%, transparent);\n}\n\n.stat-content {\n    display: flex;\n    flex-direction: column;\n}\n\n.stat-value {\n    font-size: 1.4em;\n    font-weight: var(--mj-font-bold);\n    color: var(--mj-text-inverse);\n}\n\n.stat-label {\n    font-size: var(--mj-text-sm);\n    color: color-mix(in srgb, var(--mj-text-inverse) 70%, transparent);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n/* Hero Actions */\n.hero-actions {\n    display: flex;\n    gap: 12px;\n    flex-wrap: wrap;\n}\n\n.hero-actions button {\n    backdrop-filter: blur(10px);\n}\n\n/* Main Content Sections */\n.action-content {\n    padding: 0 20px 20px;\n}\n\n.content-section {\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-lg);\n    margin-bottom: 20px;\n    overflow: hidden;\n    transition: all var(--mj-transition-base);\n}\n\n.content-section:hover {\n    box-shadow: var(--mj-shadow-md);\n}\n\n.section-header {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 20px;\n    background: var(--mj-bg-surface-elevated);\n    cursor: pointer;\n    user-select: none;\n    transition: background var(--mj-transition-base);\n}\n\n.section-header:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.section-header h2 {\n    margin: 0;\n    font-size: 1.3em;\n    color: var(--mj-text-primary);\n    flex: 1;\n}\n\n.section-header i:first-child {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.section-count {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 2px 8px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n}\n\n.toggle-icon {\n    color: var(--mj-text-muted);\n    transition: transform 0.3s;\n}\n\n.toggle-icon.rotated {\n    transform: rotate(-90deg);\n}\n\n.section-content {\n    padding: 24px;\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/* Overview Section */\n.overview-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n    gap: 20px;\n}\n\n.overview-field {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.overview-field label {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.required {\n    color: var(--mj-status-error);\n}\n\n.full-width {\n    width: 100%;\n}\n\n.overview-display {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 24px;\n}\n\n.display-field {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.display-field label {\n    font-size: var(--mj-text-sm);\n    color: var(--mj-text-muted);\n    font-weight: var(--mj-font-semibold);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.display-value {\n    font-size: 1.1em;\n    color: var(--mj-text-primary);\n}\n\n.display-value.code {\n    font-family: 'Courier New', monospace;\n    background: var(--mj-bg-surface-sunken);\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n}\n\n.approval-date {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-left: 8px;\n}\n\n/* Code Section */\n.generation-panel {\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    margin-bottom: 24px;\n}\n\n.generation-panel h3 {\n    margin: 0 0 16px 0;\n    color: var(--mj-color-indigo-500);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.prompt-section, .comments-section {\n    margin-bottom: 16px;\n}\n\n.prompt-section label, .comments-section label {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n}\n\n.generation-controls {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding-top: 12px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.code-locked-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 4px 10px;\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.code-editor-section {\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    overflow: hidden;\n}\n\n.code-toolbar {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 16px;\n    background: var(--mj-bg-surface-sunken);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.code-toolbar h3 {\n    margin: 0;\n    font-size: 1.1em;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-actions {\n    display: flex;\n    gap: 8px;\n}\n\n.code-comments {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    margin-top: 16px;\n}\n\n.code-comments h4 {\n    margin: 0 0 8px 0;\n    color: var(--mj-status-info);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-comments p {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    line-height: var(--mj-leading-relaxed);\n}\n\n.approval-comments {\n    margin-top: 16px;\n}\n\n.approval-comments label {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-status-error);\n}\n\n/* Parameters Section */\n.params-section {\n    background: var(--mj-bg-surface-sunken);\n    border-radius: var(--mj-radius-lg);\n    padding: 20px;\n}\n\n.params-section.params-section-compact {\n    padding: 12px 20px;\n}\n\n.params-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 16px;\n}\n\n.params-header h3 {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.params-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.param-card {\n    background: var(--mj-bg-surface);\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    transition: all var(--mj-transition-base);\n}\n\n.param-card:hover {\n    border-color: var(--mj-brand-primary);\n    box-shadow: var(--mj-shadow-sm);\n}\n\n.param-card.required {\n    border-color: var(--mj-status-warning);\n}\n\n.param-card.clickable {\n    cursor: pointer;\n}\n\n.param-card.clickable:hover {\n    background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n    border-color: var(--mj-brand-primary);\n    transform: translateY(-1px);\n}\n\n.param-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 8px;\n}\n\n.param-name {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n}\n\n.param-badges {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.param-edit-btn,\n.param-delete-btn {\n    background: none;\n    border: none;\n    padding: 4px 8px;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    border-radius: var(--mj-radius-sm);\n    transition: all var(--mj-transition-base);\n}\n\n.param-edit-btn:hover {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-info);\n}\n\n.param-delete-btn:hover {\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n.param-details {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.required-badge {\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.array-badge {\n    background: var(--mj-color-indigo-500);\n    color: var(--mj-text-inverse);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.param-type {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-bottom: 8px;\n}\n\n.param-description {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n    margin-bottom: 8px;\n}\n\n.param-default {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    margin-top: 8px;\n    padding-top: 8px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.default-label {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n}\n\n.param-default code {\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-family: 'Courier New', monospace;\n    color: var(--mj-color-error-400);\n}\n\n\n/* Result Codes Section */\n.result-codes-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.result-code-card {\n    display: flex;\n    align-items: flex-start;\n    gap: 16px;\n    padding: 16px;\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    background: var(--mj-bg-surface);\n    transition: all var(--mj-transition-base);\n    position: relative;\n}\n\n.result-code-card.clickable {\n    cursor: pointer;\n}\n\n.result-code-card:hover {\n    transform: translateY(-2px);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.result-code-card.success {\n    border-color: var(--mj-status-success);\n    background: color-mix(in srgb, var(--mj-status-success) 10%, var(--mj-bg-surface));\n}\n\n.result-code-card.failure {\n    border-color: var(--mj-status-error);\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n}\n\n.result-actions {\n    position: absolute;\n    top: 8px;\n    right: 8px;\n    display: flex;\n    gap: 4px;\n    opacity: 0;\n    transition: opacity var(--mj-transition-base);\n}\n\n.result-code-card:hover .result-actions {\n    opacity: 1;\n}\n\n.result-edit-btn,\n.result-delete-btn {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 4px 8px;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    font-size: var(--mj-text-sm);\n}\n\n.result-edit-btn:hover {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-brand-primary);\n}\n\n.result-delete-btn:hover {\n    background: var(--mj-status-error);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-status-error);\n}\n\n.result-icon {\n    font-size: 1.5em;\n    flex-shrink: 0;\n}\n\n.result-code-card.success .result-icon {\n    color: var(--mj-status-success);\n}\n\n.result-code-card.failure .result-icon {\n    color: var(--mj-status-error);\n}\n\n.result-content {\n    flex: 1;\n    min-width: 0;\n}\n\n.result-code {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n    font-family: 'Courier New', monospace;\n}\n\n.result-description {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n}\n\n/* Execution Section */\n.execution-stats-row {\n    display: flex;\n    gap: 20px;\n    margin-bottom: 32px;\n    flex-wrap: wrap;\n}\n\n.stat-box {\n    flex: 1;\n    min-width: 200px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.stat-box i {\n    font-size: 2em;\n    color: var(--mj-text-muted);\n}\n\n.stat-info {\n    flex: 1;\n}\n\n.executions-table {\n    overflow-x: auto;\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n}\n\n.executions-table table {\n    width: 100%;\n    border-collapse: collapse;\n}\n\n.executions-table th {\n    background: var(--mj-bg-surface-sunken);\n    padding: 12px;\n    text-align: left;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    border-bottom: 2px solid var(--mj-border-default);\n}\n\n.executions-table td {\n    padding: 12px;\n    border-bottom: 1px solid var(--mj-border-default);\n    color: var(--mj-text-primary);\n}\n\n.execution-row {\n    transition: background var(--mj-transition-base);\n}\n\n.execution-row:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.execution-row.success {\n    background: color-mix(in srgb, var(--mj-status-success) 5%, transparent);\n}\n\n.running {\n    color: var(--mj-status-warning);\n    font-style: italic;\n}\n\n.result-code {\n    display: inline-block;\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    font-family: 'Courier New', monospace;\n}\n\n.result-code.success {\n    background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-success);\n}\n\n.result-code.failure {\n    background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n/* Configuration Section */\n.config-subsection {\n    margin-bottom: 32px;\n}\n\n.config-subsection h3 {\n    margin: 0 0 16px 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.library-cards {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.library-card {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.library-card:hover {\n    background: var(--mj-bg-surface-hover);\n    transform: translateX(4px);\n}\n\n.library-card i:first-child {\n    font-size: 1.5em;\n    color: var(--mj-text-muted);\n}\n\n.library-info {\n    flex: 1;\n    min-width: 0;\n}\n\n.library-name {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n}\n\n.library-items {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 12px;\n}\n\n.related-entity-link {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.related-entity-link:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-brand-primary);\n}\n\n.related-entity-link i {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.related-entity-link span:first-of-type {\n    flex: 1;\n    font-weight: var(--mj-font-medium);\n    color: var(--mj-text-secondary);\n}\n\n.entity-count {\n    color: var(--mj-brand-primary);\n    font-size: var(--mj-text-sm);\n}\n\n/* Common States */\n.loading-state {\n    text-align: center;\n    padding: 60px;\n    color: var(--mj-text-muted);\n}\n\n.loading-state i {\n    font-size: 2em;\n    margin-bottom: 12px;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n    .action-hero-header {\n        padding: 20px;\n    }\n\n    .action-identity {\n        flex-direction: column;\n        text-align: center;\n    }\n\n    .action-icon-wrapper {\n        margin: 0 auto;\n    }\n\n    .action-title-row {\n        justify-content: center;\n    }\n\n    .action-stats {\n        justify-content: center;\n    }\n\n    .params-grid {\n        grid-template-columns: 1fr;\n    }\n}\n\n"] }]
+        args: [{ standalone: false, selector: 'mj-action-form', template: "<!--\n    NOTE: We wrap the form content in <mj-record-form-container> rather than\n    using <mj-form-toolbar> directly. The container owns the toolbar AND the\n    panels behind History/Tags/List buttons \u2014 without it those buttons emit\n    events that nothing listens to and the features silently break. Follow\n    this pattern for every custom entity form \u2014 see packages/Angular/CLAUDE.md.\n-->\n@if (record) {\n<mj-record-form-container [Record]=\"record\" [FormComponent]=\"this\"\n    [ToolbarConfig]=\"toolbarConfig\"\n    [WidthMode]=\"'full-width'\"\n    (Navigate)=\"OnFormNavigate($event)\"\n    (DeleteRequested)=\"OnDeleteRequested()\"\n    (FavoriteToggled)=\"OnFavoriteToggled()\"\n    (HistoryRequested)=\"OnHistoryRequested()\"\n    (ListManagementRequested)=\"OnListManagementRequested()\">\n        <form class=\"record-form\" #form=\"ngForm\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n\n            <!-- Main Content Area -->\n            <div class=\"action-main-area\" style=\"display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto;\">\n                \n                <!-- Header Section -->\n                <div class=\"action-header phone-hero\" [class.hero-view]=\"!EditMode\" [class.hero-compact]=\"!EditMode && !HeroDetailsOpen\" style=\"flex-shrink: 0; padding: 20px; background: var(--mj-bg-surface-card); border-bottom: 2px solid var(--mj-border-default);\">\n                    <div class=\"hero-header-row\">\n                        \n                        <!-- Left: Action Info -->\n                        <div style=\"flex: 1; min-width: 0;\">\n                            <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 8px;\">\n                                <i [class]=\"getActionIcon()\" [style.color]=\"getTypeColor()\" style=\"font-size: 1.4em;\"></i>\n                                @if (EditMode) {\n                                    <input type=\"text\" class=\"mj-input\"\n                                           [(ngModel)]=\"record.Name\"\n                                           name=\"actionName\"\n                                           placeholder=\"Enter action name...\"\n                                           style=\"font-size: 1.2em; font-weight: 600; min-width: 300px; flex: 1;\" />\n                                } @else {\n                                    <h4 style=\"margin: 0; color: var(--mj-text-secondary); font-weight: 600; flex: 1;\">{{ record.Name || 'Untitled Action' }}</h4>\n                                    <span class=\"status-chip\"\n                                          [attr.data-color]=\"record.Status === 'Active' ? 'success' : record.Status === 'Pending' ? 'warning' : 'error'\">\n                                        {{ record.Status }}\n                                    </span>\n                                    @if (hasCodeApproval && record.CodeApprovalStatus) {\n                                        <span class=\"status-chip phone-hero-detail\"\n                                              [attr.data-color]=\"record.CodeApprovalStatus === 'Approved' ? 'success' : record.CodeApprovalStatus === 'Pending' ? 'warning' : 'error'\"\n                                              [title]=\"'Code ' + record.CodeApprovalStatus\">\n                                            <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" style=\"margin-right: 4px;\"></i>\n                                            {{ record.CodeApprovalStatus }}\n                                        </span>\n                                    }\n                                }\n                            </div>\n                            \n                            <!-- Status and Type Editors when in edit mode -->\n                            @if (EditMode) {\n                                <div style=\"display: flex; gap: 16px; margin-bottom: 12px; flex-wrap: wrap;\">\n                                    <div>\n                                        <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">Status</label>\n                                        <mj-dropdown [(ngModel)]=\"record.Status\"\n                                                     name=\"actionStatus\"\n                                                     [Data]=\"[{text: 'Active', value: 'Active'}, {text: 'Pending', value: 'Pending'}, {text: 'Disabled', value: 'Disabled'}]\"\n                                                     TextField=\"text\"\n                                                     ValueField=\"value\"\n                                                     [ValuePrimitive]=\"true\"\n                                                     style=\"width: 150px;\">\n                                        </mj-dropdown>\n                                    </div>\n                                    <div>\n                                        <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                            Type <span style=\"color: var(--mj-status-error);\">*</span>\n                                        </label>\n                                        <mj-dropdown [(ngModel)]=\"record.Type\"\n                                                     name=\"actionType\"\n                                                     [Data]=\"[{text: 'Generated', value: 'Generated'}, {text: 'Custom', value: 'Custom'}]\"\n                                                     TextField=\"text\"\n                                                     ValueField=\"value\"\n                                                     [ValuePrimitive]=\"true\"\n                                                     style=\"width: 150px;\">\n                                        </mj-dropdown>\n                                    </div>\n                                    <div>\n                                        <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                            Category <span style=\"color: var(--mj-status-error);\">*</span>\n                                        </label>\n                                        <mj-dropdown [(ngModel)]=\"record.CategoryID\"\n                                                     name=\"categoryID\"\n                                                     [Data]=\"[]\"\n                                                     Placeholder=\"Select category...\"\n                                                     style=\"width: 200px;\">\n                                        </mj-dropdown>\n                                    </div>\n                                    @if (hasCodeApproval) {\n                                        <div>\n                                            <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                                <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" [style.color]=\"getApprovalStatusColor()\" style=\"margin-right: 4px;\"></i>\n                                                Code Approval\n                                            </label>\n                                            <mj-dropdown [(ngModel)]=\"record.CodeApprovalStatus\"\n                                                         name=\"codeApprovalStatus\"\n                                                         [Data]=\"[{text: 'Approved', value: 'Approved'}, {text: 'Pending', value: 'Pending'}, {text: 'Rejected', value: 'Rejected'}]\"\n                                                         TextField=\"text\"\n                                                         ValueField=\"value\"\n                                                         [ValuePrimitive]=\"true\"\n                                                         style=\"width: 160px;\">\n                                            </mj-dropdown>\n                                        </div>\n                                    }\n                                </div>\n                            }\n                            \n                            @if (EditMode) {\n                                <textarea class=\"mj-textarea\" [(ngModel)]=\"record.Description\" \n                                               name=\"actionDescription\"\n                                               [rows]=\"2\"\n                                               placeholder=\"Enter action description...\"\n                                               style=\"width: 100%; max-width: 600px; margin-bottom: 12px;\">\n                                </textarea>\n                            } @else if (record.Description) {\n                                <p class=\"phone-hero-detail\" style=\"margin: 0 0 12px 0; color: var(--mj-text-muted); font-size: 0.9em; line-height: 1.4;\">{{ record.Description }}</p>\n                            }\n                            \n                            <!-- Quick Config Row -->\n                            <div class=\"quick-config phone-hero-detail\" style=\"display: flex; align-items: center; gap: 16px; flex-wrap: wrap;\">\n                                @if (category) {\n                                    <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                        <i class=\"fa-solid fa-folder\" style=\"color: var(--mj-text-muted);\"></i>\n                                        <span style=\"color: var(--mj-text-muted);\">Category:</span>\n                                        <span style=\"color: var(--mj-text-secondary); font-weight: 500; cursor: pointer;\" (click)=\"navigateToCategory()\">\n                                            {{ category.Name }}\n                                            <i class=\"fa-solid fa-external-link\" style=\"font-size: 0.75em; margin-left: 4px;\"></i>\n                                        </span>\n                                    </div>\n                                }\n                                \n                                <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-cube\" style=\"color: var(--mj-text-muted);\"></i>\n                                    <span style=\"color: var(--mj-text-muted);\">Type:</span>\n                                    <span style=\"color: var(--mj-text-secondary); font-weight: 500;\">{{ record.Type }}</span>\n                                </div>\n                                \n                                @if (hasCodeApproval && record.CodeApprovalStatus) {\n                                    <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                        <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" [style.color]=\"getApprovalStatusColor()\"></i>\n                                        <span style=\"color: var(--mj-text-muted);\">Code:</span>\n                                        <span [style.color]=\"getApprovalStatusColor()\" style=\"font-weight: 500;\">{{ record.CodeApprovalStatus }}</span>\n                                    </div>\n                                }\n                                \n                                @if (actionParams.length > 0) {\n                                    <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                        <i class=\"fa-solid fa-sliders\" style=\"color: var(--mj-text-muted);\"></i>\n                                        <span style=\"color: var(--mj-text-secondary); font-weight: 500;\">{{ actionParams.length }} Parameters</span>\n                                    </div>\n                                }\n                            </div>\n                        </div>\n                        \n                        <!-- Right: Action Buttons -->\n                        <div class=\"action-buttons\">\n                            <div style=\"display: flex; gap: 8px;\">\n                                @if (record.ID && !EditMode) {\n                                    <button mjButton variant=\"primary\" size=\"lg\" class=\"phone-hero-run\"\n                                                (click)=\"openTestHarness()\"\n                                                title=\"Open Run Harness\"\n                                                [disabled]=\"record.Status !== 'Active'\">\n                                        <i class=\"fa-solid fa-play\"></i> Run\n                                    </button>\n                                }\n                                @if (EditMode && record.Type === 'Generated') {\n                                    <button mjButton variant=\"outline\" size=\"md\"\n                                                (click)=\"regenerateCode()\"\n                                                title=\"Regenerate Code\">\n                                        <i class=\"fa-solid fa-robot\"></i> Regenerate\n                                    </button>\n                                }\n                            </div>\n                            \n                            @if (!EditMode && record.Status !== 'Active' && record.ID) {\n                                <div style=\"font-size: 0.75em; color: var(--mj-status-error); text-align: right;\">\n                                    Action must be Active to execute\n                                </div>\n                            }\n                        </div>\n                    </div>\n                  @if (!EditMode && HeroSummary) {\n                    <button type=\"button\" class=\"phone-hero-summary\" [attr.aria-expanded]=\"HeroDetailsOpen\" (click)=\"ToggleHeroDetails()\">\n                      <span class=\"phone-hero-summary-text\">{{ HeroSummary }}</span>\n                      <i class=\"fa-solid fa-chevron-down\" aria-hidden=\"true\"></i>\n                    </button>\n                  }\n                </div>\n\n                <!-- Configuration Sections with Expansion Panels -->\n                <div class=\"configuration-sections\" style=\"flex: 1; background: var(--mj-bg-surface-card); border-top: 2px solid var(--mj-border-default); padding: 16px; min-height: 0;\">\n                    <!-- Phone: one section at a time behind a picker; desktop keeps the accordions -->\n                    <mj-accordion-sections [Enabled]=\"Phone.IsPhone\" [ActiveKey]=\"Phone.Section\" (ActiveKeyChange)=\"Phone.Pick($event)\">\n                    \n                    <!-- Parameters Section (FIRST) -->\n                    <mj-accordion-panel SectionKey=\"parameters\" SectionTitle=\"Parameters\" SectionIcon=\"fa-solid fa-sliders\" [SectionCount]=\"ActionParams.length\"\n                        [Expanded]=\"true\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template mjAccordionTitle>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-sliders\" style=\"color: var(--mj-text-muted);\"></i>\n                                Parameters\n                                @if (actionParams.length > 0) {\n                                    <span style=\"background: var(--mj-status-info); color: var(--mj-text-inverse); padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                        {{ actionParams.length }}\n                                    </span>\n                                }\n                            </span>\n                        </ng-template>\n                        \n                        <div class=\"phone-flush-x\" style=\"padding: 16px;\">\n                            @if (isLoadingParams) {\n                                <div class=\"loading-state\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                    Loading parameters...\n                                </div>\n                            } @else if (actionParams.length === 0) {\n                                <mj-empty-state\n                                    Size=\"compact\"\n                                    Icon=\"fa-solid fa-sliders\"\n                                    Title=\"No parameters defined\"\n                                    [Message]=\"EditMode && record.IsSaved ? 'Add parameters to define inputs and outputs for this action' : ''\" />\n                            } @else {\n                                <!-- Input Parameters Grid -->\n                                <div class=\"params-section\">\n                                    <div class=\"params-header\">\n                                        <h3><i class=\"fa-solid fa-sign-in-alt\"></i> Input Parameters</h3>\n                                        @if (EditMode && record.IsSaved) {\n                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"addParameter('Input')\">\n                                                <i class=\"fa-solid fa-plus\"></i> Add Input\n                                            </button>\n                                        }\n                                    </div>\n                                    \n                                    @if (getInputParams().length === 0) {\n                                        <mj-empty-state\n                                            Size=\"compact\"\n                                            Icon=\"fa-solid fa-inbox\"\n                                            Title=\"No input parameters defined\" />\n                                    } @else {\n                                        <div class=\"params-grid\">\n                                            @for (param of getInputParams(); track param.ID) {\n                                                <div class=\"param-card\" [class.required]=\"param.IsRequired\" \n                                                     [class.clickable]=\"true\"\n                                                     (click)=\"onParamClick(param, $event)\">\n                                                    <div class=\"param-header\">\n                                                        <span class=\"param-name\">{{ param.Name }}</span>\n                                                        <div class=\"param-badges\">\n                                                            @if (param.IsRequired) {\n                                                                <span class=\"required-badge\">Required</span>\n                                                            }\n                                                            @if (param.IsArray) {\n                                                                <span class=\"array-badge\">Array</span>\n                                                            }\n                                                            @if (EditMode) {\n                                                                <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n                                                                    <i class=\"fa-solid fa-edit\"></i>\n                                                                </button>\n                                                                <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n                                                                    <i class=\"fa-solid fa-trash\"></i>\n                                                                </button>\n                                                            }\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"param-details\">\n                                                        <div class=\"param-type\">{{ param.ValueType }}</div>\n                                                        @if (param.Description) {\n                                                            <div class=\"param-description\">{{ param.Description }}</div>\n                                                        }\n                                                        @if (param.DefaultValue) {\n                                                            <div class=\"param-default\">\n                                                                <span class=\"default-label\">Default:</span>\n                                                                <code>{{ param.DefaultValue }}</code>\n                                                            </div>\n                                                        }\n                                                    </div>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n\n                                <!-- Output Parameters Grid -->\n                                <div class=\"params-section\" style=\"margin-top: 24px;\" \n                                     [class.params-section-compact]=\"getOutputParams().length === 0\">\n                                    <div class=\"params-header\">\n                                        <h3><i class=\"fa-solid fa-sign-out-alt\"></i> Output Parameters</h3>\n                                        @if (EditMode && record.IsSaved) {\n                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"addParameter('Output')\">\n                                                <i class=\"fa-solid fa-plus\"></i> Add Output\n                                            </button>\n                                        }\n                                    </div>\n                                    \n                                    @if (getOutputParams().length === 0) {\n                                        <mj-empty-state\n                                            Size=\"compact\"\n                                            Icon=\"fa-solid fa-inbox\"\n                                            Title=\"No output parameters defined\" />\n                                    } @else {\n                                        <div class=\"params-grid\">\n                                            @for (param of getOutputParams(); track param.ID) {\n                                                <div class=\"param-card\"\n                                                     [class.clickable]=\"true\"\n                                                     (click)=\"onParamClick(param, $event)\">\n                                                    <div class=\"param-header\">\n                                                        <span class=\"param-name\">{{ param.Name }}</span>\n                                                        <div class=\"param-badges\">\n                                                            @if (param.IsArray) {\n                                                                <span class=\"array-badge\">Array</span>\n                                                            }\n                                                            @if (EditMode) {\n                                                                <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n                                                                    <i class=\"fa-solid fa-edit\"></i>\n                                                                </button>\n                                                                <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n                                                                    <i class=\"fa-solid fa-trash\"></i>\n                                                                </button>\n                                                            }\n                                                        </div>\n                                                    </div>\n                                                    <div class=\"param-details\">\n                                                        <div class=\"param-type\">{{ param.ValueType }}</div>\n                                                        @if (param.Description) {\n                                                            <div class=\"param-description\">{{ param.Description }}</div>\n                                                        }\n                                                        @if (param.DefaultValue) {\n                                                            <div class=\"param-default\">\n                                                                <span class=\"default-label\">Default:</span>\n                                                                <code>{{ param.DefaultValue }}</code>\n                                                            </div>\n                                                        }\n                                                    </div>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n                            }\n                        </div>\n                    </mj-accordion-panel>\n\n                    <!-- Code & Generation Section (Only for Generated type) -->\n                    @if (record.Type === 'Generated') {\n                        <mj-accordion-panel SectionKey=\"code\" SectionTitle=\"Code &amp; Generation\" SectionIcon=\"fa-solid fa-code\"\n                            [Expanded]=\"expandedSections.code\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-code\" style=\"color: var(--mj-text-muted);\"></i>\n                                    Code &amp; Generation\n                                    @if (record.CodeLocked) {\n                                        <span style=\"background: var(--mj-status-warning); color: var(--mj-color-warning-800); padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                            <i class=\"fa-solid fa-lock\"></i> Locked\n                                        </span>\n                                    }\n                                </span>\n                            </ng-template>\n                            \n                            <div class=\"phone-flush-x\" style=\"padding: 16px;\">\n                                @if (EditMode) {\n                                    <div class=\"generation-panel\">\n                                        <h3><i class=\"fa-solid fa-robot\"></i> AI Generation</h3>\n                                        <div class=\"prompt-section\">\n                                            <label>User Prompt</label>\n                                            <textarea class=\"mj-textarea\" [(ngModel)]=\"record.UserPrompt\"\n                                                           name=\"userPrompt\"\n                                                           [rows]=\"8\"\n                                                           placeholder=\"Describe what this action should do...\"\n                                                           style=\"width: 100%; min-height: 120px;\">\n                                            </textarea>\n                                        </div>\n                                        <div class=\"comments-section\">\n                                            <label>Internal Comments (not sent to AI)</label>\n                                            <textarea class=\"mj-textarea\" [(ngModel)]=\"record.UserComments\"\n                                                           name=\"userComments\"\n                                                           [rows]=\"2\"\n                                                           placeholder=\"Internal notes...\"\n                                                           style=\"width: 100%;\">\n                                            </textarea>\n                                        </div>\n                                        <div class=\"generation-controls\">\n                                            <mj-switch [(ngModel)]=\"record.CodeLocked\"\n                                                       name=\"codeLocked\">\n                                            </mj-switch>\n                                            <label style=\"margin-left: 8px;\">Lock Code (prevent regeneration)</label>\n                                        </div>\n                                    </div>\n                                }\n                                \n                                <div class=\"code-editor-section\">\n                                    <div class=\"code-toolbar\">\n                                        <h3><i class=\"fa-solid fa-file-code\"></i> Action Code</h3>\n                                        <div class=\"code-actions\">\n                                            @if (record.CodeComments) {\n                                                <button mjButton variant=\"flat\" size=\"sm\" (click)=\"toggleCodeComments()\">\n                                                    <i class=\"fa-solid fa-comment\"></i> \n                                                    {{ showCodeComments ? 'Hide' : 'Show' }} AI Comments\n                                                </button>\n                                            }\n                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"copyToClipboard(record.Code || '')\">\n                                                <i class=\"fa-solid fa-copy\"></i> Copy\n                                            </button>\n                                        </div>\n                                    </div>\n                                    <mj-code-editor \n                                        [(ngModel)]=\"record.Code\"\n                                        name=\"actionCode\"\n                                        [readonly]=\"!EditMode || record.CodeLocked\"\n                                        [language]=\"codeLanguage\"\n                                        [lineWrapping]=\"true\"\n                                        style=\"height: 400px; width: 100%;\">\n                                    </mj-code-editor>\n                                    \n                                    @if (showCodeComments && record.CodeComments) {\n                                        <div class=\"code-comments\">\n                                            <h4><i class=\"fa-solid fa-robot\"></i> AI Explanation</h4>\n                                            <p>{{ record.CodeComments }}</p>\n                                        </div>\n                                    }\n                                    \n                                    @if (EditMode && record.CodeApprovalStatus === 'Rejected') {\n                                        <div class=\"approval-comments\">\n                                            <label>Rejection Comments</label>\n                                            <textarea class=\"mj-textarea\" [(ngModel)]=\"record.CodeApprovalComments\"\n                                                           name=\"codeApprovalComments\"\n                                                           [rows]=\"2\"\n                                                           placeholder=\"Explain why the code was rejected...\"\n                                                           style=\"width: 100%;\">\n                                            </textarea>\n                                        </div>\n                                    }\n                                </div>\n                            </div>\n                        </mj-accordion-panel>\n                    }\n\n                    <!-- Runtime Action Configuration Section (only for Type='Runtime') -->\n                    @if (isRuntimeAction) {\n                        <mj-accordion-panel SectionKey=\"runtime\" SectionTitle=\"Runtime Configuration &amp; Permissions\" SectionIcon=\"fa-solid fa-wand-magic-sparkles\"\n                            [Expanded]=\"true\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-wand-magic-sparkles\" style=\"color: var(--mj-status-warning);\"></i>\n                                    Runtime Configuration &amp; Permissions\n                                    <span style=\"color: var(--mj-text-muted); font-weight: 400; font-size: 0.85em;\">\n                                        ({{ getRuntimeConfigSummary() }})\n                                    </span>\n                                </span>\n                            </ng-template>\n\n                            <div class=\"phone-flush-x\" style=\"padding: 16px;\">\n                                @if (!runtimeConfig) {\n                                    <mj-alert Variant=\"error\">\n                                        <strong>Missing or malformed RuntimeActionConfiguration.</strong>\n                                        This Runtime action cannot run until a valid configuration is supplied. Approval should not be granted in this state.\n                                    </mj-alert>\n                                } @else {\n                                    @if (getWildcardFlags().any) {\n                                        <mj-alert Variant=\"warning\" Title=\"Wildcard permissions enabled\">\n                                            <div style=\"color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                                This runtime action has one or more wildcard flags set that bypass the specific allowlists below:\n                                                @if (getWildcardFlags().entity) { <strong>allowAnyEntity</strong> }\n                                                @if (getWildcardFlags().action) { <strong>allowAnyAction</strong> }\n                                                @if (getWildcardFlags().agent) { <strong>allowAnyAgent</strong> }\n                                                . Approving grants this action unrestricted access to that namespace on behalf of any user who invokes it. Only approve if the action is framework-authored or you have personally reviewed every place it touches those resources.\n                                            </div>\n                                        </mj-alert>\n                                    }\n                                    <!-- Declared permissions \u2014 the security contract an approver is blessing -->\n                                    <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-bottom: 20px;\">\n                                        <!-- Entities -->\n                                        <div style=\"border: 1px solid var(--mj-border-default); border-radius: 6px; padding: 12px; background: var(--mj-bg-surface-card);\">\n                                            <div style=\"font-weight: 600; margin-bottom: 8px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-database\" style=\"margin-right: 6px; color: var(--mj-brand-primary);\"></i>\n                                                Allowed Entities ({{ getAllowedEntities().length }})\n                                            </div>\n                                            @if (getAllowedEntities().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None requested</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-direction: column; gap: 4px;\">\n                                                    @for (e of getAllowedEntities(); track e.id) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 4px 8px; border-radius: 4px; font-size: 0.9em; color: var(--mj-text-primary);\">\n                                                            {{ e.name }}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n\n                                        <!-- Actions -->\n                                        <div style=\"border: 1px solid var(--mj-border-default); border-radius: 6px; padding: 12px; background: var(--mj-bg-surface-card);\">\n                                            <div style=\"font-weight: 600; margin-bottom: 8px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-bolt\" style=\"margin-right: 6px; color: var(--mj-brand-primary);\"></i>\n                                                Allowed Actions ({{ getAllowedActions().length }})\n                                            </div>\n                                            @if (getAllowedActions().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None requested</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-direction: column; gap: 4px;\">\n                                                    @for (a of getAllowedActions(); track a.id) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 4px 8px; border-radius: 4px; font-size: 0.9em; color: var(--mj-text-primary);\">\n                                                            {{ a.name }}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n\n                                        <!-- Agents -->\n                                        <div style=\"border: 1px solid var(--mj-border-default); border-radius: 6px; padding: 12px; background: var(--mj-bg-surface-card);\">\n                                            <div style=\"font-weight: 600; margin-bottom: 8px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-robot\" style=\"margin-right: 6px; color: var(--mj-brand-primary);\"></i>\n                                                Allowed Agents ({{ getAllowedAgents().length }})\n                                            </div>\n                                            @if (getAllowedAgents().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None requested</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-direction: column; gap: 4px;\">\n                                                    @for (g of getAllowedAgents(); track g.id) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 4px 8px; border-radius: 4px; font-size: 0.9em; color: var(--mj-text-primary);\">\n                                                            {{ g.name }}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n                                    </div>\n\n                                    <!-- Limits + libraries -->\n                                    <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px;\">\n                                        <div>\n                                            <div style=\"font-weight: 600; margin-bottom: 6px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-gauge-high\" style=\"margin-right: 6px; color: var(--mj-text-muted);\"></i>\n                                                Resource Limits\n                                            </div>\n                                            <div style=\"color: var(--mj-text-secondary); font-size: 0.9em;\">\n                                                <div>Max memory: {{ getRuntimeLimits().maxMemoryMB }} MB</div>\n                                                <div>Max bridge calls: {{ getRuntimeLimits().maxBridgeCalls }}</div>\n                                                @if (record.MaxExecutionTimeMS) {\n                                                    <div>Max execution time: {{ record.MaxExecutionTimeMS }} ms</div>\n                                                }\n                                            </div>\n                                        </div>\n                                        <div>\n                                            <div style=\"font-weight: 600; margin-bottom: 6px; color: var(--mj-text-primary);\">\n                                                <i class=\"fa-solid fa-book\" style=\"margin-right: 6px; color: var(--mj-text-muted);\"></i>\n                                                Additional Libraries\n                                            </div>\n                                            @if (getRequestedLibraries().length === 0) {\n                                                <div style=\"color: var(--mj-text-muted); font-style: italic;\">None (only default set: lodash, date-fns, uuid, validator)</div>\n                                            } @else {\n                                                <div style=\"display: flex; flex-wrap: wrap; gap: 4px;\">\n                                                    @for (lib of getRequestedLibraries(); track lib.name) {\n                                                        <span style=\"background: var(--mj-bg-surface-sunken); padding: 2px 8px; border-radius: 10px; font-size: 0.85em;\">\n                                                            {{ lib.name }}@if (lib.version) {<span style=\"color: var(--mj-text-muted);\"> @{{ lib.version }}</span>}\n                                                        </span>\n                                                    }\n                                                </div>\n                                            }\n                                        </div>\n                                    </div>\n                                }\n\n                                <!-- Code payload -->\n                                <div>\n                                    <div style=\"font-weight: 600; margin-bottom: 6px; color: var(--mj-text-primary);\">\n                                        <i class=\"fa-solid fa-code\" style=\"margin-right: 6px; color: var(--mj-text-muted);\"></i>\n                                        JavaScript Payload\n                                    </div>\n                                    <pre style=\"background: var(--mj-bg-surface-sunken); color: var(--mj-text-primary); padding: 12px; border-radius: 4px; overflow-x: auto; max-height: 400px; font-family: 'SF Mono', Monaco, Consolas, monospace; font-size: 0.85em; margin: 0;\"><code>{{ record.Code }}</code></pre>\n                                </div>\n\n                                <!-- Approval actions (Runtime-specific labels) -->\n                                @if (EditMode && record.CodeApprovalStatus === 'Pending') {\n                                    <mj-alert Variant=\"warning\" Title=\"Approval required before this Runtime action can execute.\" class=\"approval-required-alert\">\n                                        <div style=\"color: var(--mj-text-secondary); font-size: 0.9em; margin-bottom: 12px;\">\n                                            Approving grants this action the permissions listed above on behalf of any user who invokes it. Review the code and permissions carefully before approving.\n                                        </div>\n                                        <div style=\"display: flex; gap: 8px;\">\n                                            <button class=\"mj-button mj-button-primary\" (click)=\"approveCode()\">\n                                                <i class=\"fa-solid fa-check\"></i> Approve\n                                            </button>\n                                            <button class=\"mj-button\" (click)=\"rejectCode()\">\n                                                <i class=\"fa-solid fa-ban\"></i> Reject\n                                            </button>\n                                        </div>\n                                    </mj-alert>\n                                }\n                            </div>\n                        </mj-accordion-panel>\n                    }\n\n                    <!-- Result Codes Section -->\n                    <mj-accordion-panel SectionKey=\"result-codes\" SectionTitle=\"Result Codes\" SectionIcon=\"fa-solid fa-flag-checkered\" [SectionCount]=\"ResultCodes.length\"\n                        [Expanded]=\"expandedSections.resultCodes\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template mjAccordionTitle>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-flag-checkered\" style=\"color: var(--mj-text-muted);\"></i>\n                                Result Codes\n                                @if (resultCodes.length > 0) {\n                                    <span style=\"background: var(--mj-status-success); color: var(--mj-text-inverse); padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                        {{ resultCodes.length }}\n                                    </span>\n                                }\n                            </span>\n                        </ng-template>\n                        \n                        <div class=\"phone-flush-x\" style=\"padding: 16px;\">\n                            <!-- Add Result Code Button -->\n                            @if (EditMode && record.IsSaved) {\n                                <div style=\"display: flex; justify-content: flex-end; margin-bottom: 12px;\">\n                                    <button mjButton variant=\"primary\" size=\"sm\" (click)=\"addResultCode()\">\n                                        <i class=\"fa-solid fa-plus\"></i> Add Result Code\n                                    </button>\n                                </div>\n                            }\n                            \n                            @if (isLoadingResultCodes) {\n                                <div class=\"loading-state\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                    Loading result codes...\n                                </div>\n                            } @else if (resultCodes.length === 0) {\n                                <mj-empty-state\n                                    Size=\"compact\"\n                                    Icon=\"fa-solid fa-flag-checkered\"\n                                    Title=\"No result codes defined\"\n                                    [Message]=\"EditMode && record.IsSaved ? 'Add result codes to define possible outcomes' : ''\" />\n                            } @else {\n                                <div class=\"result-codes-grid\">\n                                    @for (code of resultCodes; track code.ID) {\n                                        <div class=\"result-code-card\" \n                                             [class.success]=\"code.IsSuccess\" \n                                             [class.failure]=\"!code.IsSuccess\"\n                                             [class.clickable]=\"true\"\n                                             (click)=\"onResultCodeClick(code, $event)\">\n                                            <div class=\"result-icon\">\n                                                <i [class]=\"code.IsSuccess ? 'fa-solid fa-check-circle' : 'fa-solid fa-times-circle'\"></i>\n                                            </div>\n                                            <div class=\"result-content\">\n                                                <div class=\"result-code\">{{ code.ResultCode }}</div>\n                                                @if (code.Description) {\n                                                    <div class=\"result-description\">{{ code.Description }}</div>\n                                                }\n                                            </div>\n                                            @if (EditMode) {\n                                                <div class=\"result-actions\">\n                                                    <button class=\"result-edit-btn\" (click)=\"editResultCode(code); $event.stopPropagation()\" title=\"Edit result code\">\n                                                        <i class=\"fa-solid fa-edit\"></i>\n                                                    </button>\n                                                    <button class=\"result-delete-btn\" (click)=\"deleteResultCode(code); $event.stopPropagation()\" title=\"Delete result code\">\n                                                        <i class=\"fa-solid fa-trash\"></i>\n                                                    </button>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n                            }\n                        </div>\n                    </mj-accordion-panel>\n\n                    <!-- Execution & Monitoring Section -->\n                    @if (record.IsSaved) {\n                        <mj-accordion-panel SectionKey=\"execution\" SectionTitle=\"Execution &amp; Monitoring\" SectionIcon=\"fa-solid fa-chart-line\"\n                            [Expanded]=\"expandedSections.execution\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-chart-line\" style=\"color: var(--mj-text-muted);\"></i>\n                                    Execution &amp; Monitoring\n                                </span>\n                            </ng-template>\n                            \n                            <div class=\"phone-flush-x\" style=\"padding: 16px;\">\n                                @if (isLoadingExecutions) {\n                                    <div class=\"loading-state\">\n                                        <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                        Loading executions...\n                                    </div>\n                                } @else if (recentExecutions.length === 0) {\n                                    <mj-empty-state\n                                        Size=\"compact\"\n                                        Icon=\"fa-solid fa-chart-line\"\n                                        Title=\"No executions yet\" />\n                                } @else {\n                                    <div class=\"execution-stats-row\">\n                                        <div class=\"stat-box\">\n                                            <i class=\"fa-solid fa-tachometer-alt\"></i>\n                                            <div class=\"stat-info\">\n                                                <div class=\"stat-label\" style=\"color: var(--mj-text-primary);\">Avg Duration</div>\n                                                <div class=\"stat-value\" style=\"color: var(--mj-text-primary);\">{{ formatDuration(executionStats.avgDuration) }}</div>\n                                            </div>\n                                        </div>\n                                        <div class=\"stat-box\">\n                                            <i class=\"fa-solid fa-check-circle\" [style.color]=\"getSuccessRateColor()\"></i>\n                                            <div class=\"stat-info\">\n                                                <div class=\"stat-label\" style=\"color: var(--mj-text-primary);\">Success Rate</div>\n                                                <div class=\"stat-value\" [style.color]=\"getSuccessRateColor()\" style=\"font-weight: 600;\">{{ executionStats.successRate.toFixed(0) }}%</div>\n                                            </div>\n                                        </div>\n                                        <div class=\"stat-box\">\n                                            <i class=\"fa-solid fa-play-circle\"></i>\n                                            <div class=\"stat-info\">\n                                                <div class=\"stat-label\" style=\"color: var(--mj-text-primary);\">Total Runs</div>\n                                                <div class=\"stat-value\" style=\"color: var(--mj-text-primary);\">{{ executionStats.totalRuns }}</div>\n                                            </div>\n                                        </div>\n                                    </div>\n\n                                    <h3 style=\"margin-top: 24px;\"><i class=\"fa-solid fa-history\"></i> Recent Executions</h3>\n                                    <div class=\"executions-table\">\n                                        <table>\n                                            <thead>\n                                                <tr>\n                                                    <th>Started</th>\n                                                    <th>Duration</th>\n                                                    <th>User</th>\n                                                    <th>Result</th>\n                                                    <th>Actions</th>\n                                                </tr>\n                                            </thead>\n                                            <tbody>\n                                                @for (execution of recentExecutions; track execution.ID) {\n                                                    <tr class=\"execution-row\" [class.success]=\"isExecutionSuccess(execution)\">\n                                                        <td>{{ execution.StartedAt | date:'short' }}</td>\n                                                        <td>\n                                                            @if (execution.EndedAt) {\n                                                                {{ formatDuration(getExecutionDuration(execution)) }}\n                                                            } @else {\n                                                                <span class=\"running\">Running...</span>\n                                                            }\n                                                        </td>\n                                                        <td>{{ execution.User }}</td>\n                                                        <td>\n                                                            <span class=\"result-code\" \n                                                                  [class.success]=\"isExecutionSuccess(execution)\"\n                                                                  [class.failure]=\"!isExecutionSuccess(execution)\">\n                                                                {{ execution.ResultCode }}\n                                                            </span>\n                                                        </td>\n                                                        <td>\n                                                            <button mjButton variant=\"flat\" size=\"sm\" (click)=\"navigateToExecution(execution.ID)\">\n                                                                <i class=\"fa-solid fa-external-link\"></i>\n                                                            </button>\n                                                        </td>\n                                                    </tr>\n                                                }\n                                            </tbody>\n                                        </table>\n                                    </div>\n                                }\n                            </div>\n                        </mj-accordion-panel>\n                    }\n\n                    <!-- Related Configuration Section -->\n                    @if (record.IsSaved) {\n                        <mj-accordion-panel SectionKey=\"related\" SectionTitle=\"Related Configuration\" SectionIcon=\"fa-solid fa-cogs\"\n                            [Expanded]=\"expandedSections.configuration\"\n                            style=\"margin-bottom: 12px;\">\n                            <ng-template mjAccordionTitle>\n                                <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                    <i class=\"fa-solid fa-cogs\" style=\"color: var(--mj-text-muted);\"></i>\n                                    Related Configuration\n                                </span>\n                            </ng-template>\n                            \n                            <div class=\"phone-flush-x\" style=\"padding: 16px;\">\n                                <!-- Libraries -->\n                                <div class=\"config-subsection\">\n                                    <h3><i class=\"fa-solid fa-book\"></i> Libraries</h3>\n                                    @if (isLoadingLibraries) {\n                                        <div class=\"loading-state\">\n                                            <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                                            Loading libraries...\n                                        </div>\n                                    } @else if (actionLibraries.length === 0) {\n                                        <mj-empty-state\n                                            Size=\"compact\"\n                                            Icon=\"fa-solid fa-book\"\n                                            Title=\"No libraries configured\" />\n                                    } @else {\n                                        <div class=\"library-cards\">\n                                            @for (lib of libraries; track lib.ID; let i = $index) {\n                                                <div class=\"library-card\" (click)=\"navigateToLibrary(lib.ID)\">\n                                                    <i class=\"fa-solid fa-book\"></i>\n                                                    <div class=\"library-info\">\n                                                        <div class=\"library-name\">{{ lib.Name }}</div>\n                                                        @if (actionLibraries[i].ItemsUsed) {\n                                                            <div class=\"library-items\">{{ actionLibraries[i].ItemsUsed }}</div>\n                                                        }\n                                                    </div>\n                                                    <i class=\"fa-solid fa-external-link\"></i>\n                                                </div>\n                                            }\n                                        </div>\n                                    }\n                                </div>\n\n                                <!-- Other Related Entities -->\n                                <div class=\"related-entities-grid\">\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-shield-alt\"></i>\n                                        <span>Authorizations</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-layer-group\"></i>\n                                        <span>Contexts</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-calendar\"></i>\n                                        <span>Scheduled Actions</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                    <div class=\"related-entity-link\">\n                                        <i class=\"fa-solid fa-cube\"></i>\n                                        <span>Entity Actions</span>\n                                        <span class=\"entity-count\">View</span>\n                                    </div>\n                                </div>\n                            </div>\n                        </mj-accordion-panel>\n                    }\n                    </mj-accordion-sections>\n                </div>\n            </div>\n        </form>\n</mj-record-form-container>\n}\n\n<!-- Action Test Harness Dialog -->\n<mj-action-test-harness-dialog\n    [Action]=\"record\"\n    [ActionParams]=\"actionParams\"\n    [IsOpen]=\"showTestHarness\"\n    (Close)=\"onTestHarnessVisibilityChanged(false)\">\n</mj-action-test-harness-dialog>", styles: ["/* Enable flex layout for full-height scrolling */\n:host {\n    display: block;\n    height: 100%;\n}\n\n/* positions the Runtime-action approval alert (mj-alert is margin-less but for bottom) */\n.approval-required-alert { margin-top: 16px; }\n\n.record-form-container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n}\n\n.record-form {\n    min-height: 0 !important;\n}\n\n/* Hero Header Section */\n.action-hero-header {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 32px;\n    margin: -20px -20px 24px -20px;\n    border-radius: 0 0 var(--mj-radius-lg) var(--mj-radius-lg);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.hero-content {\n    max-width: 1400px;\n    margin: 0 auto;\n}\n\n.action-identity {\n    display: flex;\n    align-items: flex-start;\n    gap: 24px;\n    margin-bottom: 24px;\n}\n\n.action-icon-wrapper {\n    width: 80px;\n    height: 80px;\n    border-radius: var(--mj-radius-lg);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper i {\n    font-size: var(--mj-text-4xl);\n}\n\n.action-info {\n    flex: 1;\n    min-width: 0;\n}\n\n.action-title-row {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    margin-bottom: 12px;\n    flex-wrap: wrap;\n}\n\n.action-title {\n    margin: 0;\n    font-size: 2em;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-inverse);\n}\n\n.action-name-input {\n    font-size: 1.8em;\n    font-weight: var(--mj-font-semibold);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    padding: 8px 16px;\n    border-radius: var(--mj-radius-md);\n    min-width: 400px;\n}\n\n.action-name-input::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n.action-badges {\n    display: flex;\n    gap: 8px;\n    flex-wrap: wrap;\n}\n\n.status-badge, .type-badge, .approval-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 6px 14px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n}\n\n.action-category {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 0.95em;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    margin-bottom: 12px;\n}\n\n.action-category:hover {\n    color: var(--mj-text-inverse);\n    transform: translateX(4px);\n}\n\n.action-description {\n    color: color-mix(in srgb, var(--mj-text-inverse) 90%, transparent);\n    font-size: 1.05em;\n    line-height: var(--mj-leading-relaxed);\n    margin: 0;\n}\n\n.action-description-input {\n    width: 100%;\n    max-width: 600px;\n    background: color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border: 2px solid color-mix(in srgb, var(--mj-text-inverse) 30%, transparent);\n    color: var(--mj-text-inverse);\n    border-radius: var(--mj-radius-md);\n}\n\n.action-description-input::placeholder {\n    color: color-mix(in srgb, var(--mj-text-inverse) 60%, transparent);\n}\n\n/* Quick Stats */\n.action-stats {\n    display: flex;\n    gap: 24px;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n}\n\n.stat-card {\n    background: color-mix(in srgb, var(--mj-text-inverse) 10%, transparent);\n    backdrop-filter: blur(10px);\n    border: 1px solid color-mix(in srgb, var(--mj-text-inverse) 20%, transparent);\n    border-radius: var(--mj-radius-lg);\n    padding: 16px 24px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    min-width: 160px;\n}\n\n.stat-card i {\n    font-size: var(--mj-text-2xl);\n    color: color-mix(in srgb, var(--mj-text-inverse) 80%, transparent);\n}\n\n.stat-content {\n    display: flex;\n    flex-direction: column;\n}\n\n.stat-value {\n    font-size: 1.4em;\n    font-weight: var(--mj-font-bold);\n    color: var(--mj-text-inverse);\n}\n\n.stat-label {\n    font-size: var(--mj-text-sm);\n    color: color-mix(in srgb, var(--mj-text-inverse) 70%, transparent);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n/* Hero Actions */\n.hero-actions {\n    display: flex;\n    gap: 12px;\n    flex-wrap: wrap;\n}\n\n.hero-actions button {\n    backdrop-filter: blur(10px);\n}\n\n/* Main Content Sections */\n.action-content {\n    padding: 0 20px 20px;\n}\n\n.content-section {\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-lg);\n    margin-bottom: 20px;\n    overflow: hidden;\n    transition: all var(--mj-transition-base);\n}\n\n.content-section:hover {\n    box-shadow: var(--mj-shadow-md);\n}\n\n.section-header {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 20px;\n    background: var(--mj-bg-surface-elevated);\n    cursor: pointer;\n    user-select: none;\n    transition: background var(--mj-transition-base);\n}\n\n.section-header:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.section-header h2 {\n    margin: 0;\n    font-size: 1.3em;\n    color: var(--mj-text-primary);\n    flex: 1;\n}\n\n.section-header i:first-child {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.section-count {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    padding: 2px 8px;\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n}\n\n.toggle-icon {\n    color: var(--mj-text-muted);\n    transition: transform 0.3s;\n}\n\n.toggle-icon.rotated {\n    transform: rotate(-90deg);\n}\n\n.section-content {\n    padding: 24px;\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/* Overview Section */\n.overview-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n    gap: 20px;\n}\n\n.overview-field {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.overview-field label {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.required {\n    color: var(--mj-status-error);\n}\n\n.full-width {\n    width: 100%;\n}\n\n.overview-display {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 24px;\n}\n\n.display-field {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.display-field label {\n    font-size: var(--mj-text-sm);\n    color: var(--mj-text-muted);\n    font-weight: var(--mj-font-semibold);\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.display-value {\n    font-size: 1.1em;\n    color: var(--mj-text-primary);\n}\n\n.display-value.code {\n    font-family: 'Courier New', monospace;\n    background: var(--mj-bg-surface-sunken);\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n}\n\n.approval-date {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-left: 8px;\n}\n\n/* Code Section */\n.generation-panel {\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    margin-bottom: 24px;\n}\n\n.generation-panel h3 {\n    margin: 0 0 16px 0;\n    color: var(--mj-color-indigo-500);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.prompt-section, .comments-section {\n    margin-bottom: 16px;\n}\n\n.prompt-section label, .comments-section label {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n}\n\n.generation-controls {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding-top: 12px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.code-locked-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 4px 10px;\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    border-radius: var(--mj-radius-full);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.code-editor-section {\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    overflow: hidden;\n}\n\n.code-toolbar {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 12px 16px;\n    background: var(--mj-bg-surface-sunken);\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.code-toolbar h3 {\n    margin: 0;\n    font-size: 1.1em;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-actions {\n    display: flex;\n    gap: 8px;\n}\n\n.code-comments {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    margin-top: 16px;\n}\n\n.code-comments h4 {\n    margin: 0 0 8px 0;\n    color: var(--mj-status-info);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.code-comments p {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    line-height: var(--mj-leading-relaxed);\n}\n\n.approval-comments {\n    margin-top: 16px;\n}\n\n.approval-comments label {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-status-error);\n}\n\n/* Parameters Section */\n.params-section {\n    background: var(--mj-bg-surface-sunken);\n    border-radius: var(--mj-radius-lg);\n    padding: 20px;\n}\n\n.params-section.params-section-compact {\n    padding: 12px 20px;\n}\n\n.params-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 16px;\n}\n\n.params-header h3 {\n    margin: 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.params-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n.param-card {\n    background: var(--mj-bg-surface);\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 16px;\n    transition: all var(--mj-transition-base);\n}\n\n.param-card:hover {\n    border-color: var(--mj-brand-primary);\n    box-shadow: var(--mj-shadow-sm);\n}\n\n.param-card.required {\n    border-color: var(--mj-status-warning);\n}\n\n.param-card.clickable {\n    cursor: pointer;\n}\n\n.param-card.clickable:hover {\n    background: color-mix(in srgb, var(--mj-brand-primary) 8%, var(--mj-bg-surface));\n    border-color: var(--mj-brand-primary);\n    transform: translateY(-1px);\n}\n\n.param-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 8px;\n}\n\n.param-name {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n}\n\n.param-badges {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n\n.param-edit-btn,\n.param-delete-btn {\n    background: none;\n    border: none;\n    padding: 4px 8px;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    border-radius: var(--mj-radius-sm);\n    transition: all var(--mj-transition-base);\n}\n\n.param-edit-btn:hover {\n    background: color-mix(in srgb, var(--mj-status-info) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-info);\n}\n\n.param-delete-btn:hover {\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n.param-details {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.required-badge {\n    background: var(--mj-status-warning);\n    color: var(--mj-color-warning-800);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.array-badge {\n    background: var(--mj-color-indigo-500);\n    color: var(--mj-text-inverse);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-xs);\n    font-weight: var(--mj-font-medium);\n}\n\n.param-type {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    margin-bottom: 8px;\n}\n\n.param-description {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n    margin-bottom: 8px;\n}\n\n.param-default {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    margin-top: 8px;\n    padding-top: 8px;\n    border-top: 1px solid var(--mj-border-default);\n}\n\n.default-label {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n}\n\n.param-default code {\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: var(--mj-radius-sm);\n    font-family: 'Courier New', monospace;\n    color: var(--mj-color-error-400);\n}\n\n\n/* Result Codes Section */\n.result-codes-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n    gap: 16px;\n}\n\n/* Phone: one full-width column, so a card can never be wider than the form. */\n@media (max-width: 768px) {\n    .result-codes-grid {\n        grid-template-columns: minmax(0, 1fr);\n    }\n}\n\n.result-code-card {\n    display: flex;\n    align-items: flex-start;\n    gap: 16px;\n    padding: 16px;\n    border: 2px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    background: var(--mj-bg-surface);\n    transition: all var(--mj-transition-base);\n    position: relative;\n}\n\n.result-code-card.clickable {\n    cursor: pointer;\n}\n\n.result-code-card:hover {\n    transform: translateY(-2px);\n    box-shadow: var(--mj-shadow-md);\n}\n\n.result-code-card.success {\n    border-color: var(--mj-status-success);\n    background: color-mix(in srgb, var(--mj-status-success) 10%, var(--mj-bg-surface));\n}\n\n.result-code-card.failure {\n    border-color: var(--mj-status-error);\n    background: color-mix(in srgb, var(--mj-status-error) 10%, var(--mj-bg-surface));\n}\n\n.result-actions {\n    position: absolute;\n    top: 8px;\n    right: 8px;\n    display: flex;\n    gap: 4px;\n    opacity: 0;\n    transition: opacity var(--mj-transition-base);\n}\n\n.result-code-card:hover .result-actions {\n    opacity: 1;\n}\n\n.result-edit-btn,\n.result-delete-btn {\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-sm);\n    padding: 4px 8px;\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n    font-size: var(--mj-text-sm);\n}\n\n.result-edit-btn:hover {\n    background: var(--mj-brand-primary);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-brand-primary);\n}\n\n.result-delete-btn:hover {\n    background: var(--mj-status-error);\n    color: var(--mj-text-inverse);\n    border-color: var(--mj-status-error);\n}\n\n.result-icon {\n    font-size: 1.5em;\n    flex-shrink: 0;\n}\n\n.result-code-card.success .result-icon {\n    color: var(--mj-status-success);\n}\n\n.result-code-card.failure .result-icon {\n    color: var(--mj-status-error);\n}\n\n.result-content {\n    flex: 1;\n    min-width: 0;\n}\n\n.result-code {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n    font-family: 'Courier New', monospace;\n}\n\n.result-description {\n    color: var(--mj-text-secondary);\n    font-size: var(--mj-text-sm);\n    line-height: 1.4;\n}\n\n/* Execution Section */\n.execution-stats-row {\n    display: flex;\n    gap: 20px;\n    margin-bottom: 32px;\n    flex-wrap: wrap;\n}\n\n.stat-box {\n    flex: 1;\n    min-width: 200px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    padding: 20px;\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.stat-box i {\n    font-size: 2em;\n    color: var(--mj-text-muted);\n}\n\n.stat-info {\n    flex: 1;\n}\n\n.executions-table {\n    overflow-x: auto;\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n}\n\n.executions-table table {\n    width: 100%;\n    border-collapse: collapse;\n}\n\n.executions-table th {\n    background: var(--mj-bg-surface-sunken);\n    padding: 12px;\n    text-align: left;\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-secondary);\n    border-bottom: 2px solid var(--mj-border-default);\n}\n\n.executions-table td {\n    padding: 12px;\n    border-bottom: 1px solid var(--mj-border-default);\n    color: var(--mj-text-primary);\n}\n\n.execution-row {\n    transition: background var(--mj-transition-base);\n}\n\n.execution-row:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.execution-row.success {\n    background: color-mix(in srgb, var(--mj-status-success) 5%, transparent);\n}\n\n.running {\n    color: var(--mj-status-warning);\n    font-style: italic;\n}\n\n.result-code {\n    display: inline-block;\n    padding: 4px 8px;\n    border-radius: var(--mj-radius-sm);\n    font-size: var(--mj-text-sm);\n    font-weight: var(--mj-font-medium);\n    font-family: 'Courier New', monospace;\n}\n\n.result-code.success {\n    background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-success);\n}\n\n.result-code.failure {\n    background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    color: var(--mj-status-error);\n}\n\n/* Configuration Section */\n.config-subsection {\n    margin-bottom: 32px;\n}\n\n.config-subsection h3 {\n    margin: 0 0 16px 0;\n    color: var(--mj-text-secondary);\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n\n.library-cards {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.library-card {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.library-card:hover {\n    background: var(--mj-bg-surface-hover);\n    transform: translateX(4px);\n}\n\n.library-card i:first-child {\n    font-size: 1.5em;\n    color: var(--mj-text-muted);\n}\n\n.library-info {\n    flex: 1;\n    min-width: 0;\n}\n\n.library-name {\n    font-weight: var(--mj-font-semibold);\n    color: var(--mj-text-primary);\n    margin-bottom: 4px;\n}\n\n.library-items {\n    color: var(--mj-text-muted);\n    font-size: var(--mj-text-sm);\n    font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n    gap: 12px;\n}\n\n.related-entity-link {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 16px;\n    background: var(--mj-bg-surface-sunken);\n    border: 1px solid var(--mj-border-default);\n    border-radius: var(--mj-radius-md);\n    cursor: pointer;\n    transition: all var(--mj-transition-base);\n}\n\n.related-entity-link:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-brand-primary);\n}\n\n.related-entity-link i {\n    font-size: 1.2em;\n    color: var(--mj-text-muted);\n}\n\n.related-entity-link span:first-of-type {\n    flex: 1;\n    font-weight: var(--mj-font-medium);\n    color: var(--mj-text-secondary);\n}\n\n.entity-count {\n    color: var(--mj-brand-primary);\n    font-size: var(--mj-text-sm);\n}\n\n/* Common States */\n.loading-state {\n    text-align: center;\n    padding: 60px;\n    color: var(--mj-text-muted);\n}\n\n.loading-state i {\n    font-size: 2em;\n    margin-bottom: 12px;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n    .action-hero-header {\n        padding: 20px;\n    }\n\n    .action-identity {\n        flex-direction: column;\n        text-align: center;\n    }\n\n    .action-icon-wrapper {\n        margin: 0 auto;\n    }\n\n    .action-title-row {\n        justify-content: center;\n    }\n\n    .action-stats {\n        justify-content: center;\n    }\n\n    .params-grid {\n        grid-template-columns: 1fr;\n    }\n}\n\n/* Hero header row: title block left, actions right; on a phone the actions drop under the title. */\n.hero-header-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    gap: 20px;\n}\n\n.action-buttons {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n    align-items: flex-end;\n}\n\n@media (max-width: 768px) {\n    .hero-header-row {\n        flex-direction: column;\n    }\n\n    .action-buttons {\n        width: 100%;\n        align-items: stretch;\n    }\n\n    .action-buttons > div {\n        display: flex;\n        gap: 8px;\n    }\n\n    .action-buttons > div > button {\n        flex: 1;\n    }\n}\n\n/* Phone: sections sit on the page's 12px gutter, so the container and the inline-padded body\n   wrappers drop their side padding (they would indent every section twice). */\n@media (max-width: 768px) {\n    .configuration-sections {\n        padding: 12px 0 !important;\n        border-top: 0 !important;\n        background: transparent !important;\n    }\n\n    .phone-flush-x {\n        padding-left: 0 !important;\n        padding-right: 0 !important;\n    }\n}\n", "/* ============================================\n   PHONE HERO (design call 6A), shared by the custom forms that own a hero.\n   Under 768px the hero keeps icon, name, status and the primary action. Anything tagged\n   .phone-hero-detail hides while the hero is compact and comes back when the summary line is\n   tapped. Edit mode is untouched: the host only gets .hero-compact / .hero-view in view mode.\n   Host:    .phone-hero [class.hero-view]=\"!EditMode\" [class.hero-compact]=\"!EditMode && !HeroDetailsOpen\"\n   Tags:    .phone-hero-detail  hidden while compact\n            .phone-hero-hide    hidden in view mode (said elsewhere on the phone hero)\n            .phone-hero-only    shown only on phones\n            .phone-hero-top     a title + action row that stacks\n            .phone-hero-actions / .phone-hero-run   the primary action, full width at 44px\n            .phone-hero-stats   a metric row that reflows to a 2-up grid when the hero is expanded\n            .phone-hero-status  a status chip in the identity row (with .phone-hero-only)\n   ============================================ */\n.phone-hero-summary,\n.phone-hero-only {\n    display: none;\n}\n\n@media (max-width: 768px) {\n    .phone-hero {\n        padding: 12px !important;\n    }\n\n    /* !important: several heroes carry inline display/padding styles on these rows */\n    .phone-hero.hero-compact .phone-hero-detail,\n    .phone-hero.hero-view .phone-hero-hide {\n        display: none !important;\n    }\n\n    .phone-hero-only {\n        display: inline-flex;\n    }\n\n    /* Lower specificity than the compact rule above, so a compact hero still hides it */\n    .phone-hero .phone-hero-stats {\n        display: grid !important;\n        grid-template-columns: repeat(2, minmax(0, 1fr));\n        gap: 8px;\n    }\n\n    .phone-hero-status {\n        align-items: center;\n        gap: 4px;\n        margin-left: 8px;\n        padding: 2px 8px;\n        border-radius: var(--mj-radius-full, 999px);\n        color: var(--mj-text-secondary);\n        background: var(--mj-bg-surface-sunken);\n        font-size: var(--mj-text-xs);\n        font-weight: var(--mj-font-semibold);\n        vertical-align: middle;\n        white-space: nowrap;\n    }\n\n    /* data-status comes from RunStatusKind(); the -text / -bg pairs keep contrast in both themes */\n    .phone-hero-status[data-status=\"running\"] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n    .phone-hero-status[data-status=\"success\"] { color: var(--mj-status-success-text); background: var(--mj-status-success-bg); }\n    .phone-hero-status[data-status=\"error\"]   { color: var(--mj-status-error-text);   background: var(--mj-status-error-bg); }\n    .phone-hero-status[data-status=\"info\"]    { color: var(--mj-status-info-text);    background: var(--mj-status-info-bg); }\n\n    .phone-hero-top {\n        flex-direction: column;\n        align-items: stretch;\n        gap: 10px;\n    }\n\n    .phone-hero-actions {\n        width: 100%;\n    }\n\n    .phone-hero .phone-hero-run {\n        width: 100%;\n        min-height: 44px;\n        justify-content: center;\n    }\n\n    /* Inherits the hero's text colour, so it reads on light heroes and on the brand-blue\n       Queries hero alike; a muted token would be grey on blue. */\n    .phone-hero-summary {\n        display: flex;\n        align-items: center;\n        gap: 8px;\n        width: 100%;\n        min-height: 44px;\n        margin-top: 8px;\n        padding: 0 4px;\n        border: 0;\n        border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent);\n        background: transparent;\n        color: inherit;\n        font: inherit;\n        font-size: var(--mj-text-sm);\n        text-align: left;\n        cursor: pointer;\n        opacity: 0.85;\n    }\n\n    .phone-hero-summary:focus-visible {\n        outline: none;\n        box-shadow: var(--mj-focus-ring);\n    }\n\n    .phone-hero-summary-text {\n        flex: 1 1 auto;\n        min-width: 0;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        white-space: nowrap;\n    }\n\n    .phone-hero-summary > i {\n        flex-shrink: 0;\n        transition: transform 0.15s ease;\n    }\n\n    .phone-hero-summary[aria-expanded=\"true\"] > i {\n        transform: rotate(180deg);\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .phone-hero-summary > i {\n        transition: none;\n    }\n}\n"] }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJActionFormComponentExtended, { className: "MJActionFormComponentExtended", filePath: "src/lib/custom/Actions/action-form.component.ts", lineNumber: 18 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJActionFormComponentExtended, { className: "MJActionFormComponentExtended", filePath: "src/lib/custom/Actions/action-form.component.ts", lineNumber: 20 }); })();
 //# sourceMappingURL=action-form.component.js.map