@memberjunction/ng-core-entity-forms 2.53.0 → 2.54.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/custom/AIAgents/ai-agent-form.component.d.ts +20 -0
- package/dist/lib/custom/AIAgents/ai-agent-form.component.d.ts.map +1 -1
- package/dist/lib/custom/AIAgents/ai-agent-form.component.js +188 -40
- package/dist/lib/custom/AIAgents/ai-agent-form.component.js.map +1 -1
- package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.js +5 -7
- package/dist/lib/custom/AIPromptRuns/ai-prompt-run-form.component.js.map +1 -1
- package/dist/lib/custom/Actions/action-execution-log-form.component.d.ts +1 -0
- package/dist/lib/custom/Actions/action-execution-log-form.component.d.ts.map +1 -1
- package/dist/lib/custom/Actions/action-execution-log-form.component.js +212 -293
- package/dist/lib/custom/Actions/action-execution-log-form.component.js.map +1 -1
- package/dist/lib/custom/Actions/action-form.component.js +6 -8
- package/dist/lib/custom/Actions/action-form.component.js.map +1 -1
- package/dist/lib/custom/ai-agent-run/ai-agent-run-step-node.component.d.ts +25 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run-step-node.component.d.ts.map +1 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run-step-node.component.js +261 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run-step-node.component.js.map +1 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run-timeline.component.d.ts +73 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run-timeline.component.d.ts.map +1 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run-timeline.component.js +510 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run-timeline.component.js.map +1 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run.component.d.ts +40 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run.component.d.ts.map +1 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run.component.js +490 -0
- package/dist/lib/custom/ai-agent-run/ai-agent-run.component.js.map +1 -0
- package/dist/lib/custom/ai-test-harness/agent-execution-monitor.component.d.ts +31 -2
- package/dist/lib/custom/ai-test-harness/agent-execution-monitor.component.d.ts.map +1 -1
- package/dist/lib/custom/ai-test-harness/agent-execution-monitor.component.js +167 -65
- package/dist/lib/custom/ai-test-harness/agent-execution-monitor.component.js.map +1 -1
- package/dist/lib/custom/ai-test-harness/ai-test-harness.component.d.ts +35 -2
- package/dist/lib/custom/ai-test-harness/ai-test-harness.component.d.ts.map +1 -1
- package/dist/lib/custom/ai-test-harness/ai-test-harness.component.js +423 -247
- package/dist/lib/custom/ai-test-harness/ai-test-harness.component.js.map +1 -1
- package/dist/lib/custom/custom-forms.module.d.ts +25 -21
- package/dist/lib/custom/custom-forms.module.d.ts.map +1 -1
- package/dist/lib/custom/custom-forms.module.js +25 -2
- package/dist/lib/custom/custom-forms.module.js.map +1 -1
- package/dist/lib/generated/Entities/AIAgent/aiagent.form.component.js +10 -10
- package/dist/lib/generated/Entities/AIAgent/aiagent.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIAgentRun/aiagentrun.form.component.js +7 -9
- package/dist/lib/generated/Entities/AIAgentRun/aiagentrun.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIAgentRunStep/aiagentrunstep.form.component.js +3 -5
- package/dist/lib/generated/Entities/AIAgentRunStep/aiagentrunstep.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIAgentRunStep/sections/details.component.d.ts.map +1 -1
- package/dist/lib/generated/Entities/AIAgentRunStep/sections/details.component.js +13 -4
- package/dist/lib/generated/Entities/AIAgentRunStep/sections/details.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIAgentType/aiagenttype.form.component.js +5 -7
- package/dist/lib/generated/Entities/AIAgentType/aiagenttype.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIModel/aimodel.form.component.js +9 -9
- package/dist/lib/generated/Entities/AIModel/aimodel.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIModelCost/aimodelcost.form.component.js +3 -5
- package/dist/lib/generated/Entities/AIModelCost/aimodelcost.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIModelPriceType/aimodelpricetype.form.component.js +5 -7
- package/dist/lib/generated/Entities/AIModelPriceType/aimodelpricetype.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIModelPriceUnitType/aimodelpriceunittype.form.component.js +5 -7
- package/dist/lib/generated/Entities/AIModelPriceUnitType/aimodelpriceunittype.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIPrompt/aiprompt.form.component.js +13 -13
- package/dist/lib/generated/Entities/AIPrompt/aiprompt.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/AIVendor/aivendor.form.component.js +9 -9
- package/dist/lib/generated/Entities/AIVendor/aivendor.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/Action/action.form.component.js +5 -5
- package/dist/lib/generated/Entities/Action/action.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/ActionAuthorization/actionauthorization.form.component.js +1 -1
- package/dist/lib/generated/Entities/ActionAuthorization/actionauthorization.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/ActionContext/actioncontext.form.component.js +1 -1
- package/dist/lib/generated/Entities/ActionContext/actioncontext.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/Conversation/conversation.form.component.js +5 -5
- package/dist/lib/generated/Entities/Conversation/conversation.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/TemplateContent/templatecontent.form.component.js +4 -4
- package/dist/lib/generated/Entities/TemplateContent/templatecontent.form.component.js.map +1 -1
- package/dist/lib/generated/Entities/User/user.form.component.js +5 -5
- package/dist/lib/generated/Entities/User/user.form.component.js.map +1 -1
- package/package.json +12 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"action-execution-log-form.component.js","sourceRoot":"","sources":["../../../../src/lib/custom/Actions/action-execution-log-form.component.ts","../../../../src/lib/custom/Actions/action-execution-log-form.component.html"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,SAAS,EAAyC,MAAM,eAAe,CAAC;AAGjF,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,+BAA+B,EAAE,MAAM,+EAA+E,CAAC
|
|
1
|
+
{"version":3,"file":"action-execution-log-form.component.js","sourceRoot":"","sources":["../../../../src/lib/custom/Actions/action-execution-log-form.component.ts","../../../../src/lib/custom/Actions/action-execution-log-form.component.html"],"names":[],"mappings":"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"}
|
|
@@ -21,10 +21,9 @@ import * as i6 from "@progress/kendo-angular-inputs";
|
|
|
21
21
|
import * as i7 from "@progress/kendo-angular-dropdowns";
|
|
22
22
|
import * as i8 from "@progress/kendo-angular-buttons";
|
|
23
23
|
import * as i9 from "@memberjunction/ng-form-toolbar";
|
|
24
|
-
import * as i10 from "@memberjunction/ng-
|
|
25
|
-
import * as i11 from "
|
|
26
|
-
import * as i12 from "
|
|
27
|
-
import * as i13 from "@angular/common";
|
|
24
|
+
import * as i10 from "@memberjunction/ng-code-editor";
|
|
25
|
+
import * as i11 from "./action-test-harness.component";
|
|
26
|
+
import * as i12 from "@angular/common";
|
|
28
27
|
const _forTrack0 = ($index, $item) => $item.ID;
|
|
29
28
|
const _c0 = () => ({ text: "Active", value: "Active" });
|
|
30
29
|
const _c1 = () => ({ text: "Pending", value: "Pending" });
|
|
@@ -1550,18 +1549,17 @@ let ActionFormComponentExtended = class ActionFormComponentExtended extends Acti
|
|
|
1550
1549
|
}
|
|
1551
1550
|
}
|
|
1552
1551
|
static { this.ɵfac = function ActionFormComponentExtended_Factory(t) { return new (t || ActionFormComponentExtended)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1.SharedService), i0.ɵɵdirectiveInject(i2.Router), i0.ɵɵdirectiveInject(i2.ActivatedRoute), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i3.DialogService)); }; }
|
|
1553
|
-
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ActionFormComponentExtended, selectors: [["mj-action-form"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars:
|
|
1552
|
+
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ActionFormComponentExtended, selectors: [["mj-action-form"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 3, vars: 2, consts: [["form", "ngForm"], [1, "record-form-container"], [1, "record-form"], [3, "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [3, "form"], [1, "action-main-area", 2, "display", "flex", "flex-direction", "column", "height", "100%", "overflow-y", "auto"], [1, "action-header", 2, "flex-shrink", "0", "padding", "20px", "background", "#f8f9fa", "border-bottom", "2px solid #e9ecef"], [2, "display", "flex", "justify-content", "space-between", "align-items", "flex-start", "gap", "20px"], [2, "flex", "1", "min-width", "0"], [2, "display", "flex", "align-items", "center", "gap", "12px", "margin-bottom", "8px"], [2, "font-size", "1.4em"], ["name", "actionName", "placeholder", "Enter action name...", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModel"], [2, "display", "flex", "gap", "16px", "margin-bottom", "12px", "flex-wrap", "wrap"], ["name", "actionDescription", "placeholder", "Enter action description...", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModel", "rows"], [2, "margin", "0 0 12px 0", "color", "#6c757d", "font-size", "0.9em", "line-height", "1.4"], [1, "quick-config", 2, "display", "flex", "align-items", "center", "gap", "16px", "flex-wrap", "wrap"], [1, "config-item", 2, "display", "flex", "align-items", "center", "gap", "6px", "font-size", "0.85em"], [1, "fa-solid", "fa-cube", 2, "color", "#6c757d"], [2, "color", "#6c757d"], [2, "color", "#495057", "font-weight", "500"], [1, "action-buttons", 2, "display", "flex", "flex-direction", "column", "gap", "8px", "align-items", "flex-end"], [2, "display", "flex", "gap", "8px"], ["themeColor", "primary", "size", "large", "title", "Open Run Harness", 3, "disabled"], ["themeColor", "info", "size", "medium", "title", "Regenerate Code"], [2, "font-size", "0.75em", "color", "#dc3545", "text-align", "right"], [1, "configuration-sections", 2, "flex", "1", "background", "white", "border-top", "2px solid #e9ecef", "padding", "16px", "min-height", "0"], [2, "margin-bottom", "12px", 3, "expanded"], ["kendoExpansionPanelTitleDirective", ""], [2, "padding", "16px"], [1, "loading-state"], [1, "empty-state", 2, "padding", "30px", "text-align", "center"], [1, "result-codes-grid"], ["name", "actionName", "placeholder", "Enter action name...", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModelChange", "ngModel"], [2, "margin", "0", "color", "#495057", "font-weight", "600", "flex", "1"], [1, "status-badge", 2, "color", "white", "padding", "4px 10px", "border-radius", "12px", "font-size", "0.75em", "font-weight", "500"], [2, "display", "block", "margin-bottom", "4px", "font-weight", "600", "color", "#495057", "font-size", "0.9em"], ["name", "actionStatus", "textField", "text", "valueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [2, "color", "#dc3545"], ["name", "actionType", "textField", "text", "valueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], ["name", "categoryID", "placeholder", "Select category...", 2, "width", "200px", 3, "ngModelChange", "ngModel", "data"], ["name", "actionDescription", "placeholder", "Enter action description...", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModelChange", "ngModel", "rows"], [1, "fa-solid", "fa-folder", 2, "color", "#6c757d"], [2, "color", "#495057", "font-weight", "500", "cursor", "pointer", 3, "click"], [1, "fa-solid", "fa-external-link", 2, "font-size", "0.75em", "margin-left", "4px"], [2, "font-weight", "500"], [1, "fa-solid", "fa-sliders", 2, "color", "#6c757d"], ["themeColor", "primary", "size", "large", "title", "Open Run Harness", 3, "click", "disabled"], [1, "fa-solid", "fa-play"], ["themeColor", "info", "size", "medium", "title", "Regenerate Code", 3, "click"], [1, "fa-solid", "fa-robot"], ["themeColor", "success", "size", "small", 3, "click"], [1, "fa-solid", "fa-check"], ["themeColor", "error", "size", "small", 3, "click"], [1, "fa-solid", "fa-times"], [2, "display", "flex", "align-items", "center", "gap", "8px", "font-weight", "600"], [2, "background", "#17a2b8", "color", "white", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-sliders", 2, "font-size", "2em", "color", "#6c757d", "opacity", "0.3"], [2, "margin", "12px 0 0 0", "color", "#6c757d"], [2, "margin", "8px 0 0 0", "font-size", "0.85em", "color", "#6c757d"], [1, "params-section"], [1, "params-header"], [1, "fa-solid", "fa-sign-in-alt"], ["fillMode", "flat", "size", "small"], [1, "params-grid"], [1, "params-section", 2, "margin-top", "24px"], [1, "fa-solid", "fa-sign-out-alt"], [1, "empty-state", 2, "padding", "20px", "text-align", "center"], ["fillMode", "flat", "size", "small", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "fa-solid", "fa-inbox", 2, "font-size", "2em", "color", "#6c757d", "opacity", "0.3"], [1, "param-card", 3, "required", "clickable"], [1, "param-card", 3, "click"], [1, "param-header"], [1, "param-name"], [1, "param-badges"], [1, "required-badge"], [1, "array-badge"], [1, "param-details"], [1, "param-type"], [1, "param-description"], [1, "param-default"], ["title", "Edit parameter", 1, "param-edit-btn", 3, "click"], [1, "fa-solid", "fa-edit"], ["title", "Delete parameter", 1, "param-delete-btn", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "default-label"], [1, "param-card", 3, "clickable"], [1, "generation-panel"], [1, "code-editor-section"], [1, "code-toolbar"], [1, "fa-solid", "fa-file-code"], [1, "code-actions"], [1, "fa-solid", "fa-copy"], ["name", "actionCode", 2, "height", "400px", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"], [1, "code-comments"], [1, "approval-comments"], [1, "fa-solid", "fa-code", 2, "color", "#6c757d"], [2, "background", "#ffc107", "color", "#856404", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [1, "fa-solid", "fa-lock"], [1, "prompt-section"], ["name", "userPrompt", "placeholder", "Describe what this action should do...", 2, "width", "100%", "min-height", "120px", 3, "ngModelChange", "ngModel", "rows"], [1, "comments-section"], ["name", "userComments", "placeholder", "Internal notes...", 2, "width", "100%", 3, "ngModelChange", "ngModel", "rows"], [1, "generation-controls"], ["name", "codeLocked", 3, "ngModelChange", "ngModel"], [2, "margin-left", "8px"], [1, "fa-solid", "fa-comment"], ["name", "codeApprovalComments", "placeholder", "Explain why the code was rejected...", 2, "width", "100%", 3, "ngModelChange", "ngModel", "rows"], [1, "fa-solid", "fa-flag-checkered", 2, "color", "#6c757d"], [2, "background", "#28a745", "color", "white", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [1, "fa-solid", "fa-flag-checkered", 2, "font-size", "2em", "color", "#6c757d", "opacity", "0.3"], [1, "result-code-card", 3, "success", "failure"], [1, "result-code-card"], [1, "result-icon"], [1, "result-content"], [1, "result-code"], [1, "result-description"], [1, "fa-solid", "fa-chart-line", 2, "color", "#6c757d"], [1, "fa-solid", "fa-chart-line", 2, "font-size", "2em", "color", "#6c757d", "opacity", "0.3"], [1, "execution-stats-row"], [1, "stat-box"], [1, "fa-solid", "fa-tachometer-alt"], [1, "stat-info"], [1, "stat-label", 2, "color", "#212529"], [1, "stat-value", 2, "color", "#212529"], [1, "fa-solid", "fa-check-circle"], [1, "stat-value", 2, "font-weight", "600"], [1, "fa-solid", "fa-play-circle"], [2, "margin-top", "24px"], [1, "fa-solid", "fa-history"], [1, "executions-table"], [1, "execution-row", 3, "success"], [1, "execution-row"], [1, "running"], [1, "fa-solid", "fa-external-link"], [1, "config-subsection"], [1, "fa-solid", "fa-book"], [1, "empty-state", "mini"], [1, "library-cards"], [1, "related-entities-grid"], [1, "related-entity-link"], [1, "fa-solid", "fa-shield-alt"], [1, "entity-count"], [1, "fa-solid", "fa-layer-group"], [1, "fa-solid", "fa-calendar"], [1, "fa-solid", "fa-cube"], [1, "fa-solid", "fa-cogs", 2, "color", "#6c757d"], [1, "library-card"], [1, "library-card", 3, "click"], [1, "library-info"], [1, "library-name"], [1, "library-items"], [3, "close", "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [3, "visibilityChange", "action", "actionParams", "isVisible"]], template: function ActionFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
|
|
1554
1553
|
i0.ɵɵelementStart(0, "div", 1);
|
|
1555
1554
|
i0.ɵɵtemplate(1, ActionFormComponentExtended_Conditional_1_Template, 46, 23, "form", 2);
|
|
1556
1555
|
i0.ɵɵelementEnd();
|
|
1557
1556
|
i0.ɵɵtemplate(2, ActionFormComponentExtended_Conditional_2_Template, 2, 12, "kendo-window", 3);
|
|
1558
1557
|
} if (rf & 2) {
|
|
1559
|
-
i0.ɵɵproperty("bottomMargin", 20)("rightMargin", 5);
|
|
1560
1558
|
i0.ɵɵadvance();
|
|
1561
1559
|
i0.ɵɵconditional(ctx.record ? 1 : -1);
|
|
1562
1560
|
i0.ɵɵadvance();
|
|
1563
1561
|
i0.ɵɵconditional(ctx.showTestHarness ? 2 : -1);
|
|
1564
|
-
} }, dependencies: [i4.ɵNgNoValidate, i4.NgControlStatus, i4.NgControlStatusGroup, i4.NgModel, i4.NgForm, i5.ExpansionPanelComponent, i5.ExpansionPanelTitleDirective, i3.WindowComponent, i6.TextAreaComponent, i6.TextBoxComponent, i6.SwitchComponent, i7.DropDownListComponent, i8.ButtonComponent, i9.FormToolbarComponent, i10.FillContainer, i11.CodeEditorComponent, i12.ActionTestHarnessComponent, i13.DatePipe], styles: ["\n\n.action-hero-header[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 32px;\n margin: -20px -20px 24px -20px;\n border-radius: 0 0 16px 16px;\n box-shadow: 0 4px 20px rgba(0,0,0,0.1);\n}\n\n.hero-content[_ngcontent-%COMP%] {\n max-width: 1400px;\n margin: 0 auto;\n}\n\n.action-identity[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 24px;\n margin-bottom: 24px;\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%] {\n width: 80px;\n height: 80px;\n border-radius: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 36px;\n}\n\n.action-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.action-title-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n margin-bottom: 12px;\n flex-wrap: wrap;\n}\n\n.action-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 2em;\n font-weight: 600;\n color: white;\n}\n\n.action-name-input[_ngcontent-%COMP%] {\n font-size: 1.8em;\n font-weight: 600;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n padding: 8px 16px;\n border-radius: 8px;\n min-width: 400px;\n}\n\n.action-name-input[_ngcontent-%COMP%]::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n.action-badges[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n flex-wrap: wrap;\n}\n\n.status-badge[_ngcontent-%COMP%], .type-badge[_ngcontent-%COMP%], .approval-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n border-radius: 20px;\n font-size: 0.85em;\n font-weight: 500;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.3);\n}\n\n.action-category[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n color: rgba(255,255,255,0.9);\n font-size: 0.95em;\n cursor: pointer;\n transition: all 0.2s;\n margin-bottom: 12px;\n}\n\n.action-category[_ngcontent-%COMP%]:hover {\n color: white;\n transform: translateX(4px);\n}\n\n.action-description[_ngcontent-%COMP%] {\n color: rgba(255,255,255,0.9);\n font-size: 1.05em;\n line-height: 1.5;\n margin: 0;\n}\n\n.action-description-input[_ngcontent-%COMP%] {\n width: 100%;\n max-width: 600px;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n border-radius: 8px;\n}\n\n.action-description-input[_ngcontent-%COMP%]::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n\n\n.action-stats[_ngcontent-%COMP%] {\n display: flex;\n gap: 24px;\n margin-bottom: 24px;\n flex-wrap: wrap;\n}\n\n.stat-card[_ngcontent-%COMP%] {\n background: rgba(255,255,255,0.1);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.2);\n border-radius: 12px;\n padding: 16px 24px;\n display: flex;\n align-items: center;\n gap: 16px;\n min-width: 160px;\n}\n\n.stat-card[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 24px;\n color: rgba(255,255,255,0.8);\n}\n\n.stat-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n font-size: 1.4em;\n font-weight: 700;\n color: white;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n font-size: 0.85em;\n color: rgba(255,255,255,0.7);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n\n\n.hero-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.hero-actions[_ngcontent-%COMP%] kendo-button[_ngcontent-%COMP%] {\n backdrop-filter: blur(10px);\n}\n\n\n\n.action-content[_ngcontent-%COMP%] {\n padding: 0 20px 20px;\n}\n\n.content-section[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e9ecef;\n border-radius: 12px;\n margin-bottom: 20px;\n overflow: hidden;\n transition: all 0.3s ease;\n}\n\n.content-section[_ngcontent-%COMP%]:hover {\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.section-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 20px;\n background: #f8f9fa;\n cursor: pointer;\n user-select: none;\n transition: background 0.2s;\n}\n\n.section-header[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n}\n\n.section-header[_ngcontent-%COMP%] h2[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.3em;\n color: #2c3e50;\n flex: 1;\n}\n\n.section-header[_ngcontent-%COMP%] i[_ngcontent-%COMP%]:first-child {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.section-count[_ngcontent-%COMP%] {\n background: #007bff;\n color: white;\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 0.85em;\n font-weight: 500;\n}\n\n.toggle-icon[_ngcontent-%COMP%] {\n color: #6c757d;\n transition: transform 0.3s;\n}\n\n.toggle-icon.rotated[_ngcontent-%COMP%] {\n transform: rotate(-90deg);\n}\n\n.section-content[_ngcontent-%COMP%] {\n padding: 24px;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n\n\n.overview-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n}\n\n.overview-field[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.overview-field[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.9em;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.required[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.full-width[_ngcontent-%COMP%] {\n width: 100%;\n}\n\n.overview-display[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 24px;\n}\n\n.display-field[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.display-field[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n font-size: 0.85em;\n color: #6c757d;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.display-value[_ngcontent-%COMP%] {\n font-size: 1.1em;\n color: #2c3e50;\n}\n\n.display-value.code[_ngcontent-%COMP%] {\n font-family: 'Courier New', monospace;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 4px;\n}\n\n.approval-date[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.85em;\n margin-left: 8px;\n}\n\n\n\n.generation-panel[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n margin-bottom: 24px;\n}\n\n.generation-panel[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 16px 0;\n color: #6f42c1;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.prompt-section[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%] {\n margin-bottom: 16px;\n}\n\n.prompt-section[_ngcontent-%COMP%] label[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #495057;\n}\n\n.generation-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding-top: 12px;\n border-top: 1px solid #dee2e6;\n}\n\n.code-locked-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 4px 10px;\n background: #ffc107;\n color: #856404;\n border-radius: 12px;\n font-size: 0.8em;\n font-weight: 500;\n}\n\n.code-editor-section[_ngcontent-%COMP%] {\n border: 1px solid #e9ecef;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.code-toolbar[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #e9ecef;\n}\n\n.code-toolbar[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.1em;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%] {\n background: #e3f2fd;\n border: 1px solid #90caf9;\n border-radius: 8px;\n padding: 16px;\n margin-top: 16px;\n}\n\n.code-comments[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0 0 8px 0;\n color: #1976d2;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n color: #424242;\n line-height: 1.5;\n}\n\n.approval-comments[_ngcontent-%COMP%] {\n margin-top: 16px;\n}\n\n.approval-comments[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #dc3545;\n}\n\n\n\n.params-section[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-radius: 12px;\n padding: 20px;\n}\n\n.params-section.params-section-compact[_ngcontent-%COMP%] {\n padding: 12px 20px;\n}\n\n.params-section-compact[_ngcontent-%COMP%] .empty-state[_ngcontent-%COMP%] {\n padding: 12px !important;\n}\n\n.params-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 16px;\n}\n\n.params-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.params-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.param-card[_ngcontent-%COMP%] {\n background: white;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n padding: 16px;\n transition: all 0.2s;\n}\n\n.param-card[_ngcontent-%COMP%]:hover {\n border-color: #007bff;\n box-shadow: 0 2px 8px rgba(0,123,255,0.1);\n}\n\n.param-card.required[_ngcontent-%COMP%] {\n border-color: #ffc107;\n}\n\n.param-card.clickable[_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.param-card.clickable[_ngcontent-%COMP%]:hover {\n background: #e7f3ff;\n border-color: #2196f3;\n transform: translateY(-1px);\n}\n\n.param-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 8px;\n}\n\n.param-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.param-badges[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.param-edit-btn[_ngcontent-%COMP%], \n.param-delete-btn[_ngcontent-%COMP%] {\n background: none;\n border: none;\n padding: 4px 8px;\n cursor: pointer;\n color: #6c757d;\n border-radius: 4px;\n transition: all 0.2s;\n}\n\n.param-edit-btn[_ngcontent-%COMP%]:hover {\n background: #e3f2fd;\n color: #2196f3;\n}\n\n.param-delete-btn[_ngcontent-%COMP%]:hover {\n background: #ffebee;\n color: #f44336;\n}\n\n.param-details[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.required-badge[_ngcontent-%COMP%] {\n background: #ffc107;\n color: #856404;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.array-badge[_ngcontent-%COMP%] {\n background: #6f42c1;\n color: white;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.param-type[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9em;\n margin-bottom: 8px;\n}\n\n.param-description[_ngcontent-%COMP%] {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n margin-bottom: 8px;\n}\n\n.param-default[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 8px;\n padding-top: 8px;\n border-top: 1px solid #e9ecef;\n}\n\n.default-label[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.85em;\n}\n\n.param-default[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #f8f9fa;\n padding: 2px 6px;\n border-radius: 4px;\n font-family: 'Courier New', monospace;\n color: #e83e8c;\n}\n\n\n\n\n.result-codes-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.result-code-card[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n background: white;\n transition: all 0.2s;\n}\n\n.result-code-card[_ngcontent-%COMP%]:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.result-code-card.success[_ngcontent-%COMP%] {\n border-color: #28a745;\n background: #d4edda;\n}\n\n.result-code-card.failure[_ngcontent-%COMP%] {\n border-color: #dc3545;\n background: #f8d7da;\n}\n\n.result-icon[_ngcontent-%COMP%] {\n font-size: 1.5em;\n flex-shrink: 0;\n}\n\n.result-code-card.success[_ngcontent-%COMP%] .result-icon[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.result-code-card.failure[_ngcontent-%COMP%] .result-icon[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.result-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.result-code[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n font-family: 'Courier New', monospace;\n}\n\n.result-description[_ngcontent-%COMP%] {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n}\n\n\n\n.execution-stats-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 20px;\n margin-bottom: 32px;\n flex-wrap: wrap;\n}\n\n.stat-box[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 200px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.stat-box[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 2em;\n color: #6c757d;\n}\n\n.stat-info[_ngcontent-%COMP%] {\n flex: 1;\n}\n\n.executions-table[_ngcontent-%COMP%] {\n overflow-x: auto;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n}\n\n.executions-table[_ngcontent-%COMP%] table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n}\n\n.executions-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n background: #f8f9fa;\n padding: 12px;\n text-align: left;\n font-weight: 600;\n color: #495057;\n border-bottom: 2px solid #e9ecef;\n}\n\n.executions-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 12px;\n border-bottom: 1px solid #e9ecef;\n}\n\n.execution-row[_ngcontent-%COMP%] {\n transition: background 0.2s;\n}\n\n.execution-row[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n}\n\n.execution-row.success[_ngcontent-%COMP%] {\n background: #d4edda20;\n}\n\n.running[_ngcontent-%COMP%] {\n color: #ffc107;\n font-style: italic;\n}\n\n.result-code[_ngcontent-%COMP%] {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 0.85em;\n font-weight: 500;\n font-family: 'Courier New', monospace;\n}\n\n.result-code.success[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #155724;\n}\n\n.result-code.failure[_ngcontent-%COMP%] {\n background: #f8d7da;\n color: #721c24;\n}\n\n\n\n.config-subsection[_ngcontent-%COMP%] {\n margin-bottom: 32px;\n}\n\n.config-subsection[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 16px 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.library-cards[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.library-card[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.library-card[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n transform: translateX(4px);\n}\n\n.library-card[_ngcontent-%COMP%] i[_ngcontent-%COMP%]:first-child {\n font-size: 1.5em;\n color: #6c757d;\n}\n\n.library-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.library-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n}\n\n.library-items[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9em;\n font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.related-entity-link[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.related-entity-link[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #007bff;\n}\n\n.related-entity-link[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.related-entity-link[_ngcontent-%COMP%] span[_ngcontent-%COMP%]:first-of-type {\n flex: 1;\n font-weight: 500;\n color: #495057;\n}\n\n.entity-count[_ngcontent-%COMP%] {\n color: #007bff;\n font-size: 0.9em;\n}\n\n\n\n.loading-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.loading-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 2em;\n margin-bottom: 12px;\n}\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.empty-state.mini[_ngcontent-%COMP%] {\n padding: 20px;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 3em;\n margin-bottom: 16px;\n opacity: 0.3;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.1em;\n}\n\n.empty-hint[_ngcontent-%COMP%] {\n margin-top: 8px !important;\n font-size: 0.9em !important;\n opacity: 0.7;\n}\n\n.no-params[_ngcontent-%COMP%] {\n text-align: center;\n padding: 20px;\n color: #6c757d;\n font-style: italic;\n}\n\n.no-params[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n}\n\n\n\n@media (max-width: 768px) {\n .action-hero-header[_ngcontent-%COMP%] {\n padding: 20px;\n }\n \n .action-identity[_ngcontent-%COMP%] {\n flex-direction: column;\n text-align: center;\n }\n \n .action-icon-wrapper[_ngcontent-%COMP%] {\n margin: 0 auto;\n }\n \n .action-title-row[_ngcontent-%COMP%] {\n justify-content: center;\n }\n \n .action-stats[_ngcontent-%COMP%] {\n justify-content: center;\n }\n \n .params-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}"] }); }
|
|
1562
|
+
} }, dependencies: [i4.ɵNgNoValidate, i4.NgControlStatus, i4.NgControlStatusGroup, i4.NgModel, i4.NgForm, i5.ExpansionPanelComponent, i5.ExpansionPanelTitleDirective, i3.WindowComponent, i6.TextAreaComponent, i6.TextBoxComponent, i6.SwitchComponent, i7.DropDownListComponent, i8.ButtonComponent, i9.FormToolbarComponent, i10.CodeEditorComponent, i11.ActionTestHarnessComponent, i12.DatePipe], styles: ["\n\n.action-hero-header[_ngcontent-%COMP%] {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 32px;\n margin: -20px -20px 24px -20px;\n border-radius: 0 0 16px 16px;\n box-shadow: 0 4px 20px rgba(0,0,0,0.1);\n}\n\n.hero-content[_ngcontent-%COMP%] {\n max-width: 1400px;\n margin: 0 auto;\n}\n\n.action-identity[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 24px;\n margin-bottom: 24px;\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%] {\n width: 80px;\n height: 80px;\n border-radius: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 36px;\n}\n\n.action-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.action-title-row[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n margin-bottom: 12px;\n flex-wrap: wrap;\n}\n\n.action-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 2em;\n font-weight: 600;\n color: white;\n}\n\n.action-name-input[_ngcontent-%COMP%] {\n font-size: 1.8em;\n font-weight: 600;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n padding: 8px 16px;\n border-radius: 8px;\n min-width: 400px;\n}\n\n.action-name-input[_ngcontent-%COMP%]::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n.action-badges[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n flex-wrap: wrap;\n}\n\n.status-badge[_ngcontent-%COMP%], .type-badge[_ngcontent-%COMP%], .approval-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n border-radius: 20px;\n font-size: 0.85em;\n font-weight: 500;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.3);\n}\n\n.action-category[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n color: rgba(255,255,255,0.9);\n font-size: 0.95em;\n cursor: pointer;\n transition: all 0.2s;\n margin-bottom: 12px;\n}\n\n.action-category[_ngcontent-%COMP%]:hover {\n color: white;\n transform: translateX(4px);\n}\n\n.action-description[_ngcontent-%COMP%] {\n color: rgba(255,255,255,0.9);\n font-size: 1.05em;\n line-height: 1.5;\n margin: 0;\n}\n\n.action-description-input[_ngcontent-%COMP%] {\n width: 100%;\n max-width: 600px;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n border-radius: 8px;\n}\n\n.action-description-input[_ngcontent-%COMP%]::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n\n\n.action-stats[_ngcontent-%COMP%] {\n display: flex;\n gap: 24px;\n margin-bottom: 24px;\n flex-wrap: wrap;\n}\n\n.stat-card[_ngcontent-%COMP%] {\n background: rgba(255,255,255,0.1);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.2);\n border-radius: 12px;\n padding: 16px 24px;\n display: flex;\n align-items: center;\n gap: 16px;\n min-width: 160px;\n}\n\n.stat-card[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 24px;\n color: rgba(255,255,255,0.8);\n}\n\n.stat-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n font-size: 1.4em;\n font-weight: 700;\n color: white;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n font-size: 0.85em;\n color: rgba(255,255,255,0.7);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n\n\n.hero-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.hero-actions[_ngcontent-%COMP%] kendo-button[_ngcontent-%COMP%] {\n backdrop-filter: blur(10px);\n}\n\n\n\n.action-content[_ngcontent-%COMP%] {\n padding: 0 20px 20px;\n}\n\n.content-section[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #e9ecef;\n border-radius: 12px;\n margin-bottom: 20px;\n overflow: hidden;\n transition: all 0.3s ease;\n}\n\n.content-section[_ngcontent-%COMP%]:hover {\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.section-header[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 20px;\n background: #f8f9fa;\n cursor: pointer;\n user-select: none;\n transition: background 0.2s;\n}\n\n.section-header[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n}\n\n.section-header[_ngcontent-%COMP%] h2[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.3em;\n color: #2c3e50;\n flex: 1;\n}\n\n.section-header[_ngcontent-%COMP%] i[_ngcontent-%COMP%]:first-child {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.section-count[_ngcontent-%COMP%] {\n background: #007bff;\n color: white;\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 0.85em;\n font-weight: 500;\n}\n\n.toggle-icon[_ngcontent-%COMP%] {\n color: #6c757d;\n transition: transform 0.3s;\n}\n\n.toggle-icon.rotated[_ngcontent-%COMP%] {\n transform: rotate(-90deg);\n}\n\n.section-content[_ngcontent-%COMP%] {\n padding: 24px;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n\n\n.overview-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n}\n\n.overview-field[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.overview-field[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #495057;\n font-size: 0.9em;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.required[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.full-width[_ngcontent-%COMP%] {\n width: 100%;\n}\n\n.overview-display[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 24px;\n}\n\n.display-field[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.display-field[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n font-size: 0.85em;\n color: #6c757d;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.display-value[_ngcontent-%COMP%] {\n font-size: 1.1em;\n color: #2c3e50;\n}\n\n.display-value.code[_ngcontent-%COMP%] {\n font-family: 'Courier New', monospace;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 4px;\n}\n\n.approval-date[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.85em;\n margin-left: 8px;\n}\n\n\n\n.generation-panel[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n margin-bottom: 24px;\n}\n\n.generation-panel[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 16px 0;\n color: #6f42c1;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.prompt-section[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%] {\n margin-bottom: 16px;\n}\n\n.prompt-section[_ngcontent-%COMP%] label[_ngcontent-%COMP%], .comments-section[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #495057;\n}\n\n.generation-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding-top: 12px;\n border-top: 1px solid #dee2e6;\n}\n\n.code-locked-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 4px 10px;\n background: #ffc107;\n color: #856404;\n border-radius: 12px;\n font-size: 0.8em;\n font-weight: 500;\n}\n\n.code-editor-section[_ngcontent-%COMP%] {\n border: 1px solid #e9ecef;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.code-toolbar[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #e9ecef;\n}\n\n.code-toolbar[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.1em;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%] {\n background: #e3f2fd;\n border: 1px solid #90caf9;\n border-radius: 8px;\n padding: 16px;\n margin-top: 16px;\n}\n\n.code-comments[_ngcontent-%COMP%] h4[_ngcontent-%COMP%] {\n margin: 0 0 8px 0;\n color: #1976d2;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-comments[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n color: #424242;\n line-height: 1.5;\n}\n\n.approval-comments[_ngcontent-%COMP%] {\n margin-top: 16px;\n}\n\n.approval-comments[_ngcontent-%COMP%] label[_ngcontent-%COMP%] {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #dc3545;\n}\n\n\n\n.params-section[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-radius: 12px;\n padding: 20px;\n}\n\n.params-section.params-section-compact[_ngcontent-%COMP%] {\n padding: 12px 20px;\n}\n\n.params-section-compact[_ngcontent-%COMP%] .empty-state[_ngcontent-%COMP%] {\n padding: 12px !important;\n}\n\n.params-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 16px;\n}\n\n.params-header[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.params-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.param-card[_ngcontent-%COMP%] {\n background: white;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n padding: 16px;\n transition: all 0.2s;\n}\n\n.param-card[_ngcontent-%COMP%]:hover {\n border-color: #007bff;\n box-shadow: 0 2px 8px rgba(0,123,255,0.1);\n}\n\n.param-card.required[_ngcontent-%COMP%] {\n border-color: #ffc107;\n}\n\n.param-card.clickable[_ngcontent-%COMP%] {\n cursor: pointer;\n}\n\n.param-card.clickable[_ngcontent-%COMP%]:hover {\n background: #e7f3ff;\n border-color: #2196f3;\n transform: translateY(-1px);\n}\n\n.param-header[_ngcontent-%COMP%] {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 8px;\n}\n\n.param-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.param-badges[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.param-edit-btn[_ngcontent-%COMP%], \n.param-delete-btn[_ngcontent-%COMP%] {\n background: none;\n border: none;\n padding: 4px 8px;\n cursor: pointer;\n color: #6c757d;\n border-radius: 4px;\n transition: all 0.2s;\n}\n\n.param-edit-btn[_ngcontent-%COMP%]:hover {\n background: #e3f2fd;\n color: #2196f3;\n}\n\n.param-delete-btn[_ngcontent-%COMP%]:hover {\n background: #ffebee;\n color: #f44336;\n}\n\n.param-details[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.required-badge[_ngcontent-%COMP%] {\n background: #ffc107;\n color: #856404;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.array-badge[_ngcontent-%COMP%] {\n background: #6f42c1;\n color: white;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.param-type[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9em;\n margin-bottom: 8px;\n}\n\n.param-description[_ngcontent-%COMP%] {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n margin-bottom: 8px;\n}\n\n.param-default[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 8px;\n padding-top: 8px;\n border-top: 1px solid #e9ecef;\n}\n\n.default-label[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.85em;\n}\n\n.param-default[_ngcontent-%COMP%] code[_ngcontent-%COMP%] {\n background: #f8f9fa;\n padding: 2px 6px;\n border-radius: 4px;\n font-family: 'Courier New', monospace;\n color: #e83e8c;\n}\n\n\n\n\n.result-codes-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.result-code-card[_ngcontent-%COMP%] {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n background: white;\n transition: all 0.2s;\n}\n\n.result-code-card[_ngcontent-%COMP%]:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.result-code-card.success[_ngcontent-%COMP%] {\n border-color: #28a745;\n background: #d4edda;\n}\n\n.result-code-card.failure[_ngcontent-%COMP%] {\n border-color: #dc3545;\n background: #f8d7da;\n}\n\n.result-icon[_ngcontent-%COMP%] {\n font-size: 1.5em;\n flex-shrink: 0;\n}\n\n.result-code-card.success[_ngcontent-%COMP%] .result-icon[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.result-code-card.failure[_ngcontent-%COMP%] .result-icon[_ngcontent-%COMP%] {\n color: #dc3545;\n}\n\n.result-content[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.result-code[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n font-family: 'Courier New', monospace;\n}\n\n.result-description[_ngcontent-%COMP%] {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n}\n\n\n\n.execution-stats-row[_ngcontent-%COMP%] {\n display: flex;\n gap: 20px;\n margin-bottom: 32px;\n flex-wrap: wrap;\n}\n\n.stat-box[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 200px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.stat-box[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 2em;\n color: #6c757d;\n}\n\n.stat-info[_ngcontent-%COMP%] {\n flex: 1;\n}\n\n.executions-table[_ngcontent-%COMP%] {\n overflow-x: auto;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n}\n\n.executions-table[_ngcontent-%COMP%] table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n}\n\n.executions-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n background: #f8f9fa;\n padding: 12px;\n text-align: left;\n font-weight: 600;\n color: #495057;\n border-bottom: 2px solid #e9ecef;\n}\n\n.executions-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 12px;\n border-bottom: 1px solid #e9ecef;\n}\n\n.execution-row[_ngcontent-%COMP%] {\n transition: background 0.2s;\n}\n\n.execution-row[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n}\n\n.execution-row.success[_ngcontent-%COMP%] {\n background: #d4edda20;\n}\n\n.running[_ngcontent-%COMP%] {\n color: #ffc107;\n font-style: italic;\n}\n\n.result-code[_ngcontent-%COMP%] {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 0.85em;\n font-weight: 500;\n font-family: 'Courier New', monospace;\n}\n\n.result-code.success[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #155724;\n}\n\n.result-code.failure[_ngcontent-%COMP%] {\n background: #f8d7da;\n color: #721c24;\n}\n\n\n\n.config-subsection[_ngcontent-%COMP%] {\n margin-bottom: 32px;\n}\n\n.config-subsection[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n margin: 0 0 16px 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.library-cards[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.library-card[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.library-card[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n transform: translateX(4px);\n}\n\n.library-card[_ngcontent-%COMP%] i[_ngcontent-%COMP%]:first-child {\n font-size: 1.5em;\n color: #6c757d;\n}\n\n.library-info[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.library-name[_ngcontent-%COMP%] {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n}\n\n.library-items[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 0.9em;\n font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.related-entity-link[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.related-entity-link[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #007bff;\n}\n\n.related-entity-link[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.related-entity-link[_ngcontent-%COMP%] span[_ngcontent-%COMP%]:first-of-type {\n flex: 1;\n font-weight: 500;\n color: #495057;\n}\n\n.entity-count[_ngcontent-%COMP%] {\n color: #007bff;\n font-size: 0.9em;\n}\n\n\n\n.loading-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.loading-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 2em;\n margin-bottom: 12px;\n}\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.empty-state.mini[_ngcontent-%COMP%] {\n padding: 20px;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 3em;\n margin-bottom: 16px;\n opacity: 0.3;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 1.1em;\n}\n\n.empty-hint[_ngcontent-%COMP%] {\n margin-top: 8px !important;\n font-size: 0.9em !important;\n opacity: 0.7;\n}\n\n.no-params[_ngcontent-%COMP%] {\n text-align: center;\n padding: 20px;\n color: #6c757d;\n font-style: italic;\n}\n\n.no-params[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n margin: 0;\n}\n\n\n\n@media (max-width: 768px) {\n .action-hero-header[_ngcontent-%COMP%] {\n padding: 20px;\n }\n \n .action-identity[_ngcontent-%COMP%] {\n flex-direction: column;\n text-align: center;\n }\n \n .action-icon-wrapper[_ngcontent-%COMP%] {\n margin: 0 auto;\n }\n \n .action-title-row[_ngcontent-%COMP%] {\n justify-content: center;\n }\n \n .action-stats[_ngcontent-%COMP%] {\n justify-content: center;\n }\n \n .params-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}"] }); }
|
|
1565
1563
|
};
|
|
1566
1564
|
ActionFormComponentExtended = __decorate([
|
|
1567
1565
|
RegisterClass(BaseFormComponent, 'Actions')
|
|
@@ -1569,7 +1567,7 @@ ActionFormComponentExtended = __decorate([
|
|
|
1569
1567
|
export { ActionFormComponentExtended };
|
|
1570
1568
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ActionFormComponentExtended, [{
|
|
1571
1569
|
type: Component,
|
|
1572
|
-
args: [{ selector: 'mj-action-form', template: "<div class=\"record-form-container\" mjFillContainer [bottomMargin]=\"20\" [rightMargin]=\"5\">\n @if (record) {\n <form class=\"record-form\" #form=\"ngForm\" mjFillContainer>\n <mj-form-toolbar [form]=\"this\"></mj-form-toolbar>\n\n <!-- Main Content Area -->\n <div class=\"action-main-area\" style=\"display: flex; flex-direction: column; height: 100%; overflow-y: auto;\">\n \n <!-- Header Section -->\n <div class=\"action-header\" style=\"flex-shrink: 0; padding: 20px; background: #f8f9fa; border-bottom: 2px solid #e9ecef;\">\n <div style=\"display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;\">\n \n <!-- Left: Action Info -->\n <div style=\"flex: 1; min-width: 0;\">\n <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 8px;\">\n <i [class]=\"'fa-solid ' + getTypeIcon()\" [style.color]=\"getTypeColor()\" style=\"font-size: 1.4em;\"></i>\n @if (EditMode) {\n <kendo-textbox [(ngModel)]=\"record.Name\" \n name=\"actionName\"\n placeholder=\"Enter action name...\"\n style=\"font-size: 1.2em; font-weight: 600; min-width: 300px; flex: 1;\">\n </kendo-textbox>\n } @else {\n <h4 style=\"margin: 0; color: #495057; font-weight: 600; flex: 1;\">{{ record.Name || 'Untitled Action' }}</h4>\n <span class=\"status-badge\" [style.background-color]=\"getStatusColor()\" \n style=\"color: white; padding: 4px 10px; border-radius: 12px; font-size: 0.75em; font-weight: 500;\">\n {{ record.Status }}\n </span>\n }\n </div>\n \n <!-- Status and Type Editors when in edit mode -->\n @if (EditMode) {\n <div style=\"display: flex; gap: 16px; margin-bottom: 12px; flex-wrap: wrap;\">\n <div>\n <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">Status</label>\n <kendo-dropdownlist [(ngModel)]=\"record.Status\"\n name=\"actionStatus\"\n [data]=\"[{text: 'Active', value: 'Active'}, {text: 'Pending', value: 'Pending'}, {text: 'Disabled', value: 'Disabled'}]\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n style=\"width: 150px;\">\n </kendo-dropdownlist>\n </div>\n <div>\n <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n Type <span style=\"color: #dc3545;\">*</span>\n </label>\n <kendo-dropdownlist [(ngModel)]=\"record.Type\"\n name=\"actionType\"\n [data]=\"[{text: 'Generated', value: 'Generated'}, {text: 'Custom', value: 'Custom'}]\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n style=\"width: 150px;\">\n </kendo-dropdownlist>\n </div>\n <div>\n <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n Category <span style=\"color: #dc3545;\">*</span>\n </label>\n <kendo-dropdownlist [(ngModel)]=\"record.CategoryID\"\n name=\"categoryID\"\n [data]=\"[]\"\n placeholder=\"Select category...\"\n style=\"width: 200px;\">\n </kendo-dropdownlist>\n </div>\n </div>\n }\n \n @if (EditMode) {\n <kendo-textarea [(ngModel)]=\"record.Description\" \n name=\"actionDescription\"\n [rows]=\"2\"\n placeholder=\"Enter action description...\"\n style=\"width: 100%; max-width: 600px; margin-bottom: 12px;\">\n </kendo-textarea>\n } @else if (record.Description) {\n <p style=\"margin: 0 0 12px 0; color: #6c757d; font-size: 0.9em; line-height: 1.4;\">{{ record.Description }}</p>\n }\n \n <!-- Quick Config Row -->\n <div class=\"quick-config\" style=\"display: flex; align-items: center; gap: 16px; flex-wrap: wrap;\">\n @if (category) {\n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i class=\"fa-solid fa-folder\" style=\"color: #6c757d;\"></i>\n <span style=\"color: #6c757d;\">Category:</span>\n <span style=\"color: #495057; font-weight: 500; cursor: pointer;\" (click)=\"navigateToCategory()\">\n {{ category.Name }}\n <i class=\"fa-solid fa-external-link\" style=\"font-size: 0.75em; margin-left: 4px;\"></i>\n </span>\n </div>\n }\n \n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i class=\"fa-solid fa-cube\" style=\"color: #6c757d;\"></i>\n <span style=\"color: #6c757d;\">Type:</span>\n <span style=\"color: #495057; font-weight: 500;\">{{ record.Type }}</span>\n </div>\n \n @if (record.Type === 'Generated' && record.CodeApprovalStatus) {\n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" [style.color]=\"getApprovalStatusColor()\"></i>\n <span style=\"color: #6c757d;\">Code:</span>\n <span [style.color]=\"getApprovalStatusColor()\" style=\"font-weight: 500;\">{{ record.CodeApprovalStatus }}</span>\n </div>\n }\n \n @if (actionParams.length > 0) {\n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i class=\"fa-solid fa-sliders\" style=\"color: #6c757d;\"></i>\n <span style=\"color: #495057; font-weight: 500;\">{{ actionParams.length }} Parameters</span>\n </div>\n }\n </div>\n </div>\n \n <!-- Right: Action Buttons -->\n <div class=\"action-buttons\" style=\"display: flex; flex-direction: column; gap: 8px; align-items: flex-end;\">\n <div style=\"display: flex; gap: 8px;\">\n @if (record.ID) {\n <kendo-button themeColor=\"primary\" size=\"large\"\n (click)=\"openTestHarness()\"\n title=\"Open Run Harness\"\n [disabled]=\"record.Status !== 'Active'\">\n <i class=\"fa-solid fa-play\"></i> Run\n </kendo-button>\n }\n @if (EditMode && record.Type === 'Generated') {\n <kendo-button themeColor=\"info\" size=\"medium\"\n (click)=\"regenerateCode()\"\n title=\"Regenerate Code\">\n <i class=\"fa-solid fa-robot\"></i> Regenerate\n </kendo-button>\n }\n </div>\n \n @if (EditMode && record.CodeApprovalStatus === 'Pending' && record.Type === 'Generated') {\n <div style=\"display: flex; gap: 8px;\">\n <kendo-button themeColor=\"success\" size=\"small\"\n (click)=\"approveCode()\">\n <i class=\"fa-solid fa-check\"></i> Approve\n </kendo-button>\n <kendo-button themeColor=\"error\" size=\"small\"\n (click)=\"rejectCode()\">\n <i class=\"fa-solid fa-times\"></i> Reject\n </kendo-button>\n </div>\n }\n \n @if (!EditMode && record.Status !== 'Active' && record.ID) {\n <div style=\"font-size: 0.75em; color: #dc3545; text-align: right;\">\n Action must be Active to execute\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Configuration Sections with Expansion Panels -->\n <div class=\"configuration-sections\" style=\"flex: 1; background: white; border-top: 2px solid #e9ecef; padding: 16px; min-height: 0;\">\n \n <!-- Parameters Section (FIRST) -->\n <kendo-expansionpanel \n [expanded]=\"true\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-sliders\" style=\"color: #6c757d;\"></i>\n Parameters\n @if (actionParams.length > 0) {\n <span style=\"background: #17a2b8; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n {{ actionParams.length }}\n </span>\n }\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (isLoadingParams) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading parameters...\n </div>\n } @else if (actionParams.length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-sliders\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No parameters defined</p>\n @if (EditMode && record.IsSaved) {\n <p style=\"margin: 8px 0 0 0; font-size: 0.85em; color: #6c757d;\">Add parameters to define inputs and outputs for this action</p>\n }\n </div>\n } @else {\n <!-- Input Parameters Grid -->\n <div class=\"params-section\">\n <div class=\"params-header\">\n <h3><i class=\"fa-solid fa-sign-in-alt\"></i> Input Parameters</h3>\n @if (EditMode && record.IsSaved) {\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"addParameter('Input')\">\n <i class=\"fa-solid fa-plus\"></i> Add Input\n </kendo-button>\n }\n </div>\n \n @if (getInputParams().length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-inbox\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No input parameters defined</p>\n </div>\n } @else {\n <div class=\"params-grid\">\n @for (param of getInputParams(); track param.ID) {\n <div class=\"param-card\" [class.required]=\"param.IsRequired\" \n [class.clickable]=\"true\"\n (click)=\"onParamClick(param, $event)\">\n <div class=\"param-header\">\n <span class=\"param-name\">{{ param.Name }}</span>\n <div class=\"param-badges\">\n @if (param.IsRequired) {\n <span class=\"required-badge\">Required</span>\n }\n @if (param.IsArray) {\n <span class=\"array-badge\">Array</span>\n }\n @if (EditMode) {\n <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n <i class=\"fa-solid fa-edit\"></i>\n </button>\n <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n </div>\n </div>\n <div class=\"param-details\">\n <div class=\"param-type\">{{ param.ValueType }}</div>\n @if (param.Description) {\n <div class=\"param-description\">{{ param.Description }}</div>\n }\n @if (param.DefaultValue) {\n <div class=\"param-default\">\n <span class=\"default-label\">Default:</span>\n <code>{{ param.DefaultValue }}</code>\n </div>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Output Parameters Grid -->\n <div class=\"params-section\" style=\"margin-top: 24px;\" \n [class.params-section-compact]=\"getOutputParams().length === 0\">\n <div class=\"params-header\">\n <h3><i class=\"fa-solid fa-sign-out-alt\"></i> Output Parameters</h3>\n @if (EditMode && record.IsSaved) {\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"addParameter('Output')\">\n <i class=\"fa-solid fa-plus\"></i> Add Output\n </kendo-button>\n }\n </div>\n \n @if (getOutputParams().length === 0) {\n <div class=\"empty-state\" style=\"padding: 20px; text-align: center;\">\n <i class=\"fa-solid fa-inbox\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No output parameters defined</p>\n </div>\n } @else {\n <div class=\"params-grid\">\n @for (param of getOutputParams(); track param.ID) {\n <div class=\"param-card\"\n [class.clickable]=\"true\"\n (click)=\"onParamClick(param, $event)\">\n <div class=\"param-header\">\n <span class=\"param-name\">{{ param.Name }}</span>\n <div class=\"param-badges\">\n @if (param.IsArray) {\n <span class=\"array-badge\">Array</span>\n }\n @if (EditMode) {\n <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n <i class=\"fa-solid fa-edit\"></i>\n </button>\n <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n </div>\n </div>\n <div class=\"param-details\">\n <div class=\"param-type\">{{ param.ValueType }}</div>\n @if (param.Description) {\n <div class=\"param-description\">{{ param.Description }}</div>\n }\n @if (param.DefaultValue) {\n <div class=\"param-default\">\n <span class=\"default-label\">Default:</span>\n <code>{{ param.DefaultValue }}</code>\n </div>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n </kendo-expansionpanel>\n\n <!-- Code & Generation Section (Only for Generated type) -->\n @if (record.Type === 'Generated') {\n <kendo-expansionpanel \n [expanded]=\"expandedSections.code\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n Code & Generation\n @if (record.CodeLocked) {\n <span style=\"background: #ffc107; color: #856404; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n <i class=\"fa-solid fa-lock\"></i> Locked\n </span>\n }\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (EditMode) {\n <div class=\"generation-panel\">\n <h3><i class=\"fa-solid fa-robot\"></i> AI Generation</h3>\n <div class=\"prompt-section\">\n <label>User Prompt</label>\n <kendo-textarea [(ngModel)]=\"record.UserPrompt\"\n name=\"userPrompt\"\n [rows]=\"8\"\n placeholder=\"Describe what this action should do...\"\n style=\"width: 100%; min-height: 120px;\">\n </kendo-textarea>\n </div>\n <div class=\"comments-section\">\n <label>Internal Comments (not sent to AI)</label>\n <kendo-textarea [(ngModel)]=\"record.UserComments\"\n name=\"userComments\"\n [rows]=\"2\"\n placeholder=\"Internal notes...\"\n style=\"width: 100%;\">\n </kendo-textarea>\n </div>\n <div class=\"generation-controls\">\n <kendo-switch [(ngModel)]=\"record.CodeLocked\"\n name=\"codeLocked\">\n </kendo-switch>\n <label style=\"margin-left: 8px;\">Lock Code (prevent regeneration)</label>\n </div>\n </div>\n }\n \n <div class=\"code-editor-section\">\n <div class=\"code-toolbar\">\n <h3><i class=\"fa-solid fa-file-code\"></i> Action Code</h3>\n <div class=\"code-actions\">\n @if (record.CodeComments) {\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"toggleCodeComments()\">\n <i class=\"fa-solid fa-comment\"></i> \n {{ showCodeComments ? 'Hide' : 'Show' }} AI Comments\n </kendo-button>\n }\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"copyToClipboard(record.Code || '')\">\n <i class=\"fa-solid fa-copy\"></i> Copy\n </kendo-button>\n </div>\n </div>\n <mj-code-editor \n [(ngModel)]=\"record.Code\"\n name=\"actionCode\"\n [readonly]=\"!EditMode || record.CodeLocked\"\n [language]=\"codeLanguage\"\n [lineWrapping]=\"true\"\n style=\"height: 400px; width: 100%;\">\n </mj-code-editor>\n \n @if (showCodeComments && record.CodeComments) {\n <div class=\"code-comments\">\n <h4><i class=\"fa-solid fa-robot\"></i> AI Explanation</h4>\n <p>{{ record.CodeComments }}</p>\n </div>\n }\n \n @if (EditMode && record.CodeApprovalStatus === 'Rejected') {\n <div class=\"approval-comments\">\n <label>Rejection Comments</label>\n <kendo-textarea [(ngModel)]=\"record.CodeApprovalComments\"\n name=\"codeApprovalComments\"\n [rows]=\"2\"\n placeholder=\"Explain why the code was rejected...\"\n style=\"width: 100%;\">\n </kendo-textarea>\n </div>\n }\n </div>\n </div>\n </kendo-expansionpanel>\n }\n\n <!-- Result Codes Section -->\n <kendo-expansionpanel \n [expanded]=\"expandedSections.resultCodes\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-flag-checkered\" style=\"color: #6c757d;\"></i>\n Result Codes\n @if (resultCodes.length > 0) {\n <span style=\"background: #28a745; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n {{ resultCodes.length }}\n </span>\n }\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (isLoadingResultCodes) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading result codes...\n </div>\n } @else if (resultCodes.length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-flag-checkered\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No result codes defined</p>\n @if (EditMode && record.IsSaved) {\n <p style=\"margin: 8px 0 0 0; font-size: 0.85em; color: #6c757d;\">Add result codes to define possible outcomes</p>\n }\n </div>\n } @else {\n <div class=\"result-codes-grid\">\n @for (code of resultCodes; track code.ID) {\n <div class=\"result-code-card\" [class.success]=\"code.IsSuccess\" [class.failure]=\"!code.IsSuccess\">\n <div class=\"result-icon\">\n <i [class]=\"code.IsSuccess ? 'fa-solid fa-check-circle' : 'fa-solid fa-times-circle'\"></i>\n </div>\n <div class=\"result-content\">\n <div class=\"result-code\">{{ code.ResultCode }}</div>\n @if (code.Description) {\n <div class=\"result-description\">{{ code.Description }}</div>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n </kendo-expansionpanel>\n\n <!-- Execution & Monitoring Section -->\n @if (record.IsSaved) {\n <kendo-expansionpanel \n [expanded]=\"expandedSections.execution\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-chart-line\" style=\"color: #6c757d;\"></i>\n Execution & Monitoring\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (isLoadingExecutions) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading executions...\n </div>\n } @else if (recentExecutions.length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-chart-line\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No executions yet</p>\n </div>\n } @else {\n <div class=\"execution-stats-row\">\n <div class=\"stat-box\">\n <i class=\"fa-solid fa-tachometer-alt\"></i>\n <div class=\"stat-info\">\n <div class=\"stat-label\" style=\"color: #212529;\">Avg Duration</div>\n <div class=\"stat-value\" style=\"color: #212529;\">{{ formatDuration(executionStats.avgDuration) }}</div>\n </div>\n </div>\n <div class=\"stat-box\">\n <i class=\"fa-solid fa-check-circle\" [style.color]=\"getSuccessRateColor()\"></i>\n <div class=\"stat-info\">\n <div class=\"stat-label\" style=\"color: #212529;\">Success Rate</div>\n <div class=\"stat-value\" [style.color]=\"getSuccessRateColor()\" style=\"font-weight: 600;\">{{ executionStats.successRate.toFixed(0) }}%</div>\n </div>\n </div>\n <div class=\"stat-box\">\n <i class=\"fa-solid fa-play-circle\"></i>\n <div class=\"stat-info\">\n <div class=\"stat-label\" style=\"color: #212529;\">Total Runs</div>\n <div class=\"stat-value\" style=\"color: #212529;\">{{ executionStats.totalRuns }}</div>\n </div>\n </div>\n </div>\n\n <h3 style=\"margin-top: 24px;\"><i class=\"fa-solid fa-history\"></i> Recent Executions</h3>\n <div class=\"executions-table\">\n <table>\n <thead>\n <tr>\n <th>Started</th>\n <th>Duration</th>\n <th>User</th>\n <th>Result</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (execution of recentExecutions; track execution.ID) {\n <tr class=\"execution-row\" [class.success]=\"isExecutionSuccess(execution)\">\n <td>{{ execution.StartedAt | date:'short' }}</td>\n <td>\n @if (execution.EndedAt) {\n {{ formatDuration(getExecutionDuration(execution)) }}\n } @else {\n <span class=\"running\">Running...</span>\n }\n </td>\n <td>{{ execution.User }}</td>\n <td>\n <span class=\"result-code\" \n [class.success]=\"isExecutionSuccess(execution)\"\n [class.failure]=\"!isExecutionSuccess(execution)\">\n {{ execution.ResultCode }}\n </span>\n </td>\n <td>\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"navigateToExecution(execution.ID)\">\n <i class=\"fa-solid fa-external-link\"></i>\n </kendo-button>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n </div>\n </kendo-expansionpanel>\n }\n\n <!-- Related Configuration Section -->\n @if (record.IsSaved) {\n <kendo-expansionpanel \n [expanded]=\"expandedSections.configuration\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-cogs\" style=\"color: #6c757d;\"></i>\n Related Configuration\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n <!-- Libraries -->\n <div class=\"config-subsection\">\n <h3><i class=\"fa-solid fa-book\"></i> Libraries</h3>\n @if (isLoadingLibraries) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading libraries...\n </div>\n } @else if (actionLibraries.length === 0) {\n <div class=\"empty-state mini\">\n <p>No libraries configured</p>\n </div>\n } @else {\n <div class=\"library-cards\">\n @for (lib of libraries; track lib.ID; let i = $index) {\n <div class=\"library-card\" (click)=\"navigateToLibrary(lib.ID)\">\n <i class=\"fa-solid fa-book\"></i>\n <div class=\"library-info\">\n <div class=\"library-name\">{{ lib.Name }}</div>\n @if (actionLibraries[i].ItemsUsed) {\n <div class=\"library-items\">{{ actionLibraries[i].ItemsUsed }}</div>\n }\n </div>\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Other Related Entities -->\n <div class=\"related-entities-grid\">\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-shield-alt\"></i>\n <span>Authorizations</span>\n <span class=\"entity-count\">View</span>\n </div>\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-layer-group\"></i>\n <span>Contexts</span>\n <span class=\"entity-count\">View</span>\n </div>\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-calendar\"></i>\n <span>Scheduled Actions</span>\n <span class=\"entity-count\">View</span>\n </div>\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-cube\"></i>\n <span>Entity Actions</span>\n <span class=\"entity-count\">View</span>\n </div>\n </div>\n </div>\n </kendo-expansionpanel>\n }\n </div>\n </div>\n </form>\n }\n</div>\n\n<!-- Action Test Harness -->\n@if (showTestHarness) {\n <kendo-window \n [width]=\"1200\" \n [height]=\"800\" \n [minWidth]=\"800\"\n [minHeight]=\"600\"\n [draggable]=\"true\"\n [resizable]=\"true\"\n [state]=\"'default'\"\n (close)=\"onTestHarnessVisibilityChanged(false)\"\n title=\"Run Action - {{ record.Name || 'Untitled' }}\">\n <mj-action-test-harness\n [action]=\"record\"\n [actionParams]=\"actionParams\"\n [isVisible]=\"showTestHarness\"\n (visibilityChange)=\"onTestHarnessVisibilityChanged($event)\">\n </mj-action-test-harness>\n </kendo-window>\n}", styles: ["/* Hero Header Section */\n.action-hero-header {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 32px;\n margin: -20px -20px 24px -20px;\n border-radius: 0 0 16px 16px;\n box-shadow: 0 4px 20px rgba(0,0,0,0.1);\n}\n\n.hero-content {\n max-width: 1400px;\n margin: 0 auto;\n}\n\n.action-identity {\n display: flex;\n align-items: flex-start;\n gap: 24px;\n margin-bottom: 24px;\n}\n\n.action-icon-wrapper {\n width: 80px;\n height: 80px;\n border-radius: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper i {\n font-size: 36px;\n}\n\n.action-info {\n flex: 1;\n min-width: 0;\n}\n\n.action-title-row {\n display: flex;\n align-items: center;\n gap: 16px;\n margin-bottom: 12px;\n flex-wrap: wrap;\n}\n\n.action-title {\n margin: 0;\n font-size: 2em;\n font-weight: 600;\n color: white;\n}\n\n.action-name-input {\n font-size: 1.8em;\n font-weight: 600;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n padding: 8px 16px;\n border-radius: 8px;\n min-width: 400px;\n}\n\n.action-name-input::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n.action-badges {\n display: flex;\n gap: 8px;\n flex-wrap: wrap;\n}\n\n.status-badge, .type-badge, .approval-badge {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n border-radius: 20px;\n font-size: 0.85em;\n font-weight: 500;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.3);\n}\n\n.action-category {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n color: rgba(255,255,255,0.9);\n font-size: 0.95em;\n cursor: pointer;\n transition: all 0.2s;\n margin-bottom: 12px;\n}\n\n.action-category:hover {\n color: white;\n transform: translateX(4px);\n}\n\n.action-description {\n color: rgba(255,255,255,0.9);\n font-size: 1.05em;\n line-height: 1.5;\n margin: 0;\n}\n\n.action-description-input {\n width: 100%;\n max-width: 600px;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n border-radius: 8px;\n}\n\n.action-description-input::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n/* Quick Stats */\n.action-stats {\n display: flex;\n gap: 24px;\n margin-bottom: 24px;\n flex-wrap: wrap;\n}\n\n.stat-card {\n background: rgba(255,255,255,0.1);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.2);\n border-radius: 12px;\n padding: 16px 24px;\n display: flex;\n align-items: center;\n gap: 16px;\n min-width: 160px;\n}\n\n.stat-card i {\n font-size: 24px;\n color: rgba(255,255,255,0.8);\n}\n\n.stat-content {\n display: flex;\n flex-direction: column;\n}\n\n.stat-value {\n font-size: 1.4em;\n font-weight: 700;\n color: white;\n}\n\n.stat-label {\n font-size: 0.85em;\n color: rgba(255,255,255,0.7);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n/* Hero Actions */\n.hero-actions {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.hero-actions kendo-button {\n backdrop-filter: blur(10px);\n}\n\n/* Main Content Sections */\n.action-content {\n padding: 0 20px 20px;\n}\n\n.content-section {\n background: white;\n border: 1px solid #e9ecef;\n border-radius: 12px;\n margin-bottom: 20px;\n overflow: hidden;\n transition: all 0.3s ease;\n}\n\n.content-section:hover {\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.section-header {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 20px;\n background: #f8f9fa;\n cursor: pointer;\n user-select: none;\n transition: background 0.2s;\n}\n\n.section-header:hover {\n background: #e9ecef;\n}\n\n.section-header h2 {\n margin: 0;\n font-size: 1.3em;\n color: #2c3e50;\n flex: 1;\n}\n\n.section-header i:first-child {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.section-count {\n background: #007bff;\n color: white;\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 0.85em;\n font-weight: 500;\n}\n\n.toggle-icon {\n color: #6c757d;\n transition: transform 0.3s;\n}\n\n.toggle-icon.rotated {\n transform: rotate(-90deg);\n}\n\n.section-content {\n padding: 24px;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n/* Overview Section */\n.overview-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n}\n\n.overview-field {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.overview-field label {\n font-weight: 600;\n color: #495057;\n font-size: 0.9em;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.required {\n color: #dc3545;\n}\n\n.full-width {\n width: 100%;\n}\n\n.overview-display {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 24px;\n}\n\n.display-field {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.display-field label {\n font-size: 0.85em;\n color: #6c757d;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.display-value {\n font-size: 1.1em;\n color: #2c3e50;\n}\n\n.display-value.code {\n font-family: 'Courier New', monospace;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 4px;\n}\n\n.approval-date {\n color: #6c757d;\n font-size: 0.85em;\n margin-left: 8px;\n}\n\n/* Code Section */\n.generation-panel {\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n margin-bottom: 24px;\n}\n\n.generation-panel h3 {\n margin: 0 0 16px 0;\n color: #6f42c1;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.prompt-section, .comments-section {\n margin-bottom: 16px;\n}\n\n.prompt-section label, .comments-section label {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #495057;\n}\n\n.generation-controls {\n display: flex;\n align-items: center;\n gap: 12px;\n padding-top: 12px;\n border-top: 1px solid #dee2e6;\n}\n\n.code-locked-badge {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 4px 10px;\n background: #ffc107;\n color: #856404;\n border-radius: 12px;\n font-size: 0.8em;\n font-weight: 500;\n}\n\n.code-editor-section {\n border: 1px solid #e9ecef;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.code-toolbar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #e9ecef;\n}\n\n.code-toolbar h3 {\n margin: 0;\n font-size: 1.1em;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-actions {\n display: flex;\n gap: 8px;\n}\n\n.code-comments {\n background: #e3f2fd;\n border: 1px solid #90caf9;\n border-radius: 8px;\n padding: 16px;\n margin-top: 16px;\n}\n\n.code-comments h4 {\n margin: 0 0 8px 0;\n color: #1976d2;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-comments p {\n margin: 0;\n color: #424242;\n line-height: 1.5;\n}\n\n.approval-comments {\n margin-top: 16px;\n}\n\n.approval-comments label {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #dc3545;\n}\n\n/* Parameters Section */\n.params-section {\n background: #f8f9fa;\n border-radius: 12px;\n padding: 20px;\n}\n\n.params-section.params-section-compact {\n padding: 12px 20px;\n}\n\n.params-section-compact .empty-state {\n padding: 12px !important;\n}\n\n.params-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 16px;\n}\n\n.params-header h3 {\n margin: 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.params-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.param-card {\n background: white;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n padding: 16px;\n transition: all 0.2s;\n}\n\n.param-card:hover {\n border-color: #007bff;\n box-shadow: 0 2px 8px rgba(0,123,255,0.1);\n}\n\n.param-card.required {\n border-color: #ffc107;\n}\n\n.param-card.clickable {\n cursor: pointer;\n}\n\n.param-card.clickable:hover {\n background: #e7f3ff;\n border-color: #2196f3;\n transform: translateY(-1px);\n}\n\n.param-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 8px;\n}\n\n.param-name {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.param-badges {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.param-edit-btn,\n.param-delete-btn {\n background: none;\n border: none;\n padding: 4px 8px;\n cursor: pointer;\n color: #6c757d;\n border-radius: 4px;\n transition: all 0.2s;\n}\n\n.param-edit-btn:hover {\n background: #e3f2fd;\n color: #2196f3;\n}\n\n.param-delete-btn:hover {\n background: #ffebee;\n color: #f44336;\n}\n\n.param-details {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.required-badge {\n background: #ffc107;\n color: #856404;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.array-badge {\n background: #6f42c1;\n color: white;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.param-type {\n color: #6c757d;\n font-size: 0.9em;\n margin-bottom: 8px;\n}\n\n.param-description {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n margin-bottom: 8px;\n}\n\n.param-default {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 8px;\n padding-top: 8px;\n border-top: 1px solid #e9ecef;\n}\n\n.default-label {\n color: #6c757d;\n font-size: 0.85em;\n}\n\n.param-default code {\n background: #f8f9fa;\n padding: 2px 6px;\n border-radius: 4px;\n font-family: 'Courier New', monospace;\n color: #e83e8c;\n}\n\n\n/* Result Codes Section */\n.result-codes-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.result-code-card {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n background: white;\n transition: all 0.2s;\n}\n\n.result-code-card:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.result-code-card.success {\n border-color: #28a745;\n background: #d4edda;\n}\n\n.result-code-card.failure {\n border-color: #dc3545;\n background: #f8d7da;\n}\n\n.result-icon {\n font-size: 1.5em;\n flex-shrink: 0;\n}\n\n.result-code-card.success .result-icon {\n color: #28a745;\n}\n\n.result-code-card.failure .result-icon {\n color: #dc3545;\n}\n\n.result-content {\n flex: 1;\n min-width: 0;\n}\n\n.result-code {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n font-family: 'Courier New', monospace;\n}\n\n.result-description {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n}\n\n/* Execution Section */\n.execution-stats-row {\n display: flex;\n gap: 20px;\n margin-bottom: 32px;\n flex-wrap: wrap;\n}\n\n.stat-box {\n flex: 1;\n min-width: 200px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.stat-box i {\n font-size: 2em;\n color: #6c757d;\n}\n\n.stat-info {\n flex: 1;\n}\n\n.executions-table {\n overflow-x: auto;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n}\n\n.executions-table table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.executions-table th {\n background: #f8f9fa;\n padding: 12px;\n text-align: left;\n font-weight: 600;\n color: #495057;\n border-bottom: 2px solid #e9ecef;\n}\n\n.executions-table td {\n padding: 12px;\n border-bottom: 1px solid #e9ecef;\n}\n\n.execution-row {\n transition: background 0.2s;\n}\n\n.execution-row:hover {\n background: #f8f9fa;\n}\n\n.execution-row.success {\n background: #d4edda20;\n}\n\n.running {\n color: #ffc107;\n font-style: italic;\n}\n\n.result-code {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 0.85em;\n font-weight: 500;\n font-family: 'Courier New', monospace;\n}\n\n.result-code.success {\n background: #d4edda;\n color: #155724;\n}\n\n.result-code.failure {\n background: #f8d7da;\n color: #721c24;\n}\n\n/* Configuration Section */\n.config-subsection {\n margin-bottom: 32px;\n}\n\n.config-subsection h3 {\n margin: 0 0 16px 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.library-cards {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.library-card {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.library-card:hover {\n background: #e9ecef;\n transform: translateX(4px);\n}\n\n.library-card i:first-child {\n font-size: 1.5em;\n color: #6c757d;\n}\n\n.library-info {\n flex: 1;\n min-width: 0;\n}\n\n.library-name {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n}\n\n.library-items {\n color: #6c757d;\n font-size: 0.9em;\n font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.related-entity-link {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.related-entity-link:hover {\n background: #e9ecef;\n border-color: #007bff;\n}\n\n.related-entity-link i {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.related-entity-link span:first-of-type {\n flex: 1;\n font-weight: 500;\n color: #495057;\n}\n\n.entity-count {\n color: #007bff;\n font-size: 0.9em;\n}\n\n/* Common States */\n.loading-state {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.loading-state i {\n font-size: 2em;\n margin-bottom: 12px;\n}\n\n.empty-state {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.empty-state.mini {\n padding: 20px;\n}\n\n.empty-state i {\n font-size: 3em;\n margin-bottom: 16px;\n opacity: 0.3;\n}\n\n.empty-state p {\n margin: 0;\n font-size: 1.1em;\n}\n\n.empty-hint {\n margin-top: 8px !important;\n font-size: 0.9em !important;\n opacity: 0.7;\n}\n\n.no-params {\n text-align: center;\n padding: 20px;\n color: #6c757d;\n font-style: italic;\n}\n\n.no-params p {\n margin: 0;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n .action-hero-header {\n padding: 20px;\n }\n \n .action-identity {\n flex-direction: column;\n text-align: center;\n }\n \n .action-icon-wrapper {\n margin: 0 auto;\n }\n \n .action-title-row {\n justify-content: center;\n }\n \n .action-stats {\n justify-content: center;\n }\n \n .params-grid {\n grid-template-columns: 1fr;\n }\n}"] }]
|
|
1570
|
+
args: [{ selector: 'mj-action-form', template: "<div class=\"record-form-container\">\n @if (record) {\n <form class=\"record-form\" #form=\"ngForm\">\n <mj-form-toolbar [form]=\"this\"></mj-form-toolbar>\n\n <!-- Main Content Area -->\n <div class=\"action-main-area\" style=\"display: flex; flex-direction: column; height: 100%; overflow-y: auto;\">\n \n <!-- Header Section -->\n <div class=\"action-header\" style=\"flex-shrink: 0; padding: 20px; background: #f8f9fa; border-bottom: 2px solid #e9ecef;\">\n <div style=\"display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;\">\n \n <!-- Left: Action Info -->\n <div style=\"flex: 1; min-width: 0;\">\n <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 8px;\">\n <i [class]=\"'fa-solid ' + getTypeIcon()\" [style.color]=\"getTypeColor()\" style=\"font-size: 1.4em;\"></i>\n @if (EditMode) {\n <kendo-textbox [(ngModel)]=\"record.Name\" \n name=\"actionName\"\n placeholder=\"Enter action name...\"\n style=\"font-size: 1.2em; font-weight: 600; min-width: 300px; flex: 1;\">\n </kendo-textbox>\n } @else {\n <h4 style=\"margin: 0; color: #495057; font-weight: 600; flex: 1;\">{{ record.Name || 'Untitled Action' }}</h4>\n <span class=\"status-badge\" [style.background-color]=\"getStatusColor()\" \n style=\"color: white; padding: 4px 10px; border-radius: 12px; font-size: 0.75em; font-weight: 500;\">\n {{ record.Status }}\n </span>\n }\n </div>\n \n <!-- Status and Type Editors when in edit mode -->\n @if (EditMode) {\n <div style=\"display: flex; gap: 16px; margin-bottom: 12px; flex-wrap: wrap;\">\n <div>\n <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">Status</label>\n <kendo-dropdownlist [(ngModel)]=\"record.Status\"\n name=\"actionStatus\"\n [data]=\"[{text: 'Active', value: 'Active'}, {text: 'Pending', value: 'Pending'}, {text: 'Disabled', value: 'Disabled'}]\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n style=\"width: 150px;\">\n </kendo-dropdownlist>\n </div>\n <div>\n <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n Type <span style=\"color: #dc3545;\">*</span>\n </label>\n <kendo-dropdownlist [(ngModel)]=\"record.Type\"\n name=\"actionType\"\n [data]=\"[{text: 'Generated', value: 'Generated'}, {text: 'Custom', value: 'Custom'}]\"\n textField=\"text\"\n valueField=\"value\"\n [valuePrimitive]=\"true\"\n style=\"width: 150px;\">\n </kendo-dropdownlist>\n </div>\n <div>\n <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n Category <span style=\"color: #dc3545;\">*</span>\n </label>\n <kendo-dropdownlist [(ngModel)]=\"record.CategoryID\"\n name=\"categoryID\"\n [data]=\"[]\"\n placeholder=\"Select category...\"\n style=\"width: 200px;\">\n </kendo-dropdownlist>\n </div>\n </div>\n }\n \n @if (EditMode) {\n <kendo-textarea [(ngModel)]=\"record.Description\" \n name=\"actionDescription\"\n [rows]=\"2\"\n placeholder=\"Enter action description...\"\n style=\"width: 100%; max-width: 600px; margin-bottom: 12px;\">\n </kendo-textarea>\n } @else if (record.Description) {\n <p style=\"margin: 0 0 12px 0; color: #6c757d; font-size: 0.9em; line-height: 1.4;\">{{ record.Description }}</p>\n }\n \n <!-- Quick Config Row -->\n <div class=\"quick-config\" style=\"display: flex; align-items: center; gap: 16px; flex-wrap: wrap;\">\n @if (category) {\n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i class=\"fa-solid fa-folder\" style=\"color: #6c757d;\"></i>\n <span style=\"color: #6c757d;\">Category:</span>\n <span style=\"color: #495057; font-weight: 500; cursor: pointer;\" (click)=\"navigateToCategory()\">\n {{ category.Name }}\n <i class=\"fa-solid fa-external-link\" style=\"font-size: 0.75em; margin-left: 4px;\"></i>\n </span>\n </div>\n }\n \n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i class=\"fa-solid fa-cube\" style=\"color: #6c757d;\"></i>\n <span style=\"color: #6c757d;\">Type:</span>\n <span style=\"color: #495057; font-weight: 500;\">{{ record.Type }}</span>\n </div>\n \n @if (record.Type === 'Generated' && record.CodeApprovalStatus) {\n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i [class]=\"'fa-solid ' + getApprovalStatusIcon()\" [style.color]=\"getApprovalStatusColor()\"></i>\n <span style=\"color: #6c757d;\">Code:</span>\n <span [style.color]=\"getApprovalStatusColor()\" style=\"font-weight: 500;\">{{ record.CodeApprovalStatus }}</span>\n </div>\n }\n \n @if (actionParams.length > 0) {\n <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n <i class=\"fa-solid fa-sliders\" style=\"color: #6c757d;\"></i>\n <span style=\"color: #495057; font-weight: 500;\">{{ actionParams.length }} Parameters</span>\n </div>\n }\n </div>\n </div>\n \n <!-- Right: Action Buttons -->\n <div class=\"action-buttons\" style=\"display: flex; flex-direction: column; gap: 8px; align-items: flex-end;\">\n <div style=\"display: flex; gap: 8px;\">\n @if (record.ID) {\n <kendo-button themeColor=\"primary\" size=\"large\"\n (click)=\"openTestHarness()\"\n title=\"Open Run Harness\"\n [disabled]=\"record.Status !== 'Active'\">\n <i class=\"fa-solid fa-play\"></i> Run\n </kendo-button>\n }\n @if (EditMode && record.Type === 'Generated') {\n <kendo-button themeColor=\"info\" size=\"medium\"\n (click)=\"regenerateCode()\"\n title=\"Regenerate Code\">\n <i class=\"fa-solid fa-robot\"></i> Regenerate\n </kendo-button>\n }\n </div>\n \n @if (EditMode && record.CodeApprovalStatus === 'Pending' && record.Type === 'Generated') {\n <div style=\"display: flex; gap: 8px;\">\n <kendo-button themeColor=\"success\" size=\"small\"\n (click)=\"approveCode()\">\n <i class=\"fa-solid fa-check\"></i> Approve\n </kendo-button>\n <kendo-button themeColor=\"error\" size=\"small\"\n (click)=\"rejectCode()\">\n <i class=\"fa-solid fa-times\"></i> Reject\n </kendo-button>\n </div>\n }\n \n @if (!EditMode && record.Status !== 'Active' && record.ID) {\n <div style=\"font-size: 0.75em; color: #dc3545; text-align: right;\">\n Action must be Active to execute\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Configuration Sections with Expansion Panels -->\n <div class=\"configuration-sections\" style=\"flex: 1; background: white; border-top: 2px solid #e9ecef; padding: 16px; min-height: 0;\">\n \n <!-- Parameters Section (FIRST) -->\n <kendo-expansionpanel \n [expanded]=\"true\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-sliders\" style=\"color: #6c757d;\"></i>\n Parameters\n @if (actionParams.length > 0) {\n <span style=\"background: #17a2b8; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n {{ actionParams.length }}\n </span>\n }\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (isLoadingParams) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading parameters...\n </div>\n } @else if (actionParams.length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-sliders\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No parameters defined</p>\n @if (EditMode && record.IsSaved) {\n <p style=\"margin: 8px 0 0 0; font-size: 0.85em; color: #6c757d;\">Add parameters to define inputs and outputs for this action</p>\n }\n </div>\n } @else {\n <!-- Input Parameters Grid -->\n <div class=\"params-section\">\n <div class=\"params-header\">\n <h3><i class=\"fa-solid fa-sign-in-alt\"></i> Input Parameters</h3>\n @if (EditMode && record.IsSaved) {\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"addParameter('Input')\">\n <i class=\"fa-solid fa-plus\"></i> Add Input\n </kendo-button>\n }\n </div>\n \n @if (getInputParams().length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-inbox\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No input parameters defined</p>\n </div>\n } @else {\n <div class=\"params-grid\">\n @for (param of getInputParams(); track param.ID) {\n <div class=\"param-card\" [class.required]=\"param.IsRequired\" \n [class.clickable]=\"true\"\n (click)=\"onParamClick(param, $event)\">\n <div class=\"param-header\">\n <span class=\"param-name\">{{ param.Name }}</span>\n <div class=\"param-badges\">\n @if (param.IsRequired) {\n <span class=\"required-badge\">Required</span>\n }\n @if (param.IsArray) {\n <span class=\"array-badge\">Array</span>\n }\n @if (EditMode) {\n <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n <i class=\"fa-solid fa-edit\"></i>\n </button>\n <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n </div>\n </div>\n <div class=\"param-details\">\n <div class=\"param-type\">{{ param.ValueType }}</div>\n @if (param.Description) {\n <div class=\"param-description\">{{ param.Description }}</div>\n }\n @if (param.DefaultValue) {\n <div class=\"param-default\">\n <span class=\"default-label\">Default:</span>\n <code>{{ param.DefaultValue }}</code>\n </div>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Output Parameters Grid -->\n <div class=\"params-section\" style=\"margin-top: 24px;\" \n [class.params-section-compact]=\"getOutputParams().length === 0\">\n <div class=\"params-header\">\n <h3><i class=\"fa-solid fa-sign-out-alt\"></i> Output Parameters</h3>\n @if (EditMode && record.IsSaved) {\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"addParameter('Output')\">\n <i class=\"fa-solid fa-plus\"></i> Add Output\n </kendo-button>\n }\n </div>\n \n @if (getOutputParams().length === 0) {\n <div class=\"empty-state\" style=\"padding: 20px; text-align: center;\">\n <i class=\"fa-solid fa-inbox\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No output parameters defined</p>\n </div>\n } @else {\n <div class=\"params-grid\">\n @for (param of getOutputParams(); track param.ID) {\n <div class=\"param-card\"\n [class.clickable]=\"true\"\n (click)=\"onParamClick(param, $event)\">\n <div class=\"param-header\">\n <span class=\"param-name\">{{ param.Name }}</span>\n <div class=\"param-badges\">\n @if (param.IsArray) {\n <span class=\"array-badge\">Array</span>\n }\n @if (EditMode) {\n <button class=\"param-edit-btn\" (click)=\"editParameter(param)\" title=\"Edit parameter\">\n <i class=\"fa-solid fa-edit\"></i>\n </button>\n <button class=\"param-delete-btn\" (click)=\"deleteParameter(param)\" title=\"Delete parameter\">\n <i class=\"fa-solid fa-trash\"></i>\n </button>\n }\n </div>\n </div>\n <div class=\"param-details\">\n <div class=\"param-type\">{{ param.ValueType }}</div>\n @if (param.Description) {\n <div class=\"param-description\">{{ param.Description }}</div>\n }\n @if (param.DefaultValue) {\n <div class=\"param-default\">\n <span class=\"default-label\">Default:</span>\n <code>{{ param.DefaultValue }}</code>\n </div>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n </div>\n </kendo-expansionpanel>\n\n <!-- Code & Generation Section (Only for Generated type) -->\n @if (record.Type === 'Generated') {\n <kendo-expansionpanel \n [expanded]=\"expandedSections.code\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n Code & Generation\n @if (record.CodeLocked) {\n <span style=\"background: #ffc107; color: #856404; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n <i class=\"fa-solid fa-lock\"></i> Locked\n </span>\n }\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (EditMode) {\n <div class=\"generation-panel\">\n <h3><i class=\"fa-solid fa-robot\"></i> AI Generation</h3>\n <div class=\"prompt-section\">\n <label>User Prompt</label>\n <kendo-textarea [(ngModel)]=\"record.UserPrompt\"\n name=\"userPrompt\"\n [rows]=\"8\"\n placeholder=\"Describe what this action should do...\"\n style=\"width: 100%; min-height: 120px;\">\n </kendo-textarea>\n </div>\n <div class=\"comments-section\">\n <label>Internal Comments (not sent to AI)</label>\n <kendo-textarea [(ngModel)]=\"record.UserComments\"\n name=\"userComments\"\n [rows]=\"2\"\n placeholder=\"Internal notes...\"\n style=\"width: 100%;\">\n </kendo-textarea>\n </div>\n <div class=\"generation-controls\">\n <kendo-switch [(ngModel)]=\"record.CodeLocked\"\n name=\"codeLocked\">\n </kendo-switch>\n <label style=\"margin-left: 8px;\">Lock Code (prevent regeneration)</label>\n </div>\n </div>\n }\n \n <div class=\"code-editor-section\">\n <div class=\"code-toolbar\">\n <h3><i class=\"fa-solid fa-file-code\"></i> Action Code</h3>\n <div class=\"code-actions\">\n @if (record.CodeComments) {\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"toggleCodeComments()\">\n <i class=\"fa-solid fa-comment\"></i> \n {{ showCodeComments ? 'Hide' : 'Show' }} AI Comments\n </kendo-button>\n }\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"copyToClipboard(record.Code || '')\">\n <i class=\"fa-solid fa-copy\"></i> Copy\n </kendo-button>\n </div>\n </div>\n <mj-code-editor \n [(ngModel)]=\"record.Code\"\n name=\"actionCode\"\n [readonly]=\"!EditMode || record.CodeLocked\"\n [language]=\"codeLanguage\"\n [lineWrapping]=\"true\"\n style=\"height: 400px; width: 100%;\">\n </mj-code-editor>\n \n @if (showCodeComments && record.CodeComments) {\n <div class=\"code-comments\">\n <h4><i class=\"fa-solid fa-robot\"></i> AI Explanation</h4>\n <p>{{ record.CodeComments }}</p>\n </div>\n }\n \n @if (EditMode && record.CodeApprovalStatus === 'Rejected') {\n <div class=\"approval-comments\">\n <label>Rejection Comments</label>\n <kendo-textarea [(ngModel)]=\"record.CodeApprovalComments\"\n name=\"codeApprovalComments\"\n [rows]=\"2\"\n placeholder=\"Explain why the code was rejected...\"\n style=\"width: 100%;\">\n </kendo-textarea>\n </div>\n }\n </div>\n </div>\n </kendo-expansionpanel>\n }\n\n <!-- Result Codes Section -->\n <kendo-expansionpanel \n [expanded]=\"expandedSections.resultCodes\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-flag-checkered\" style=\"color: #6c757d;\"></i>\n Result Codes\n @if (resultCodes.length > 0) {\n <span style=\"background: #28a745; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n {{ resultCodes.length }}\n </span>\n }\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (isLoadingResultCodes) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading result codes...\n </div>\n } @else if (resultCodes.length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-flag-checkered\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No result codes defined</p>\n @if (EditMode && record.IsSaved) {\n <p style=\"margin: 8px 0 0 0; font-size: 0.85em; color: #6c757d;\">Add result codes to define possible outcomes</p>\n }\n </div>\n } @else {\n <div class=\"result-codes-grid\">\n @for (code of resultCodes; track code.ID) {\n <div class=\"result-code-card\" [class.success]=\"code.IsSuccess\" [class.failure]=\"!code.IsSuccess\">\n <div class=\"result-icon\">\n <i [class]=\"code.IsSuccess ? 'fa-solid fa-check-circle' : 'fa-solid fa-times-circle'\"></i>\n </div>\n <div class=\"result-content\">\n <div class=\"result-code\">{{ code.ResultCode }}</div>\n @if (code.Description) {\n <div class=\"result-description\">{{ code.Description }}</div>\n }\n </div>\n </div>\n }\n </div>\n }\n </div>\n </kendo-expansionpanel>\n\n <!-- Execution & Monitoring Section -->\n @if (record.IsSaved) {\n <kendo-expansionpanel \n [expanded]=\"expandedSections.execution\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-chart-line\" style=\"color: #6c757d;\"></i>\n Execution & Monitoring\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n @if (isLoadingExecutions) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading executions...\n </div>\n } @else if (recentExecutions.length === 0) {\n <div class=\"empty-state\" style=\"padding: 30px; text-align: center;\">\n <i class=\"fa-solid fa-chart-line\" style=\"font-size: 2em; color: #6c757d; opacity: 0.3;\"></i>\n <p style=\"margin: 12px 0 0 0; color: #6c757d;\">No executions yet</p>\n </div>\n } @else {\n <div class=\"execution-stats-row\">\n <div class=\"stat-box\">\n <i class=\"fa-solid fa-tachometer-alt\"></i>\n <div class=\"stat-info\">\n <div class=\"stat-label\" style=\"color: #212529;\">Avg Duration</div>\n <div class=\"stat-value\" style=\"color: #212529;\">{{ formatDuration(executionStats.avgDuration) }}</div>\n </div>\n </div>\n <div class=\"stat-box\">\n <i class=\"fa-solid fa-check-circle\" [style.color]=\"getSuccessRateColor()\"></i>\n <div class=\"stat-info\">\n <div class=\"stat-label\" style=\"color: #212529;\">Success Rate</div>\n <div class=\"stat-value\" [style.color]=\"getSuccessRateColor()\" style=\"font-weight: 600;\">{{ executionStats.successRate.toFixed(0) }}%</div>\n </div>\n </div>\n <div class=\"stat-box\">\n <i class=\"fa-solid fa-play-circle\"></i>\n <div class=\"stat-info\">\n <div class=\"stat-label\" style=\"color: #212529;\">Total Runs</div>\n <div class=\"stat-value\" style=\"color: #212529;\">{{ executionStats.totalRuns }}</div>\n </div>\n </div>\n </div>\n\n <h3 style=\"margin-top: 24px;\"><i class=\"fa-solid fa-history\"></i> Recent Executions</h3>\n <div class=\"executions-table\">\n <table>\n <thead>\n <tr>\n <th>Started</th>\n <th>Duration</th>\n <th>User</th>\n <th>Result</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (execution of recentExecutions; track execution.ID) {\n <tr class=\"execution-row\" [class.success]=\"isExecutionSuccess(execution)\">\n <td>{{ execution.StartedAt | date:'short' }}</td>\n <td>\n @if (execution.EndedAt) {\n {{ formatDuration(getExecutionDuration(execution)) }}\n } @else {\n <span class=\"running\">Running...</span>\n }\n </td>\n <td>{{ execution.User }}</td>\n <td>\n <span class=\"result-code\" \n [class.success]=\"isExecutionSuccess(execution)\"\n [class.failure]=\"!isExecutionSuccess(execution)\">\n {{ execution.ResultCode }}\n </span>\n </td>\n <td>\n <kendo-button fillMode=\"flat\" size=\"small\" (click)=\"navigateToExecution(execution.ID)\">\n <i class=\"fa-solid fa-external-link\"></i>\n </kendo-button>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n </div>\n </kendo-expansionpanel>\n }\n\n <!-- Related Configuration Section -->\n @if (record.IsSaved) {\n <kendo-expansionpanel \n [expanded]=\"expandedSections.configuration\"\n style=\"margin-bottom: 12px;\">\n <ng-template kendoExpansionPanelTitleDirective>\n <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n <i class=\"fa-solid fa-cogs\" style=\"color: #6c757d;\"></i>\n Related Configuration\n </span>\n </ng-template>\n \n <div style=\"padding: 16px;\">\n <!-- Libraries -->\n <div class=\"config-subsection\">\n <h3><i class=\"fa-solid fa-book\"></i> Libraries</h3>\n @if (isLoadingLibraries) {\n <div class=\"loading-state\">\n <i class=\"fa-solid fa-spinner fa-spin\"></i>\n Loading libraries...\n </div>\n } @else if (actionLibraries.length === 0) {\n <div class=\"empty-state mini\">\n <p>No libraries configured</p>\n </div>\n } @else {\n <div class=\"library-cards\">\n @for (lib of libraries; track lib.ID; let i = $index) {\n <div class=\"library-card\" (click)=\"navigateToLibrary(lib.ID)\">\n <i class=\"fa-solid fa-book\"></i>\n <div class=\"library-info\">\n <div class=\"library-name\">{{ lib.Name }}</div>\n @if (actionLibraries[i].ItemsUsed) {\n <div class=\"library-items\">{{ actionLibraries[i].ItemsUsed }}</div>\n }\n </div>\n <i class=\"fa-solid fa-external-link\"></i>\n </div>\n }\n </div>\n }\n </div>\n\n <!-- Other Related Entities -->\n <div class=\"related-entities-grid\">\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-shield-alt\"></i>\n <span>Authorizations</span>\n <span class=\"entity-count\">View</span>\n </div>\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-layer-group\"></i>\n <span>Contexts</span>\n <span class=\"entity-count\">View</span>\n </div>\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-calendar\"></i>\n <span>Scheduled Actions</span>\n <span class=\"entity-count\">View</span>\n </div>\n <div class=\"related-entity-link\">\n <i class=\"fa-solid fa-cube\"></i>\n <span>Entity Actions</span>\n <span class=\"entity-count\">View</span>\n </div>\n </div>\n </div>\n </kendo-expansionpanel>\n }\n </div>\n </div>\n </form>\n }\n</div>\n\n<!-- Action Test Harness -->\n@if (showTestHarness) {\n <kendo-window \n [width]=\"1200\" \n [height]=\"800\" \n [minWidth]=\"800\"\n [minHeight]=\"600\"\n [draggable]=\"true\"\n [resizable]=\"true\"\n [state]=\"'default'\"\n (close)=\"onTestHarnessVisibilityChanged(false)\"\n title=\"Run Action - {{ record.Name || 'Untitled' }}\">\n <mj-action-test-harness\n [action]=\"record\"\n [actionParams]=\"actionParams\"\n [isVisible]=\"showTestHarness\"\n (visibilityChange)=\"onTestHarnessVisibilityChanged($event)\">\n </mj-action-test-harness>\n </kendo-window>\n}", styles: ["/* Hero Header Section */\n.action-hero-header {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 32px;\n margin: -20px -20px 24px -20px;\n border-radius: 0 0 16px 16px;\n box-shadow: 0 4px 20px rgba(0,0,0,0.1);\n}\n\n.hero-content {\n max-width: 1400px;\n margin: 0 auto;\n}\n\n.action-identity {\n display: flex;\n align-items: flex-start;\n gap: 24px;\n margin-bottom: 24px;\n}\n\n.action-icon-wrapper {\n width: 80px;\n height: 80px;\n border-radius: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n}\n\n.action-icon-wrapper i {\n font-size: 36px;\n}\n\n.action-info {\n flex: 1;\n min-width: 0;\n}\n\n.action-title-row {\n display: flex;\n align-items: center;\n gap: 16px;\n margin-bottom: 12px;\n flex-wrap: wrap;\n}\n\n.action-title {\n margin: 0;\n font-size: 2em;\n font-weight: 600;\n color: white;\n}\n\n.action-name-input {\n font-size: 1.8em;\n font-weight: 600;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n padding: 8px 16px;\n border-radius: 8px;\n min-width: 400px;\n}\n\n.action-name-input::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n.action-badges {\n display: flex;\n gap: 8px;\n flex-wrap: wrap;\n}\n\n.status-badge, .type-badge, .approval-badge {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 6px 14px;\n border-radius: 20px;\n font-size: 0.85em;\n font-weight: 500;\n background: rgba(255,255,255,0.2);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.3);\n}\n\n.action-category {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n color: rgba(255,255,255,0.9);\n font-size: 0.95em;\n cursor: pointer;\n transition: all 0.2s;\n margin-bottom: 12px;\n}\n\n.action-category:hover {\n color: white;\n transform: translateX(4px);\n}\n\n.action-description {\n color: rgba(255,255,255,0.9);\n font-size: 1.05em;\n line-height: 1.5;\n margin: 0;\n}\n\n.action-description-input {\n width: 100%;\n max-width: 600px;\n background: rgba(255,255,255,0.2);\n border: 2px solid rgba(255,255,255,0.3);\n color: white;\n border-radius: 8px;\n}\n\n.action-description-input::placeholder {\n color: rgba(255,255,255,0.6);\n}\n\n/* Quick Stats */\n.action-stats {\n display: flex;\n gap: 24px;\n margin-bottom: 24px;\n flex-wrap: wrap;\n}\n\n.stat-card {\n background: rgba(255,255,255,0.1);\n backdrop-filter: blur(10px);\n border: 1px solid rgba(255,255,255,0.2);\n border-radius: 12px;\n padding: 16px 24px;\n display: flex;\n align-items: center;\n gap: 16px;\n min-width: 160px;\n}\n\n.stat-card i {\n font-size: 24px;\n color: rgba(255,255,255,0.8);\n}\n\n.stat-content {\n display: flex;\n flex-direction: column;\n}\n\n.stat-value {\n font-size: 1.4em;\n font-weight: 700;\n color: white;\n}\n\n.stat-label {\n font-size: 0.85em;\n color: rgba(255,255,255,0.7);\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n/* Hero Actions */\n.hero-actions {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.hero-actions kendo-button {\n backdrop-filter: blur(10px);\n}\n\n/* Main Content Sections */\n.action-content {\n padding: 0 20px 20px;\n}\n\n.content-section {\n background: white;\n border: 1px solid #e9ecef;\n border-radius: 12px;\n margin-bottom: 20px;\n overflow: hidden;\n transition: all 0.3s ease;\n}\n\n.content-section:hover {\n box-shadow: 0 4px 12px rgba(0,0,0,0.08);\n}\n\n.section-header {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 20px;\n background: #f8f9fa;\n cursor: pointer;\n user-select: none;\n transition: background 0.2s;\n}\n\n.section-header:hover {\n background: #e9ecef;\n}\n\n.section-header h2 {\n margin: 0;\n font-size: 1.3em;\n color: #2c3e50;\n flex: 1;\n}\n\n.section-header i:first-child {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.section-count {\n background: #007bff;\n color: white;\n padding: 2px 8px;\n border-radius: 12px;\n font-size: 0.85em;\n font-weight: 500;\n}\n\n.toggle-icon {\n color: #6c757d;\n transition: transform 0.3s;\n}\n\n.toggle-icon.rotated {\n transform: rotate(-90deg);\n}\n\n.section-content {\n padding: 24px;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n/* Overview Section */\n.overview-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n gap: 20px;\n}\n\n.overview-field {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.overview-field label {\n font-weight: 600;\n color: #495057;\n font-size: 0.9em;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.required {\n color: #dc3545;\n}\n\n.full-width {\n width: 100%;\n}\n\n.overview-display {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 24px;\n}\n\n.display-field {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.display-field label {\n font-size: 0.85em;\n color: #6c757d;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.display-value {\n font-size: 1.1em;\n color: #2c3e50;\n}\n\n.display-value.code {\n font-family: 'Courier New', monospace;\n background: #f8f9fa;\n padding: 4px 8px;\n border-radius: 4px;\n}\n\n.approval-date {\n color: #6c757d;\n font-size: 0.85em;\n margin-left: 8px;\n}\n\n/* Code Section */\n.generation-panel {\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n margin-bottom: 24px;\n}\n\n.generation-panel h3 {\n margin: 0 0 16px 0;\n color: #6f42c1;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.prompt-section, .comments-section {\n margin-bottom: 16px;\n}\n\n.prompt-section label, .comments-section label {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #495057;\n}\n\n.generation-controls {\n display: flex;\n align-items: center;\n gap: 12px;\n padding-top: 12px;\n border-top: 1px solid #dee2e6;\n}\n\n.code-locked-badge {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 4px 10px;\n background: #ffc107;\n color: #856404;\n border-radius: 12px;\n font-size: 0.8em;\n font-weight: 500;\n}\n\n.code-editor-section {\n border: 1px solid #e9ecef;\n border-radius: 8px;\n overflow: hidden;\n}\n\n.code-toolbar {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 12px 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #e9ecef;\n}\n\n.code-toolbar h3 {\n margin: 0;\n font-size: 1.1em;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-actions {\n display: flex;\n gap: 8px;\n}\n\n.code-comments {\n background: #e3f2fd;\n border: 1px solid #90caf9;\n border-radius: 8px;\n padding: 16px;\n margin-top: 16px;\n}\n\n.code-comments h4 {\n margin: 0 0 8px 0;\n color: #1976d2;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.code-comments p {\n margin: 0;\n color: #424242;\n line-height: 1.5;\n}\n\n.approval-comments {\n margin-top: 16px;\n}\n\n.approval-comments label {\n display: block;\n margin-bottom: 8px;\n font-weight: 600;\n color: #dc3545;\n}\n\n/* Parameters Section */\n.params-section {\n background: #f8f9fa;\n border-radius: 12px;\n padding: 20px;\n}\n\n.params-section.params-section-compact {\n padding: 12px 20px;\n}\n\n.params-section-compact .empty-state {\n padding: 12px !important;\n}\n\n.params-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 16px;\n}\n\n.params-header h3 {\n margin: 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.params-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.param-card {\n background: white;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n padding: 16px;\n transition: all 0.2s;\n}\n\n.param-card:hover {\n border-color: #007bff;\n box-shadow: 0 2px 8px rgba(0,123,255,0.1);\n}\n\n.param-card.required {\n border-color: #ffc107;\n}\n\n.param-card.clickable {\n cursor: pointer;\n}\n\n.param-card.clickable:hover {\n background: #e7f3ff;\n border-color: #2196f3;\n transform: translateY(-1px);\n}\n\n.param-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 8px;\n}\n\n.param-name {\n font-weight: 600;\n color: #2c3e50;\n}\n\n.param-badges {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.param-edit-btn,\n.param-delete-btn {\n background: none;\n border: none;\n padding: 4px 8px;\n cursor: pointer;\n color: #6c757d;\n border-radius: 4px;\n transition: all 0.2s;\n}\n\n.param-edit-btn:hover {\n background: #e3f2fd;\n color: #2196f3;\n}\n\n.param-delete-btn:hover {\n background: #ffebee;\n color: #f44336;\n}\n\n.param-details {\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n\n.required-badge {\n background: #ffc107;\n color: #856404;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.array-badge {\n background: #6f42c1;\n color: white;\n padding: 2px 6px;\n border-radius: 4px;\n font-size: 0.75em;\n font-weight: 500;\n}\n\n.param-type {\n color: #6c757d;\n font-size: 0.9em;\n margin-bottom: 8px;\n}\n\n.param-description {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n margin-bottom: 8px;\n}\n\n.param-default {\n display: flex;\n align-items: center;\n gap: 8px;\n margin-top: 8px;\n padding-top: 8px;\n border-top: 1px solid #e9ecef;\n}\n\n.default-label {\n color: #6c757d;\n font-size: 0.85em;\n}\n\n.param-default code {\n background: #f8f9fa;\n padding: 2px 6px;\n border-radius: 4px;\n font-family: 'Courier New', monospace;\n color: #e83e8c;\n}\n\n\n/* Result Codes Section */\n.result-codes-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 16px;\n}\n\n.result-code-card {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n padding: 16px;\n border: 2px solid #e9ecef;\n border-radius: 8px;\n background: white;\n transition: all 0.2s;\n}\n\n.result-code-card:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.result-code-card.success {\n border-color: #28a745;\n background: #d4edda;\n}\n\n.result-code-card.failure {\n border-color: #dc3545;\n background: #f8d7da;\n}\n\n.result-icon {\n font-size: 1.5em;\n flex-shrink: 0;\n}\n\n.result-code-card.success .result-icon {\n color: #28a745;\n}\n\n.result-code-card.failure .result-icon {\n color: #dc3545;\n}\n\n.result-content {\n flex: 1;\n min-width: 0;\n}\n\n.result-code {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n font-family: 'Courier New', monospace;\n}\n\n.result-description {\n color: #495057;\n font-size: 0.9em;\n line-height: 1.4;\n}\n\n/* Execution Section */\n.execution-stats-row {\n display: flex;\n gap: 20px;\n margin-bottom: 32px;\n flex-wrap: wrap;\n}\n\n.stat-box {\n flex: 1;\n min-width: 200px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n padding: 20px;\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.stat-box i {\n font-size: 2em;\n color: #6c757d;\n}\n\n.stat-info {\n flex: 1;\n}\n\n.executions-table {\n overflow-x: auto;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n}\n\n.executions-table table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.executions-table th {\n background: #f8f9fa;\n padding: 12px;\n text-align: left;\n font-weight: 600;\n color: #495057;\n border-bottom: 2px solid #e9ecef;\n}\n\n.executions-table td {\n padding: 12px;\n border-bottom: 1px solid #e9ecef;\n}\n\n.execution-row {\n transition: background 0.2s;\n}\n\n.execution-row:hover {\n background: #f8f9fa;\n}\n\n.execution-row.success {\n background: #d4edda20;\n}\n\n.running {\n color: #ffc107;\n font-style: italic;\n}\n\n.result-code {\n display: inline-block;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 0.85em;\n font-weight: 500;\n font-family: 'Courier New', monospace;\n}\n\n.result-code.success {\n background: #d4edda;\n color: #155724;\n}\n\n.result-code.failure {\n background: #f8d7da;\n color: #721c24;\n}\n\n/* Configuration Section */\n.config-subsection {\n margin-bottom: 32px;\n}\n\n.config-subsection h3 {\n margin: 0 0 16px 0;\n color: #495057;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.library-cards {\n display: flex;\n flex-direction: column;\n gap: 12px;\n}\n\n.library-card {\n display: flex;\n align-items: center;\n gap: 16px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.library-card:hover {\n background: #e9ecef;\n transform: translateX(4px);\n}\n\n.library-card i:first-child {\n font-size: 1.5em;\n color: #6c757d;\n}\n\n.library-info {\n flex: 1;\n min-width: 0;\n}\n\n.library-name {\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 4px;\n}\n\n.library-items {\n color: #6c757d;\n font-size: 0.9em;\n font-family: 'Courier New', monospace;\n}\n\n.related-entities-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 12px;\n}\n\n.related-entity-link {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 16px;\n background: #f8f9fa;\n border: 1px solid #e9ecef;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.2s;\n}\n\n.related-entity-link:hover {\n background: #e9ecef;\n border-color: #007bff;\n}\n\n.related-entity-link i {\n font-size: 1.2em;\n color: #6c757d;\n}\n\n.related-entity-link span:first-of-type {\n flex: 1;\n font-weight: 500;\n color: #495057;\n}\n\n.entity-count {\n color: #007bff;\n font-size: 0.9em;\n}\n\n/* Common States */\n.loading-state {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.loading-state i {\n font-size: 2em;\n margin-bottom: 12px;\n}\n\n.empty-state {\n text-align: center;\n padding: 60px;\n color: #6c757d;\n}\n\n.empty-state.mini {\n padding: 20px;\n}\n\n.empty-state i {\n font-size: 3em;\n margin-bottom: 16px;\n opacity: 0.3;\n}\n\n.empty-state p {\n margin: 0;\n font-size: 1.1em;\n}\n\n.empty-hint {\n margin-top: 8px !important;\n font-size: 0.9em !important;\n opacity: 0.7;\n}\n\n.no-params {\n text-align: center;\n padding: 20px;\n color: #6c757d;\n font-style: italic;\n}\n\n.no-params p {\n margin: 0;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n .action-hero-header {\n padding: 20px;\n }\n \n .action-identity {\n flex-direction: column;\n text-align: center;\n }\n \n .action-icon-wrapper {\n margin: 0 auto;\n }\n \n .action-title-row {\n justify-content: center;\n }\n \n .action-stats {\n justify-content: center;\n }\n \n .params-grid {\n grid-template-columns: 1fr;\n }\n}"] }]
|
|
1573
1571
|
}], () => [{ type: i0.ElementRef }, { type: i1.SharedService }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: i0.ChangeDetectorRef }, { type: i3.DialogService }], null); })();
|
|
1574
1572
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ActionFormComponentExtended, { className: "ActionFormComponentExtended", filePath: "src/lib/custom/Actions/action-form.component.ts", lineNumber: 18 }); })();
|
|
1575
1573
|
// Loader function required for the component to be properly registered
|