@memberjunction/ng-core-entity-forms 5.43.0 → 5.44.0

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

@@ -121,15 +121,9 @@ function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_39
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 62);
-    i0.ɵɵelement(1, "i", 64);
-    i0.ɵɵelementStart(2, "p");
-    i0.ɵɵtext(3, "No parameters match the current filter.");
+    i0.ɵɵelementStart(0, "mj-empty-state", 64);
+    i0.ɵɵlistener("Action", function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_0_Template_mj_empty_state_Action_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.clearFilters()); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "button", 65);
-    i0.ɵɵlistener("click", function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_0_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r0.clearFilters()); });
-    i0.ɵɵtext(5, " Clear filters ");
-    i0.ɵɵelementEnd()();
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "i", 37);
@@ -142,7 +136,7 @@ function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 77);
+    i0.ɵɵelementStart(0, "button", 76);
     i0.ɵɵlistener("click", function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_14_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const p_r10 = i0.ɵɵnextContext().$implicit; const ctx_r0 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r0.toggleExpanded(p_r10)); });
     i0.ɵɵelement(1, "i", 13);
     i0.ɵɵelementEnd();
@@ -155,7 +149,7 @@ function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
     const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 76)(1, "mj-code-editor", 78);
+    i0.ɵɵelementStart(0, "div", 75)(1, "mj-code-editor", 77);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_19_Template_mj_code_editor_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r11); const p_r10 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(p_r10.FormattedValue, $event) || (p_r10.FormattedValue = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -166,27 +160,27 @@ function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "li", 66)(1, "div", 67)(2, "span", 68);
+    i0.ɵɵelementStart(0, "li", 65)(1, "div", 66)(2, "span", 67);
     i0.ɵɵconditionalCreate(3, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_3_Template, 1, 0, "i", 37)(4, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_4_Template, 1, 0, "i", 41)(5, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_5_Template, 1, 0, "i", 39);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 69)(8, "span", 70);
+    i0.ɵɵelementStart(7, "div", 68)(8, "span", 69);
     i0.ɵɵtext(9);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "span", 71);
+    i0.ɵɵelementStart(10, "span", 70);
     i0.ɵɵelement(11, "i", 13);
     i0.ɵɵtext(12);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(13, "div", 72);
-    i0.ɵɵconditionalCreate(14, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_14_Template, 2, 4, "button", 73);
-    i0.ɵɵelementStart(15, "button", 74);
+    i0.ɵɵelementStart(13, "div", 71);
+    i0.ɵɵconditionalCreate(14, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_14_Template, 2, 4, "button", 72);
+    i0.ɵɵelementStart(15, "button", 73);
     i0.ɵɵlistener("click", function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Template_button_click_15_listener() { const p_r10 = i0.ɵɵrestoreView(_r8).$implicit; const ctx_r0 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r0.copyParamValue(p_r10)); });
     i0.ɵɵelement(16, "i", 60);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(17, "div", 75);
+    i0.ɵɵelementStart(17, "div", 74);
     i0.ɵɵtext(18);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(19, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_19_Template, 2, 5, "div", 76);
+    i0.ɵɵconditionalCreate(19, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Conditional_19_Template, 2, 5, "div", 75);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const p_r10 = ctx.$implicit;
@@ -217,7 +211,7 @@ function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "ul", 63);
-    i0.ɵɵrepeaterCreate(1, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Template, 20, 12, "li", 66, i0.ɵɵcomponentInstance().trackParam, true);
+    i0.ɵɵrepeaterCreate(1, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_For_2_Template, 20, 12, "li", 65, i0.ɵɵcomponentInstance().trackParam, true);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(3);
@@ -225,7 +219,7 @@ function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40
     i0.ɵɵrepeater(ctx_r0.filteredParameters);
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_0_Template, 6, 0, "div", 62)(1, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_Template, 3, 0, "ul", 63);
+    i0.ɵɵconditionalCreate(0, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_0_Template, 1, 0, "mj-empty-state", 62)(1, MJActionExecutionLogFormComponentExtended_Conditional_68_Conditional_40_Conditional_1_Template, 3, 0, "ul", 63);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
     i0.ɵɵconditional(ctx_r0.filteredParameters.length === 0 ? 0 : 1);
@@ -325,21 +319,21 @@ function MJActionExecutionLogFormComponentExtended_Conditional_68_Template(rf, c
     i0.ɵɵconditional(ctx_r0.showRawJson ? 39 : 40);
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_69_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 81);
+    i0.ɵɵelement(0, "i", 80);
     i0.ɵɵtext(1, " Output Message ");
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_69_Template(rf, ctx) { if (rf & 1) {
     const _r12 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "mj-accordion-panel", 22);
     i0.ɵɵtemplate(1, MJActionExecutionLogFormComponentExtended_Conditional_69_ng_template_1_Template, 2, 0, "ng-template", 23);
-    i0.ɵɵelementStart(2, "div", 79)(3, "div", 57)(4, "span", 58);
+    i0.ɵɵelementStart(2, "div", 78)(3, "div", 57)(4, "span", 58);
     i0.ɵɵtext(5, "JSON");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(6, "button", 59);
     i0.ɵɵlistener("click", function MJActionExecutionLogFormComponentExtended_Conditional_69_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r12); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.copyToClipboard(ctx_r0.formattedMessage)); });
     i0.ɵɵelement(7, "i", 60);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "mj-code-editor", 80);
+    i0.ɵɵelementStart(8, "mj-code-editor", 79);
     i0.ɵɵtwoWayListener("ngModelChange", function MJActionExecutionLogFormComponentExtended_Conditional_69_Template_mj_code_editor_ngModelChange_8_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.formattedMessage, $event) || (ctx_r0.formattedMessage = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -350,17 +344,14 @@ function MJActionExecutionLogFormComponentExtended_Conditional_69_Template(rf, c
     i0.ɵɵproperty("readonly", true)("language", "json")("lineWrapping", true);
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_70_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 84);
+    i0.ɵɵelement(0, "i", 82);
     i0.ɵɵtext(1, " Execution Data ");
 } }
 function MJActionExecutionLogFormComponentExtended_Conditional_70_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "mj-accordion-panel", 22);
     i0.ɵɵtemplate(1, MJActionExecutionLogFormComponentExtended_Conditional_70_ng_template_1_Template, 2, 0, "ng-template", 23);
-    i0.ɵɵelementStart(2, "div", 82);
-    i0.ɵɵelement(3, "i", 83);
-    i0.ɵɵelementStart(4, "p");
-    i0.ɵɵtext(5, "No execution data recorded");
-    i0.ɵɵelementEnd()()();
+    i0.ɵɵelement(2, "mj-empty-state", 81);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
     i0.ɵɵproperty("Expanded", true);
 } }
