@memberjunction/ng-dashboards 5.21.0 → 5.23.0

package/dist/APIKeys/api-scopes-panel.component.js

@@ -4,11 +4,8 @@ import { UUIDsEqual } from '@memberjunction/global';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "@angular/forms";
-import * as i3 from "@progress/kendo-angular-buttons";
-import * as i4 from "@progress/kendo-angular-dropdowns";
-import * as i5 from "@progress/kendo-angular-inputs";
-import * as i6 from "@progress/kendo-angular-dialog";
-import * as i7 from "@memberjunction/ng-shared-generic";
+import * as i3 from "@memberjunction/ng-ui-components";
+import * as i4 from "@memberjunction/ng-shared-generic";
 const _c0 = a0 => ({ node: a0 });
 const _c1 = () => ({ FullPath: "(No Parent - Root Level)", ID: null });
 function APIScopesPanelComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
@@ -233,8 +230,8 @@ function APIScopesPanelComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(2);
     i0.ɵɵconditional(ctx_r1.ScopeTree.length === 0 ? 28 : -1);
 } }
-function APIScopesPanelComponent_Conditional_3_Conditional_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 56);
+function APIScopesPanelComponent_Conditional_3_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 54);
     i0.ɵɵtext(1, " Full path will be: ");
     i0.ɵɵelementStart(2, "code");
     i0.ɵɵtext(3);
@@ -244,14 +241,14 @@ function APIScopesPanelComponent_Conditional_3_Conditional_19_Template(rf, ctx)
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate2("", ctx_r1.SelectedParentScope.FullPath, ":", ctx_r1.EditName || "...");
 } }
-function APIScopesPanelComponent_Conditional_3_Conditional_43_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-loading", 68);
+function APIScopesPanelComponent_Conditional_3_Conditional_41_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-loading", 66);
 } if (rf & 2) {
     i0.ɵɵproperty("showText", false);
 } }
-function APIScopesPanelComponent_Conditional_3_Conditional_44_Template(rf, ctx) { if (rf & 1) {
+function APIScopesPanelComponent_Conditional_3_Conditional_42_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
-    i0.ɵɵelement(1, "i", 70);
+    i0.ɵɵelement(1, "i", 68);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -261,99 +258,95 @@ function APIScopesPanelComponent_Conditional_3_Conditional_44_Template(rf, ctx)
 } }
 function APIScopesPanelComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-window", 49);
-    i0.ɵɵlistener("close", function APIScopesPanelComponent_Conditional_3_Template_kendo_window_close_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDialogs()); });
-    i0.ɵɵelementStart(1, "kendo-window-titlebar")(2, "div", 50);
+    i0.ɵɵelementStart(0, "mj-window", 49);
+    i0.ɵɵlistener("Close", function APIScopesPanelComponent_Conditional_3_Template_mj_window_Close_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDialogs()); });
+    i0.ɵɵelementStart(1, "mj-window-titlebar")(2, "div", 50);
     i0.ɵɵelement(3, "i", 7);
     i0.ɵɵelementStart(4, "span");
     i0.ɵɵtext(5);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "button", 51);
-    i0.ɵɵlistener("click", function APIScopesPanelComponent_Conditional_3_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDialogs()); });
-    i0.ɵɵelement(7, "i", 52);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "div", 53)(9, "div", 54)(10, "label");
-    i0.ɵɵtext(11, "Scope Name *");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(6, "div", 51)(7, "div", 52)(8, "label");
+    i0.ɵɵtext(9, "Scope Name *");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "input", 55);
-    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_input_ngModelChange_12_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditName, $event) || (ctx_r1.EditName = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(10, "input", 53);
+    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_input_ngModelChange_10_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditName, $event) || (ctx_r1.EditName = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(13, "span", 56);
-    i0.ɵɵtext(14, "Use lowercase, single word. Will be combined with parent for full path.");
+    i0.ɵɵelementStart(11, "span", 54);
+    i0.ɵɵtext(12, "Use lowercase, single word. Will be combined with parent for full path.");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(15, "div", 54)(16, "label");
-    i0.ɵɵtext(17, "Parent Scope");
+    i0.ɵɵelementStart(13, "div", 52)(14, "label");
+    i0.ɵɵtext(15, "Parent Scope");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(18, "kendo-dropdownlist", 57);
-    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_kendo_dropdownlist_ngModelChange_18_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditParentId, $event) || (ctx_r1.EditParentId = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(16, "mj-dropdown", 55);
+    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_mj_dropdown_ngModelChange_16_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditParentId, $event) || (ctx_r1.EditParentId = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(19, APIScopesPanelComponent_Conditional_3_Conditional_19_Template, 4, 2, "span", 56);
+    i0.ɵɵconditionalCreate(17, APIScopesPanelComponent_Conditional_3_Conditional_17_Template, 4, 2, "span", 54);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(20, "div", 58)(21, "div", 59)(22, "label");
-    i0.ɵɵtext(23, "Category");
+    i0.ɵɵelementStart(18, "div", 56)(19, "div", 57)(20, "label");
+    i0.ɵɵtext(21, "Category");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(24, "kendo-dropdownlist", 60);
-    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_kendo_dropdownlist_ngModelChange_24_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditCategory, $event) || (ctx_r1.EditCategory = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(22, "mj-dropdown", 58);
+    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_mj_dropdown_ngModelChange_22_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditCategory, $event) || (ctx_r1.EditCategory = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(25, "div", 59)(26, "label");
-    i0.ɵɵtext(27, "Resource Type");
+    i0.ɵɵelementStart(23, "div", 57)(24, "label");
+    i0.ɵɵtext(25, "Resource Type");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(28, "kendo-dropdownlist", 61);
-    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_kendo_dropdownlist_ngModelChange_28_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditResourceType, $event) || (ctx_r1.EditResourceType = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(26, "mj-dropdown", 59);
+    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_mj_dropdown_ngModelChange_26_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditResourceType, $event) || (ctx_r1.EditResourceType = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(29, "div", 54)(30, "label");
-    i0.ɵɵtext(31, "Description");
+    i0.ɵɵelementStart(27, "div", 52)(28, "label");
+    i0.ɵɵtext(29, "Description");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(32, "textarea", 62);
-    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_textarea_ngModelChange_32_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditDescription, $event) || (ctx_r1.EditDescription = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(30, "textarea", 60);
+    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_textarea_ngModelChange_30_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditDescription, $event) || (ctx_r1.EditDescription = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(33, "div", 54)(34, "label", 63)(35, "input", 64);
-    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_input_ngModelChange_35_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditIsActive, $event) || (ctx_r1.EditIsActive = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(31, "div", 52)(32, "label", 61)(33, "input", 62);
+    i0.ɵɵtwoWayListener("ngModelChange", function APIScopesPanelComponent_Conditional_3_Template_input_ngModelChange_33_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.EditIsActive, $event) || (ctx_r1.EditIsActive = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(36, "div")(37, "span");
-    i0.ɵɵtext(38, "Active");
+    i0.ɵɵelementStart(34, "div")(35, "span");
+    i0.ɵɵtext(36, "Active");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(39, "span", 65);
-    i0.ɵɵtext(40, "Inactive scopes cannot be assigned to keys or applications");
+    i0.ɵɵelementStart(37, "span", 63);
+    i0.ɵɵtext(38, "Inactive scopes cannot be assigned to keys or applications");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(41, "div", 66)(42, "button", 67);
-    i0.ɵɵlistener("click", function APIScopesPanelComponent_Conditional_3_Template_button_click_42_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.saveScope()); });
-    i0.ɵɵconditionalCreate(43, APIScopesPanelComponent_Conditional_3_Conditional_43_Template, 1, 1, "mj-loading", 68);
-    i0.ɵɵconditionalCreate(44, APIScopesPanelComponent_Conditional_3_Conditional_44_Template, 3, 1, "span");
+    i0.ɵɵelementStart(39, "div", 64)(40, "button", 65);
+    i0.ɵɵlistener("click", function APIScopesPanelComponent_Conditional_3_Template_button_click_40_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.saveScope()); });
+    i0.ɵɵconditionalCreate(41, APIScopesPanelComponent_Conditional_3_Conditional_41_Template, 1, 1, "mj-loading", 66);
+    i0.ɵɵconditionalCreate(42, APIScopesPanelComponent_Conditional_3_Conditional_42_Template, 3, 1, "span");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(45, "button", 69);
-    i0.ɵɵlistener("click", function APIScopesPanelComponent_Conditional_3_Template_button_click_45_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDialogs()); });
-    i0.ɵɵtext(46, "Cancel");
+    i0.ɵɵelementStart(43, "button", 67);
+    i0.ɵɵlistener("click", function APIScopesPanelComponent_Conditional_3_Template_button_click_43_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDialogs()); });
+    i0.ɵɵtext(44, "Cancel");
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("width", 560)("minWidth", 420)("minHeight", 480)("resizable", true)("draggable", true)("top", 80);
+    i0.ɵɵproperty("Width", 560)("MinWidth", 420)("MinHeight", 480)("Resizable", true)("Draggable", true)("Visible", true)("Top", 80);
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(ctx_r1.EditingScope ? "Edit Scope" : "New Scope");
-    i0.ɵɵadvance(7);
+    i0.ɵɵadvance(5);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.EditName);
     i0.ɵɵadvance(6);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.EditParentId);
-    i0.ɵɵproperty("data", ctx_r1.getParentOptions())("textField", "FullPath")("valueField", "ID")("valuePrimitive", true)("defaultItem", i0.ɵɵpureFunction0(29, _c1));
+    i0.ɵɵproperty("Data", ctx_r1.getParentOptions())("ValuePrimitive", true)("DefaultItem", i0.ɵɵpureFunction0(27, _c1));
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.SelectedParentScope ? 19 : -1);
+    i0.ɵɵconditional(ctx_r1.SelectedParentScope ? 17 : -1);
     i0.ɵɵadvance(5);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.EditCategory);
-    i0.ɵɵproperty("data", ctx_r1.Categories)("valuePrimitive", true);
+    i0.ɵɵproperty("Data", ctx_r1.Categories)("ValuePrimitive", true);
     i0.ɵɵadvance(4);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.EditResourceType);
-    i0.ɵɵproperty("data", ctx_r1.ResourceTypes)("valuePrimitive", true)("defaultItem", "");
+    i0.ɵɵproperty("Data", ctx_r1.ResourceTypes)("ValuePrimitive", true)("DefaultItem", "");
     i0.ɵɵadvance(4);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.EditDescription);
     i0.ɵɵproperty("rows", 3);
     i0.ɵɵadvance(3);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.EditIsActive);
     i0.ɵɵadvance(7);