@@ -710,7 +701,7 @@ let MJActionExecutionLogFormComponentExtended = class MJActionExecutionLogFormCo
         }
     }
     static { this.ɵfac = /*@__PURE__*/ (() => { let ɵMJActionExecutionLogFormComponentExtended_BaseFactory; return function MJActionExecutionLogFormComponentExtended_Factory(__ngFactoryType__) { return (ɵMJActionExecutionLogFormComponentExtended_BaseFactory || (ɵMJActionExecutionLogFormComponentExtended_BaseFactory = i0.ɵɵgetInheritedFactory(MJActionExecutionLogFormComponentExtended)))(__ngFactoryType__ || MJActionExecutionLogFormComponentExtended); }; })(); }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJActionExecutionLogFormComponentExtended, selectors: [["mj-action-execution-log-form"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 71, vars: 28, consts: [[1, "record-form-container", "action-execution-log-form", 2, "height", "100%", "display", "flex", "flex-direction", "column"], [1, "record-form", 2, "display", "flex", "flex-direction", "column", "height", "100%", "overflow", "hidden"], [1, "header"], [1, "header-content"], [1, "header-left"], [1, "icon-wrapper"], [1, "fas", "fa-terminal"], [1, "header-info"], [1, "meta-info"], [1, "action-name"], [1, "log-id"], [1, "header-right"], [1, "status-badge"], [1, "fas", 3, "ngClass"], [1, "execution-time"], [1, "fas", "fa-clock"], [1, "header-stats"], [1, "stat"], [1, "label"], [1, "value"], [1, "content-area"], [1, "accordion-container"], [3, "Expanded"], ["mjAccordionTitle", ""], [1, "details-grid"], [1, "detail-item"], [1, "monospace"], [1, "detail-value"], [1, "btn-link", 3, "click"], [1, "fas", "fa-external-link-alt"], [1, "fas", "fa-info-circle"], [1, "params-panel"], [1, "params-toolbar"], [1, "filter-chips"], ["type", "button", 1, "chip", 3, "click"], [1, "chip-count"], ["type", "button", 1, "chip", "chip-input", 3, "click", "disabled"], [1, "fas", "fa-sign-in-alt"], ["type", "button", 1, "chip", "chip-both", 3, "click", "disabled"], [1, "fas", "fa-exchange-alt"], ["type", "button", 1, "chip", "chip-output", 3, "click", "disabled"], [1, "fas", "fa-sign-out-alt"], [1, "toolbar-right"], [1, "search-wrapper"], [1, "fas", "fa-search", "search-icon"], ["type", "text", "placeholder", "Search name or value\u2026", "name", "paramSearch", 1, "mj-input", "params-search", 3, "ngModelChange", "ngModel"], ["type", "button", "title", "Clear search", 1, "search-clear"], ["role", "group", "aria-label", "Sort parameters", 1, "sort-group"], ["type", "button", "title", "Sort by type", 1, "sort-btn", 3, "click"], ["type", "button", "title", "Sort by name", 1, "sort-btn", 3, "click"], ["type", "button", "title", "Toggle raw JSON view", 1, "raw-toggle", 3, "click"], [1, "fas", "fa-code"], [1, "json-viewer", "raw-json-viewer"], [1, "fas", "fa-sliders-h"], [1, "param-count-pill"], ["type", "button", "title", "Clear search", 1, "search-clear", 3, "click"], [1, "fas", "fa-times"], [1, "json-toolbar"], [1, "json-label"], ["title", "Copy JSON", 1, "btn-icon", 3, "click"], [1, "fas", "fa-copy"], ["name", "formattedParamsRaw", 2, "height", "360px", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"], [1, "empty-filter"], [1, "params-list"], [1, "fas", "fa-filter-circle-xmark"], ["type", "button", 1, "btn-link", 3, "click"], [1, "param-row"], [1, "param-header"], [1, "type-badge"], [1, "param-name-wrap"], [1, "param-name"], [1, "value-kind-chip"], [1, "param-actions"], ["type", "button", 1, "btn-icon", "param-expand", 3, "is-expanded", "title"], ["type", "button", "title", "Copy value", 1, "btn-icon", 3, "click"], [1, "param-preview"], [1, "param-expanded"], ["type", "button", 1, "btn-icon", "param-expand", 3, "click", "title"], [2, "height", "240px", "width", "100%", 3, "ngModelChange", "ngModel", "name", "readonly", "language", "lineWrapping"], [1, "json-viewer"], ["name", "formattedMessage", 2, "height", "300px", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"], [1, "fas", "fa-comment-alt"], [1, "empty-state"], [1, "fas", "fa-inbox"], [1, "fas", "fa-database"]], template: function MJActionExecutionLogFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJActionExecutionLogFormComponentExtended, selectors: [["mj-action-execution-log-form"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 71, vars: 28, consts: [[1, "record-form-container", "action-execution-log-form", 2, "height", "100%", "display", "flex", "flex-direction", "column"], [1, "record-form", 2, "display", "flex", "flex-direction", "column", "height", "100%", "overflow", "hidden"], [1, "header"], [1, "header-content"], [1, "header-left"], [1, "icon-wrapper"], [1, "fas", "fa-terminal"], [1, "header-info"], [1, "meta-info"], [1, "action-name"], [1, "log-id"], [1, "header-right"], [1, "status-badge"], [1, "fas", 3, "ngClass"], [1, "execution-time"], [1, "fas", "fa-clock"], [1, "header-stats"], [1, "stat"], [1, "label"], [1, "value"], [1, "content-area"], [1, "accordion-container"], [3, "Expanded"], ["mjAccordionTitle", ""], [1, "details-grid"], [1, "detail-item"], [1, "monospace"], [1, "detail-value"], [1, "btn-link", 3, "click"], [1, "fas", "fa-external-link-alt"], [1, "fas", "fa-info-circle"], [1, "params-panel"], [1, "params-toolbar"], [1, "filter-chips"], ["type", "button", 1, "chip", 3, "click"], [1, "chip-count"], ["type", "button", 1, "chip", "chip-input", 3, "click", "disabled"], [1, "fas", "fa-sign-in-alt"], ["type", "button", 1, "chip", "chip-both", 3, "click", "disabled"], [1, "fas", "fa-exchange-alt"], ["type", "button", 1, "chip", "chip-output", 3, "click", "disabled"], [1, "fas", "fa-sign-out-alt"], [1, "toolbar-right"], [1, "search-wrapper"], [1, "fas", "fa-search", "search-icon"], ["type", "text", "placeholder", "Search name or value\u2026", "name", "paramSearch", 1, "mj-input", "params-search", 3, "ngModelChange", "ngModel"], ["type", "button", "title", "Clear search", 1, "search-clear"], ["role", "group", "aria-label", "Sort parameters", 1, "sort-group"], ["type", "button", "title", "Sort by type", 1, "sort-btn", 3, "click"], ["type", "button", "title", "Sort by name", 1, "sort-btn", 3, "click"], ["type", "button", "title", "Toggle raw JSON view", 1, "raw-toggle", 3, "click"], [1, "fas", "fa-code"], [1, "json-viewer", "raw-json-viewer"], [1, "fas", "fa-sliders-h"], [1, "mj-accordion-badge", "mj-accordion-badge--right"], ["type", "button", "title", "Clear search", 1, "search-clear", 3, "click"], [1, "fas", "fa-times"], [1, "json-toolbar"], [1, "json-label"], ["title", "Copy JSON", 1, "btn-icon", 3, "click"], [1, "fas", "fa-copy"], ["name", "formattedParamsRaw", 2, "height", "360px", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"], ["Variant", "no-results", "Size", "compact", "Icon", "fa-solid fa-filter-circle-xmark", "Title", "No parameters match the current filter.", "ActionText", "Clear filters", "ActionIcon", "fa-solid fa-rotate-left", "ActionVariant", "flat"], [1, "params-list"], ["Variant", "no-results", "Size", "compact", "Icon", "fa-solid fa-filter-circle-xmark", "Title", "No parameters match the current filter.", "ActionText", "Clear filters", "ActionIcon", "fa-solid fa-rotate-left", "ActionVariant", "flat", 3, "Action"], [1, "param-row"], [1, "param-header"], [1, "type-badge"], [1, "param-name-wrap"], [1, "param-name"], [1, "value-kind-chip"], [1, "param-actions"], ["type", "button", 1, "btn-icon", "param-expand", 3, "is-expanded", "title"], ["type", "button", "title", "Copy value", 1, "btn-icon", 3, "click"], [1, "param-preview"], [1, "param-expanded"], ["type", "button", 1, "btn-icon", "param-expand", 3, "click", "title"], [2, "height", "240px", "width", "100%", 3, "ngModelChange", "ngModel", "name", "readonly", "language", "lineWrapping"], [1, "json-viewer"], ["name", "formattedMessage", 2, "height", "300px", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"], [1, "fas", "fa-comment-alt"], ["Size", "compact", "Icon", "fa-solid fa-inbox", "Title", "No execution data recorded"], [1, "fas", "fa-database"]], template: function MJActionExecutionLogFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "div", 3)(4, "div", 4)(5, "div", 5);
             i0.ɵɵelement(6, "i", 6);
             i0.ɵɵelementEnd();
@@ -783,7 +774,7 @@ let MJActionExecutionLogFormComponentExtended = class MJActionExecutionLogFormCo
             i0.ɵɵelementEnd()()()();
             i0.ɵɵconditionalCreate(68, MJActionExecutionLogFormComponentExtended_Conditional_68_Template, 41, 27, "mj-accordion-panel", 22);
             i0.ɵɵconditionalCreate(69, MJActionExecutionLogFormComponentExtended_Conditional_69_Template, 9, 5, "mj-accordion-panel", 22);
-            i0.ɵɵconditionalCreate(70, MJActionExecutionLogFormComponentExtended_Conditional_70_Template, 6, 1, "mj-accordion-panel", 22);
+            i0.ɵɵconditionalCreate(70, MJActionExecutionLogFormComponentExtended_Conditional_70_Template, 3, 1, "mj-accordion-panel", 22);
             i0.ɵɵelementEnd()()()();
         } if (rf & 2) {
             i0.ɵɵadvance(11);
@@ -831,7 +822,7 @@ let MJActionExecutionLogFormComponentExtended = class MJActionExecutionLogFormCo
             i0.ɵɵconditional(ctx.record.Message ? 69 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(!ctx.record.Params && !ctx.record.Message && !ctx.hasAnyParameters ? 70 : -1);
-        } }, dependencies: [i1.NgClass, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MJAccordionPanelComponent, i3.MJAccordionTitleDirective, i4.CodeEditorComponent, i1.DatePipe], styles: ["\n\n[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n}\n\n.action-execution-log-form[_ngcontent-%COMP%] {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  background: var(--mj-bg-page);\n  color: var(--mj-text-primary);\n}\n\n\n\n.header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 20px;\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.icon-wrapper[_ngcontent-%COMP%] {\n  width: 48px;\n  height: 48px;\n  background: var(--mj-status-info);\n  border-radius: var(--mj-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n  font-size: var(--mj-text-xl);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-2xl);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.meta-info[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n  margin-top: 4px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.action-name[_ngcontent-%COMP%] {\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.log-id[_ngcontent-%COMP%] {\n  font-family: monospace;\n  font-size: var(--mj-text-xs);\n  opacity: 0.7;\n}\n\n.header-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n  padding: 6px 16px;\n  border-radius: var(--mj-radius-full);\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--mj-text-inverse);\n}\n\n.execution-time[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.header-stats[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 24px;\n  padding-top: 12px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.stat[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.stat[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.stat[_ngcontent-%COMP%]   .value[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.record-form[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 0;\n}\n\n\n\n.content-area[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n\n\n.details-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n  gap: 20px;\n  padding: 20px;\n}\n\n.detail-item[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.detail-item[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: var(--mj-font-semibold);\n}\n\n.detail-value[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: var(--mj-text-primary);\n}\n\n.btn-link[_ngcontent-%COMP%] {\n  background: none;\n  border: none;\n  color: var(--mj-brand-primary);\n  cursor: pointer;\n  font-size: var(--mj-text-sm);\n  padding: 4px;\n}\n\n.btn-link[_ngcontent-%COMP%]:hover {\n  color: var(--mj-brand-primary-hover);\n}\n\n.loading[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  font-size: var(--mj-text-xs);\n}\n\n\n\n.json-viewer[_ngcontent-%COMP%] {\n  padding: 20px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: var(--mj-radius-md);\n  margin-bottom: 20px;\n}\n\n.json-toolbar[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 12px;\n}\n\n.json-label[_ngcontent-%COMP%] {\n  background: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n  padding: 4px 12px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.btn-icon[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 32px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-sm);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n  color: var(--mj-text-muted);\n}\n\n.btn-icon[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-secondary);\n}\n\n\n\n.status-badge[data-status=\"success\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"ok\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"completed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"200\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failure\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"pending\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"running\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[_ngcontent-%COMP%] {\n  background-color: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n  text-align: center;\n  padding: 40px;\n  color: var(--mj-text-muted);\n}\n\n.empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-5xl);\n  opacity: 0.3;\n  margin-bottom: 16px;\n}\n\n.monospace[_ngcontent-%COMP%] {\n  font-family: 'Courier New', Courier, monospace;\n  font-size: var(--mj-text-xs);\n}\n\n\n\n\n\n\n.param-count-pill[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 22px;\n  height: 22px;\n  padding: 0 7px;\n  margin-left: 8px;\n  border-radius: var(--mj-radius-full);\n  background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  letter-spacing: 0.3px;\n}\n\n.params-panel[_ngcontent-%COMP%] {\n  padding: 18px 20px 22px;\n}\n\n\n\n.params-toolbar[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 14px;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 14px;\n  margin-bottom: 14px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n.chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 13px;\n  border-radius: var(--mj-radius-full);\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.chip[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-primary);\n}\n.chip[_ngcontent-%COMP%]:disabled {\n  opacity: 0.45;\n  cursor: not-allowed;\n}\n.chip[_ngcontent-%COMP%]   .chip-count[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 20px;\n  height: 18px;\n  padding: 0 6px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n}\n.chip[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 11px;\n}\n\n.chip.active[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active[_ngcontent-%COMP%]   .chip-count[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n  color: var(--mj-text-inverse);\n}\n\n\n\n.chip.chip-input.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-info);\n  border-color: var(--mj-status-info);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n  border-color: var(--mj-status-success);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.search-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.search-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  pointer-events: none;\n}\n.params-search[_ngcontent-%COMP%] {\n  min-width: 220px;\n  padding: 7px 30px 7px 30px;\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n}\n.search-clear[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 6px;\n  width: 22px;\n  height: 22px;\n  border: none;\n  background: transparent;\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.search-clear[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n  background: var(--mj-bg-surface-hover);\n}\n\n.sort-group[_ngcontent-%COMP%] {\n  display: inline-flex;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface);\n}\n.sort-btn[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  background: transparent;\n  border: none;\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: background var(--mj-transition-base);\n}\n.sort-btn[_ngcontent-%COMP%]    + .sort-btn[_ngcontent-%COMP%] {\n  border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n.sort-btn.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n.raw-toggle[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.raw-toggle[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n\n\n.params-list[_ngcontent-%COMP%] {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.param-row[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-left: 3px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 12px 14px;\n  transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row[_ngcontent-%COMP%]:hover {\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n  box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"][_ngcontent-%COMP%]  { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"][_ngcontent-%COMP%] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"][_ngcontent-%COMP%]   { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 3px 10px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"][_ngcontent-%COMP%] {\n  background: var(--mj-status-info-bg);\n  color: var(--mj-status-info-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"][_ngcontent-%COMP%] {\n  background: var(--mj-status-success-bg);\n  color: var(--mj-status-success-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"][_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  min-width: 0;\n}\n.param-name[_ngcontent-%COMP%] {\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.value-kind-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 2px 8px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 10px;\n  font-weight: var(--mj-font-medium);\n  text-transform: lowercase;\n  letter-spacing: 0.3px;\n  flex-shrink: 0;\n}\n.value-kind-chip[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"][_ngcontent-%COMP%]  { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"][_ngcontent-%COMP%] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"][_ngcontent-%COMP%]   { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"][_ngcontent-%COMP%]  { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"][_ngcontent-%COMP%], \n.value-kind-chip[data-kind=\"undefined\"][_ngcontent-%COMP%] {\n  color: var(--mj-text-disabled);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 4px;\n  flex-shrink: 0;\n}\n.param-actions[_ngcontent-%COMP%]   .btn-icon[_ngcontent-%COMP%] {\n  width: 28px;\n  height: 28px;\n}\n.param-expand.is-expanded[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview[_ngcontent-%COMP%] {\n  margin-top: 8px;\n  padding-left: calc(64px + 12px); \n\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  word-break: break-word;\n  line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"][_ngcontent-%COMP%]   { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"][_ngcontent-%COMP%]   { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"][_ngcontent-%COMP%]  { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"undefined\"][_ngcontent-%COMP%] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"object\"][_ngcontent-%COMP%]   { color: var(--mj-brand-primary); }\n\n.param-expanded[_ngcontent-%COMP%] {\n  margin-top: 10px;\n  margin-left: calc(64px + 12px);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer[_ngcontent-%COMP%] { margin-top: 4px; }\n\n.empty-filter[_ngcontent-%COMP%] {\n  text-align: center;\n  padding: 36px 20px;\n  color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-sunken);\n  border: 1px dashed var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n}\n.empty-filter[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-3xl);\n  margin-bottom: 12px;\n  opacity: 0.5;\n}\n.empty-filter[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  margin: 0 0 12px;\n  font-size: var(--mj-text-sm);\n}\n\n\n\n@media (max-width: 768px) {\n  .header-content[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-stats[_ngcontent-%COMP%] {\n    flex-wrap: wrap;\n  }\n\n  .details-grid[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .params-toolbar[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .toolbar-right[_ngcontent-%COMP%] {\n    justify-content: space-between;\n  }\n  .params-search[_ngcontent-%COMP%] { min-width: 0; width: 100%; }\n  .search-wrapper[_ngcontent-%COMP%] { flex: 1; }\n\n  .param-preview[_ngcontent-%COMP%], \n   .param-expanded[_ngcontent-%COMP%] {\n    padding-left: 0;\n    margin-left: 0;\n  }\n}"] }); }
+        } }, dependencies: [i1.NgClass, i2.DefaultValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MJEmptyStateComponent, i3.MJAccordionPanelComponent, i3.MJAccordionTitleDirective, i4.CodeEditorComponent, i1.DatePipe], styles: ["\n\n[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n}\n\n.action-execution-log-form[_ngcontent-%COMP%] {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  background: var(--mj-bg-page);\n  color: var(--mj-text-primary);\n}\n\n\n\n.header[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 20px;\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.icon-wrapper[_ngcontent-%COMP%] {\n  width: 48px;\n  height: 48px;\n  background: var(--mj-status-info);\n  border-radius: var(--mj-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n  font-size: var(--mj-text-xl);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-2xl);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.meta-info[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n  margin-top: 4px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.action-name[_ngcontent-%COMP%] {\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.log-id[_ngcontent-%COMP%] {\n  font-family: monospace;\n  font-size: var(--mj-text-xs);\n  opacity: 0.7;\n}\n\n.header-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n  padding: 6px 16px;\n  border-radius: var(--mj-radius-full);\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--mj-text-inverse);\n}\n\n.execution-time[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.header-stats[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 24px;\n  padding-top: 12px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.stat[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.stat[_ngcontent-%COMP%]   .label[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.stat[_ngcontent-%COMP%]   .value[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.record-form[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 0;\n}\n\n\n\n.content-area[_ngcontent-%COMP%] {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n\n\n.details-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n  gap: 20px;\n  padding: 20px;\n}\n\n.detail-item[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.detail-item[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: var(--mj-font-semibold);\n}\n\n.detail-value[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: var(--mj-text-primary);\n}\n\n.btn-link[_ngcontent-%COMP%] {\n  background: none;\n  border: none;\n  color: var(--mj-brand-primary);\n  cursor: pointer;\n  font-size: var(--mj-text-sm);\n  padding: 4px;\n}\n\n.btn-link[_ngcontent-%COMP%]:hover {\n  color: var(--mj-brand-primary-hover);\n}\n\n.loading[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n  font-size: var(--mj-text-xs);\n}\n\n\n\n.json-viewer[_ngcontent-%COMP%] {\n  padding: 20px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: var(--mj-radius-md);\n  margin-bottom: 20px;\n}\n\n.json-toolbar[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 12px;\n}\n\n.json-label[_ngcontent-%COMP%] {\n  background: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n  padding: 4px 12px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.btn-icon[_ngcontent-%COMP%] {\n  width: 32px;\n  height: 32px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-sm);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n  color: var(--mj-text-muted);\n}\n\n.btn-icon[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-secondary);\n}\n\n\n\n.status-badge[data-status=\"success\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"ok\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"completed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"200\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failed\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"failure\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"pending\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"][_ngcontent-%COMP%], \n.status-badge[data-status=\"running\"][_ngcontent-%COMP%] {\n  background-color: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[_ngcontent-%COMP%] {\n  background-color: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n}\n\n.monospace[_ngcontent-%COMP%] {\n  font-family: 'Courier New', Courier, monospace;\n  font-size: var(--mj-text-xs);\n}\n\n\n\n\n\n\n.params-panel[_ngcontent-%COMP%] {\n  padding: 18px 20px 22px;\n}\n\n\n\n.params-toolbar[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 14px;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 14px;\n  margin-bottom: 14px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n.chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 13px;\n  border-radius: var(--mj-radius-full);\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.chip[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-primary);\n}\n.chip[_ngcontent-%COMP%]:disabled {\n  opacity: 0.45;\n  cursor: not-allowed;\n}\n.chip[_ngcontent-%COMP%]   .chip-count[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 20px;\n  height: 18px;\n  padding: 0 6px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n}\n.chip[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 11px;\n}\n\n.chip.active[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active[_ngcontent-%COMP%]   .chip-count[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n  color: var(--mj-text-inverse);\n}\n\n\n\n.chip.chip-input.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-info);\n  border-color: var(--mj-status-info);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n  border-color: var(--mj-status-success);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.search-wrapper[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.search-icon[_ngcontent-%COMP%] {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  pointer-events: none;\n}\n.params-search[_ngcontent-%COMP%] {\n  min-width: 220px;\n  padding: 7px 30px 7px 30px;\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n}\n.search-clear[_ngcontent-%COMP%] {\n  position: absolute;\n  right: 6px;\n  width: 22px;\n  height: 22px;\n  border: none;\n  background: transparent;\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.search-clear[_ngcontent-%COMP%]:hover {\n  color: var(--mj-text-primary);\n  background: var(--mj-bg-surface-hover);\n}\n\n.sort-group[_ngcontent-%COMP%] {\n  display: inline-flex;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface);\n}\n.sort-btn[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  background: transparent;\n  border: none;\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: background var(--mj-transition-base);\n}\n.sort-btn[_ngcontent-%COMP%]    + .sort-btn[_ngcontent-%COMP%] {\n  border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n.sort-btn.active[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n\n.raw-toggle[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.raw-toggle[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n\n\n.params-list[_ngcontent-%COMP%] {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.param-row[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-left: 3px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 12px 14px;\n  transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row[_ngcontent-%COMP%]:hover {\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n  box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"][_ngcontent-%COMP%]  { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"][_ngcontent-%COMP%] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"][_ngcontent-%COMP%]   { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 3px 10px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"][_ngcontent-%COMP%] {\n  background: var(--mj-status-info-bg);\n  color: var(--mj-status-info-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"][_ngcontent-%COMP%] {\n  background: var(--mj-status-success-bg);\n  color: var(--mj-status-success-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"][_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  min-width: 0;\n}\n.param-name[_ngcontent-%COMP%] {\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.value-kind-chip[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 2px 8px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 10px;\n  font-weight: var(--mj-font-medium);\n  text-transform: lowercase;\n  letter-spacing: 0.3px;\n  flex-shrink: 0;\n}\n.value-kind-chip[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"][_ngcontent-%COMP%]  { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"][_ngcontent-%COMP%] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"][_ngcontent-%COMP%]   { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"][_ngcontent-%COMP%]  { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"][_ngcontent-%COMP%], \n.value-kind-chip[data-kind=\"undefined\"][_ngcontent-%COMP%] {\n  color: var(--mj-text-disabled);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 4px;\n  flex-shrink: 0;\n}\n.param-actions[_ngcontent-%COMP%]   .btn-icon[_ngcontent-%COMP%] {\n  width: 28px;\n  height: 28px;\n}\n.param-expand.is-expanded[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview[_ngcontent-%COMP%] {\n  margin-top: 8px;\n  padding-left: calc(64px + 12px); \n\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  word-break: break-word;\n  line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"][_ngcontent-%COMP%]   { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"][_ngcontent-%COMP%]   { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"][_ngcontent-%COMP%]  { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"undefined\"][_ngcontent-%COMP%] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"][_ngcontent-%COMP%], \n.param-preview[data-kind=\"object\"][_ngcontent-%COMP%]   { color: var(--mj-brand-primary); }\n\n.param-expanded[_ngcontent-%COMP%] {\n  margin-top: 10px;\n  margin-left: calc(64px + 12px);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer[_ngcontent-%COMP%] { margin-top: 4px; }\n\n\n\n@media (max-width: 768px) {\n  .header-content[_ngcontent-%COMP%] {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-stats[_ngcontent-%COMP%] {\n    flex-wrap: wrap;\n  }\n\n  .details-grid[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n\n  .params-toolbar[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .toolbar-right[_ngcontent-%COMP%] {\n    justify-content: space-between;\n  }\n  .params-search[_ngcontent-%COMP%] { min-width: 0; width: 100%; }\n  .search-wrapper[_ngcontent-%COMP%] { flex: 1; }\n\n  .param-preview[_ngcontent-%COMP%], \n   .param-expanded[_ngcontent-%COMP%] {\n    padding-left: 0;\n    margin-left: 0;\n  }\n}"] }); }
 };
 MJActionExecutionLogFormComponentExtended = __decorate([
     RegisterClass(BaseFormComponent, 'MJ: Action Execution Logs')
@@ -839,7 +830,7 @@ MJActionExecutionLogFormComponentExtended = __decorate([
 export { MJActionExecutionLogFormComponentExtended };
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJActionExecutionLogFormComponentExtended, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-action-execution-log-form', template: "<div class=\"record-form-container action-execution-log-form\" style=\"height: 100%; display: flex; flex-direction: column;\">\n    <div class=\"record-form\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n        <!-- Header -->\n        <div class=\"header\">\n            <div class=\"header-content\">\n                <div class=\"header-left\">\n                    <div class=\"icon-wrapper\">\n                        <i class=\"fas fa-terminal\"></i>\n                    </div>\n                    <div class=\"header-info\">\n                        <h2>Action Execution Log</h2>\n                        <div class=\"meta-info\">\n                            @if (action) {\n                                <span class=\"action-name\">{{ action.Name }}</span>\n                            }\n                            <span class=\"log-id\">{{ record.ID }}</span>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"header-right\">\n                    <div class=\"status-badge\" [attr.data-status]=\"record.ResultCode?.toLowerCase()\">\n                        <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\"></i>\n                        {{ record.ResultCode || 'UNKNOWN' }}\n                    </div>\n                    <div class=\"execution-time\">\n                        <i class=\"fas fa-clock\"></i>\n                        {{ formatDuration(getExecutionDuration()) }}\n                    </div>\n                </div>\n            </div>\n            <div class=\"header-stats\">\n                <div class=\"stat\">\n                    <span class=\"label\">Started</span>\n                    <span class=\"value\">{{ record.StartedAt | date:'short' }}</span>\n                </div>\n                @if (record.EndedAt) {\n                    <div class=\"stat\">\n                        <span class=\"label\">Ended</span>\n                        <span class=\"value\">{{ record.EndedAt | date:'short' }}</span>\n                    </div>\n                }\n                @if (action) {\n                    <div class=\"stat\">\n                        <span class=\"label\">Action</span>\n                        <span class=\"value\">\n                            <button class=\"btn-link\" (click)=\"navigateToAction()\">\n                                {{ action.Name }}\n                                <i class=\"fas fa-external-link-alt\"></i>\n                            </button>\n                        </span>\n                    </div>\n                }\n                @if (user) {\n                    <div class=\"stat\">\n                        <span class=\"label\">User</span>\n                        <span class=\"value\">\n                            <button class=\"btn-link\" (click)=\"navigateToUser()\">\n                                {{ user.Name }}\n                                <i class=\"fas fa-external-link-alt\"></i>\n                            </button>\n                        </span>\n                    </div>\n                }\n            </div>\n        </div>\n\n        <!-- Content Area -->\n        <div class=\"content-area\">\n            <div class=\"accordion-container\">\n                <!-- Execution Details -->\n                <mj-accordion-panel [Expanded]=\"true\">\n                    <ng-template mjAccordionTitle>\n                      <i class=\"fas fa-info-circle\"></i> Execution Details\n                    </ng-template>\n                        <div class=\"details-grid\">\n                            <div class=\"detail-item\">\n                                <label>Execution ID</label>\n                                <span class=\"monospace\">{{ record.ID }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Action ID</label>\n                                <span class=\"monospace\">{{ record.ActionID }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>User ID</label>\n                                <span class=\"monospace\">{{ record.UserID }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Result Code</label>\n                                <span class=\"detail-value\">\n                                    <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\" [style.color]=\"getResultCodeColor()\"></i>\n                                    <span [style.color]=\"getResultCodeColor()\">{{ record.ResultCode || 'N/A' }}</span>\n                                </span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Duration</label>\n                                <span>{{ formatDuration(getExecutionDuration()) }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Retention Period</label>\n                                <span>{{ record.RetentionPeriod ? record.RetentionPeriod + ' days' : 'Indefinite' }}</span>\n                            </div>\n                        </div>\n                </mj-accordion-panel>\n\n                <!-- Unified Parameters section -->\n                @if (hasAnyParameters) {\n                    <mj-accordion-panel [Expanded]=\"true\">\n                        <ng-template mjAccordionTitle>\n                          <i class=\"fas fa-sliders-h\"></i>\n                          Parameters\n                          <span class=\"param-count-pill\">{{ paramCounts.All }}</span>\n                        </ng-template>\n                        <div class=\"params-panel\">\n                            <!-- Toolbar: filter chips, search, sort, raw toggle -->\n                            <div class=\"params-toolbar\">\n                                <div class=\"filter-chips\">\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip\"\n                                        [class.active]=\"typeFilter === 'All'\"\n                                        (click)=\"setTypeFilter('All')\">\n                                        All <span class=\"chip-count\">{{ paramCounts.All }}</span>\n                                    </button>\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip chip-input\"\n                                        [class.active]=\"typeFilter === 'Input'\"\n                                        [disabled]=\"paramCounts.Input === 0\"\n                                        (click)=\"setTypeFilter('Input')\">\n                                        <i class=\"fas fa-sign-in-alt\"></i>\n                                        Input <span class=\"chip-count\">{{ paramCounts.Input }}</span>\n                                    </button>\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip chip-both\"\n                                        [class.active]=\"typeFilter === 'Both'\"\n                                        [disabled]=\"paramCounts.Both === 0\"\n                                        (click)=\"setTypeFilter('Both')\">\n                                        <i class=\"fas fa-exchange-alt\"></i>\n                                        In/Out <span class=\"chip-count\">{{ paramCounts.Both }}</span>\n                                    </button>\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip chip-output\"\n                                        [class.active]=\"typeFilter === 'Output'\"\n                                        [disabled]=\"paramCounts.Output === 0\"\n                                        (click)=\"setTypeFilter('Output')\">\n                                        <i class=\"fas fa-sign-out-alt\"></i>\n                                        Output <span class=\"chip-count\">{{ paramCounts.Output }}</span>\n                                    </button>\n                                </div>\n\n                                <div class=\"toolbar-right\">\n                                    <div class=\"search-wrapper\">\n                                        <i class=\"fas fa-search search-icon\"></i>\n                                        <input\n                                            type=\"text\"\n                                            class=\"mj-input params-search\"\n                                            placeholder=\"Search name or value\u2026\"\n                                            [(ngModel)]=\"searchText\"\n                                            name=\"paramSearch\" />\n                                        @if (searchText) {\n                                            <button type=\"button\" class=\"search-clear\" (click)=\"searchText = ''\" title=\"Clear search\">\n                                                <i class=\"fas fa-times\"></i>\n                                            </button>\n                                        }\n                                    </div>\n\n                                    <div class=\"sort-group\" role=\"group\" aria-label=\"Sort parameters\">\n                                        <button\n                                            type=\"button\"\n                                            class=\"sort-btn\"\n                                            [class.active]=\"sortKey === 'type'\"\n                                            (click)=\"toggleSort('type')\"\n                                            title=\"Sort by type\">\n                                            Type\n                                            @if (sortKey === 'type') {\n                                                <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-short-wide' : 'fa-arrow-up-wide-short'\"></i>\n                                            }\n                                        </button>\n                                        <button\n                                            type=\"button\"\n                                            class=\"sort-btn\"\n                                            [class.active]=\"sortKey === 'name'\"\n                                            (click)=\"toggleSort('name')\"\n                                            title=\"Sort by name\">\n                                            Name\n                                            @if (sortKey === 'name') {\n                                                <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-a-z' : 'fa-arrow-up-z-a'\"></i>\n                                            }\n                                        </button>\n                                    </div>\n\n                                    <button\n                                        type=\"button\"\n                                        class=\"raw-toggle\"\n                                        [class.active]=\"showRawJson\"\n                                        (click)=\"toggleRawJson()\"\n                                        title=\"Toggle raw JSON view\">\n                                        <i class=\"fas fa-code\"></i>\n                                        Raw\n                                    </button>\n                                </div>\n                            </div>\n\n                            @if (showRawJson) {\n                                <div class=\"json-viewer raw-json-viewer\">\n                                    <div class=\"json-toolbar\">\n                                        <span class=\"json-label\">Raw JSON</span>\n                                        <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedParams)\">\n                                            <i class=\"fas fa-copy\"></i>\n                                        </button>\n                                    </div>\n                                    <mj-code-editor\n                                        [(ngModel)]=\"formattedParams\"\n                                        name=\"formattedParamsRaw\"\n                                        [readonly]=\"true\"\n                                        [language]=\"'json'\"\n                                        [lineWrapping]=\"true\"\n                                        style=\"height: 360px; width: 100%;\">\n                                    </mj-code-editor>\n                                </div>\n                            } @else {\n                                <!-- Rich param list -->\n                                @if (filteredParameters.length === 0) {\n                                    <div class=\"empty-filter\">\n                                        <i class=\"fas fa-filter-circle-xmark\"></i>\n                                        <p>No parameters match the current filter.</p>\n                                        <button type=\"button\" class=\"btn-link\" (click)=\"clearFilters()\">\n                                            Clear filters\n                                        </button>\n                                    </div>\n                                } @else {\n                                    <ul class=\"params-list\">\n                                        @for (p of filteredParameters; track trackParam($index, p)) {\n                                            <li class=\"param-row\" [attr.data-type]=\"p.Type\">\n                                                <div class=\"param-header\">\n                                                    <span class=\"type-badge\" [attr.data-type]=\"p.Type\">\n                                                        @if (p.Type === 'Input') {\n                                                            <i class=\"fas fa-sign-in-alt\"></i>\n                                                        } @else if (p.Type === 'Output') {\n                                                            <i class=\"fas fa-sign-out-alt\"></i>\n                                                        } @else {\n                                                            <i class=\"fas fa-exchange-alt\"></i>\n                                                        }\n                                                        {{ getTypeLabel(p.Type) }}\n                                                    </span>\n                                                    <div class=\"param-name-wrap\">\n                                                        <span class=\"param-name\">{{ p.Name }}</span>\n                                                        <span class=\"value-kind-chip\" [attr.data-kind]=\"p.ValueKind\">\n                                                            <i class=\"fas\" [ngClass]=\"getValueKindIcon(p.ValueKind)\"></i>\n                                                            {{ p.ValueKind }}\n                                                        </span>\n                                                    </div>\n                                                    <div class=\"param-actions\">\n                                                        @if (p.IsExpandable) {\n                                                            <button type=\"button\" class=\"btn-icon param-expand\" [class.is-expanded]=\"p.Expanded\" (click)=\"toggleExpanded(p)\" [title]=\"p.Expanded ? 'Collapse' : 'Expand'\">\n                                                                <i class=\"fas\" [ngClass]=\"p.Expanded ? 'fa-chevron-up' : 'fa-chevron-down'\"></i>\n                                                            </button>\n                                                        }\n                                                        <button type=\"button\" class=\"btn-icon\" (click)=\"copyParamValue(p)\" title=\"Copy value\">\n                                                            <i class=\"fas fa-copy\"></i>\n                                                        </button>\n                                                    </div>\n                                                </div>\n                                                <div class=\"param-preview\" [attr.data-kind]=\"p.ValueKind\">{{ p.Preview }}</div>\n                                                @if (p.IsExpandable && p.Expanded) {\n                                                    <div class=\"param-expanded\">\n                                                        <mj-code-editor\n                                                            [(ngModel)]=\"p.FormattedValue\"\n                                                            [name]=\"'param-' + p.Name\"\n                                                            [readonly]=\"true\"\n                                                            [language]=\"'json'\"\n                                                            [lineWrapping]=\"true\"\n                                                            style=\"height: 240px; width: 100%;\">\n                                                        </mj-code-editor>\n                                                    </div>\n                                                }\n                                            </li>\n                                        }\n                                    </ul>\n                                }\n                            }\n                        </div>\n                    </mj-accordion-panel>\n                }\n\n                <!-- Output Message -->\n                @if (record.Message) {\n                    <mj-accordion-panel [Expanded]=\"true\">\n                        <ng-template mjAccordionTitle>\n                          <i class=\"fas fa-comment-alt\"></i> Output Message\n                        </ng-template>\n                            <div class=\"json-viewer\">\n                                <div class=\"json-toolbar\">\n                                    <span class=\"json-label\">JSON</span>\n                                    <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedMessage)\">\n                                        <i class=\"fas fa-copy\"></i>\n                                    </button>\n                                </div>\n                                <mj-code-editor \n                                    [(ngModel)]=\"formattedMessage\"\n                                    name=\"formattedMessage\"\n                                    [readonly]=\"true\"\n                                    [language]=\"'json'\"\n                                    [lineWrapping]=\"true\"\n                                    style=\"height: 300px; width: 100%;\">\n                                </mj-code-editor>\n                            </div>\n                    </mj-accordion-panel>\n                }\n\n                <!-- Empty States for missing data -->\n                @if (!record.Params && !record.Message && !hasAnyParameters) {\n                    <mj-accordion-panel [Expanded]=\"true\">\n                        <ng-template mjAccordionTitle>\n                          <i class=\"fas fa-database\"></i> Execution Data\n                        </ng-template>\n                            <div class=\"empty-state\">\n                                <i class=\"fas fa-inbox\"></i>\n                                <p>No execution data recorded</p>\n                            </div>\n                    </mj-accordion-panel>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: ["/* Action Execution Log Form Styles */\n:host {\n  display: block;\n  height: 100%;\n}\n\n.action-execution-log-form {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  background: var(--mj-bg-page);\n  color: var(--mj-text-primary);\n}\n\n/* Header Styles */\n.header {\n  background: var(--mj-bg-surface-card);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 20px;\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 16px;\n}\n\n.header-left {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.icon-wrapper {\n  width: 48px;\n  height: 48px;\n  background: var(--mj-status-info);\n  border-radius: var(--mj-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n  font-size: var(--mj-text-xl);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info h2 {\n  margin: 0;\n  font-size: var(--mj-text-2xl);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.meta-info {\n  display: flex;\n  gap: 12px;\n  margin-top: 4px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.action-name {\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.log-id {\n  font-family: monospace;\n  font-size: var(--mj-text-xs);\n  opacity: 0.7;\n}\n\n.header-right {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.status-badge {\n  padding: 6px 16px;\n  border-radius: var(--mj-radius-full);\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--mj-text-inverse);\n}\n\n.execution-time {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.header-stats {\n  display: flex;\n  gap: 24px;\n  padding-top: 12px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.stat {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.stat .label {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.stat .value {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.record-form {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 0;\n}\n\n/* Content Area */\n.content-area {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n/* Details Grid */\n.details-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n  gap: 20px;\n  padding: 20px;\n}\n\n.detail-item {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.detail-item label {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: var(--mj-font-semibold);\n}\n\n.detail-value {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: var(--mj-text-primary);\n}\n\n.btn-link {\n  background: none;\n  border: none;\n  color: var(--mj-brand-primary);\n  cursor: pointer;\n  font-size: var(--mj-text-sm);\n  padding: 4px;\n}\n\n.btn-link:hover {\n  color: var(--mj-brand-primary-hover);\n}\n\n.loading {\n  color: var(--mj-text-muted);\n  font-size: var(--mj-text-xs);\n}\n\n/* JSON Viewer */\n.json-viewer {\n  padding: 20px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: var(--mj-radius-md);\n  margin-bottom: 20px;\n}\n\n.json-toolbar {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 12px;\n}\n\n.json-label {\n  background: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n  padding: 4px 12px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.btn-icon {\n  width: 32px;\n  height: 32px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-sm);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n  color: var(--mj-text-muted);\n}\n\n.btn-icon:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-secondary);\n}\n\n/* Status badge colors based on data-status attribute */\n.status-badge[data-status=\"success\"],\n.status-badge[data-status=\"ok\"],\n.status-badge[data-status=\"completed\"],\n.status-badge[data-status=\"200\"] {\n  background-color: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"],\n.status-badge[data-status=\"failed\"],\n.status-badge[data-status=\"failure\"] {\n  background-color: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"],\n.status-badge[data-status=\"pending\"] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"],\n.status-badge[data-status=\"running\"] {\n  background-color: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge {\n  background-color: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n}\n\n/* Empty state */\n.empty-state {\n  text-align: center;\n  padding: 40px;\n  color: var(--mj-text-muted);\n}\n\n.empty-state i {\n  font-size: var(--mj-text-5xl);\n  opacity: 0.3;\n  margin-bottom: 16px;\n}\n\n.monospace {\n  font-family: 'Courier New', Courier, monospace;\n  font-size: var(--mj-text-xs);\n}\n\n/* ============================================================\n   Unified Parameters Panel\n   ============================================================ */\n\n.param-count-pill {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 22px;\n  height: 22px;\n  padding: 0 7px;\n  margin-left: 8px;\n  border-radius: var(--mj-radius-full);\n  background: color-mix(in srgb, var(--mj-brand-primary) 14%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  letter-spacing: 0.3px;\n}\n\n.params-panel {\n  padding: 18px 20px 22px;\n}\n\n/* Toolbar --------------------------------------------------------------- */\n.params-toolbar {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 14px;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 14px;\n  margin-bottom: 14px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips {\n  display: flex;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n.chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 13px;\n  border-radius: var(--mj-radius-full);\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.chip:hover:not(:disabled) {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-primary);\n}\n.chip:disabled {\n  opacity: 0.45;\n  cursor: not-allowed;\n}\n.chip .chip-count {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 20px;\n  height: 18px;\n  padding: 0 6px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n}\n.chip i {\n  font-size: 11px;\n}\n\n.chip.active {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active .chip-count {\n  background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n  color: var(--mj-text-inverse);\n}\n\n/* Chip type flavors (active state tints per Input/Output/Both). */\n.chip.chip-input.active {\n  background: var(--mj-status-info);\n  border-color: var(--mj-status-info);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active {\n  background: var(--mj-status-success);\n  border-color: var(--mj-status-success);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.search-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.search-icon {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  pointer-events: none;\n}\n.params-search {\n  min-width: 220px;\n  padding: 7px 30px 7px 30px;\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n}\n.search-clear {\n  position: absolute;\n  right: 6px;\n  width: 22px;\n  height: 22px;\n  border: none;\n  background: transparent;\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.search-clear:hover {\n  color: var(--mj-text-primary);\n  background: var(--mj-bg-surface-hover);\n}\n\n.sort-group {\n  display: inline-flex;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface);\n}\n.sort-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  background: transparent;\n  border: none;\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: background var(--mj-transition-base);\n}\n.sort-btn + .sort-btn {\n  border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n.sort-btn.active i { color: var(--mj-brand-primary); }\n\n.raw-toggle {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.raw-toggle:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n/* Param list rows -------------------------------------------------------- */\n.params-list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.param-row {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-left: 3px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 12px 14px;\n  transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row:hover {\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n  box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"]  { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"]   { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.type-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 3px 10px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"] {\n  background: var(--mj-status-info-bg);\n  color: var(--mj-status-info-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"] {\n  background: var(--mj-status-success-bg);\n  color: var(--mj-status-success-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  min-width: 0;\n}\n.param-name {\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.value-kind-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 2px 8px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 10px;\n  font-weight: var(--mj-font-medium);\n  text-transform: lowercase;\n  letter-spacing: 0.3px;\n  flex-shrink: 0;\n}\n.value-kind-chip i { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"]  { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"]   { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"]  { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"],\n.value-kind-chip[data-kind=\"undefined\"] {\n  color: var(--mj-text-disabled);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions {\n  display: flex;\n  gap: 4px;\n  flex-shrink: 0;\n}\n.param-actions .btn-icon {\n  width: 28px;\n  height: 28px;\n}\n.param-expand.is-expanded {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview {\n  margin-top: 8px;\n  padding-left: calc(64px + 12px); /* align under param name (after type badge) */\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  word-break: break-word;\n  line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"]   { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"]   { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"]  { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"],\n.param-preview[data-kind=\"undefined\"] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"],\n.param-preview[data-kind=\"object\"]   { color: var(--mj-brand-primary); }\n\n.param-expanded {\n  margin-top: 10px;\n  margin-left: calc(64px + 12px);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer { margin-top: 4px; }\n\n.empty-filter {\n  text-align: center;\n  padding: 36px 20px;\n  color: var(--mj-text-muted);\n  background: var(--mj-bg-surface-sunken);\n  border: 1px dashed var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n}\n.empty-filter i {\n  font-size: var(--mj-text-3xl);\n  margin-bottom: 12px;\n  opacity: 0.5;\n}\n.empty-filter p {\n  margin: 0 0 12px;\n  font-size: var(--mj-text-sm);\n}\n\n/* Responsive adjustments */\n@media (max-width: 768px) {\n  .header-content {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-stats {\n    flex-wrap: wrap;\n  }\n\n  .details-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .params-toolbar {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .toolbar-right {\n    justify-content: space-between;\n  }\n  .params-search { min-width: 0; width: 100%; }\n  .search-wrapper { flex: 1; }\n\n  .param-preview,\n  .param-expanded {\n    padding-left: 0;\n    margin-left: 0;\n  }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-action-execution-log-form', template: "<div class=\"record-form-container action-execution-log-form\" style=\"height: 100%; display: flex; flex-direction: column;\">\n    <div class=\"record-form\" style=\"display: flex; flex-direction: column; height: 100%; overflow: hidden;\">\n        <!-- Header -->\n        <div class=\"header\">\n            <div class=\"header-content\">\n                <div class=\"header-left\">\n                    <div class=\"icon-wrapper\">\n                        <i class=\"fas fa-terminal\"></i>\n                    </div>\n                    <div class=\"header-info\">\n                        <h2>Action Execution Log</h2>\n                        <div class=\"meta-info\">\n                            @if (action) {\n                                <span class=\"action-name\">{{ action.Name }}</span>\n                            }\n                            <span class=\"log-id\">{{ record.ID }}</span>\n                        </div>\n                    </div>\n                </div>\n                <div class=\"header-right\">\n                    <div class=\"status-badge\" [attr.data-status]=\"record.ResultCode?.toLowerCase()\">\n                        <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\"></i>\n                        {{ record.ResultCode || 'UNKNOWN' }}\n                    </div>\n                    <div class=\"execution-time\">\n                        <i class=\"fas fa-clock\"></i>\n                        {{ formatDuration(getExecutionDuration()) }}\n                    </div>\n                </div>\n            </div>\n            <div class=\"header-stats\">\n                <div class=\"stat\">\n                    <span class=\"label\">Started</span>\n                    <span class=\"value\">{{ record.StartedAt | date:'short' }}</span>\n                </div>\n                @if (record.EndedAt) {\n                    <div class=\"stat\">\n                        <span class=\"label\">Ended</span>\n                        <span class=\"value\">{{ record.EndedAt | date:'short' }}</span>\n                    </div>\n                }\n                @if (action) {\n                    <div class=\"stat\">\n                        <span class=\"label\">Action</span>\n                        <span class=\"value\">\n                            <button class=\"btn-link\" (click)=\"navigateToAction()\">\n                                {{ action.Name }}\n                                <i class=\"fas fa-external-link-alt\"></i>\n                            </button>\n                        </span>\n                    </div>\n                }\n                @if (user) {\n                    <div class=\"stat\">\n                        <span class=\"label\">User</span>\n                        <span class=\"value\">\n                            <button class=\"btn-link\" (click)=\"navigateToUser()\">\n                                {{ user.Name }}\n                                <i class=\"fas fa-external-link-alt\"></i>\n                            </button>\n                        </span>\n                    </div>\n                }\n            </div>\n        </div>\n\n        <!-- Content Area -->\n        <div class=\"content-area\">\n            <div class=\"accordion-container\">\n                <!-- Execution Details -->\n                <mj-accordion-panel [Expanded]=\"true\">\n                    <ng-template mjAccordionTitle>\n                      <i class=\"fas fa-info-circle\"></i> Execution Details\n                    </ng-template>\n                        <div class=\"details-grid\">\n                            <div class=\"detail-item\">\n                                <label>Execution ID</label>\n                                <span class=\"monospace\">{{ record.ID }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Action ID</label>\n                                <span class=\"monospace\">{{ record.ActionID }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>User ID</label>\n                                <span class=\"monospace\">{{ record.UserID }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Result Code</label>\n                                <span class=\"detail-value\">\n                                    <i class=\"fas\" [ngClass]=\"getResultCodeIcon()\" [style.color]=\"getResultCodeColor()\"></i>\n                                    <span [style.color]=\"getResultCodeColor()\">{{ record.ResultCode || 'N/A' }}</span>\n                                </span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Duration</label>\n                                <span>{{ formatDuration(getExecutionDuration()) }}</span>\n                            </div>\n                            <div class=\"detail-item\">\n                                <label>Retention Period</label>\n                                <span>{{ record.RetentionPeriod ? record.RetentionPeriod + ' days' : 'Indefinite' }}</span>\n                            </div>\n                        </div>\n                </mj-accordion-panel>\n\n                <!-- Unified Parameters section -->\n                @if (hasAnyParameters) {\n                    <mj-accordion-panel [Expanded]=\"true\">\n                        <ng-template mjAccordionTitle>\n                          <i class=\"fas fa-sliders-h\"></i>\n                          Parameters\n                          <span class=\"mj-accordion-badge mj-accordion-badge--right\">{{ paramCounts.All }}</span>\n                        </ng-template>\n                        <div class=\"params-panel\">\n                            <!-- Toolbar: filter chips, search, sort, raw toggle -->\n                            <div class=\"params-toolbar\">\n                                <div class=\"filter-chips\">\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip\"\n                                        [class.active]=\"typeFilter === 'All'\"\n                                        (click)=\"setTypeFilter('All')\">\n                                        All <span class=\"chip-count\">{{ paramCounts.All }}</span>\n                                    </button>\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip chip-input\"\n                                        [class.active]=\"typeFilter === 'Input'\"\n                                        [disabled]=\"paramCounts.Input === 0\"\n                                        (click)=\"setTypeFilter('Input')\">\n                                        <i class=\"fas fa-sign-in-alt\"></i>\n                                        Input <span class=\"chip-count\">{{ paramCounts.Input }}</span>\n                                    </button>\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip chip-both\"\n                                        [class.active]=\"typeFilter === 'Both'\"\n                                        [disabled]=\"paramCounts.Both === 0\"\n                                        (click)=\"setTypeFilter('Both')\">\n                                        <i class=\"fas fa-exchange-alt\"></i>\n                                        In/Out <span class=\"chip-count\">{{ paramCounts.Both }}</span>\n                                    </button>\n                                    <button\n                                        type=\"button\"\n                                        class=\"chip chip-output\"\n                                        [class.active]=\"typeFilter === 'Output'\"\n                                        [disabled]=\"paramCounts.Output === 0\"\n                                        (click)=\"setTypeFilter('Output')\">\n                                        <i class=\"fas fa-sign-out-alt\"></i>\n                                        Output <span class=\"chip-count\">{{ paramCounts.Output }}</span>\n                                    </button>\n                                </div>\n\n                                <div class=\"toolbar-right\">\n                                    <div class=\"search-wrapper\">\n                                        <i class=\"fas fa-search search-icon\"></i>\n                                        <input\n                                            type=\"text\"\n                                            class=\"mj-input params-search\"\n                                            placeholder=\"Search name or value\u2026\"\n                                            [(ngModel)]=\"searchText\"\n                                            name=\"paramSearch\" />\n                                        @if (searchText) {\n                                            <button type=\"button\" class=\"search-clear\" (click)=\"searchText = ''\" title=\"Clear search\">\n                                                <i class=\"fas fa-times\"></i>\n                                            </button>\n                                        }\n                                    </div>\n\n                                    <div class=\"sort-group\" role=\"group\" aria-label=\"Sort parameters\">\n                                        <button\n                                            type=\"button\"\n                                            class=\"sort-btn\"\n                                            [class.active]=\"sortKey === 'type'\"\n                                            (click)=\"toggleSort('type')\"\n                                            title=\"Sort by type\">\n                                            Type\n                                            @if (sortKey === 'type') {\n                                                <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-short-wide' : 'fa-arrow-up-wide-short'\"></i>\n                                            }\n                                        </button>\n                                        <button\n                                            type=\"button\"\n                                            class=\"sort-btn\"\n                                            [class.active]=\"sortKey === 'name'\"\n                                            (click)=\"toggleSort('name')\"\n                                            title=\"Sort by name\">\n                                            Name\n                                            @if (sortKey === 'name') {\n                                                <i class=\"fas\" [ngClass]=\"sortDir === 'asc' ? 'fa-arrow-down-a-z' : 'fa-arrow-up-z-a'\"></i>\n                                            }\n                                        </button>\n                                    </div>\n\n                                    <button\n                                        type=\"button\"\n                                        class=\"raw-toggle\"\n                                        [class.active]=\"showRawJson\"\n                                        (click)=\"toggleRawJson()\"\n                                        title=\"Toggle raw JSON view\">\n                                        <i class=\"fas fa-code\"></i>\n                                        Raw\n                                    </button>\n                                </div>\n                            </div>\n\n                            @if (showRawJson) {\n                                <div class=\"json-viewer raw-json-viewer\">\n                                    <div class=\"json-toolbar\">\n                                        <span class=\"json-label\">Raw JSON</span>\n                                        <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedParams)\">\n                                            <i class=\"fas fa-copy\"></i>\n                                        </button>\n                                    </div>\n                                    <mj-code-editor\n                                        [(ngModel)]=\"formattedParams\"\n                                        name=\"formattedParamsRaw\"\n                                        [readonly]=\"true\"\n                                        [language]=\"'json'\"\n                                        [lineWrapping]=\"true\"\n                                        style=\"height: 360px; width: 100%;\">\n                                    </mj-code-editor>\n                                </div>\n                            } @else {\n                                <!-- Rich param list -->\n                                @if (filteredParameters.length === 0) {\n                                    <mj-empty-state\n                                        Variant=\"no-results\"\n                                        Size=\"compact\"\n                                        Icon=\"fa-solid fa-filter-circle-xmark\"\n                                        Title=\"No parameters match the current filter.\"\n                                        ActionText=\"Clear filters\"\n                                        ActionIcon=\"fa-solid fa-rotate-left\"\n                                        ActionVariant=\"flat\"\n                                        (Action)=\"clearFilters()\" />\n                                } @else {\n                                    <ul class=\"params-list\">\n                                        @for (p of filteredParameters; track trackParam($index, p)) {\n                                            <li class=\"param-row\" [attr.data-type]=\"p.Type\">\n                                                <div class=\"param-header\">\n                                                    <span class=\"type-badge\" [attr.data-type]=\"p.Type\">\n                                                        @if (p.Type === 'Input') {\n                                                            <i class=\"fas fa-sign-in-alt\"></i>\n                                                        } @else if (p.Type === 'Output') {\n                                                            <i class=\"fas fa-sign-out-alt\"></i>\n                                                        } @else {\n                                                            <i class=\"fas fa-exchange-alt\"></i>\n                                                        }\n                                                        {{ getTypeLabel(p.Type) }}\n                                                    </span>\n                                                    <div class=\"param-name-wrap\">\n                                                        <span class=\"param-name\">{{ p.Name }}</span>\n                                                        <span class=\"value-kind-chip\" [attr.data-kind]=\"p.ValueKind\">\n                                                            <i class=\"fas\" [ngClass]=\"getValueKindIcon(p.ValueKind)\"></i>\n                                                            {{ p.ValueKind }}\n                                                        </span>\n                                                    </div>\n                                                    <div class=\"param-actions\">\n                                                        @if (p.IsExpandable) {\n                                                            <button type=\"button\" class=\"btn-icon param-expand\" [class.is-expanded]=\"p.Expanded\" (click)=\"toggleExpanded(p)\" [title]=\"p.Expanded ? 'Collapse' : 'Expand'\">\n                                                                <i class=\"fas\" [ngClass]=\"p.Expanded ? 'fa-chevron-up' : 'fa-chevron-down'\"></i>\n                                                            </button>\n                                                        }\n                                                        <button type=\"button\" class=\"btn-icon\" (click)=\"copyParamValue(p)\" title=\"Copy value\">\n                                                            <i class=\"fas fa-copy\"></i>\n                                                        </button>\n                                                    </div>\n                                                </div>\n                                                <div class=\"param-preview\" [attr.data-kind]=\"p.ValueKind\">{{ p.Preview }}</div>\n                                                @if (p.IsExpandable && p.Expanded) {\n                                                    <div class=\"param-expanded\">\n                                                        <mj-code-editor\n                                                            [(ngModel)]=\"p.FormattedValue\"\n                                                            [name]=\"'param-' + p.Name\"\n                                                            [readonly]=\"true\"\n                                                            [language]=\"'json'\"\n                                                            [lineWrapping]=\"true\"\n                                                            style=\"height: 240px; width: 100%;\">\n                                                        </mj-code-editor>\n                                                    </div>\n                                                }\n                                            </li>\n                                        }\n                                    </ul>\n                                }\n                            }\n                        </div>\n                    </mj-accordion-panel>\n                }\n\n                <!-- Output Message -->\n                @if (record.Message) {\n                    <mj-accordion-panel [Expanded]=\"true\">\n                        <ng-template mjAccordionTitle>\n                          <i class=\"fas fa-comment-alt\"></i> Output Message\n                        </ng-template>\n                            <div class=\"json-viewer\">\n                                <div class=\"json-toolbar\">\n                                    <span class=\"json-label\">JSON</span>\n                                    <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"copyToClipboard(formattedMessage)\">\n                                        <i class=\"fas fa-copy\"></i>\n                                    </button>\n                                </div>\n                                <mj-code-editor \n                                    [(ngModel)]=\"formattedMessage\"\n                                    name=\"formattedMessage\"\n                                    [readonly]=\"true\"\n                                    [language]=\"'json'\"\n                                    [lineWrapping]=\"true\"\n                                    style=\"height: 300px; width: 100%;\">\n                                </mj-code-editor>\n                            </div>\n                    </mj-accordion-panel>\n                }\n\n                <!-- Empty States for missing data -->\n                @if (!record.Params && !record.Message && !hasAnyParameters) {\n                    <mj-accordion-panel [Expanded]=\"true\">\n                        <ng-template mjAccordionTitle>\n                          <i class=\"fas fa-database\"></i> Execution Data\n                        </ng-template>\n                            <mj-empty-state\n                                Size=\"compact\"\n                                Icon=\"fa-solid fa-inbox\"\n                                Title=\"No execution data recorded\" />\n                    </mj-accordion-panel>\n                }\n            </div>\n        </div>\n    </div>\n</div>", styles: ["/* Action Execution Log Form Styles */\n:host {\n  display: block;\n  height: 100%;\n}\n\n.action-execution-log-form {\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  background: var(--mj-bg-page);\n  color: var(--mj-text-primary);\n}\n\n/* Header Styles */\n.header {\n  background: var(--mj-bg-surface-card);\n  border-bottom: 1px solid var(--mj-border-default);\n  padding: 20px;\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-content {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 16px;\n}\n\n.header-left {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.icon-wrapper {\n  width: 48px;\n  height: 48px;\n  background: var(--mj-status-info);\n  border-radius: var(--mj-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: var(--mj-text-inverse);\n  font-size: var(--mj-text-xl);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.header-info h2 {\n  margin: 0;\n  font-size: var(--mj-text-2xl);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.meta-info {\n  display: flex;\n  gap: 12px;\n  margin-top: 4px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.action-name {\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.log-id {\n  font-family: monospace;\n  font-size: var(--mj-text-xs);\n  opacity: 0.7;\n}\n\n.header-right {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.status-badge {\n  padding: 6px 16px;\n  border-radius: var(--mj-radius-full);\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  color: var(--mj-text-inverse);\n}\n\n.execution-time {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-muted);\n}\n\n.header-stats {\n  display: flex;\n  gap: 24px;\n  padding-top: 12px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.stat {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.stat .label {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.stat .value {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-secondary);\n}\n\n.record-form {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  min-height: 0;\n}\n\n/* Content Area */\n.content-area {\n  flex: 1;\n  min-height: 0;\n  overflow-y: auto;\n  padding: 20px;\n}\n\n/* Details Grid */\n.details-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n  gap: 20px;\n  padding: 20px;\n}\n\n.detail-item {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.detail-item label {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  font-weight: var(--mj-font-semibold);\n}\n\n.detail-value {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: var(--mj-text-primary);\n}\n\n.btn-link {\n  background: none;\n  border: none;\n  color: var(--mj-brand-primary);\n  cursor: pointer;\n  font-size: var(--mj-text-sm);\n  padding: 4px;\n}\n\n.btn-link:hover {\n  color: var(--mj-brand-primary-hover);\n}\n\n.loading {\n  color: var(--mj-text-muted);\n  font-size: var(--mj-text-xs);\n}\n\n/* JSON Viewer */\n.json-viewer {\n  padding: 20px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: var(--mj-radius-md);\n  margin-bottom: 20px;\n}\n\n.json-toolbar {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 12px;\n}\n\n.json-label {\n  background: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n  padding: 4px 12px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.btn-icon {\n  width: 32px;\n  height: 32px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  border-radius: var(--mj-radius-sm);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n  color: var(--mj-text-muted);\n}\n\n.btn-icon:hover {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-secondary);\n}\n\n/* Status badge colors based on data-status attribute */\n.status-badge[data-status=\"success\"],\n.status-badge[data-status=\"ok\"],\n.status-badge[data-status=\"completed\"],\n.status-badge[data-status=\"200\"] {\n  background-color: var(--mj-status-success);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"error\"],\n.status-badge[data-status=\"failed\"],\n.status-badge[data-status=\"failure\"] {\n  background-color: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge[data-status=\"warning\"],\n.status-badge[data-status=\"pending\"] {\n  background-color: var(--mj-status-warning);\n  color: var(--mj-color-warning-800);\n}\n\n.status-badge[data-status=\"info\"],\n.status-badge[data-status=\"running\"] {\n  background-color: var(--mj-status-info);\n  color: var(--mj-text-inverse);\n}\n\n.status-badge {\n  background-color: var(--mj-text-muted);\n  color: var(--mj-text-inverse);\n}\n\n.monospace {\n  font-family: 'Courier New', Courier, monospace;\n  font-size: var(--mj-text-xs);\n}\n\n/* ============================================================\n   Unified Parameters Panel\n   ============================================================ */\n\n.params-panel {\n  padding: 18px 20px 22px;\n}\n\n/* Toolbar --------------------------------------------------------------- */\n.params-toolbar {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 14px;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 14px;\n  margin-bottom: 14px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-lg);\n}\n\n.filter-chips {\n  display: flex;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n.chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 13px;\n  border-radius: var(--mj-radius-full);\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.chip:hover:not(:disabled) {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-primary);\n}\n.chip:disabled {\n  opacity: 0.45;\n  cursor: not-allowed;\n}\n.chip .chip-count {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 20px;\n  height: 18px;\n  padding: 0 6px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n}\n.chip i {\n  font-size: 11px;\n}\n\n.chip.active {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n.chip.active .chip-count {\n  background: color-mix(in srgb, var(--mj-text-inverse) 25%, transparent);\n  color: var(--mj-text-inverse);\n}\n\n/* Chip type flavors (active state tints per Input/Output/Both). */\n.chip.chip-input.active {\n  background: var(--mj-status-info);\n  border-color: var(--mj-status-info);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-info) 22%, transparent);\n}\n.chip.chip-output.active {\n  background: var(--mj-status-success);\n  border-color: var(--mj-status-success);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 22%, transparent);\n}\n.chip.chip-both.active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 22%, transparent);\n}\n\n.toolbar-right {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  flex-wrap: wrap;\n}\n\n.search-wrapper {\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n.search-icon {\n  position: absolute;\n  left: 10px;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n  pointer-events: none;\n}\n.params-search {\n  min-width: 220px;\n  padding: 7px 30px 7px 30px;\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n}\n.search-clear {\n  position: absolute;\n  right: 6px;\n  width: 22px;\n  height: 22px;\n  border: none;\n  background: transparent;\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n}\n.search-clear:hover {\n  color: var(--mj-text-primary);\n  background: var(--mj-bg-surface-hover);\n}\n\n.sort-group {\n  display: inline-flex;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface);\n}\n.sort-btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  background: transparent;\n  border: none;\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: background var(--mj-transition-base);\n}\n.sort-btn + .sort-btn {\n  border-left: 1px solid var(--mj-border-default);\n}\n.sort-btn:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.sort-btn.active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n.sort-btn.active i { color: var(--mj-brand-primary); }\n\n.raw-toggle {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 7px 12px;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  border-radius: var(--mj-radius-md);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-medium);\n  cursor: pointer;\n  transition: all var(--mj-transition-base);\n}\n.raw-toggle:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.raw-toggle.active {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n/* Param list rows -------------------------------------------------------- */\n.params-list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.param-row {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-left: 3px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 12px 14px;\n  transition: border-color var(--mj-transition-base), box-shadow var(--mj-transition-base);\n}\n.param-row:hover {\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n  box-shadow: 0 1px 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n.param-row[data-type=\"Input\"]  { border-left-color: var(--mj-status-info); }\n.param-row[data-type=\"Output\"] { border-left-color: var(--mj-status-success); }\n.param-row[data-type=\"Both\"]   { border-left-color: color-mix(in srgb, var(--mj-brand-primary) 75%, var(--mj-status-warning) 25%); }\n\n.param-header {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n\n.type-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 3px 10px;\n  border-radius: var(--mj-radius-full);\n  font-size: 11px;\n  font-weight: var(--mj-font-semibold);\n  text-transform: uppercase;\n  letter-spacing: 0.4px;\n  flex-shrink: 0;\n}\n.type-badge[data-type=\"Input\"] {\n  background: var(--mj-status-info-bg);\n  color: var(--mj-status-info-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-info) 30%, transparent);\n}\n.type-badge[data-type=\"Output\"] {\n  background: var(--mj-status-success-bg);\n  color: var(--mj-status-success-text);\n  border: 1px solid color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n.type-badge[data-type=\"Both\"] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 12%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border: 1px solid color-mix(in srgb, var(--mj-brand-primary) 35%, transparent);\n}\n\n.param-name-wrap {\n  flex: 1;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  min-width: 0;\n}\n.param-name {\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.value-kind-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 2px 8px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n  border-radius: var(--mj-radius-full);\n  font-size: 10px;\n  font-weight: var(--mj-font-medium);\n  text-transform: lowercase;\n  letter-spacing: 0.3px;\n  flex-shrink: 0;\n}\n.value-kind-chip i { font-size: 9px; }\n.value-kind-chip[data-kind=\"number\"]  { color: var(--mj-status-info-text); background: var(--mj-status-info-bg); }\n.value-kind-chip[data-kind=\"boolean\"] { color: var(--mj-status-warning-text); background: var(--mj-status-warning-bg); }\n.value-kind-chip[data-kind=\"array\"]   { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"object\"]  { color: var(--mj-brand-primary); background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface)); }\n.value-kind-chip[data-kind=\"null\"],\n.value-kind-chip[data-kind=\"undefined\"] {\n  color: var(--mj-text-disabled);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.param-actions {\n  display: flex;\n  gap: 4px;\n  flex-shrink: 0;\n}\n.param-actions .btn-icon {\n  width: 28px;\n  height: 28px;\n}\n.param-expand.is-expanded {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n  border-color: color-mix(in srgb, var(--mj-brand-primary) 35%, var(--mj-border-default));\n}\n\n.param-preview {\n  margin-top: 8px;\n  padding-left: calc(64px + 12px); /* align under param name (after type badge) */\n  font-family: 'SF Mono', 'Fira Code', Menlo, Consolas, monospace;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  word-break: break-word;\n  line-height: 1.55;\n}\n.param-preview[data-kind=\"string\"]   { color: var(--mj-status-success-text); }\n.param-preview[data-kind=\"number\"]   { color: var(--mj-status-info-text); }\n.param-preview[data-kind=\"boolean\"]  { color: var(--mj-status-warning-text); }\n.param-preview[data-kind=\"null\"],\n.param-preview[data-kind=\"undefined\"] { color: var(--mj-text-disabled); font-style: italic; }\n.param-preview[data-kind=\"array\"],\n.param-preview[data-kind=\"object\"]   { color: var(--mj-brand-primary); }\n\n.param-expanded {\n  margin-top: 10px;\n  margin-left: calc(64px + 12px);\n  border: 1px solid var(--mj-border-subtle);\n  border-radius: var(--mj-radius-md);\n  overflow: hidden;\n  background: var(--mj-bg-surface-sunken);\n}\n\n.raw-json-viewer { margin-top: 4px; }\n\n/* Responsive adjustments */\n@media (max-width: 768px) {\n  .header-content {\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .header-stats {\n    flex-wrap: wrap;\n  }\n\n  .details-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .params-toolbar {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .toolbar-right {\n    justify-content: space-between;\n  }\n  .params-search { min-width: 0; width: 100%; }\n  .search-wrapper { flex: 1; }\n\n  .param-preview,\n  .param-expanded {\n    padding-left: 0;\n    margin-left: 0;\n  }\n}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJActionExecutionLogFormComponentExtended, { className: "MJActionExecutionLogFormComponentExtended", filePath: "src/lib/custom/Actions/action-execution-log-form.component.ts", lineNumber: 35 }); })();
 //# sourceMappingURL=action-execution-log-form.component.js.map