-    i0.ɵɵproperty("themeColor", "primary")("disabled", !ctx_r1.EditName.trim() || ctx_r1.IsSaving);
+    i0.ɵɵproperty("disabled", !ctx_r1.EditName.trim() || ctx_r1.IsSaving);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.IsSaving ? 43 : -1);
+    i0.ɵɵconditional(ctx_r1.IsSaving ? 41 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(!ctx_r1.IsSaving ? 44 : -1);
+    i0.ɵɵconditional(!ctx_r1.IsSaving ? 42 : -1);
 } }
 /**
  * API Scopes Panel Component
@@ -624,11 +617,11 @@ export class APIScopesPanelComponent {
         return this.FlatScopes.filter(s => s.IsActive).length;
     }
     static ɵfac = function APIScopesPanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || APIScopesPanelComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: APIScopesPanelComponent, selectors: [["mj-api-scopes-panel"]], outputs: { ScopeUpdated: "ScopeUpdated" }, standalone: false, decls: 4, vars: 3, consts: [["scopeNode", ""], [1, "scopes-panel"], ["text", "Loading scopes..."], [3, "width", "minWidth", "minHeight", "resizable", "draggable", "top"], [1, "panel-header"], [1, "header-left"], [1, "panel-title"], [1, "fa-solid", "fa-shield-halved"], [1, "panel-subtitle"], [1, "header-actions"], [1, "scope-stats"], [1, "stat"], [1, "fa-solid", "fa-shield"], [1, "stat", "active"], [1, "fa-solid", "fa-check-circle"], [1, "tree-controls"], ["title", "Expand All", 1, "btn-icon", 3, "click"], [1, "fa-solid", "fa-plus-square"], ["title", "Collapse All", 1, "btn-icon", 3, "click"], [1, "fa-solid", "fa-minus-square"], [1, "btn-create", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "message", "success"], [1, "message", "error"], [1, "scope-tree"], [1, "empty-state"], [1, "fa-solid", "fa-circle-exclamation"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "scope-node"], [1, "node-content"], [1, "expand-btn"], [1, "expand-placeholder"], [1, "scope-info", 3, "click"], [1, "scope-icon"], [1, "scope-details"], [1, "scope-name"], [1, "full-path"], [1, "status-badge"], [1, "scope-meta"], [1, "category"], [1, "resource-type"], [1, "description"], [1, "node-actions"], ["title", "Add Child Scope", 1, "btn-node-action", 3, "click"], ["title", "Edit Scope", 1, "btn-node-action", 3, "click"], [1, "fa-solid", "fa-pencil"], [1, "children"], [1, "expand-btn", 3, "click"], [1, "fa-solid"], [3, "close", "width", "minWidth", "minHeight", "resizable", "draggable", "top"], [1, "dialog-title"], ["kendoButton", "", "fillMode", "flat", "title", "Close (Esc)", 1, "window-close-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "dialog-content"], [1, "form-field"], ["kendoTextBox", "", "placeholder", "e.g., runview, create, execute", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "field-hint"], [3, "ngModelChange", "ngModel", "data", "textField", "valueField", "valuePrimitive", "defaultItem"], [1, "form-row"], [1, "form-field", "half"], [3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [3, "ngModelChange", "ngModel", "data", "valuePrimitive", "defaultItem"], ["kendoTextArea", "", "placeholder", "Describe what this scope allows...", 1, "form-textarea", 3, "ngModelChange", "ngModel", "rows"], [1, "checkbox-label"], ["type", "checkbox", "kendoCheckBox", "", 3, "ngModelChange", "ngModel"], [1, "checkbox-hint"], [1, "dialog-actions"], ["kendoButton", "", 3, "click", "themeColor", "disabled"], ["size", "small", 3, "showText"], ["kendoButton", "", 3, "click"], [1, "fa-solid", "fa-save"]], template: function APIScopesPanelComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: APIScopesPanelComponent, selectors: [["mj-api-scopes-panel"]], outputs: { ScopeUpdated: "ScopeUpdated" }, standalone: false, decls: 4, vars: 3, consts: [["scopeNode", ""], [1, "scopes-panel"], ["text", "Loading scopes..."], [3, "Width", "MinWidth", "MinHeight", "Resizable", "Draggable", "Visible", "Top"], [1, "panel-header"], [1, "header-left"], [1, "panel-title"], [1, "fa-solid", "fa-shield-halved"], [1, "panel-subtitle"], [1, "header-actions"], [1, "scope-stats"], [1, "stat"], [1, "fa-solid", "fa-shield"], [1, "stat", "active"], [1, "fa-solid", "fa-check-circle"], [1, "tree-controls"], ["title", "Expand All", 1, "btn-icon", 3, "click"], [1, "fa-solid", "fa-plus-square"], ["title", "Collapse All", 1, "btn-icon", 3, "click"], [1, "fa-solid", "fa-minus-square"], [1, "btn-create", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "message", "success"], [1, "message", "error"], [1, "scope-tree"], [1, "empty-state"], [1, "fa-solid", "fa-circle-exclamation"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "scope-node"], [1, "node-content"], [1, "expand-btn"], [1, "expand-placeholder"], [1, "scope-info", 3, "click"], [1, "scope-icon"], [1, "scope-details"], [1, "scope-name"], [1, "full-path"], [1, "status-badge"], [1, "scope-meta"], [1, "category"], [1, "resource-type"], [1, "description"], [1, "node-actions"], ["title", "Add Child Scope", 1, "btn-node-action", 3, "click"], ["title", "Edit Scope", 1, "btn-node-action", 3, "click"], [1, "fa-solid", "fa-pencil"], [1, "children"], [1, "expand-btn", 3, "click"], [1, "fa-solid"], [3, "Close", "Width", "MinWidth", "MinHeight", "Resizable", "Draggable", "Visible", "Top"], [1, "dialog-title"], [1, "dialog-content"], [1, "form-field"], ["placeholder", "e.g., runview, create, execute", 1, "mj-input", "form-input", 3, "ngModelChange", "ngModel"], [1, "field-hint"], ["TextField", "FullPath", "ValueField", "ID", 3, "ngModelChange", "ngModel", "Data", "ValuePrimitive", "DefaultItem"], [1, "form-row"], [1, "form-field", "half"], [3, "ngModelChange", "ngModel", "Data", "ValuePrimitive"], [3, "ngModelChange", "ngModel", "Data", "ValuePrimitive", "DefaultItem"], ["placeholder", "Describe what this scope allows...", 1, "mj-textarea", "form-textarea", 3, "ngModelChange", "ngModel", "rows"], [1, "checkbox-label"], ["type", "checkbox", 1, "mj-checkbox", 3, "ngModelChange", "ngModel"], [1, "checkbox-hint"], [1, "dialog-actions"], ["mjButton", "", "variant", "primary", 3, "click", "disabled"], ["size", "small", 3, "showText"], ["mjButton", "", 3, "click"], [1, "fa-solid", "fa-save"]], template: function APIScopesPanelComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 1);
             i0.ɵɵconditionalCreate(1, APIScopesPanelComponent_Conditional_1_Template, 1, 0, "mj-loading", 2);
             i0.ɵɵconditionalCreate(2, APIScopesPanelComponent_Conditional_2_Template, 31, 5);
-            i0.ɵɵconditionalCreate(3, APIScopesPanelComponent_Conditional_3_Template, 47, 30, "kendo-window", 3);
+            i0.ɵɵconditionalCreate(3, APIScopesPanelComponent_Conditional_3_Template, 45, 28, "mj-window", 3);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
@@ -637,11 +630,11 @@ export class APIScopesPanelComponent {
             i0.ɵɵconditional(!ctx.IsLoading ? 2 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.ShowCreateDialog || ctx.ShowEditDialog ? 3 : -1);
-        } }, dependencies: [i1.NgTemplateOutlet, i2.DefaultValueAccessor, i2.CheckboxControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.ButtonComponent, i4.DropDownListComponent, i5.TextBoxDirective, i5.TextAreaDirective, i5.CheckBoxDirective, i6.WindowComponent, i6.WindowTitleBarComponent, i7.LoadingComponent], styles: [".scopes-panel[_ngcontent-%COMP%] {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n}\n\n\n\n.panel-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n    gap: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 200px;\n}\n\n.panel-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin: 0 0 4px 0;\n}\n\n.panel-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n}\n\n.panel-subtitle[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n    margin: 0;\n}\n\n.header-actions[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.scope-stats[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 16px;\n}\n\n.stat[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 13px;\n    color: var(--mj-text-secondary);\n}\n\n.stat.active[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n}\n\n.stat[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n}\n\n.tree-controls[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 4px;\n}\n\n.btn-icon[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-icon[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.btn-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n}\n\n.btn-create[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 20px;\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    color: var(--mj-text-inverse);\n    border: none;\n    border-radius: 8px;\n    font-weight: 600;\n    font-size: 14px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-create[_ngcontent-%COMP%]:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}\n\n\n\n.message[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    border-radius: 8px;\n    margin-bottom: 16px;\n    font-size: 14px;\n}\n\n.message.success[_ngcontent-%COMP%] {\n    background: var(--mj-color-success-100);\n    color: var(--mj-color-success-800);\n    border: 1px solid var(--mj-status-success-border);\n}\n\n.message.error[_ngcontent-%COMP%] {\n    background: var(--mj-color-error-100);\n    color: var(--mj-status-error);\n    border: 1px solid var(--mj-status-error-border);\n}\n\n\n\n.scope-tree[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    background: var(--mj-bg-surface);\n    border-radius: 12px;\n    box-shadow: var(--mj-shadow-md);\n}\n\n.scope-node[_ngcontent-%COMP%] {\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.scope-node[_ngcontent-%COMP%]:last-child {\n    border-bottom: none;\n}\n\n.node-content[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    padding: 12px 16px;\n    transition: background 0.2s ease;\n}\n\n.node-content[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.node-content.inactive[_ngcontent-%COMP%] {\n    opacity: 0.6;\n}\n\n.expand-btn[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    transition: transform 0.2s ease;\n    flex-shrink: 0;\n}\n\n.expand-btn[_ngcontent-%COMP%]:hover {\n    color: var(--mj-text-secondary);\n}\n\n.expand-placeholder[_ngcontent-%COMP%] {\n    width: 24px;\n    flex-shrink: 0;\n}\n\n.scope-info[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    flex: 1;\n    min-width: 0;\n    cursor: pointer;\n}\n\n.scope-icon[_ngcontent-%COMP%] {\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n    margin-right: 12px;\n    flex-shrink: 0;\n}\n\n.scope-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: var(--mj-text-inverse);\n}\n\n.scope-details[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.scope-name[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--mj-text-primary);\n    flex-wrap: wrap;\n}\n\n.full-path[_ngcontent-%COMP%] {\n    font-family: monospace;\n    font-size: 12px;\n    color: var(--mj-text-muted);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    border-radius: 4px;\n    background: var(--mj-bg-surface-sunken);\n    color: var(--mj-text-secondary);\n}\n\n.scope-meta[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    margin-top: 4px;\n    font-size: 12px;\n    flex-wrap: wrap;\n}\n\n.category[_ngcontent-%COMP%] {\n    font-weight: 500;\n}\n\n.resource-type[_ngcontent-%COMP%] {\n    color: var(--mj-text-secondary);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.description[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    max-width: 300px;\n}\n\n.node-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 4px;\n    margin-left: 12px;\n    opacity: 0;\n    transition: opacity 0.2s ease;\n}\n\n.node-content[_ngcontent-%COMP%]:hover   .node-actions[_ngcontent-%COMP%] {\n    opacity: 1;\n}\n\n.btn-node-action[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 28px;\n    height: 28px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-node-action[_ngcontent-%COMP%]:hover {\n    background: var(--mj-status-success);\n    border-color: var(--mj-status-success);\n    color: var(--mj-text-inverse);\n}\n\n.btn-node-action[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 12px;\n}\n\n.children[_ngcontent-%COMP%] {\n    margin-left: 0;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 48px;\n    color: var(--mj-text-secondary);\n    text-align: center;\n}\n\n.empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 48px;\n    margin-bottom: 16px;\n    opacity: 0.5;\n}\n\n.empty-state[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 16px;\n    font-weight: 500;\n}\n\n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    font-size: 14px;\n    margin-top: 8px;\n}\n\n\n\n\n\n\n\n\n[_nghost-%COMP%]     kendo-window {\n    border-radius: 16px !important;\n    overflow: hidden;\n    box-shadow: var(--mj-shadow-2xl) !important;\n    background: var(--mj-bg-surface) !important;\n}\n\n[_nghost-%COMP%]     kendo-window .k-window-content {\n    padding: 0 !important;\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    background: var(--mj-bg-surface) !important;\n}\n\n[_nghost-%COMP%]     kendo-window-titlebar {\n    display: flex !important;\n    align-items: center;\n    justify-content: space-between;\n    padding: 18px 24px !important;\n    background: var(--mj-bg-page) !important;\n    border-bottom: 1px solid var(--mj-border-default) !important;\n}\n\n.dialog-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    font-weight: 600;\n    font-size: 17px;\n    color: var(--mj-text-primary);\n}\n\n.dialog-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n    font-size: 18px;\n}\n\n.window-close-btn[_ngcontent-%COMP%] {\n    margin-left: auto;\n    color: var(--mj-text-muted);\n    transition: all 0.2s ease;\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n}\n\n.window-close-btn[_ngcontent-%COMP%]:hover {\n    color: var(--mj-text-primary);\n    background: var(--mj-bg-surface-hover);\n}\n\n.window-close-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 16px;\n}\n\n\n\n.dialog-content[_ngcontent-%COMP%] {\n    padding: 24px;\n    flex: 1;\n    overflow-y: auto;\n}\n\n\n\n.form-field[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.form-field[_ngcontent-%COMP%]:last-of-type {\n    margin-bottom: 0;\n}\n\n.form-field[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin-bottom: 8px;\n    letter-spacing: 0.01em;\n}\n\n.form-input[_ngcontent-%COMP%] {\n    width: 100%;\n}\n\n.form-textarea[_ngcontent-%COMP%] {\n    width: 100%;\n    resize: vertical;\n    min-height: 80px;\n}\n\n[_nghost-%COMP%]     .form-input .k-input, \n[_nghost-%COMP%]     .form-textarea .k-input-inner, \n[_nghost-%COMP%]     .form-field .k-dropdownlist {\n    padding: 10px 14px;\n    border-radius: 8px;\n    font-size: 14px;\n    border-color: var(--mj-border-default);\n    background: var(--mj-bg-surface) !important;\n    color: var(--mj-text-primary) !important;\n    transition: all 0.2s ease;\n}\n\n[_nghost-%COMP%]     .form-input:focus-within, \n[_nghost-%COMP%]     .form-textarea:focus-within, \n[_nghost-%COMP%]     .form-field .k-dropdownlist.k-focus {\n    box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 10%, transparent);\n}\n\n.field-hint[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 6px;\n    line-height: 1.4;\n}\n\n.form-row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 16px;\n}\n\n.form-field.half[_ngcontent-%COMP%] {\n    flex: 1;\n}\n\n.checkbox-label[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-start;\n    gap: 12px;\n    cursor: pointer;\n    padding: 12px 16px;\n    background: var(--mj-bg-page);\n    border-radius: 10px;\n    border: 1px solid var(--mj-border-default);\n    transition: all 0.2s ease;\n}\n\n.checkbox-label[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-sunken);\n    border-color: var(--mj-border-strong);\n}\n\n.checkbox-label[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    margin-top: 2px;\n    flex-shrink: 0;\n}\n\n.checkbox-label[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:first-of-type {\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    font-size: 14px;\n}\n\n.checkbox-hint[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 4px;\n    line-height: 1.4;\n}\n\n\n\n.dialog-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 12px;\n    padding: 20px 24px;\n    background: var(--mj-bg-page);\n    border-top: 1px solid var(--mj-border-default);\n    margin: 0 -24px -24px -24px;\n}\n\n[_nghost-%COMP%]     .dialog-actions .k-button {\n    min-width: 100px;\n    padding: 10px 20px;\n    font-weight: 600;\n    border-radius: 8px;\n    transition: all 0.2s ease;\n}\n\n[_nghost-%COMP%]     .dialog-actions .k-button-solid-primary {\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    border: none;\n    box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n\n[_nghost-%COMP%]     .dialog-actions .k-button-solid-primary:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}"] });
+        } }, dependencies: [i1.NgTemplateOutlet, i2.DefaultValueAccessor, i2.CheckboxControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MJButtonDirective, i3.MJWindowComponent, i3.MJWindowTitlebarComponent, i3.MJDropdownComponent, i4.LoadingComponent], styles: [".scopes-panel[_ngcontent-%COMP%] {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n}\n\n\n\n.panel-header[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n    gap: 16px;\n}\n\n.header-left[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 200px;\n}\n\n.panel-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin: 0 0 4px 0;\n}\n\n.panel-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n}\n\n.panel-subtitle[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n    margin: 0;\n}\n\n.header-actions[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.scope-stats[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 16px;\n}\n\n.stat[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 13px;\n    color: var(--mj-text-secondary);\n}\n\n.stat.active[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n}\n\n.stat[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n}\n\n.tree-controls[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 4px;\n}\n\n.btn-icon[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-icon[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.btn-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n}\n\n.btn-create[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 20px;\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    color: var(--mj-text-inverse);\n    border: none;\n    border-radius: 8px;\n    font-weight: 600;\n    font-size: 14px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-create[_ngcontent-%COMP%]:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}\n\n\n\n.message[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    border-radius: 8px;\n    margin-bottom: 16px;\n    font-size: 14px;\n}\n\n.message.success[_ngcontent-%COMP%] {\n    background: var(--mj-color-success-100);\n    color: var(--mj-color-success-800);\n    border: 1px solid var(--mj-status-success-border);\n}\n\n.message.error[_ngcontent-%COMP%] {\n    background: var(--mj-color-error-100);\n    color: var(--mj-status-error);\n    border: 1px solid var(--mj-status-error-border);\n}\n\n\n\n.scope-tree[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    background: var(--mj-bg-surface);\n    border-radius: 12px;\n    box-shadow: var(--mj-shadow-md);\n}\n\n.scope-node[_ngcontent-%COMP%] {\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.scope-node[_ngcontent-%COMP%]:last-child {\n    border-bottom: none;\n}\n\n.node-content[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    padding: 12px 16px;\n    transition: background 0.2s ease;\n}\n\n.node-content[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.node-content.inactive[_ngcontent-%COMP%] {\n    opacity: 0.6;\n}\n\n.expand-btn[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    transition: transform 0.2s ease;\n    flex-shrink: 0;\n}\n\n.expand-btn[_ngcontent-%COMP%]:hover {\n    color: var(--mj-text-secondary);\n}\n\n.expand-placeholder[_ngcontent-%COMP%] {\n    width: 24px;\n    flex-shrink: 0;\n}\n\n.scope-info[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    flex: 1;\n    min-width: 0;\n    cursor: pointer;\n}\n\n.scope-icon[_ngcontent-%COMP%] {\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n    margin-right: 12px;\n    flex-shrink: 0;\n}\n\n.scope-icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 14px;\n    color: var(--mj-text-inverse);\n}\n\n.scope-details[_ngcontent-%COMP%] {\n    flex: 1;\n    min-width: 0;\n}\n\n.scope-name[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--mj-text-primary);\n    flex-wrap: wrap;\n}\n\n.full-path[_ngcontent-%COMP%] {\n    font-family: monospace;\n    font-size: 12px;\n    color: var(--mj-text-muted);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    border-radius: 4px;\n    background: var(--mj-bg-surface-sunken);\n    color: var(--mj-text-secondary);\n}\n\n.scope-meta[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    margin-top: 4px;\n    font-size: 12px;\n    flex-wrap: wrap;\n}\n\n.category[_ngcontent-%COMP%] {\n    font-weight: 500;\n}\n\n.resource-type[_ngcontent-%COMP%] {\n    color: var(--mj-text-secondary);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.description[_ngcontent-%COMP%] {\n    color: var(--mj-text-muted);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    max-width: 300px;\n}\n\n.node-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 4px;\n    margin-left: 12px;\n    opacity: 0;\n    transition: opacity 0.2s ease;\n}\n\n.node-content[_ngcontent-%COMP%]:hover   .node-actions[_ngcontent-%COMP%] {\n    opacity: 1;\n}\n\n.btn-node-action[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 28px;\n    height: 28px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-node-action[_ngcontent-%COMP%]:hover {\n    background: var(--mj-status-success);\n    border-color: var(--mj-status-success);\n    color: var(--mj-text-inverse);\n}\n\n.btn-node-action[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 12px;\n}\n\n.children[_ngcontent-%COMP%] {\n    margin-left: 0;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 48px;\n    color: var(--mj-text-secondary);\n    text-align: center;\n}\n\n.empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 48px;\n    margin-bottom: 16px;\n    opacity: 0.5;\n}\n\n.empty-state[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 16px;\n    font-weight: 500;\n}\n\n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    font-size: 14px;\n    margin-top: 8px;\n}\n\n\n\n\n\n\n\n\n[_nghost-%COMP%]     .mj-window {\n    border-radius: 16px !important;\n    overflow: hidden;\n    box-shadow: var(--mj-shadow-2xl) !important;\n    background: var(--mj-bg-surface) !important;\n}\n\n[_nghost-%COMP%]     .mj-window-body {\n    padding: 0 !important;\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    background: var(--mj-bg-surface) !important;\n}\n\n[_nghost-%COMP%]     .mj-window-titlebar {\n    display: flex !important;\n    align-items: center;\n    justify-content: space-between;\n    padding: 18px 24px !important;\n    background: var(--mj-bg-page) !important;\n    border-bottom: 1px solid var(--mj-border-default) !important;\n}\n\n.dialog-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    font-weight: 600;\n    font-size: 17px;\n    color: var(--mj-text-primary);\n}\n\n.dialog-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: var(--mj-status-success);\n    font-size: 18px;\n}\n\n.window-close-btn[_ngcontent-%COMP%] {\n    margin-left: auto;\n    color: var(--mj-text-muted);\n    transition: all 0.2s ease;\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n}\n\n.window-close-btn[_ngcontent-%COMP%]:hover {\n    color: var(--mj-text-primary);\n    background: var(--mj-bg-surface-hover);\n}\n\n.window-close-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 16px;\n}\n\n\n\n.dialog-content[_ngcontent-%COMP%] {\n    padding: 24px;\n    flex: 1;\n    overflow-y: auto;\n}\n\n\n\n.form-field[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.form-field[_ngcontent-%COMP%]:last-of-type {\n    margin-bottom: 0;\n}\n\n.form-field[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin-bottom: 8px;\n    letter-spacing: 0.01em;\n}\n\n.form-input[_ngcontent-%COMP%] {\n    width: 100%;\n}\n\n.form-textarea[_ngcontent-%COMP%] {\n    width: 100%;\n    resize: vertical;\n    min-height: 80px;\n}\n\n[_nghost-%COMP%]     .form-input.mj-input, \n[_nghost-%COMP%]     .form-textarea.mj-textarea, \n[_nghost-%COMP%]     .form-field .mj-dropdown {\n    padding: 10px 14px;\n    border-radius: 8px;\n    font-size: 14px;\n    border-color: var(--mj-border-default);\n    background: var(--mj-bg-surface) !important;\n    color: var(--mj-text-primary) !important;\n    transition: all 0.2s ease;\n}\n\n[_nghost-%COMP%]     .form-input.mj-input:focus-within, \n[_nghost-%COMP%]     .form-textarea.mj-textarea:focus-within, \n[_nghost-%COMP%]     .form-field .mj-dropdown:focus-within {\n    box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 10%, transparent);\n}\n\n.field-hint[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 6px;\n    line-height: 1.4;\n}\n\n.form-row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 16px;\n}\n\n.form-field.half[_ngcontent-%COMP%] {\n    flex: 1;\n}\n\n.checkbox-label[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: flex-start;\n    gap: 12px;\n    cursor: pointer;\n    padding: 12px 16px;\n    background: var(--mj-bg-page);\n    border-radius: 10px;\n    border: 1px solid var(--mj-border-default);\n    transition: all 0.2s ease;\n}\n\n.checkbox-label[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-sunken);\n    border-color: var(--mj-border-strong);\n}\n\n.checkbox-label[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    margin-top: 2px;\n    flex-shrink: 0;\n}\n\n.checkbox-label[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:first-of-type {\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    font-size: 14px;\n}\n\n.checkbox-hint[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 4px;\n    line-height: 1.4;\n}\n\n\n\n.dialog-actions[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 12px;\n    padding: 20px 24px;\n    background: var(--mj-bg-page);\n    border-top: 1px solid var(--mj-border-default);\n    margin: 0 -24px -24px -24px;\n}\n\n[_nghost-%COMP%]     .dialog-actions .mj-button {\n    min-width: 100px;\n    padding: 10px 20px;\n    font-weight: 600;\n    border-radius: 8px;\n    transition: all 0.2s ease;\n}\n\n[_nghost-%COMP%]     .dialog-actions .mj-button-primary {\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    border: none;\n    box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n\n[_nghost-%COMP%]     .dialog-actions .mj-button-primary:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(APIScopesPanelComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-api-scopes-panel', template: "<div class=\"scopes-panel\">\n  @if (IsLoading) {\n    <mj-loading text=\"Loading scopes...\"></mj-loading>\n  }\n\n  @if (!IsLoading) {\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-left\">\n        <h3 class=\"panel-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          API Scopes\n        </h3>\n        <p class=\"panel-subtitle\">Manage hierarchical permission scopes for API access</p>\n      </div>\n      <div class=\"header-actions\">\n        <div class=\"scope-stats\">\n          <span class=\"stat\">\n            <i class=\"fa-solid fa-shield\"></i>\n            {{getTotalCount()}} total\n          </span>\n          <span class=\"stat active\">\n            <i class=\"fa-solid fa-check-circle\"></i>\n            {{getActiveCount()}} active\n          </span>\n        </div>\n        <div class=\"tree-controls\">\n          <button class=\"btn-icon\" (click)=\"expandAll()\" title=\"Expand All\">\n            <i class=\"fa-solid fa-plus-square\"></i>\n          </button>\n          <button class=\"btn-icon\" (click)=\"collapseAll()\" title=\"Collapse All\">\n            <i class=\"fa-solid fa-minus-square\"></i>\n          </button>\n        </div>\n        <button class=\"btn-create\" (click)=\"openCreateDialog()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          New Scope\n        </button>\n      </div>\n    </div>\n    <!-- Messages -->\n    @if (SuccessMessage) {\n      <div class=\"message success\">\n        <i class=\"fa-solid fa-check-circle\"></i>\n        {{SuccessMessage}}\n      </div>\n    }\n    @if (ErrorMessage) {\n      <div class=\"message error\">\n        <i class=\"fa-solid fa-circle-exclamation\"></i>\n        {{ErrorMessage}}\n      </div>\n    }\n    <!-- Scope Tree -->\n    <div class=\"scope-tree\">\n      @for (node of ScopeTree; track node) {\n        <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: node }\"></ng-container>\n      }\n      <!-- Empty State -->\n      @if (ScopeTree.length === 0) {\n        <div class=\"empty-state\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>No scopes configured</span>\n          <p>Create scopes to define API access permissions</p>\n        </div>\n      }\n    </div>\n    <!-- Recursive Node Template -->\n    <ng-template #scopeNode let-node=\"node\">\n      <div class=\"scope-node\" [style.padding-left.px]=\"node.level * 24\">\n        <div class=\"node-content\" [class.inactive]=\"!node.scope.IsActive\">\n          @if (node.children.length > 0) {\n            <button class=\"expand-btn\"\n              (click)=\"toggleExpanded(node)\">\n              <i class=\"fa-solid\"\n                [class.fa-chevron-right]=\"!node.expanded\"\n              [class.fa-chevron-down]=\"node.expanded\"></i>\n            </button>\n          }\n          @if (node.children.length === 0) {\n            <span class=\"expand-placeholder\"></span>\n          }\n          <div class=\"scope-info\" (click)=\"openEditDialog(node.scope)\">\n            <div class=\"scope-icon\" [style.backgroundColor]=\"getCategoryColor(node.scope.Category)\">\n              <i class=\"fa-solid fa-shield\"></i>\n            </div>\n            <div class=\"scope-details\">\n              <div class=\"scope-name\">\n                {{node.scope.Name}}\n                @if (node.scope.FullPath && node.scope.FullPath !== node.scope.Name) {\n                  <span class=\"full-path\">\n                    {{node.scope.FullPath}}\n                  </span>\n                }\n                @if (!node.scope.IsActive) {\n                  <span class=\"status-badge\">Inactive</span>\n                }\n              </div>\n              <div class=\"scope-meta\">\n                <span class=\"category\" [style.color]=\"getCategoryColor(node.scope.Category)\">\n                  {{node.scope.Category}}\n                </span>\n                @if (node.scope.ResourceType) {\n                  <span class=\"resource-type\">\n                    {{node.scope.ResourceType}}\n                  </span>\n                }\n                @if (node.scope.Description) {\n                  <span class=\"description\">\n                    {{node.scope.Description}}\n                  </span>\n                }\n              </div>\n            </div>\n          </div>\n          <div class=\"node-actions\">\n            <button class=\"btn-node-action\" (click)=\"openCreateDialog(node.scope)\" title=\"Add Child Scope\">\n              <i class=\"fa-solid fa-plus\"></i>\n            </button>\n            <button class=\"btn-node-action\" (click)=\"openEditDialog(node.scope)\" title=\"Edit Scope\">\n              <i class=\"fa-solid fa-pencil\"></i>\n            </button>\n          </div>\n        </div>\n        @if (node.expanded && node.children.length > 0) {\n          <div class=\"children\">\n            @for (child of node.children; track child) {\n              <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: child }\"></ng-container>\n            }\n          </div>\n        }\n      </div>\n    </ng-template>\n  }\n\n  <!-- Create/Edit Dialog -->\n  @if (ShowCreateDialog || ShowEditDialog) {\n    <kendo-window\n      [width]=\"560\"\n      [minWidth]=\"420\"\n      [minHeight]=\"480\"\n      [resizable]=\"true\"\n      [draggable]=\"true\"\n      [top]=\"80\"\n      (close)=\"closeDialogs()\">\n      <kendo-window-titlebar>\n        <div class=\"dialog-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>{{EditingScope ? 'Edit Scope' : 'New Scope'}}</span>\n        </div>\n        <button kendoButton fillMode=\"flat\" (click)=\"closeDialogs()\" class=\"window-close-btn\" title=\"Close (Esc)\">\n          <i class=\"fa-solid fa-times\"></i>\n        </button>\n      </kendo-window-titlebar>\n      <div class=\"dialog-content\">\n        <div class=\"form-field\">\n          <label>Scope Name *</label>\n          <input kendoTextBox [(ngModel)]=\"EditName\"\n            placeholder=\"e.g., runview, create, execute\"\n            class=\"form-input\" />\n          <span class=\"field-hint\">Use lowercase, single word. Will be combined with parent for full path.</span>\n        </div>\n        <div class=\"form-field\">\n          <label>Parent Scope</label>\n          <kendo-dropdownlist [(ngModel)]=\"EditParentId\"\n            [data]=\"getParentOptions()\"\n            [textField]=\"'FullPath'\"\n            [valueField]=\"'ID'\"\n            [valuePrimitive]=\"true\"\n            [defaultItem]=\"{ FullPath: '(No Parent - Root Level)', ID: null }\">\n          </kendo-dropdownlist>\n          @if (SelectedParentScope) {\n            <span class=\"field-hint\">\n              Full path will be: <code>{{SelectedParentScope.FullPath}}:{{EditName || '...'}}</code>\n            </span>\n          }\n        </div>\n        <div class=\"form-row\">\n          <div class=\"form-field half\">\n            <label>Category</label>\n            <kendo-dropdownlist [(ngModel)]=\"EditCategory\"\n              [data]=\"Categories\"\n              [valuePrimitive]=\"true\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"form-field half\">\n            <label>Resource Type</label>\n            <kendo-dropdownlist [(ngModel)]=\"EditResourceType\"\n              [data]=\"ResourceTypes\"\n              [valuePrimitive]=\"true\"\n              [defaultItem]=\"''\">\n            </kendo-dropdownlist>\n          </div>\n        </div>\n        <div class=\"form-field\">\n          <label>Description</label>\n          <textarea kendoTextArea [(ngModel)]=\"EditDescription\"\n            placeholder=\"Describe what this scope allows...\"\n            [rows]=\"3\"\n          class=\"form-textarea\"></textarea>\n        </div>\n        <div class=\"form-field\">\n          <label class=\"checkbox-label\">\n            <input type=\"checkbox\" kendoCheckBox [(ngModel)]=\"EditIsActive\" />\n            <div>\n              <span>Active</span>\n              <span class=\"checkbox-hint\">Inactive scopes cannot be assigned to keys or applications</span>\n            </div>\n          </label>\n        </div>\n        <div class=\"dialog-actions\">\n          <button kendoButton [themeColor]=\"'primary'\"\n            [disabled]=\"!EditName.trim() || IsSaving\"\n            (click)=\"saveScope()\">\n            @if (IsSaving) {\n              <mj-loading [showText]=\"false\" size=\"small\"></mj-loading>\n            }\n            @if (!IsSaving) {\n              <span>\n                <i class=\"fa-solid fa-save\"></i>\n                {{EditingScope ? 'Update' : 'Create'}}\n              </span>\n            }\n          </button>\n          <button kendoButton (click)=\"closeDialogs()\">Cancel</button>\n        </div>\n      </div>\n    </kendo-window>\n  }\n</div>\n", styles: [".scopes-panel {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n}\n\n/* Panel Header */\n.panel-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n    gap: 16px;\n}\n\n.header-left {\n    flex: 1;\n    min-width: 200px;\n}\n\n.panel-title {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin: 0 0 4px 0;\n}\n\n.panel-title i {\n    color: var(--mj-status-success);\n}\n\n.panel-subtitle {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n    margin: 0;\n}\n\n.header-actions {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.scope-stats {\n    display: flex;\n    gap: 16px;\n}\n\n.stat {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 13px;\n    color: var(--mj-text-secondary);\n}\n\n.stat.active {\n    color: var(--mj-status-success);\n}\n\n.stat i {\n    font-size: 14px;\n}\n\n.tree-controls {\n    display: flex;\n    gap: 4px;\n}\n\n.btn-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-icon:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.btn-icon i {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n}\n\n.btn-create {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 20px;\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    color: var(--mj-text-inverse);\n    border: none;\n    border-radius: 8px;\n    font-weight: 600;\n    font-size: 14px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-create:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}\n\n/* Messages */\n.message {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    border-radius: 8px;\n    margin-bottom: 16px;\n    font-size: 14px;\n}\n\n.message.success {\n    background: var(--mj-color-success-100);\n    color: var(--mj-color-success-800);\n    border: 1px solid var(--mj-status-success-border);\n}\n\n.message.error {\n    background: var(--mj-color-error-100);\n    color: var(--mj-status-error);\n    border: 1px solid var(--mj-status-error-border);\n}\n\n/* Scope Tree */\n.scope-tree {\n    flex: 1;\n    overflow-y: auto;\n    background: var(--mj-bg-surface);\n    border-radius: 12px;\n    box-shadow: var(--mj-shadow-md);\n}\n\n.scope-node {\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.scope-node:last-child {\n    border-bottom: none;\n}\n\n.node-content {\n    display: flex;\n    align-items: center;\n    padding: 12px 16px;\n    transition: background 0.2s ease;\n}\n\n.node-content:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.node-content.inactive {\n    opacity: 0.6;\n}\n\n.expand-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    transition: transform 0.2s ease;\n    flex-shrink: 0;\n}\n\n.expand-btn:hover {\n    color: var(--mj-text-secondary);\n}\n\n.expand-placeholder {\n    width: 24px;\n    flex-shrink: 0;\n}\n\n.scope-info {\n    display: flex;\n    align-items: center;\n    flex: 1;\n    min-width: 0;\n    cursor: pointer;\n}\n\n.scope-icon {\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n    margin-right: 12px;\n    flex-shrink: 0;\n}\n\n.scope-icon i {\n    font-size: 14px;\n    color: var(--mj-text-inverse);\n}\n\n.scope-details {\n    flex: 1;\n    min-width: 0;\n}\n\n.scope-name {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--mj-text-primary);\n    flex-wrap: wrap;\n}\n\n.full-path {\n    font-family: monospace;\n    font-size: 12px;\n    color: var(--mj-text-muted);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.status-badge {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    border-radius: 4px;\n    background: var(--mj-bg-surface-sunken);\n    color: var(--mj-text-secondary);\n}\n\n.scope-meta {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    margin-top: 4px;\n    font-size: 12px;\n    flex-wrap: wrap;\n}\n\n.category {\n    font-weight: 500;\n}\n\n.resource-type {\n    color: var(--mj-text-secondary);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.description {\n    color: var(--mj-text-muted);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    max-width: 300px;\n}\n\n.node-actions {\n    display: flex;\n    gap: 4px;\n    margin-left: 12px;\n    opacity: 0;\n    transition: opacity 0.2s ease;\n}\n\n.node-content:hover .node-actions {\n    opacity: 1;\n}\n\n.btn-node-action {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 28px;\n    height: 28px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-node-action:hover {\n    background: var(--mj-status-success);\n    border-color: var(--mj-status-success);\n    color: var(--mj-text-inverse);\n}\n\n.btn-node-action i {\n    font-size: 12px;\n}\n\n.children {\n    margin-left: 0;\n}\n\n/* Empty State */\n.empty-state {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 48px;\n    color: var(--mj-text-secondary);\n    text-align: center;\n}\n\n.empty-state i {\n    font-size: 48px;\n    margin-bottom: 16px;\n    opacity: 0.5;\n}\n\n.empty-state span {\n    font-size: 16px;\n    font-weight: 500;\n}\n\n.empty-state p {\n    font-size: 14px;\n    margin-top: 8px;\n}\n\n/* ========================================\n   Dialog Styles - Polished & Professional\n   ======================================== */\n\n/* Window styling */\n:host ::ng-deep kendo-window {\n    border-radius: 16px !important;\n    overflow: hidden;\n    box-shadow: var(--mj-shadow-2xl) !important;\n    background: var(--mj-bg-surface) !important;\n}\n\n:host ::ng-deep kendo-window .k-window-content {\n    padding: 0 !important;\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    background: var(--mj-bg-surface) !important;\n}\n\n:host ::ng-deep kendo-window-titlebar {\n    display: flex !important;\n    align-items: center;\n    justify-content: space-between;\n    padding: 18px 24px !important;\n    background: var(--mj-bg-page) !important;\n    border-bottom: 1px solid var(--mj-border-default) !important;\n}\n\n.dialog-title {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    font-weight: 600;\n    font-size: 17px;\n    color: var(--mj-text-primary);\n}\n\n.dialog-title i {\n    color: var(--mj-status-success);\n    font-size: 18px;\n}\n\n.window-close-btn {\n    margin-left: auto;\n    color: var(--mj-text-muted);\n    transition: all 0.2s ease;\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n}\n\n.window-close-btn:hover {\n    color: var(--mj-text-primary);\n    background: var(--mj-bg-surface-hover);\n}\n\n.window-close-btn i {\n    font-size: 16px;\n}\n\n/* Dialog Content */\n.dialog-content {\n    padding: 24px;\n    flex: 1;\n    overflow-y: auto;\n}\n\n/* Form Fields */\n.form-field {\n    margin-bottom: 20px;\n}\n\n.form-field:last-of-type {\n    margin-bottom: 0;\n}\n\n.form-field label {\n    display: block;\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin-bottom: 8px;\n    letter-spacing: 0.01em;\n}\n\n.form-input {\n    width: 100%;\n}\n\n.form-textarea {\n    width: 100%;\n    resize: vertical;\n    min-height: 80px;\n}\n\n:host ::ng-deep .form-input .k-input,\n:host ::ng-deep .form-textarea .k-input-inner,\n:host ::ng-deep .form-field .k-dropdownlist {\n    padding: 10px 14px;\n    border-radius: 8px;\n    font-size: 14px;\n    border-color: var(--mj-border-default);\n    background: var(--mj-bg-surface) !important;\n    color: var(--mj-text-primary) !important;\n    transition: all 0.2s ease;\n}\n\n:host ::ng-deep .form-input:focus-within,\n:host ::ng-deep .form-textarea:focus-within,\n:host ::ng-deep .form-field .k-dropdownlist.k-focus {\n    box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 10%, transparent);\n}\n\n.field-hint {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 6px;\n    line-height: 1.4;\n}\n\n.form-row {\n    display: flex;\n    gap: 16px;\n}\n\n.form-field.half {\n    flex: 1;\n}\n\n.checkbox-label {\n    display: flex;\n    align-items: flex-start;\n    gap: 12px;\n    cursor: pointer;\n    padding: 12px 16px;\n    background: var(--mj-bg-page);\n    border-radius: 10px;\n    border: 1px solid var(--mj-border-default);\n    transition: all 0.2s ease;\n}\n\n.checkbox-label:hover {\n    background: var(--mj-bg-surface-sunken);\n    border-color: var(--mj-border-strong);\n}\n\n.checkbox-label input {\n    margin-top: 2px;\n    flex-shrink: 0;\n}\n\n.checkbox-label span:first-of-type {\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    font-size: 14px;\n}\n\n.checkbox-hint {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 4px;\n    line-height: 1.4;\n}\n\n/* Dialog Actions */\n.dialog-actions {\n    display: flex;\n    gap: 12px;\n    padding: 20px 24px;\n    background: var(--mj-bg-page);\n    border-top: 1px solid var(--mj-border-default);\n    margin: 0 -24px -24px -24px;\n}\n\n:host ::ng-deep .dialog-actions .k-button {\n    min-width: 100px;\n    padding: 10px 20px;\n    font-weight: 600;\n    border-radius: 8px;\n    transition: all 0.2s ease;\n}\n\n:host ::ng-deep .dialog-actions .k-button-solid-primary {\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    border: none;\n    box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n\n:host ::ng-deep .dialog-actions .k-button-solid-primary:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-api-scopes-panel', template: "<div class=\"scopes-panel\">\n  @if (IsLoading) {\n    <mj-loading text=\"Loading scopes...\"></mj-loading>\n  }\n\n  @if (!IsLoading) {\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-left\">\n        <h3 class=\"panel-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          API Scopes\n        </h3>\n        <p class=\"panel-subtitle\">Manage hierarchical permission scopes for API access</p>\n      </div>\n      <div class=\"header-actions\">\n        <div class=\"scope-stats\">\n          <span class=\"stat\">\n            <i class=\"fa-solid fa-shield\"></i>\n            {{getTotalCount()}} total\n          </span>\n          <span class=\"stat active\">\n            <i class=\"fa-solid fa-check-circle\"></i>\n            {{getActiveCount()}} active\n          </span>\n        </div>\n        <div class=\"tree-controls\">\n          <button class=\"btn-icon\" (click)=\"expandAll()\" title=\"Expand All\">\n            <i class=\"fa-solid fa-plus-square\"></i>\n          </button>\n          <button class=\"btn-icon\" (click)=\"collapseAll()\" title=\"Collapse All\">\n            <i class=\"fa-solid fa-minus-square\"></i>\n          </button>\n        </div>\n        <button class=\"btn-create\" (click)=\"openCreateDialog()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          New Scope\n        </button>\n      </div>\n    </div>\n    <!-- Messages -->\n    @if (SuccessMessage) {\n      <div class=\"message success\">\n        <i class=\"fa-solid fa-check-circle\"></i>\n        {{SuccessMessage}}\n      </div>\n    }\n    @if (ErrorMessage) {\n      <div class=\"message error\">\n        <i class=\"fa-solid fa-circle-exclamation\"></i>\n        {{ErrorMessage}}\n      </div>\n    }\n    <!-- Scope Tree -->\n    <div class=\"scope-tree\">\n      @for (node of ScopeTree; track node) {\n        <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: node }\"></ng-container>\n      }\n      <!-- Empty State -->\n      @if (ScopeTree.length === 0) {\n        <div class=\"empty-state\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>No scopes configured</span>\n          <p>Create scopes to define API access permissions</p>\n        </div>\n      }\n    </div>\n    <!-- Recursive Node Template -->\n    <ng-template #scopeNode let-node=\"node\">\n      <div class=\"scope-node\" [style.padding-left.px]=\"node.level * 24\">\n        <div class=\"node-content\" [class.inactive]=\"!node.scope.IsActive\">\n          @if (node.children.length > 0) {\n            <button class=\"expand-btn\"\n              (click)=\"toggleExpanded(node)\">\n              <i class=\"fa-solid\"\n                [class.fa-chevron-right]=\"!node.expanded\"\n              [class.fa-chevron-down]=\"node.expanded\"></i>\n            </button>\n          }\n          @if (node.children.length === 0) {\n            <span class=\"expand-placeholder\"></span>\n          }\n          <div class=\"scope-info\" (click)=\"openEditDialog(node.scope)\">\n            <div class=\"scope-icon\" [style.backgroundColor]=\"getCategoryColor(node.scope.Category)\">\n              <i class=\"fa-solid fa-shield\"></i>\n            </div>\n            <div class=\"scope-details\">\n              <div class=\"scope-name\">\n                {{node.scope.Name}}\n                @if (node.scope.FullPath && node.scope.FullPath !== node.scope.Name) {\n                  <span class=\"full-path\">\n                    {{node.scope.FullPath}}\n                  </span>\n                }\n                @if (!node.scope.IsActive) {\n                  <span class=\"status-badge\">Inactive</span>\n                }\n              </div>\n              <div class=\"scope-meta\">\n                <span class=\"category\" [style.color]=\"getCategoryColor(node.scope.Category)\">\n                  {{node.scope.Category}}\n                </span>\n                @if (node.scope.ResourceType) {\n                  <span class=\"resource-type\">\n                    {{node.scope.ResourceType}}\n                  </span>\n                }\n                @if (node.scope.Description) {\n                  <span class=\"description\">\n                    {{node.scope.Description}}\n                  </span>\n                }\n              </div>\n            </div>\n          </div>\n          <div class=\"node-actions\">\n            <button class=\"btn-node-action\" (click)=\"openCreateDialog(node.scope)\" title=\"Add Child Scope\">\n              <i class=\"fa-solid fa-plus\"></i>\n            </button>\n            <button class=\"btn-node-action\" (click)=\"openEditDialog(node.scope)\" title=\"Edit Scope\">\n              <i class=\"fa-solid fa-pencil\"></i>\n            </button>\n          </div>\n        </div>\n        @if (node.expanded && node.children.length > 0) {\n          <div class=\"children\">\n            @for (child of node.children; track child) {\n              <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: child }\"></ng-container>\n            }\n          </div>\n        }\n      </div>\n    </ng-template>\n  }\n\n  <!-- Create/Edit Dialog -->\n  @if (ShowCreateDialog || ShowEditDialog) {\n    <mj-window\n      [Width]=\"560\"\n      [MinWidth]=\"420\"\n      [MinHeight]=\"480\"\n      [Resizable]=\"true\"\n      [Draggable]=\"true\"\n      [Visible]=\"true\"\n      [Top]=\"80\"\n      (Close)=\"closeDialogs()\">\n      <mj-window-titlebar>\n        <div class=\"dialog-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>{{EditingScope ? 'Edit Scope' : 'New Scope'}}</span>\n        </div>\n      </mj-window-titlebar>\n      <div class=\"dialog-content\">\n        <div class=\"form-field\">\n          <label>Scope Name *</label>\n          <input class=\"mj-input form-input\" [(ngModel)]=\"EditName\"\n            placeholder=\"e.g., runview, create, execute\" />\n          <span class=\"field-hint\">Use lowercase, single word. Will be combined with parent for full path.</span>\n        </div>\n        <div class=\"form-field\">\n          <label>Parent Scope</label>\n          <mj-dropdown [(ngModel)]=\"EditParentId\"\n            [Data]=\"getParentOptions()\"\n            TextField=\"FullPath\"\n            ValueField=\"ID\"\n            [ValuePrimitive]=\"true\"\n            [DefaultItem]=\"{ FullPath: '(No Parent - Root Level)', ID: null }\">\n          </mj-dropdown>\n          @if (SelectedParentScope) {\n            <span class=\"field-hint\">\n              Full path will be: <code>{{SelectedParentScope.FullPath}}:{{EditName || '...'}}</code>\n            </span>\n          }\n        </div>\n        <div class=\"form-row\">\n          <div class=\"form-field half\">\n            <label>Category</label>\n            <mj-dropdown [(ngModel)]=\"EditCategory\"\n              [Data]=\"Categories\"\n              [ValuePrimitive]=\"true\">\n            </mj-dropdown>\n          </div>\n          <div class=\"form-field half\">\n            <label>Resource Type</label>\n            <mj-dropdown [(ngModel)]=\"EditResourceType\"\n              [Data]=\"ResourceTypes\"\n              [ValuePrimitive]=\"true\"\n              [DefaultItem]=\"''\">\n            </mj-dropdown>\n          </div>\n        </div>\n        <div class=\"form-field\">\n          <label>Description</label>\n          <textarea class=\"mj-textarea form-textarea\" [(ngModel)]=\"EditDescription\"\n            placeholder=\"Describe what this scope allows...\"\n            [rows]=\"3\"></textarea>\n        </div>\n        <div class=\"form-field\">\n          <label class=\"checkbox-label\">\n            <input type=\"checkbox\" class=\"mj-checkbox\" [(ngModel)]=\"EditIsActive\" />\n            <div>\n              <span>Active</span>\n              <span class=\"checkbox-hint\">Inactive scopes cannot be assigned to keys or applications</span>\n            </div>\n          </label>\n        </div>\n        <div class=\"dialog-actions\">\n          <button mjButton variant=\"primary\"\n            [disabled]=\"!EditName.trim() || IsSaving\"\n            (click)=\"saveScope()\">\n            @if (IsSaving) {\n              <mj-loading [showText]=\"false\" size=\"small\"></mj-loading>\n            }\n            @if (!IsSaving) {\n              <span>\n                <i class=\"fa-solid fa-save\"></i>\n                {{EditingScope ? 'Update' : 'Create'}}\n              </span>\n            }\n          </button>\n          <button mjButton (click)=\"closeDialogs()\">Cancel</button>\n        </div>\n      </div>\n    </mj-window>\n  }\n</div>\n", styles: [".scopes-panel {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n}\n\n/* Panel Header */\n.panel-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n    margin-bottom: 24px;\n    flex-wrap: wrap;\n    gap: 16px;\n}\n\n.header-left {\n    flex: 1;\n    min-width: 200px;\n}\n\n.panel-title {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 18px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin: 0 0 4px 0;\n}\n\n.panel-title i {\n    color: var(--mj-status-success);\n}\n\n.panel-subtitle {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n    margin: 0;\n}\n\n.header-actions {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.scope-stats {\n    display: flex;\n    gap: 16px;\n}\n\n.stat {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 13px;\n    color: var(--mj-text-secondary);\n}\n\n.stat.active {\n    color: var(--mj-status-success);\n}\n\n.stat i {\n    font-size: 14px;\n}\n\n.tree-controls {\n    display: flex;\n    gap: 4px;\n}\n\n.btn-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 32px;\n    height: 32px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-icon:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.btn-icon i {\n    font-size: 14px;\n    color: var(--mj-text-secondary);\n}\n\n.btn-create {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 20px;\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    color: var(--mj-text-inverse);\n    border: none;\n    border-radius: 8px;\n    font-weight: 600;\n    font-size: 14px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-create:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}\n\n/* Messages */\n.message {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 16px;\n    border-radius: 8px;\n    margin-bottom: 16px;\n    font-size: 14px;\n}\n\n.message.success {\n    background: var(--mj-color-success-100);\n    color: var(--mj-color-success-800);\n    border: 1px solid var(--mj-status-success-border);\n}\n\n.message.error {\n    background: var(--mj-color-error-100);\n    color: var(--mj-status-error);\n    border: 1px solid var(--mj-status-error-border);\n}\n\n/* Scope Tree */\n.scope-tree {\n    flex: 1;\n    overflow-y: auto;\n    background: var(--mj-bg-surface);\n    border-radius: 12px;\n    box-shadow: var(--mj-shadow-md);\n}\n\n.scope-node {\n    border-bottom: 1px solid var(--mj-border-default);\n}\n\n.scope-node:last-child {\n    border-bottom: none;\n}\n\n.node-content {\n    display: flex;\n    align-items: center;\n    padding: 12px 16px;\n    transition: background 0.2s ease;\n}\n\n.node-content:hover {\n    background: var(--mj-bg-surface-hover);\n}\n\n.node-content.inactive {\n    opacity: 0.6;\n}\n\n.expand-btn {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 24px;\n    height: 24px;\n    background: none;\n    border: none;\n    cursor: pointer;\n    color: var(--mj-text-muted);\n    transition: transform 0.2s ease;\n    flex-shrink: 0;\n}\n\n.expand-btn:hover {\n    color: var(--mj-text-secondary);\n}\n\n.expand-placeholder {\n    width: 24px;\n    flex-shrink: 0;\n}\n\n.scope-info {\n    display: flex;\n    align-items: center;\n    flex: 1;\n    min-width: 0;\n    cursor: pointer;\n}\n\n.scope-icon {\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n    margin-right: 12px;\n    flex-shrink: 0;\n}\n\n.scope-icon i {\n    font-size: 14px;\n    color: var(--mj-text-inverse);\n}\n\n.scope-details {\n    flex: 1;\n    min-width: 0;\n}\n\n.scope-name {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    font-size: 14px;\n    font-weight: 500;\n    color: var(--mj-text-primary);\n    flex-wrap: wrap;\n}\n\n.full-path {\n    font-family: monospace;\n    font-size: 12px;\n    color: var(--mj-text-muted);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.status-badge {\n    font-size: 10px;\n    font-weight: 500;\n    padding: 2px 6px;\n    border-radius: 4px;\n    background: var(--mj-bg-surface-sunken);\n    color: var(--mj-text-secondary);\n}\n\n.scope-meta {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    margin-top: 4px;\n    font-size: 12px;\n    flex-wrap: wrap;\n}\n\n.category {\n    font-weight: 500;\n}\n\n.resource-type {\n    color: var(--mj-text-secondary);\n    background: var(--mj-bg-surface-sunken);\n    padding: 2px 6px;\n    border-radius: 4px;\n}\n\n.description {\n    color: var(--mj-text-muted);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    max-width: 300px;\n}\n\n.node-actions {\n    display: flex;\n    gap: 4px;\n    margin-left: 12px;\n    opacity: 0;\n    transition: opacity 0.2s ease;\n}\n\n.node-content:hover .node-actions {\n    opacity: 1;\n}\n\n.btn-node-action {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 28px;\n    height: 28px;\n    background: var(--mj-bg-surface);\n    border: 1px solid var(--mj-border-default);\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.btn-node-action:hover {\n    background: var(--mj-status-success);\n    border-color: var(--mj-status-success);\n    color: var(--mj-text-inverse);\n}\n\n.btn-node-action i {\n    font-size: 12px;\n}\n\n.children {\n    margin-left: 0;\n}\n\n/* Empty State */\n.empty-state {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 48px;\n    color: var(--mj-text-secondary);\n    text-align: center;\n}\n\n.empty-state i {\n    font-size: 48px;\n    margin-bottom: 16px;\n    opacity: 0.5;\n}\n\n.empty-state span {\n    font-size: 16px;\n    font-weight: 500;\n}\n\n.empty-state p {\n    font-size: 14px;\n    margin-top: 8px;\n}\n\n/* ========================================\n   Dialog Styles - Polished & Professional\n   ======================================== */\n\n/* Window styling */\n:host ::ng-deep .mj-window {\n    border-radius: 16px !important;\n    overflow: hidden;\n    box-shadow: var(--mj-shadow-2xl) !important;\n    background: var(--mj-bg-surface) !important;\n}\n\n:host ::ng-deep .mj-window-body {\n    padding: 0 !important;\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    background: var(--mj-bg-surface) !important;\n}\n\n:host ::ng-deep .mj-window-titlebar {\n    display: flex !important;\n    align-items: center;\n    justify-content: space-between;\n    padding: 18px 24px !important;\n    background: var(--mj-bg-page) !important;\n    border-bottom: 1px solid var(--mj-border-default) !important;\n}\n\n.dialog-title {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    font-weight: 600;\n    font-size: 17px;\n    color: var(--mj-text-primary);\n}\n\n.dialog-title i {\n    color: var(--mj-status-success);\n    font-size: 18px;\n}\n\n.window-close-btn {\n    margin-left: auto;\n    color: var(--mj-text-muted);\n    transition: all 0.2s ease;\n    width: 32px;\n    height: 32px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 8px;\n}\n\n.window-close-btn:hover {\n    color: var(--mj-text-primary);\n    background: var(--mj-bg-surface-hover);\n}\n\n.window-close-btn i {\n    font-size: 16px;\n}\n\n/* Dialog Content */\n.dialog-content {\n    padding: 24px;\n    flex: 1;\n    overflow-y: auto;\n}\n\n/* Form Fields */\n.form-field {\n    margin-bottom: 20px;\n}\n\n.form-field:last-of-type {\n    margin-bottom: 0;\n}\n\n.form-field label {\n    display: block;\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    margin-bottom: 8px;\n    letter-spacing: 0.01em;\n}\n\n.form-input {\n    width: 100%;\n}\n\n.form-textarea {\n    width: 100%;\n    resize: vertical;\n    min-height: 80px;\n}\n\n:host ::ng-deep .form-input.mj-input,\n:host ::ng-deep .form-textarea.mj-textarea,\n:host ::ng-deep .form-field .mj-dropdown {\n    padding: 10px 14px;\n    border-radius: 8px;\n    font-size: 14px;\n    border-color: var(--mj-border-default);\n    background: var(--mj-bg-surface) !important;\n    color: var(--mj-text-primary) !important;\n    transition: all 0.2s ease;\n}\n\n:host ::ng-deep .form-input.mj-input:focus-within,\n:host ::ng-deep .form-textarea.mj-textarea:focus-within,\n:host ::ng-deep .form-field .mj-dropdown:focus-within {\n    box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-status-success) 10%, transparent);\n}\n\n.field-hint {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 6px;\n    line-height: 1.4;\n}\n\n.form-row {\n    display: flex;\n    gap: 16px;\n}\n\n.form-field.half {\n    flex: 1;\n}\n\n.checkbox-label {\n    display: flex;\n    align-items: flex-start;\n    gap: 12px;\n    cursor: pointer;\n    padding: 12px 16px;\n    background: var(--mj-bg-page);\n    border-radius: 10px;\n    border: 1px solid var(--mj-border-default);\n    transition: all 0.2s ease;\n}\n\n.checkbox-label:hover {\n    background: var(--mj-bg-surface-sunken);\n    border-color: var(--mj-border-strong);\n}\n\n.checkbox-label input {\n    margin-top: 2px;\n    flex-shrink: 0;\n}\n\n.checkbox-label span:first-of-type {\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    font-size: 14px;\n}\n\n.checkbox-hint {\n    display: block;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    margin-top: 4px;\n    line-height: 1.4;\n}\n\n/* Dialog Actions */\n.dialog-actions {\n    display: flex;\n    gap: 12px;\n    padding: 20px 24px;\n    background: var(--mj-bg-page);\n    border-top: 1px solid var(--mj-border-default);\n    margin: 0 -24px -24px -24px;\n}\n\n:host ::ng-deep .dialog-actions .mj-button {\n    min-width: 100px;\n    padding: 10px 20px;\n    font-weight: 600;\n    border-radius: 8px;\n    transition: all 0.2s ease;\n}\n\n:host ::ng-deep .dialog-actions .mj-button-primary {\n    background: linear-gradient(135deg, var(--mj-status-success) 0%, var(--mj-color-success-600) 100%);\n    border: none;\n    box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-status-success) 30%, transparent);\n}\n\n:host ::ng-deep .dialog-actions .mj-button-primary:hover {\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-status-success) 40%, transparent);\n}\n"] }]
     }], () => [{ type: i0.ChangeDetectorRef }], { ScopeUpdated: [{
             type: Output
         }] }); })();

package/dist/APIKeys/api-scopes-panel.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"api-scopes-panel.component.js","sourceRoot":"","sources":["../../src/APIKeys/api-scopes-panel.component.ts","../../src/APIKeys/api-scopes-panel.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, OnInit, EventEmitter, Output, ChangeDetectorRef } from '@angular/core';\nimport { Metadata, RunView } from '@memberjunction/core';\nimport { MJAPIScopeEntity } from '@memberjunction/core-entities';\nimport { UUIDsEqual } from '@memberjunction/global';\n/** Scope tree node structure */\ninterface ScopeTreeNode {\n    scope: MJAPIScopeEntity;\n    children: ScopeTreeNode[];\n    expanded: boolean;\n    level: number;\n}\n\n/**\n * API Scopes Panel Component\n * Manages API Scopes in a hierarchical tree structure\n */\n@Component({\n  standalone: false,\n    selector: 'mj-api-scopes-panel',\n    templateUrl: './api-scopes-panel.component.html',\n    styleUrls: ['./api-scopes-panel.component.css']\n})\nexport class APIScopesPanelComponent implements OnInit {\n    @Output() ScopeUpdated = new EventEmitter<void>();\n\n    private md = new Metadata();\n    private cdr: ChangeDetectorRef;\n\n    // Loading states\n    public IsLoading = true;\n    public IsSaving = false;\n\n    // Data\n    public ScopeTree: ScopeTreeNode[] = [];\n    public FlatScopes: MJAPIScopeEntity[] = [];\n\n    // Edit state\n    public EditingScope: MJAPIScopeEntity | null = null;\n    public EditName = '';\n    public EditDescription = '';\n    public EditCategory = '';\n    public EditResourceType = '';\n    public EditParentId: string | null = null;\n    public EditIsActive = true;\n\n    // Dialog states\n    public ShowCreateDialog = false;\n    public ShowEditDialog = false;\n    public SelectedParentScope: MJAPIScopeEntity | null = null;\n\n    // Messages\n    public SuccessMessage = '';\n    public ErrorMessage = '';\n\n    // Category colors\n    public readonly CategoryColors: Record<string, string> = {\n        'Entities': '#6366f1',\n        'Agents': '#10b981',\n        'Admin': '#f59e0b',\n        'Actions': '#8b5cf6',\n        'Queries': '#3b82f6',\n        'Reports': '#ef4444',\n        'Communication': '#ec4899',\n        'Other': '#6b7280'\n    };\n\n    // Resource type options\n    public readonly ResourceTypes = ['Entity', 'Agent', 'Query', 'Mutation', 'Action', 'Report', 'Admin', 'Other'];\n    public readonly Categories = ['Entities', 'Agents', 'Admin', 'Actions', 'Queries', 'Reports', 'Communication', 'Other'];\n\n    constructor(cdr: ChangeDetectorRef) {\n        this.cdr = cdr;\n    }\n\n    async ngOnInit(): Promise<void> {\n        await this.loadData();\n    }\n\n    /**\n     * Load all scopes\n     */\n    public async loadData(): Promise<void> {\n        this.IsLoading = true;\n        try {\n            const rv = new RunView();\n            const result = await rv.RunView<MJAPIScopeEntity>({\n                EntityName: 'MJ: API Scopes',\n                OrderBy: 'FullPath',\n                ResultType: 'entity_object'\n            });\n\n            if (result.Success) {\n                this.FlatScopes = result.Results;\n                this.buildTree();\n            }\n        } catch (error) {\n            console.error('Error loading scopes:', error);\n            this.ErrorMessage = 'Failed to load scopes';\n        } finally {\n            this.IsLoading = false;\n            this.cdr.markForCheck();\n        }\n    }\n\n    /**\n     * Build tree structure from flat scopes\n     */\n    private buildTree(): void {\n        const scopeMap = new Map<string, ScopeTreeNode>();\n        const rootNodes: ScopeTreeNode[] = [];\n\n        // Create nodes\n        for (const scope of this.FlatScopes) {\n            scopeMap.set(scope.ID, {\n                scope,\n                children: [],\n                expanded: true,\n                level: 0\n            });\n        }\n\n        // Build hierarchy\n        for (const scope of this.FlatScopes) {\n            const node = scopeMap.get(scope.ID)!;\n            if (scope.ParentID) {\n                const parent = scopeMap.get(scope.ParentID);\n                if (parent) {\n                    parent.children.push(node);\n                    node.level = parent.level + 1;\n                } else {\n                    rootNodes.push(node);\n                }\n            } else {\n                rootNodes.push(node);\n            }\n        }\n\n        // Calculate levels recursively\n        const calculateLevels = (nodes: ScopeTreeNode[], level: number) => {\n            for (const node of nodes) {\n                node.level = level;\n                calculateLevels(node.children, level + 1);\n            }\n        };\n        calculateLevels(rootNodes, 0);\n\n        this.ScopeTree = rootNodes;\n    }\n\n    /**\n     * Open create dialog for new scope\n     */\n    public openCreateDialog(parentScope: MJAPIScopeEntity | null = null): void {\n        this.EditName = '';\n        this.EditDescription = '';\n        this.EditCategory = parentScope?.Category || 'Entities';\n        this.EditResourceType = '';\n        this.EditParentId = parentScope?.ID || null;\n        this.EditIsActive = true;\n        this.EditingScope = null;\n        this.SelectedParentScope = parentScope;\n        this.ShowCreateDialog = true;\n    }\n\n    /**\n     * Open edit dialog for existing scope\n     */\n    public openEditDialog(scope: MJAPIScopeEntity): void {\n        this.EditingScope = scope;\n        this.EditName = scope.Name;\n        this.EditDescription = scope.Description || '';\n        this.EditCategory = scope.Category || 'Entities';\n        this.EditResourceType = scope.ResourceType || '';\n        this.EditParentId = scope.ParentID;\n        this.EditIsActive = scope.IsActive;\n        this.SelectedParentScope = scope.ParentID\n            ? this.FlatScopes.find(s => UUIDsEqual(s.ID, scope.ParentID)) || null\n            : null;\n        this.ShowEditDialog = true;\n    }\n\n    /**\n     * Save scope (create or update)\n     */\n    public async saveScope(): Promise<void> {\n        this.IsSaving = true;\n        this.ErrorMessage = '';\n\n        try {\n            let scope: MJAPIScopeEntity;\n\n            if (this.EditingScope) {\n                scope = this.EditingScope;\n            } else {\n                scope = await this.md.GetEntityObject<MJAPIScopeEntity>('MJ: API Scopes');\n                scope.NewRecord();\n            }\n\n            scope.Name = this.EditName.trim();\n            scope.Description = this.EditDescription.trim() || null;\n            scope.Category = this.EditCategory;\n            scope.ResourceType = this.EditResourceType || null;\n            scope.ParentID = this.EditParentId;\n            scope.IsActive = this.EditIsActive;\n            // FullPath is auto-computed by the trigger\n\n            const result = await scope.Save();\n            if (result) {\n                this.SuccessMessage = this.EditingScope\n                    ? 'Scope updated successfully'\n                    : 'Scope created successfully';\n                this.closeDialogs();\n                await this.loadData();\n                this.ScopeUpdated.emit();\n                setTimeout(() => this.SuccessMessage = '', 3000);\n            } else {\n                this.ErrorMessage = 'Failed to save scope';\n            }\n        } catch (error) {\n            console.error('Error saving scope:', error);\n            this.ErrorMessage = 'An error occurred while saving';\n        } finally {\n            this.IsSaving = false;\n        }\n    }\n\n    /**\n     * Toggle node expansion\n     */\n    public toggleExpanded(node: ScopeTreeNode): void {\n        node.expanded = !node.expanded;\n    }\n\n    /**\n     * Expand all nodes\n     */\n    public expandAll(): void {\n        const expand = (nodes: ScopeTreeNode[]) => {\n            for (const node of nodes) {\n                node.expanded = true;\n                expand(node.children);\n            }\n        };\n        expand(this.ScopeTree);\n    }\n\n    /**\n     * Collapse all nodes\n     */\n    public collapseAll(): void {\n        const collapse = (nodes: ScopeTreeNode[]) => {\n            for (const node of nodes) {\n                node.expanded = false;\n                collapse(node.children);\n            }\n        };\n        collapse(this.ScopeTree);\n    }\n\n    /**\n     * Close all dialogs\n     */\n    public closeDialogs(): void {\n        this.ShowCreateDialog = false;\n        this.ShowEditDialog = false;\n        this.EditingScope = null;\n        this.SelectedParentScope = null;\n    }\n\n    /**\n     * Get parent scopes for dropdown (exclude self and descendants)\n     */\n    public getParentOptions(): MJAPIScopeEntity[] {\n        if (!this.EditingScope) {\n            return this.FlatScopes;\n        }\n\n        // Exclude self and all descendants\n        const excludeIds = new Set<string>([this.EditingScope.ID]);\n        const addDescendants = (parentId: string) => {\n            for (const scope of this.FlatScopes) {\n                if (UUIDsEqual(scope.ParentID, parentId) && !excludeIds.has(scope.ID)) {\n                    excludeIds.add(scope.ID);\n                    addDescendants(scope.ID);\n                }\n            }\n        };\n        addDescendants(this.EditingScope.ID);\n\n        return this.FlatScopes.filter(s => !excludeIds.has(s.ID));\n    }\n\n    /**\n     * Get category color\n     */\n    public getCategoryColor(category: string | null): string {\n        return this.CategoryColors[category || 'Other'] || this.CategoryColors['Other'];\n    }\n\n    /**\n     * Get count of total scopes\n     */\n    public getTotalCount(): number {\n        return this.FlatScopes.length;\n    }\n\n    /**\n     * Get count of active scopes\n     */\n    public getActiveCount(): number {\n        return this.FlatScopes.filter(s => s.IsActive).length;\n    }\n}\n","<div class=\"scopes-panel\">\n  @if (IsLoading) {\n    <mj-loading text=\"Loading scopes...\"></mj-loading>\n  }\n\n  @if (!IsLoading) {\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-left\">\n        <h3 class=\"panel-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          API Scopes\n        </h3>\n        <p class=\"panel-subtitle\">Manage hierarchical permission scopes for API access</p>\n      </div>\n      <div class=\"header-actions\">\n        <div class=\"scope-stats\">\n          <span class=\"stat\">\n            <i class=\"fa-solid fa-shield\"></i>\n            {{getTotalCount()}} total\n          </span>\n          <span class=\"stat active\">\n            <i class=\"fa-solid fa-check-circle\"></i>\n            {{getActiveCount()}} active\n          </span>\n        </div>\n        <div class=\"tree-controls\">\n          <button class=\"btn-icon\" (click)=\"expandAll()\" title=\"Expand All\">\n            <i class=\"fa-solid fa-plus-square\"></i>\n          </button>\n          <button class=\"btn-icon\" (click)=\"collapseAll()\" title=\"Collapse All\">\n            <i class=\"fa-solid fa-minus-square\"></i>\n          </button>\n        </div>\n        <button class=\"btn-create\" (click)=\"openCreateDialog()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          New Scope\n        </button>\n      </div>\n    </div>\n    <!-- Messages -->\n    @if (SuccessMessage) {\n      <div class=\"message success\">\n        <i class=\"fa-solid fa-check-circle\"></i>\n        {{SuccessMessage}}\n      </div>\n    }\n    @if (ErrorMessage) {\n      <div class=\"message error\">\n        <i class=\"fa-solid fa-circle-exclamation\"></i>\n        {{ErrorMessage}}\n      </div>\n    }\n    <!-- Scope Tree -->\n    <div class=\"scope-tree\">\n      @for (node of ScopeTree; track node) {\n        <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: node }\"></ng-container>\n      }\n      <!-- Empty State -->\n      @if (ScopeTree.length === 0) {\n        <div class=\"empty-state\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>No scopes configured</span>\n          <p>Create scopes to define API access permissions</p>\n        </div>\n      }\n    </div>\n    <!-- Recursive Node Template -->\n    <ng-template #scopeNode let-node=\"node\">\n      <div class=\"scope-node\" [style.padding-left.px]=\"node.level * 24\">\n        <div class=\"node-content\" [class.inactive]=\"!node.scope.IsActive\">\n          @if (node.children.length > 0) {\n            <button class=\"expand-btn\"\n              (click)=\"toggleExpanded(node)\">\n              <i class=\"fa-solid\"\n                [class.fa-chevron-right]=\"!node.expanded\"\n              [class.fa-chevron-down]=\"node.expanded\"></i>\n            </button>\n          }\n          @if (node.children.length === 0) {\n            <span class=\"expand-placeholder\"></span>\n          }\n          <div class=\"scope-info\" (click)=\"openEditDialog(node.scope)\">\n            <div class=\"scope-icon\" [style.backgroundColor]=\"getCategoryColor(node.scope.Category)\">\n              <i class=\"fa-solid fa-shield\"></i>\n            </div>\n            <div class=\"scope-details\">\n              <div class=\"scope-name\">\n                {{node.scope.Name}}\n                @if (node.scope.FullPath && node.scope.FullPath !== node.scope.Name) {\n                  <span class=\"full-path\">\n                    {{node.scope.FullPath}}\n                  </span>\n                }\n                @if (!node.scope.IsActive) {\n                  <span class=\"status-badge\">Inactive</span>\n                }\n              </div>\n              <div class=\"scope-meta\">\n                <span class=\"category\" [style.color]=\"getCategoryColor(node.scope.Category)\">\n                  {{node.scope.Category}}\n                </span>\n                @if (node.scope.ResourceType) {\n                  <span class=\"resource-type\">\n                    {{node.scope.ResourceType}}\n                  </span>\n                }\n                @if (node.scope.Description) {\n                  <span class=\"description\">\n                    {{node.scope.Description}}\n                  </span>\n                }\n              </div>\n            </div>\n          </div>\n          <div class=\"node-actions\">\n            <button class=\"btn-node-action\" (click)=\"openCreateDialog(node.scope)\" title=\"Add Child Scope\">\n              <i class=\"fa-solid fa-plus\"></i>\n            </button>\n            <button class=\"btn-node-action\" (click)=\"openEditDialog(node.scope)\" title=\"Edit Scope\">\n              <i class=\"fa-solid fa-pencil\"></i>\n            </button>\n          </div>\n        </div>\n        @if (node.expanded && node.children.length > 0) {\n          <div class=\"children\">\n            @for (child of node.children; track child) {\n              <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: child }\"></ng-container>\n            }\n          </div>\n        }\n      </div>\n    </ng-template>\n  }\n\n  <!-- Create/Edit Dialog -->\n  @if (ShowCreateDialog || ShowEditDialog) {\n    <kendo-window\n      [width]=\"560\"\n      [minWidth]=\"420\"\n      [minHeight]=\"480\"\n      [resizable]=\"true\"\n      [draggable]=\"true\"\n      [top]=\"80\"\n      (close)=\"closeDialogs()\">\n      <kendo-window-titlebar>\n        <div class=\"dialog-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>{{EditingScope ? 'Edit Scope' : 'New Scope'}}</span>\n        </div>\n        <button kendoButton fillMode=\"flat\" (click)=\"closeDialogs()\" class=\"window-close-btn\" title=\"Close (Esc)\">\n          <i class=\"fa-solid fa-times\"></i>\n        </button>\n      </kendo-window-titlebar>\n      <div class=\"dialog-content\">\n        <div class=\"form-field\">\n          <label>Scope Name *</label>\n          <input kendoTextBox [(ngModel)]=\"EditName\"\n            placeholder=\"e.g., runview, create, execute\"\n            class=\"form-input\" />\n          <span class=\"field-hint\">Use lowercase, single word. Will be combined with parent for full path.</span>\n        </div>\n        <div class=\"form-field\">\n          <label>Parent Scope</label>\n          <kendo-dropdownlist [(ngModel)]=\"EditParentId\"\n            [data]=\"getParentOptions()\"\n            [textField]=\"'FullPath'\"\n            [valueField]=\"'ID'\"\n            [valuePrimitive]=\"true\"\n            [defaultItem]=\"{ FullPath: '(No Parent - Root Level)', ID: null }\">\n          </kendo-dropdownlist>\n          @if (SelectedParentScope) {\n            <span class=\"field-hint\">\n              Full path will be: <code>{{SelectedParentScope.FullPath}}:{{EditName || '...'}}</code>\n            </span>\n          }\n        </div>\n        <div class=\"form-row\">\n          <div class=\"form-field half\">\n            <label>Category</label>\n            <kendo-dropdownlist [(ngModel)]=\"EditCategory\"\n              [data]=\"Categories\"\n              [valuePrimitive]=\"true\">\n            </kendo-dropdownlist>\n          </div>\n          <div class=\"form-field half\">\n            <label>Resource Type</label>\n            <kendo-dropdownlist [(ngModel)]=\"EditResourceType\"\n              [data]=\"ResourceTypes\"\n              [valuePrimitive]=\"true\"\n              [defaultItem]=\"''\">\n            </kendo-dropdownlist>\n          </div>\n        </div>\n        <div class=\"form-field\">\n          <label>Description</label>\n          <textarea kendoTextArea [(ngModel)]=\"EditDescription\"\n            placeholder=\"Describe what this scope allows...\"\n            [rows]=\"3\"\n          class=\"form-textarea\"></textarea>\n        </div>\n        <div class=\"form-field\">\n          <label class=\"checkbox-label\">\n            <input type=\"checkbox\" kendoCheckBox [(ngModel)]=\"EditIsActive\" />\n            <div>\n              <span>Active</span>\n              <span class=\"checkbox-hint\">Inactive scopes cannot be assigned to keys or applications</span>\n            </div>\n          </label>\n        </div>\n        <div class=\"dialog-actions\">\n          <button kendoButton [themeColor]=\"'primary'\"\n            [disabled]=\"!EditName.trim() || IsSaving\"\n            (click)=\"saveScope()\">\n            @if (IsSaving) {\n              <mj-loading [showText]=\"false\" size=\"small\"></mj-loading>\n            }\n            @if (!IsSaving) {\n              <span>\n                <i class=\"fa-solid fa-save\"></i>\n                {{EditingScope ? 'Update' : 'Create'}}\n              </span>\n            }\n          </button>\n          <button kendoButton (click)=\"closeDialogs()\">Cancel</button>\n        </div>\n      </div>\n    </kendo-window>\n  }\n</div>\n"]}
+{"version":3,"file":"api-scopes-panel.component.js","sourceRoot":"","sources":["../../src/APIKeys/api-scopes-panel.component.ts","../../src/APIKeys/api-scopes-panel.component.html"],"names":[],"mappings":"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","sourcesContent":["import { Component, OnInit, EventEmitter, Output, ChangeDetectorRef } from '@angular/core';\nimport { Metadata, RunView } from '@memberjunction/core';\nimport { MJAPIScopeEntity } from '@memberjunction/core-entities';\nimport { UUIDsEqual } from '@memberjunction/global';\n/** Scope tree node structure */\ninterface ScopeTreeNode {\n    scope: MJAPIScopeEntity;\n    children: ScopeTreeNode[];\n    expanded: boolean;\n    level: number;\n}\n\n/**\n * API Scopes Panel Component\n * Manages API Scopes in a hierarchical tree structure\n */\n@Component({\n  standalone: false,\n    selector: 'mj-api-scopes-panel',\n    templateUrl: './api-scopes-panel.component.html',\n    styleUrls: ['./api-scopes-panel.component.css']\n})\nexport class APIScopesPanelComponent implements OnInit {\n    @Output() ScopeUpdated = new EventEmitter<void>();\n\n    private md = new Metadata();\n    private cdr: ChangeDetectorRef;\n\n    // Loading states\n    public IsLoading = true;\n    public IsSaving = false;\n\n    // Data\n    public ScopeTree: ScopeTreeNode[] = [];\n    public FlatScopes: MJAPIScopeEntity[] = [];\n\n    // Edit state\n    public EditingScope: MJAPIScopeEntity | null = null;\n    public EditName = '';\n    public EditDescription = '';\n    public EditCategory = '';\n    public EditResourceType = '';\n    public EditParentId: string | null = null;\n    public EditIsActive = true;\n\n    // Dialog states\n    public ShowCreateDialog = false;\n    public ShowEditDialog = false;\n    public SelectedParentScope: MJAPIScopeEntity | null = null;\n\n    // Messages\n    public SuccessMessage = '';\n    public ErrorMessage = '';\n\n    // Category colors\n    public readonly CategoryColors: Record<string, string> = {\n        'Entities': '#6366f1',\n        'Agents': '#10b981',\n        'Admin': '#f59e0b',\n        'Actions': '#8b5cf6',\n        'Queries': '#3b82f6',\n        'Reports': '#ef4444',\n        'Communication': '#ec4899',\n        'Other': '#6b7280'\n    };\n\n    // Resource type options\n    public readonly ResourceTypes = ['Entity', 'Agent', 'Query', 'Mutation', 'Action', 'Report', 'Admin', 'Other'];\n    public readonly Categories = ['Entities', 'Agents', 'Admin', 'Actions', 'Queries', 'Reports', 'Communication', 'Other'];\n\n    constructor(cdr: ChangeDetectorRef) {\n        this.cdr = cdr;\n    }\n\n    async ngOnInit(): Promise<void> {\n        await this.loadData();\n    }\n\n    /**\n     * Load all scopes\n     */\n    public async loadData(): Promise<void> {\n        this.IsLoading = true;\n        try {\n            const rv = new RunView();\n            const result = await rv.RunView<MJAPIScopeEntity>({\n                EntityName: 'MJ: API Scopes',\n                OrderBy: 'FullPath',\n                ResultType: 'entity_object'\n            });\n\n            if (result.Success) {\n                this.FlatScopes = result.Results;\n                this.buildTree();\n            }\n        } catch (error) {\n            console.error('Error loading scopes:', error);\n            this.ErrorMessage = 'Failed to load scopes';\n        } finally {\n            this.IsLoading = false;\n            this.cdr.markForCheck();\n        }\n    }\n\n    /**\n     * Build tree structure from flat scopes\n     */\n    private buildTree(): void {\n        const scopeMap = new Map<string, ScopeTreeNode>();\n        const rootNodes: ScopeTreeNode[] = [];\n\n        // Create nodes\n        for (const scope of this.FlatScopes) {\n            scopeMap.set(scope.ID, {\n                scope,\n                children: [],\n                expanded: true,\n                level: 0\n            });\n        }\n\n        // Build hierarchy\n        for (const scope of this.FlatScopes) {\n            const node = scopeMap.get(scope.ID)!;\n            if (scope.ParentID) {\n                const parent = scopeMap.get(scope.ParentID);\n                if (parent) {\n                    parent.children.push(node);\n                    node.level = parent.level + 1;\n                } else {\n                    rootNodes.push(node);\n                }\n            } else {\n                rootNodes.push(node);\n            }\n        }\n\n        // Calculate levels recursively\n        const calculateLevels = (nodes: ScopeTreeNode[], level: number) => {\n            for (const node of nodes) {\n                node.level = level;\n                calculateLevels(node.children, level + 1);\n            }\n        };\n        calculateLevels(rootNodes, 0);\n\n        this.ScopeTree = rootNodes;\n    }\n\n    /**\n     * Open create dialog for new scope\n     */\n    public openCreateDialog(parentScope: MJAPIScopeEntity | null = null): void {\n        this.EditName = '';\n        this.EditDescription = '';\n        this.EditCategory = parentScope?.Category || 'Entities';\n        this.EditResourceType = '';\n        this.EditParentId = parentScope?.ID || null;\n        this.EditIsActive = true;\n        this.EditingScope = null;\n        this.SelectedParentScope = parentScope;\n        this.ShowCreateDialog = true;\n    }\n\n    /**\n     * Open edit dialog for existing scope\n     */\n    public openEditDialog(scope: MJAPIScopeEntity): void {\n        this.EditingScope = scope;\n        this.EditName = scope.Name;\n        this.EditDescription = scope.Description || '';\n        this.EditCategory = scope.Category || 'Entities';\n        this.EditResourceType = scope.ResourceType || '';\n        this.EditParentId = scope.ParentID;\n        this.EditIsActive = scope.IsActive;\n        this.SelectedParentScope = scope.ParentID\n            ? this.FlatScopes.find(s => UUIDsEqual(s.ID, scope.ParentID)) || null\n            : null;\n        this.ShowEditDialog = true;\n    }\n\n    /**\n     * Save scope (create or update)\n     */\n    public async saveScope(): Promise<void> {\n        this.IsSaving = true;\n        this.ErrorMessage = '';\n\n        try {\n            let scope: MJAPIScopeEntity;\n\n            if (this.EditingScope) {\n                scope = this.EditingScope;\n            } else {\n                scope = await this.md.GetEntityObject<MJAPIScopeEntity>('MJ: API Scopes');\n                scope.NewRecord();\n            }\n\n            scope.Name = this.EditName.trim();\n            scope.Description = this.EditDescription.trim() || null;\n            scope.Category = this.EditCategory;\n            scope.ResourceType = this.EditResourceType || null;\n            scope.ParentID = this.EditParentId;\n            scope.IsActive = this.EditIsActive;\n            // FullPath is auto-computed by the trigger\n\n            const result = await scope.Save();\n            if (result) {\n                this.SuccessMessage = this.EditingScope\n                    ? 'Scope updated successfully'\n                    : 'Scope created successfully';\n                this.closeDialogs();\n                await this.loadData();\n                this.ScopeUpdated.emit();\n                setTimeout(() => this.SuccessMessage = '', 3000);\n            } else {\n                this.ErrorMessage = 'Failed to save scope';\n            }\n        } catch (error) {\n            console.error('Error saving scope:', error);\n            this.ErrorMessage = 'An error occurred while saving';\n        } finally {\n            this.IsSaving = false;\n        }\n    }\n\n    /**\n     * Toggle node expansion\n     */\n    public toggleExpanded(node: ScopeTreeNode): void {\n        node.expanded = !node.expanded;\n    }\n\n    /**\n     * Expand all nodes\n     */\n    public expandAll(): void {\n        const expand = (nodes: ScopeTreeNode[]) => {\n            for (const node of nodes) {\n                node.expanded = true;\n                expand(node.children);\n            }\n        };\n        expand(this.ScopeTree);\n    }\n\n    /**\n     * Collapse all nodes\n     */\n    public collapseAll(): void {\n        const collapse = (nodes: ScopeTreeNode[]) => {\n            for (const node of nodes) {\n                node.expanded = false;\n                collapse(node.children);\n            }\n        };\n        collapse(this.ScopeTree);\n    }\n\n    /**\n     * Close all dialogs\n     */\n    public closeDialogs(): void {\n        this.ShowCreateDialog = false;\n        this.ShowEditDialog = false;\n        this.EditingScope = null;\n        this.SelectedParentScope = null;\n    }\n\n    /**\n     * Get parent scopes for dropdown (exclude self and descendants)\n     */\n    public getParentOptions(): MJAPIScopeEntity[] {\n        if (!this.EditingScope) {\n            return this.FlatScopes;\n        }\n\n        // Exclude self and all descendants\n        const excludeIds = new Set<string>([this.EditingScope.ID]);\n        const addDescendants = (parentId: string) => {\n            for (const scope of this.FlatScopes) {\n                if (UUIDsEqual(scope.ParentID, parentId) && !excludeIds.has(scope.ID)) {\n                    excludeIds.add(scope.ID);\n                    addDescendants(scope.ID);\n                }\n            }\n        };\n        addDescendants(this.EditingScope.ID);\n\n        return this.FlatScopes.filter(s => !excludeIds.has(s.ID));\n    }\n\n    /**\n     * Get category color\n     */\n    public getCategoryColor(category: string | null): string {\n        return this.CategoryColors[category || 'Other'] || this.CategoryColors['Other'];\n    }\n\n    /**\n     * Get count of total scopes\n     */\n    public getTotalCount(): number {\n        return this.FlatScopes.length;\n    }\n\n    /**\n     * Get count of active scopes\n     */\n    public getActiveCount(): number {\n        return this.FlatScopes.filter(s => s.IsActive).length;\n    }\n}\n","<div class=\"scopes-panel\">\n  @if (IsLoading) {\n    <mj-loading text=\"Loading scopes...\"></mj-loading>\n  }\n\n  @if (!IsLoading) {\n    <!-- Header -->\n    <div class=\"panel-header\">\n      <div class=\"header-left\">\n        <h3 class=\"panel-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          API Scopes\n        </h3>\n        <p class=\"panel-subtitle\">Manage hierarchical permission scopes for API access</p>\n      </div>\n      <div class=\"header-actions\">\n        <div class=\"scope-stats\">\n          <span class=\"stat\">\n            <i class=\"fa-solid fa-shield\"></i>\n            {{getTotalCount()}} total\n          </span>\n          <span class=\"stat active\">\n            <i class=\"fa-solid fa-check-circle\"></i>\n            {{getActiveCount()}} active\n          </span>\n        </div>\n        <div class=\"tree-controls\">\n          <button class=\"btn-icon\" (click)=\"expandAll()\" title=\"Expand All\">\n            <i class=\"fa-solid fa-plus-square\"></i>\n          </button>\n          <button class=\"btn-icon\" (click)=\"collapseAll()\" title=\"Collapse All\">\n            <i class=\"fa-solid fa-minus-square\"></i>\n          </button>\n        </div>\n        <button class=\"btn-create\" (click)=\"openCreateDialog()\">\n          <i class=\"fa-solid fa-plus\"></i>\n          New Scope\n        </button>\n      </div>\n    </div>\n    <!-- Messages -->\n    @if (SuccessMessage) {\n      <div class=\"message success\">\n        <i class=\"fa-solid fa-check-circle\"></i>\n        {{SuccessMessage}}\n      </div>\n    }\n    @if (ErrorMessage) {\n      <div class=\"message error\">\n        <i class=\"fa-solid fa-circle-exclamation\"></i>\n        {{ErrorMessage}}\n      </div>\n    }\n    <!-- Scope Tree -->\n    <div class=\"scope-tree\">\n      @for (node of ScopeTree; track node) {\n        <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: node }\"></ng-container>\n      }\n      <!-- Empty State -->\n      @if (ScopeTree.length === 0) {\n        <div class=\"empty-state\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>No scopes configured</span>\n          <p>Create scopes to define API access permissions</p>\n        </div>\n      }\n    </div>\n    <!-- Recursive Node Template -->\n    <ng-template #scopeNode let-node=\"node\">\n      <div class=\"scope-node\" [style.padding-left.px]=\"node.level * 24\">\n        <div class=\"node-content\" [class.inactive]=\"!node.scope.IsActive\">\n          @if (node.children.length > 0) {\n            <button class=\"expand-btn\"\n              (click)=\"toggleExpanded(node)\">\n              <i class=\"fa-solid\"\n                [class.fa-chevron-right]=\"!node.expanded\"\n              [class.fa-chevron-down]=\"node.expanded\"></i>\n            </button>\n          }\n          @if (node.children.length === 0) {\n            <span class=\"expand-placeholder\"></span>\n          }\n          <div class=\"scope-info\" (click)=\"openEditDialog(node.scope)\">\n            <div class=\"scope-icon\" [style.backgroundColor]=\"getCategoryColor(node.scope.Category)\">\n              <i class=\"fa-solid fa-shield\"></i>\n            </div>\n            <div class=\"scope-details\">\n              <div class=\"scope-name\">\n                {{node.scope.Name}}\n                @if (node.scope.FullPath && node.scope.FullPath !== node.scope.Name) {\n                  <span class=\"full-path\">\n                    {{node.scope.FullPath}}\n                  </span>\n                }\n                @if (!node.scope.IsActive) {\n                  <span class=\"status-badge\">Inactive</span>\n                }\n              </div>\n              <div class=\"scope-meta\">\n                <span class=\"category\" [style.color]=\"getCategoryColor(node.scope.Category)\">\n                  {{node.scope.Category}}\n                </span>\n                @if (node.scope.ResourceType) {\n                  <span class=\"resource-type\">\n                    {{node.scope.ResourceType}}\n                  </span>\n                }\n                @if (node.scope.Description) {\n                  <span class=\"description\">\n                    {{node.scope.Description}}\n                  </span>\n                }\n              </div>\n            </div>\n          </div>\n          <div class=\"node-actions\">\n            <button class=\"btn-node-action\" (click)=\"openCreateDialog(node.scope)\" title=\"Add Child Scope\">\n              <i class=\"fa-solid fa-plus\"></i>\n            </button>\n            <button class=\"btn-node-action\" (click)=\"openEditDialog(node.scope)\" title=\"Edit Scope\">\n              <i class=\"fa-solid fa-pencil\"></i>\n            </button>\n          </div>\n        </div>\n        @if (node.expanded && node.children.length > 0) {\n          <div class=\"children\">\n            @for (child of node.children; track child) {\n              <ng-container *ngTemplateOutlet=\"scopeNode; context: { node: child }\"></ng-container>\n            }\n          </div>\n        }\n      </div>\n    </ng-template>\n  }\n\n  <!-- Create/Edit Dialog -->\n  @if (ShowCreateDialog || ShowEditDialog) {\n    <mj-window\n      [Width]=\"560\"\n      [MinWidth]=\"420\"\n      [MinHeight]=\"480\"\n      [Resizable]=\"true\"\n      [Draggable]=\"true\"\n      [Visible]=\"true\"\n      [Top]=\"80\"\n      (Close)=\"closeDialogs()\">\n      <mj-window-titlebar>\n        <div class=\"dialog-title\">\n          <i class=\"fa-solid fa-shield-halved\"></i>\n          <span>{{EditingScope ? 'Edit Scope' : 'New Scope'}}</span>\n        </div>\n      </mj-window-titlebar>\n      <div class=\"dialog-content\">\n        <div class=\"form-field\">\n          <label>Scope Name *</label>\n          <input class=\"mj-input form-input\" [(ngModel)]=\"EditName\"\n            placeholder=\"e.g., runview, create, execute\" />\n          <span class=\"field-hint\">Use lowercase, single word. Will be combined with parent for full path.</span>\n        </div>\n        <div class=\"form-field\">\n          <label>Parent Scope</label>\n          <mj-dropdown [(ngModel)]=\"EditParentId\"\n            [Data]=\"getParentOptions()\"\n            TextField=\"FullPath\"\n            ValueField=\"ID\"\n            [ValuePrimitive]=\"true\"\n            [DefaultItem]=\"{ FullPath: '(No Parent - Root Level)', ID: null }\">\n          </mj-dropdown>\n          @if (SelectedParentScope) {\n            <span class=\"field-hint\">\n              Full path will be: <code>{{SelectedParentScope.FullPath}}:{{EditName || '...'}}</code>\n            </span>\n          }\n        </div>\n        <div class=\"form-row\">\n          <div class=\"form-field half\">\n            <label>Category</label>\n            <mj-dropdown [(ngModel)]=\"EditCategory\"\n              [Data]=\"Categories\"\n              [ValuePrimitive]=\"true\">\n            </mj-dropdown>\n          </div>\n          <div class=\"form-field half\">\n            <label>Resource Type</label>\n            <mj-dropdown [(ngModel)]=\"EditResourceType\"\n              [Data]=\"ResourceTypes\"\n              [ValuePrimitive]=\"true\"\n              [DefaultItem]=\"''\">\n            </mj-dropdown>\n          </div>\n        </div>\n        <div class=\"form-field\">\n          <label>Description</label>\n          <textarea class=\"mj-textarea form-textarea\" [(ngModel)]=\"EditDescription\"\n            placeholder=\"Describe what this scope allows...\"\n            [rows]=\"3\"></textarea>\n        </div>\n        <div class=\"form-field\">\n          <label class=\"checkbox-label\">\n            <input type=\"checkbox\" class=\"mj-checkbox\" [(ngModel)]=\"EditIsActive\" />\n            <div>\n              <span>Active</span>\n              <span class=\"checkbox-hint\">Inactive scopes cannot be assigned to keys or applications</span>\n            </div>\n          </label>\n        </div>\n        <div class=\"dialog-actions\">\n          <button mjButton variant=\"primary\"\n            [disabled]=\"!EditName.trim() || IsSaving\"\n            (click)=\"saveScope()\">\n            @if (IsSaving) {\n              <mj-loading [showText]=\"false\" size=\"small\"></mj-loading>\n            }\n            @if (!IsSaving) {\n              <span>\n                <i class=\"fa-solid fa-save\"></i>\n                {{EditingScope ? 'Update' : 'Create'}}\n              </span>\n            }\n          </button>\n          <button mjButton (click)=\"closeDialogs()\">Cancel</button>\n        </div>\n      </div>\n    </mj-window>\n  }\n</div>\n"]}