@memberjunction/ng-dashboards 5.0.0 → 5.1.0

package/dist/Credentials/components/credential-type-edit-panel.component.js

@@ -1,563 +0,0 @@
-import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
-import { Metadata } from '@memberjunction/core';
-import { MJNotificationService } from '@memberjunction/ng-notifications';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "@angular/forms";
-import * as i3 from "@memberjunction/ng-shared-generic";
-function CredentialTypeEditPanelComponent_div_0_mj_loading_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-loading", 21);
-} }
-function CredentialTypeEditPanelComponent_div_0_form_15_button_13_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 46);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_form_15_button_13_Template_button_click_0_listener() { const cat_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.category = cat_r5); });
-    i0.ɵɵelement(1, "i");
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const cat_r5 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵstyleProp("--cat-color", ctx_r1.getCategoryColor(cat_r5));
-    i0.ɵɵclassProp("selected", ctx_r1.category === cat_r5);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(ctx_r1.getCategoryIcon(cat_r5));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(cat_r5);
-} }
-function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template(rf, ctx) { if (rf & 1) {
-    const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 49)(1, "div", 50)(2, "button", 51);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_button_click_2_listener() { const i_r7 = i0.ɵɵrestoreView(_r6).index; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.moveFieldUp(i_r7)); });
-    i0.ɵɵelement(3, "i", 52);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "button", 51);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_button_click_4_listener() { const i_r7 = i0.ɵɵrestoreView(_r6).index; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.moveFieldDown(i_r7)); });
-    i0.ɵɵelement(5, "i", 53);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "div", 54)(7, "div", 55)(8, "input", 56);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_input_ngModelChange_8_listener($event) { const field_r8 = i0.ɵɵrestoreView(_r6).$implicit; i0.ɵɵtwoWayBindingSet(field_r8.name, $event) || (field_r8.name = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "input", 57);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_input_ngModelChange_9_listener($event) { const field_r8 = i0.ɵɵrestoreView(_r6).$implicit; i0.ɵɵtwoWayBindingSet(field_r8.title, $event) || (field_r8.title = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "select", 58);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_select_ngModelChange_10_listener($event) { const field_r8 = i0.ɵɵrestoreView(_r6).$implicit; i0.ɵɵtwoWayBindingSet(field_r8.type, $event) || (field_r8.type = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementStart(11, "option", 59);
-    i0.ɵɵtext(12, "String");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(13, "option", 60);
-    i0.ɵɵtext(14, "Number");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(15, "option", 61);
-    i0.ɵɵtext(16, "Boolean");
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(17, "div", 55)(18, "input", 62);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_input_ngModelChange_18_listener($event) { const field_r8 = i0.ɵɵrestoreView(_r6).$implicit; i0.ɵɵtwoWayBindingSet(field_r8.description, $event) || (field_r8.description = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(19, "div", 63)(20, "label", 64)(21, "input", 65);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_input_ngModelChange_21_listener($event) { const field_r8 = i0.ɵɵrestoreView(_r6).$implicit; i0.ɵɵtwoWayBindingSet(field_r8.required, $event) || (field_r8.required = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(22, "span");
-    i0.ɵɵtext(23, "Required");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(24, "label", 64)(25, "input", 65);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_input_ngModelChange_25_listener($event) { const field_r8 = i0.ɵɵrestoreView(_r6).$implicit; i0.ɵɵtwoWayBindingSet(field_r8.isSecret, $event) || (field_r8.isSecret = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(26, "span");
-    i0.ɵɵelement(27, "i", 66);
-    i0.ɵɵtext(28, " Secret");
-    i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(29, "button", 67);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template_button_click_29_listener() { const i_r7 = i0.ɵɵrestoreView(_r6).index; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.removeSchemaField(i_r7)); });
-    i0.ɵɵelement(30, "i", 68);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const field_r8 = ctx.$implicit;
-    const i_r7 = ctx.index;
-    const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", i_r7 === 0 || ctx_r1.isSaving);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", i_r7 === ctx_r1.schemaFields.length - 1 || ctx_r1.isSaving);
-    i0.ɵɵadvance(4);
-    i0.ɵɵproperty("name", "fieldName_" + i_r7);
-    i0.ɵɵtwoWayProperty("ngModel", field_r8.name);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("name", "fieldTitle_" + i_r7);
-    i0.ɵɵtwoWayProperty("ngModel", field_r8.title);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("name", "fieldType_" + i_r7);
-    i0.ɵɵtwoWayProperty("ngModel", field_r8.type);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(8);
-    i0.ɵɵproperty("name", "fieldDesc_" + i_r7);
-    i0.ɵɵtwoWayProperty("ngModel", field_r8.description);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("name", "fieldRequired_" + i_r7);
-    i0.ɵɵtwoWayProperty("ngModel", field_r8.required);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(4);
-    i0.ɵɵproperty("name", "fieldSecret_" + i_r7);
-    i0.ɵɵtwoWayProperty("ngModel", field_r8.isSecret);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(4);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-} }
-function CredentialTypeEditPanelComponent_div_0_form_15_div_39_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 47);
-    i0.ɵɵtemplate(1, CredentialTypeEditPanelComponent_div_0_form_15_div_39_div_1_Template, 31, 21, "div", 48);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngForOf", ctx_r1.schemaFields);
-} }
-function CredentialTypeEditPanelComponent_div_0_form_15_div_40_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 69);
-    i0.ɵɵelement(1, "i", 25);
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3, "No fields defined. Add fields that credentials of this type will need to store.");
-    i0.ɵɵelementEnd()();
-} }
-function CredentialTypeEditPanelComponent_div_0_form_15_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "form", 22);
-    i0.ɵɵlistener("submit", function CredentialTypeEditPanelComponent_div_0_form_15_Template_form_submit_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); $event.preventDefault(); return i0.ɵɵresetView(ctx_r1.save()); });
-    i0.ɵɵelementStart(1, "div", 23)(2, "h3", 24);
-    i0.ɵɵelement(3, "i", 25);
-    i0.ɵɵtext(4, " Basic Information ");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 26)(6, "label", 27);
-    i0.ɵɵtext(7, "Name");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "input", 28);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_Template_input_ngModelChange_8_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.name, $event) || (ctx_r1.name = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "div", 26)(10, "label", 29);
-    i0.ɵɵtext(11, "Category");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "div", 30);
-    i0.ɵɵtemplate(13, CredentialTypeEditPanelComponent_div_0_form_15_button_13_Template, 4, 8, "button", 31);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(14, "div", 26)(15, "label", 32);
-    i0.ɵɵtext(16, "Description");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(17, "textarea", 33);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_Template_textarea_ngModelChange_17_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.description, $event) || (ctx_r1.description = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(18, "div", 34)(19, "div", 26)(20, "label", 35);
-    i0.ɵɵtext(21, "Icon Class");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(22, "input", 36);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_Template_input_ngModelChange_22_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.iconClass, $event) || (ctx_r1.iconClass = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(23, "span", 37);
-    i0.ɵɵtext(24, "Font Awesome icon class");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(25, "div", 26)(26, "label", 38);
-    i0.ɵɵtext(27, "Validation Endpoint");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(28, "input", 39);
-    i0.ɵɵtwoWayListener("ngModelChange", function CredentialTypeEditPanelComponent_div_0_form_15_Template_input_ngModelChange_28_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r1.validationEndpoint, $event) || (ctx_r1.validationEndpoint = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(29, "span", 37);
-    i0.ɵɵtext(30, "Optional API endpoint to validate credentials");
-    i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(31, "div", 23)(32, "div", 40)(33, "h3", 24);
-    i0.ɵɵelement(34, "i", 41);
-    i0.ɵɵtext(35, " Field Schema ");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(36, "button", 42);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_form_15_Template_button_click_36_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.addSchemaField()); });
-    i0.ɵɵelement(37, "i", 43);
-    i0.ɵɵtext(38, " Add Field ");
-    i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(39, CredentialTypeEditPanelComponent_div_0_form_15_div_39_Template, 2, 1, "div", 44)(40, CredentialTypeEditPanelComponent_div_0_form_15_div_40_Template, 4, 0, "div", 45);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(8);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.name);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(5);
-    i0.ɵɵproperty("ngForOf", ctx_r1.categories);
-    i0.ɵɵadvance(4);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.description);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(5);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.iconClass);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(6);
-    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.validationEndpoint);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(8);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngIf", ctx_r1.schemaFields.length > 0);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.schemaFields.length === 0);
-} }
-function CredentialTypeEditPanelComponent_div_0_button_18_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 70);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_button_18_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.deleteType()); });
-    i0.ɵɵelement(1, "i", 68);
-    i0.ɵɵelementStart(2, "span");
-    i0.ɵɵtext(3, "Delete");
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-} }
-function CredentialTypeEditPanelComponent_div_0_i_23_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 71);
-} }
-function CredentialTypeEditPanelComponent_div_0_i_24_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 72);
-} }
-function CredentialTypeEditPanelComponent_div_0_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 1);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_Template_div_click_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onBackdropClick($event)); });
-    i0.ɵɵelementStart(1, "div", 2)(2, "div", 3)(3, "div", 4)(4, "div", 5);
-    i0.ɵɵelement(5, "i");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 6)(7, "h2");
-    i0.ɵɵtext(8);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "span", 7);
-    i0.ɵɵtext(10);
-    i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(11, "button", 8);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closePanel()); });
-    i0.ɵɵelement(12, "i", 9);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(13, "div", 10);
-    i0.ɵɵtemplate(14, CredentialTypeEditPanelComponent_div_0_mj_loading_14_Template, 1, 0, "mj-loading", 11)(15, CredentialTypeEditPanelComponent_div_0_form_15_Template, 41, 12, "form", 12);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(16, "div", 13)(17, "div", 14);
-    i0.ɵɵtemplate(18, CredentialTypeEditPanelComponent_div_0_button_18_Template, 4, 1, "button", 15);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(19, "div", 16)(20, "button", 17);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_Template_button_click_20_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closePanel()); });
-    i0.ɵɵtext(21, " Cancel ");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(22, "button", 18);
-    i0.ɵɵlistener("click", function CredentialTypeEditPanelComponent_div_0_Template_button_click_22_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.save()); });
-    i0.ɵɵtemplate(23, CredentialTypeEditPanelComponent_div_0_i_23_Template, 1, 0, "i", 19)(24, CredentialTypeEditPanelComponent_div_0_i_24_Template, 1, 0, "i", 20);
-    i0.ɵɵelementStart(25, "span");
-    i0.ɵɵtext(26);
-    i0.ɵɵelementEnd()()()()()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵclassProp("open", ctx_r1.isOpen);
-    i0.ɵɵadvance(3);
-    i0.ɵɵstyleProp("background-color", ctx_r1.getCategoryColor(ctx_r1.category) + "15")("color", ctx_r1.getCategoryColor(ctx_r1.category));
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(ctx_r1.iconClass || ctx_r1.getCategoryIcon(ctx_r1.category));
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(ctx_r1.panelTitle);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1("", ctx_r1.category, " credential type");
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngIf", ctx_r1.isLoading);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.isLoading);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngIf", !ctx_r1.isNew);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", ctx_r1.isSaving || !ctx_r1.canSave);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", ctx_r1.isSaving);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.isSaving);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r1.isNew ? "Create" : "Save");
-} }
-export function LoadCredentialTypeEditPanel() {
-    // Prevents tree-shaking
-}
-export class CredentialTypeEditPanelComponent {
-    cdr;
-    credentialType = null;
-    isOpen = false;
-    close = new EventEmitter();
-    saved = new EventEmitter();
-    deleted = new EventEmitter();
-    isLoading = false;
-    isSaving = false;
-    isNew = false;
-    // Form fields
-    name = '';
-    description = '';
-    category = 'Integration';
-    iconClass = '';
-    validationEndpoint = '';
-    schemaFields = [];
-    // Available categories
-    categories = ['AI', 'Authentication', 'Communication', 'Database', 'Integration', 'Storage'];
-    _metadata = new Metadata();
-    constructor(cdr) {
-        this.cdr = cdr;
-    }
-    ngOnInit() { }
-    get panelTitle() {
-        return this.isNew ? 'Create Credential Type' : 'Edit Credential Type';
-    }
-    get canSave() {
-        return this.name.trim().length > 0 && this.category.length > 0;
-    }
-    async open(credentialType) {
-        this.isLoading = true;
-        this.isOpen = true;
-        this.credentialType = credentialType;
-        this.isNew = !credentialType || !credentialType.ID;
-        this.cdr.markForCheck();
-        this.resetForm();
-        if (credentialType && credentialType.ID) {
-            this.populateFromType(credentialType);
-        }
-        this.isLoading = false;
-        this.cdr.markForCheck();
-    }
-    resetForm() {
-        this.name = '';
-        this.description = '';
-        this.category = 'Integration';
-        this.iconClass = '';
-        this.validationEndpoint = '';
-        this.schemaFields = [];
-    }
-    populateFromType(credentialType) {
-        this.name = credentialType.Name || '';
-        this.description = credentialType.Description || '';
-        this.category = credentialType.Category || 'Integration';
-        this.iconClass = credentialType.IconClass || '';
-        this.validationEndpoint = credentialType.ValidationEndpoint || '';
-        // Parse field schema
-        this.parseFieldSchema(credentialType.FieldSchema);
-    }
-    parseFieldSchema(schemaJson) {
-        try {
-            if (!schemaJson) {
-                this.schemaFields = [];
-                return;
-            }
-            const schema = JSON.parse(schemaJson);
-            const properties = schema.properties || {};
-            const required = schema.required || [];
-            this.schemaFields = Object.entries(properties).map(([name, prop]) => ({
-                name,
-                type: prop.type || 'string',
-                title: prop.title || name,
-                description: prop.description || '',
-                isSecret: prop.isSecret === true,
-                required: required.includes(name),
-                order: typeof prop.order === 'number' ? prop.order : 999
-            }));
-            this.schemaFields.sort((a, b) => a.order - b.order);
-        }
-        catch (e) {
-            console.error('Error parsing field schema:', e);
-            this.schemaFields = [];
-        }
-    }
-    buildFieldSchema() {
-        if (this.schemaFields.length === 0) {
-            return JSON.stringify({ type: 'object', properties: {}, required: [] });
-        }
-        const properties = {};
-        const required = [];
-        for (let i = 0; i < this.schemaFields.length; i++) {
-            const field = this.schemaFields[i];
-            properties[field.name] = {
-                type: field.type,
-                title: field.title,
-                description: field.description,
-                isSecret: field.isSecret,
-                order: i
-            };
-            if (field.required) {
-                required.push(field.name);
-            }
-        }
-        return JSON.stringify({
-            $schema: 'http://json-schema.org/draft-07/schema#',
-            type: 'object',
-            properties,
-            required
-        }, null, 2);
-    }
-    // Schema field management
-    addSchemaField() {
-        this.schemaFields.push({
-            name: '',
-            type: 'string',
-            title: '',
-            description: '',
-            isSecret: false,
-            required: false,
-            order: this.schemaFields.length
-        });
-        this.cdr.markForCheck();
-    }
-    removeSchemaField(index) {
-        this.schemaFields.splice(index, 1);
-        this.cdr.markForCheck();
-    }
-    moveFieldUp(index) {
-        if (index > 0) {
-            const temp = this.schemaFields[index];
-            this.schemaFields[index] = this.schemaFields[index - 1];
-            this.schemaFields[index - 1] = temp;
-            this.cdr.markForCheck();
-        }
-    }
-    moveFieldDown(index) {
-        if (index < this.schemaFields.length - 1) {
-            const temp = this.schemaFields[index];
-            this.schemaFields[index] = this.schemaFields[index + 1];
-            this.schemaFields[index + 1] = temp;
-            this.cdr.markForCheck();
-        }
-    }
-    async save() {
-        if (!this.canSave) {
-            MJNotificationService.Instance.CreateSimpleNotification('Please fill in all required fields', 'warning', 3000);
-            return;
-        }
-        this.isSaving = true;
-        this.cdr.markForCheck();
-        try {
-            let entity;
-            if (this.isNew) {
-                entity = await this._metadata.GetEntityObject('MJ: Credential Types');
-            }
-            else {
-                entity = this.credentialType;
-            }
-            entity.Name = this.name.trim();
-            entity.Description = this.description.trim() || null;
-            entity.Category = this.category;
-            entity.IconClass = this.iconClass.trim() || null;
-            entity.ValidationEndpoint = this.validationEndpoint.trim() || null;
-            entity.FieldSchema = this.buildFieldSchema();
-            const success = await entity.Save();
-            if (success) {
-                const action = this.isNew ? 'created' : 'updated';
-                MJNotificationService.Instance.CreateSimpleNotification(`Credential type "${entity.Name}" ${action} successfully`, 'success', 3000);
-                this.saved.emit(entity);
-                this.closePanel();
-            }
-            else {
-                const errorMessage = entity.LatestResult?.Message || 'Unknown error';
-                console.error('Save failed:', errorMessage);
-                MJNotificationService.Instance.CreateSimpleNotification(`Failed to save credential type: ${errorMessage}`, 'error', 5000);
-            }
-        }
-        catch (error) {
-            console.error('Error saving credential type:', error);
-            MJNotificationService.Instance.CreateSimpleNotification('Error saving credential type', 'error', 3000);
-        }
-        finally {
-            this.isSaving = false;
-            this.cdr.markForCheck();
-        }
-    }
-    async deleteType() {
-        if (this.isNew || !this.credentialType)
-            return;
-        const confirmed = confirm(`Are you sure you want to delete "${this.credentialType.Name}"? This action cannot be undone.`);
-        if (!confirmed)
-            return;
-        this.isSaving = true;
-        this.cdr.markForCheck();
-        try {
-            const success = await this.credentialType.Delete();
-            if (success) {
-                MJNotificationService.Instance.CreateSimpleNotification(`Credential type "${this.credentialType.Name}" deleted successfully`, 'success', 3000);
-                this.deleted.emit(this.credentialType.ID);
-                this.closePanel();
-            }
-            else {
-                const errorMessage = this.credentialType.LatestResult?.Message || 'Unknown error';
-                MJNotificationService.Instance.CreateSimpleNotification(`Failed to delete credential type: ${errorMessage}`, 'error', 5000);
-            }
-        }
-        catch (error) {
-            console.error('Error deleting credential type:', error);
-            MJNotificationService.Instance.CreateSimpleNotification('Error deleting credential type', 'error', 3000);
-        }
-        finally {
-            this.isSaving = false;
-            this.cdr.markForCheck();
-        }
-    }
-    closePanel() {
-        this.isOpen = false;
-        this.credentialType = null;
-        this.resetForm();
-        this.close.emit();
-        this.cdr.markForCheck();
-    }
-    onBackdropClick(event) {
-        if (event.target.classList.contains('panel-backdrop')) {
-            this.closePanel();
-        }
-    }
-    getCategoryIcon(category) {
-        const iconMap = {
-            'AI': 'fa-solid fa-brain',
-            'Communication': 'fa-solid fa-envelope',
-            'Storage': 'fa-solid fa-cloud',
-            'Database': 'fa-solid fa-database',
-            'Authentication': 'fa-solid fa-shield-halved',
-            'Integration': 'fa-solid fa-plug'
-        };
-        return iconMap[category] || 'fa-solid fa-key';
-    }
-    getCategoryColor(category) {
-        const colorMap = {
-            'AI': '#8b5cf6',
-            'Communication': '#3b82f6',
-            'Storage': '#06b6d4',
-            'Database': '#f59e0b',
-            'Authentication': '#10b981',
-            'Integration': '#ec4899'
-        };
-        return colorMap[category] || '#6366f1';
-    }
-    static ɵfac = function CredentialTypeEditPanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CredentialTypeEditPanelComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CredentialTypeEditPanelComponent, selectors: [["mj-credential-type-edit-panel"]], inputs: { credentialType: "credentialType", isOpen: "isOpen" }, outputs: { close: "close", saved: "saved", deleted: "deleted" }, decls: 1, vars: 1, consts: [["class", "panel-backdrop", 3, "click", 4, "ngIf"], [1, "panel-backdrop", 3, "click"], [1, "edit-panel"], [1, "panel-header"], [1, "header-content"], [1, "header-icon"], [1, "header-text"], [1, "header-subtitle"], [1, "close-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-times"], [1, "panel-body"], ["text", "Loading...", 4, "ngIf"], ["class", "type-form", 3, "submit", 4, "ngIf"], [1, "panel-footer"], [1, "footer-left"], ["class", "btn-delete", 3, "disabled", "click", 4, "ngIf"], [1, "footer-right"], [1, "btn-secondary", 3, "click", "disabled"], [1, "btn-primary", 3, "click", "disabled"], ["class", "fa-solid fa-spinner fa-spin", 4, "ngIf"], ["class", "fa-solid fa-check", 4, "ngIf"], ["text", "Loading..."], [1, "type-form", 3, "submit"], [1, "form-section"], [1, "section-title"], [1, "fa-solid", "fa-info-circle"], [1, "form-group"], ["for", "typeName", 1, "required"], ["type", "text", "id", "typeName", "name", "typeName", "placeholder", "e.g., OpenAI, SendGrid, AWS S3", "required", "", 3, "ngModelChange", "ngModel", "disabled"], ["for", "typeCategory", 1, "required"], [1, "category-selector"], ["type", "button", "class", "category-btn", 3, "selected", "--cat-color", "disabled", "click", 4, "ngFor", "ngForOf"], ["for", "typeDescription"], ["id", "typeDescription", "name", "typeDescription", "placeholder", "Optional description of this credential type...", "rows", "3", 3, "ngModelChange", "ngModel", "disabled"], [1, "form-row"], ["for", "typeIcon"], ["type", "text", "id", "typeIcon", "name", "typeIcon", "placeholder", "e.g., fa-brands fa-openai", 3, "ngModelChange", "ngModel", "disabled"], [1, "field-hint"], ["for", "validationEndpoint"], ["type", "text", "id", "validationEndpoint", "name", "validationEndpoint", "placeholder", "https://api.example.com/validate", 3, "ngModelChange", "ngModel", "disabled"], [1, "section-header-row"], [1, "fa-solid", "fa-list-check"], ["type", "button", 1, "btn-add-field", 3, "click", "disabled"], [1, "fa-solid", "fa-plus"], ["class", "schema-fields", 4, "ngIf"], ["class", "no-fields-message", 4, "ngIf"], ["type", "button", 1, "category-btn", 3, "click", "disabled"], [1, "schema-fields"], ["class", "schema-field", 4, "ngFor", "ngForOf"], [1, "schema-field"], [1, "field-drag-handle"], ["type", "button", 1, "move-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-chevron-up"], [1, "fa-solid", "fa-chevron-down"], [1, "field-content"], [1, "field-row"], ["type", "text", "placeholder", "Field name (e.g., apiKey)", 1, "field-name-input", 3, "ngModelChange", "name", "ngModel", "disabled"], ["type", "text", "placeholder", "Display title", 1, "field-title-input", 3, "ngModelChange", "name", "ngModel", "disabled"], [1, "field-type-select", 3, "ngModelChange", "name", "ngModel", "disabled"], ["value", "string"], ["value", "number"], ["value", "boolean"], ["type", "text", "placeholder", "Field description (optional)", 1, "field-desc-input", 3, "ngModelChange", "name", "ngModel", "disabled"], [1, "field-options"], [1, "checkbox-label"], ["type", "checkbox", 3, "ngModelChange", "name", "ngModel", "disabled"], [1, "fa-solid", "fa-lock"], ["type", "button", "title", "Remove field", 1, "remove-field-btn", 3, "click", "disabled"], [1, "fa-solid", "fa-trash"], [1, "no-fields-message"], [1, "btn-delete", 3, "click", "disabled"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-check"]], template: function CredentialTypeEditPanelComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, CredentialTypeEditPanelComponent_div_0_Template, 27, 19, "div", 0);
-        } if (rf & 2) {
-            i0.ɵɵproperty("ngIf", ctx.isOpen);
-        } }, dependencies: [i1.NgForOf, i1.NgIf, i2.ɵNgNoValidate, i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.CheckboxControlValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgControlStatusGroup, i2.RequiredValidator, i2.NgModel, i2.NgForm, i3.LoadingComponent], styles: ["\n\n.panel-backdrop[_ngcontent-%COMP%] {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.5);\n    z-index: 1000;\n    display: flex;\n    justify-content: flex-end;\n    animation: _ngcontent-%COMP%_fadeIn 0.2s ease-out;\n}\n\n@keyframes _ngcontent-%COMP%_fadeIn {\n    from { opacity: 0; }\n    to { opacity: 1; }\n}\n\n\n\n.edit-panel[_ngcontent-%COMP%] {\n    width: 100%;\n    max-width: 600px;\n    height: 100%;\n    background: #ffffff;\n    display: flex;\n    flex-direction: column;\n    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);\n    transform: translateX(100%);\n    animation: _ngcontent-%COMP%_slideIn 0.3s ease-out forwards;\n}\n\n@keyframes _ngcontent-%COMP%_slideIn {\n    from { transform: translateX(100%); }\n    to { transform: translateX(0); }\n}\n\n\n\n.panel-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 20px 24px;\n    border-bottom: 1px solid #e5e7eb;\n    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);\n}\n\n.header-content[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.header-icon[_ngcontent-%COMP%] {\n    width: 48px;\n    height: 48px;\n    border-radius: 12px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 20px;\n    flex-shrink: 0;\n}\n\n.header-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n    font-size: 18px;\n    font-weight: 600;\n    color: #1e293b;\n    margin: 0 0 4px 0;\n}\n\n.header-subtitle[_ngcontent-%COMP%] {\n    font-size: 13px;\n    color: #64748b;\n}\n\n.close-btn[_ngcontent-%COMP%] {\n    width: 36px;\n    height: 36px;\n    border: none;\n    background: #f1f5f9;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #64748b;\n    font-size: 16px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.15s ease;\n}\n\n.close-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #e2e8f0;\n    color: #334155;\n}\n\n.close-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n.panel-body[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    padding: 24px;\n    scroll-behavior: smooth;\n    -webkit-overflow-scrolling: touch;\n}\n\n\n\n.form-section[_ngcontent-%COMP%] {\n    margin-bottom: 28px;\n}\n\n.form-section[_ngcontent-%COMP%]:last-child {\n    margin-bottom: 0;\n}\n\n.section-title[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 14px;\n    font-weight: 600;\n    color: #334155;\n    margin: 0 0 16px 0;\n    padding-bottom: 10px;\n    border-bottom: 1px solid #f1f5f9;\n}\n\n.section-title[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: #6366f1;\n    font-size: 14px;\n}\n\n.section-header-row[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-bottom: 16px;\n}\n\n.section-header-row[_ngcontent-%COMP%]   .section-title[_ngcontent-%COMP%] {\n    margin: 0;\n    padding: 0;\n    border: none;\n}\n\n.btn-add-field[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: 6px 12px;\n    background: #6366f1;\n    color: white;\n    border: none;\n    border-radius: 6px;\n    font-size: 12px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-add-field[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #4f46e5;\n}\n\n.btn-add-field[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n.form-group[_ngcontent-%COMP%] {\n    margin-bottom: 18px;\n}\n\n.form-group[_ngcontent-%COMP%]:last-child {\n    margin-bottom: 0;\n}\n\n.form-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 13px;\n    font-weight: 500;\n    color: #475569;\n    margin-bottom: 6px;\n}\n\n.form-group[_ngcontent-%COMP%]   label.required[_ngcontent-%COMP%]::after {\n    content: '*';\n    color: #ef4444;\n    margin-left: 4px;\n}\n\n.form-group[_ngcontent-%COMP%]   input[type=\"text\"][_ngcontent-%COMP%], \n.form-group[_ngcontent-%COMP%]   input[type=\"number\"][_ngcontent-%COMP%], \n.form-group[_ngcontent-%COMP%]   select[_ngcontent-%COMP%], \n.form-group[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #d1d5db;\n    border-radius: 8px;\n    font-size: 14px;\n    color: #1e293b;\n    background: #ffffff;\n    transition: all 0.15s ease;\n    box-sizing: border-box;\n}\n\n.form-group[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]:focus, \n.form-group[_ngcontent-%COMP%]   select[_ngcontent-%COMP%]:focus, \n.form-group[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]:focus {\n    outline: none;\n    border-color: #6366f1;\n    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);\n}\n\n.form-group[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]:disabled, \n.form-group[_ngcontent-%COMP%]   select[_ngcontent-%COMP%]:disabled, \n.form-group[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]:disabled {\n    background: #f8fafc;\n    color: #94a3b8;\n    cursor: not-allowed;\n}\n\n.form-group[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%] {\n    resize: vertical;\n    min-height: 80px;\n}\n\n.field-hint[_ngcontent-%COMP%] {\n    display: block;\n    font-size: 12px;\n    color: #94a3b8;\n    margin-top: 5px;\n}\n\n.form-row[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 16px;\n}\n\n\n\n.category-selector[_ngcontent-%COMP%] {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 10px;\n}\n\n.category-btn[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 6px;\n    padding: 12px 8px;\n    border: 2px solid #e5e7eb;\n    border-radius: 10px;\n    background: #ffffff;\n    cursor: pointer;\n    transition: all 0.2s ease;\n    color: #64748b;\n}\n\n.category-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 18px;\n}\n\n.category-btn[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-size: 11px;\n    font-weight: 500;\n}\n\n.category-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    border-color: var(--cat-color);\n    background: color-mix(in srgb, var(--cat-color) 5%, white);\n}\n\n.category-btn.selected[_ngcontent-%COMP%] {\n    border-color: var(--cat-color);\n    background: color-mix(in srgb, var(--cat-color) 10%, white);\n    color: var(--cat-color);\n}\n\n.category-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n.schema-fields[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.schema-field[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 12px;\n    padding: 14px;\n    background: #f8fafc;\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n}\n\n.field-drag-handle[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.move-btn[_ngcontent-%COMP%] {\n    width: 24px;\n    height: 24px;\n    border: none;\n    background: #e2e8f0;\n    border-radius: 4px;\n    cursor: pointer;\n    color: #64748b;\n    font-size: 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.15s ease;\n}\n\n.move-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #cbd5e1;\n    color: #334155;\n}\n\n.move-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.3;\n    cursor: not-allowed;\n}\n\n.field-content[_ngcontent-%COMP%] {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n}\n\n.field-row[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 10px;\n}\n\n.field-name-input[_ngcontent-%COMP%] {\n    flex: 1;\n    padding: 8px 12px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n    font-family: monospace;\n}\n\n.field-title-input[_ngcontent-%COMP%] {\n    flex: 1;\n    padding: 8px 12px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n}\n\n.field-type-select[_ngcontent-%COMP%] {\n    width: 100px;\n    padding: 8px 10px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n    cursor: pointer;\n}\n\n.field-desc-input[_ngcontent-%COMP%] {\n    flex: 1;\n    padding: 8px 12px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n}\n\n.field-options[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 16px;\n}\n\n.checkbox-label[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 12px;\n    color: #64748b;\n    cursor: pointer;\n}\n\n.checkbox-label[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n    width: 14px;\n    height: 14px;\n    accent-color: #6366f1;\n}\n\n.checkbox-label[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 10px;\n    color: #f59e0b;\n}\n\n.remove-field-btn[_ngcontent-%COMP%] {\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: transparent;\n    color: #94a3b8;\n    cursor: pointer;\n    border-radius: 6px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.15s ease;\n    align-self: flex-start;\n}\n\n.remove-field-btn[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #fef2f2;\n    color: #dc2626;\n}\n\n.remove-field-btn[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.no-fields-message[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 16px;\n    background: #f8fafc;\n    border: 2px dashed #e2e8f0;\n    border-radius: 10px;\n    color: #64748b;\n    font-size: 13px;\n}\n\n.no-fields-message[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: #94a3b8;\n}\n\n\n\n.panel-footer[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 16px 24px;\n    border-top: 1px solid #e5e7eb;\n    background: #f8fafc;\n}\n\n.footer-left[_ngcontent-%COMP%], \n.footer-right[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.btn-primary[_ngcontent-%COMP%], \n.btn-secondary[_ngcontent-%COMP%], \n.btn-delete[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 20px;\n    border: none;\n    border-radius: 8px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-primary[_ngcontent-%COMP%] {\n    background: #6366f1;\n    color: #ffffff;\n}\n\n.btn-primary[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #4f46e5;\n}\n\n.btn-primary[_ngcontent-%COMP%]:disabled {\n    background: #c7d2fe;\n    cursor: not-allowed;\n}\n\n.btn-secondary[_ngcontent-%COMP%] {\n    background: #ffffff;\n    color: #475569;\n    border: 1px solid #d1d5db;\n}\n\n.btn-secondary[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #f1f5f9;\n    border-color: #94a3b8;\n}\n\n.btn-secondary[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.btn-delete[_ngcontent-%COMP%] {\n    background: transparent;\n    color: #dc2626;\n    padding: 10px 16px;\n}\n\n.btn-delete[_ngcontent-%COMP%]:hover:not(:disabled) {\n    background: #fef2f2;\n}\n\n.btn-delete[_ngcontent-%COMP%]:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n\n\n@media (max-width: 768px) {\n    .edit-panel[_ngcontent-%COMP%] {\n        max-width: 100%;\n    }\n\n    .panel-header[_ngcontent-%COMP%] {\n        padding: 16px 20px;\n    }\n\n    .header-icon[_ngcontent-%COMP%] {\n        width: 40px;\n        height: 40px;\n        font-size: 18px;\n    }\n\n    .header-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n        font-size: 16px;\n    }\n\n    .panel-body[_ngcontent-%COMP%] {\n        padding: 20px;\n    }\n\n    .form-row[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr;\n    }\n\n    .category-selector[_ngcontent-%COMP%] {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n    .schema-field[_ngcontent-%COMP%] {\n        flex-direction: column;\n    }\n\n    .field-drag-handle[_ngcontent-%COMP%] {\n        flex-direction: row;\n        justify-content: flex-end;\n        order: 1;\n    }\n\n    .field-content[_ngcontent-%COMP%] {\n        order: 0;\n    }\n\n    .remove-field-btn[_ngcontent-%COMP%] {\n        order: 2;\n        align-self: flex-end;\n    }\n\n    .field-row[_ngcontent-%COMP%] {\n        flex-direction: column;\n    }\n\n    .field-type-select[_ngcontent-%COMP%] {\n        width: 100%;\n    }\n\n    .panel-footer[_ngcontent-%COMP%] {\n        padding: 14px 20px;\n        flex-direction: column-reverse;\n        gap: 12px;\n    }\n\n    .footer-left[_ngcontent-%COMP%], \n   .footer-right[_ngcontent-%COMP%] {\n        width: 100%;\n    }\n\n    .footer-right[_ngcontent-%COMP%] {\n        flex-direction: row;\n    }\n\n    .footer-right[_ngcontent-%COMP%]   .btn-primary[_ngcontent-%COMP%], \n   .footer-right[_ngcontent-%COMP%]   .btn-secondary[_ngcontent-%COMP%] {\n        flex: 1;\n        justify-content: center;\n    }\n\n    .btn-delete[_ngcontent-%COMP%] {\n        width: 100%;\n        justify-content: center;\n        background: #fef2f2;\n    }\n}\n\n@media (max-width: 480px) {\n    .panel-header[_ngcontent-%COMP%] {\n        padding: 14px 16px;\n    }\n\n    .header-content[_ngcontent-%COMP%] {\n        gap: 12px;\n    }\n\n    .header-icon[_ngcontent-%COMP%] {\n        width: 36px;\n        height: 36px;\n        font-size: 16px;\n        border-radius: 10px;\n    }\n\n    .header-text[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n        font-size: 15px;\n    }\n\n    .header-subtitle[_ngcontent-%COMP%] {\n        font-size: 12px;\n    }\n\n    .panel-body[_ngcontent-%COMP%] {\n        padding: 16px;\n    }\n\n    .category-selector[_ngcontent-%COMP%] {\n        grid-template-columns: repeat(3, 1fr);\n    }\n\n    .category-btn[_ngcontent-%COMP%] {\n        padding: 10px 6px;\n    }\n\n    .category-btn[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n        font-size: 16px;\n    }\n\n    .category-btn[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n        font-size: 10px;\n    }\n\n    .schema-field[_ngcontent-%COMP%] {\n        padding: 12px;\n    }\n\n    .field-name-input[_ngcontent-%COMP%], \n   .field-title-input[_ngcontent-%COMP%], \n   .field-desc-input[_ngcontent-%COMP%], \n   .field-type-select[_ngcontent-%COMP%] {\n        font-size: 14px;\n        padding: 10px 12px;\n    }\n\n    .panel-footer[_ngcontent-%COMP%] {\n        padding: 12px 16px;\n    }\n\n    .btn-primary[_ngcontent-%COMP%], \n   .btn-secondary[_ngcontent-%COMP%] {\n        padding: 10px 16px;\n        font-size: 13px;\n    }\n}\n\n\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar {\n    width: 6px;\n}\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar-track {\n    background: transparent;\n}\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n    background: #d1d5db;\n    border-radius: 3px;\n}\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar-thumb:hover {\n    background: #94a3b8;\n}\n\n\n\n@keyframes _ngcontent-%COMP%_spin {\n    from { transform: rotate(0deg); }\n    to { transform: rotate(360deg); }\n}\n\n.fa-spin[_ngcontent-%COMP%] {\n    animation: _ngcontent-%COMP%_spin 1s linear infinite;\n}"], changeDetection: 0 });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CredentialTypeEditPanelComponent, [{
-        type: Component,
-        args: [{ selector: 'mj-credential-type-edit-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"panel-backdrop\" *ngIf=\"isOpen\" (click)=\"onBackdropClick($event)\">\n    <div class=\"edit-panel\" [class.open]=\"isOpen\">\n        <!-- Panel Header -->\n        <div class=\"panel-header\">\n            <div class=\"header-content\">\n                <div class=\"header-icon\" [style.backgroundColor]=\"getCategoryColor(category) + '15'\" [style.color]=\"getCategoryColor(category)\">\n                    <i [class]=\"iconClass || getCategoryIcon(category)\"></i>\n                </div>\n                <div class=\"header-text\">\n                    <h2>{{panelTitle}}</h2>\n                    <span class=\"header-subtitle\">{{category}} credential type</span>\n                </div>\n            </div>\n            <button class=\"close-btn\" (click)=\"closePanel()\" [disabled]=\"isSaving\">\n                <i class=\"fa-solid fa-times\"></i>\n            </button>\n        </div>\n\n        <!-- Panel Body -->\n        <div class=\"panel-body\">\n            <mj-loading *ngIf=\"isLoading\" text=\"Loading...\"></mj-loading>\n\n            <form *ngIf=\"!isLoading\" class=\"type-form\" (submit)=\"$event.preventDefault(); save()\">\n                <!-- Basic Info Section -->\n                <div class=\"form-section\">\n                    <h3 class=\"section-title\">\n                        <i class=\"fa-solid fa-info-circle\"></i>\n                        Basic Information\n                    </h3>\n\n                    <div class=\"form-group\">\n                        <label for=\"typeName\" class=\"required\">Name</label>\n                        <input\n                            type=\"text\"\n                            id=\"typeName\"\n                            name=\"typeName\"\n                            [(ngModel)]=\"name\"\n                            placeholder=\"e.g., OpenAI, SendGrid, AWS S3\"\n                            [disabled]=\"isSaving\"\n                            required\n                        />\n                    </div>\n\n                    <div class=\"form-group\">\n                        <label for=\"typeCategory\" class=\"required\">Category</label>\n                        <div class=\"category-selector\">\n                            <button\n                                type=\"button\"\n                                *ngFor=\"let cat of categories\"\n                                class=\"category-btn\"\n                                [class.selected]=\"category === cat\"\n                                [style.--cat-color]=\"getCategoryColor(cat)\"\n                                (click)=\"category = cat\"\n                                [disabled]=\"isSaving\"\n                            >\n                                <i [class]=\"getCategoryIcon(cat)\"></i>\n                                <span>{{cat}}</span>\n                            </button>\n                        </div>\n                    </div>\n\n                    <div class=\"form-group\">\n                        <label for=\"typeDescription\">Description</label>\n                        <textarea\n                            id=\"typeDescription\"\n                            name=\"typeDescription\"\n                            [(ngModel)]=\"description\"\n                            placeholder=\"Optional description of this credential type...\"\n                            rows=\"3\"\n                            [disabled]=\"isSaving\"\n                        ></textarea>\n                    </div>\n\n                    <div class=\"form-row\">\n                        <div class=\"form-group\">\n                            <label for=\"typeIcon\">Icon Class</label>\n                            <input\n                                type=\"text\"\n                                id=\"typeIcon\"\n                                name=\"typeIcon\"\n                                [(ngModel)]=\"iconClass\"\n                                placeholder=\"e.g., fa-brands fa-openai\"\n                                [disabled]=\"isSaving\"\n                            />\n                            <span class=\"field-hint\">Font Awesome icon class</span>\n                        </div>\n\n                        <div class=\"form-group\">\n                            <label for=\"validationEndpoint\">Validation Endpoint</label>\n                            <input\n                                type=\"text\"\n                                id=\"validationEndpoint\"\n                                name=\"validationEndpoint\"\n                                [(ngModel)]=\"validationEndpoint\"\n                                placeholder=\"https://api.example.com/validate\"\n                                [disabled]=\"isSaving\"\n                            />\n                            <span class=\"field-hint\">Optional API endpoint to validate credentials</span>\n                        </div>\n                    </div>\n                </div>\n\n                <!-- Field Schema Section -->\n                <div class=\"form-section\">\n                    <div class=\"section-header-row\">\n                        <h3 class=\"section-title\">\n                            <i class=\"fa-solid fa-list-check\"></i>\n                            Field Schema\n                        </h3>\n                        <button\n                            type=\"button\"\n                            class=\"btn-add-field\"\n                            (click)=\"addSchemaField()\"\n                            [disabled]=\"isSaving\"\n                        >\n                            <i class=\"fa-solid fa-plus\"></i>\n                            Add Field\n                        </button>\n                    </div>\n\n                    <div class=\"schema-fields\" *ngIf=\"schemaFields.length > 0\">\n                        <div class=\"schema-field\" *ngFor=\"let field of schemaFields; let i = index\">\n                            <div class=\"field-drag-handle\">\n                                <button type=\"button\" class=\"move-btn\" (click)=\"moveFieldUp(i)\" [disabled]=\"i === 0 || isSaving\">\n                                    <i class=\"fa-solid fa-chevron-up\"></i>\n                                </button>\n                                <button type=\"button\" class=\"move-btn\" (click)=\"moveFieldDown(i)\" [disabled]=\"i === schemaFields.length - 1 || isSaving\">\n                                    <i class=\"fa-solid fa-chevron-down\"></i>\n                                </button>\n                            </div>\n\n                            <div class=\"field-content\">\n                                <div class=\"field-row\">\n                                    <input\n                                        type=\"text\"\n                                        [name]=\"'fieldName_' + i\"\n                                        [(ngModel)]=\"field.name\"\n                                        placeholder=\"Field name (e.g., apiKey)\"\n                                        class=\"field-name-input\"\n                                        [disabled]=\"isSaving\"\n                                    />\n                                    <input\n                                        type=\"text\"\n                                        [name]=\"'fieldTitle_' + i\"\n                                        [(ngModel)]=\"field.title\"\n                                        placeholder=\"Display title\"\n                                        class=\"field-title-input\"\n                                        [disabled]=\"isSaving\"\n                                    />\n                                    <select [name]=\"'fieldType_' + i\" [(ngModel)]=\"field.type\" class=\"field-type-select\" [disabled]=\"isSaving\">\n                                        <option value=\"string\">String</option>\n                                        <option value=\"number\">Number</option>\n                                        <option value=\"boolean\">Boolean</option>\n                                    </select>\n                                </div>\n\n                                <div class=\"field-row\">\n                                    <input\n                                        type=\"text\"\n                                        [name]=\"'fieldDesc_' + i\"\n                                        [(ngModel)]=\"field.description\"\n                                        placeholder=\"Field description (optional)\"\n                                        class=\"field-desc-input\"\n                                        [disabled]=\"isSaving\"\n                                    />\n                                </div>\n\n                                <div class=\"field-options\">\n                                    <label class=\"checkbox-label\">\n                                        <input type=\"checkbox\" [name]=\"'fieldRequired_' + i\" [(ngModel)]=\"field.required\" [disabled]=\"isSaving\" />\n                                        <span>Required</span>\n                                    </label>\n                                    <label class=\"checkbox-label\">\n                                        <input type=\"checkbox\" [name]=\"'fieldSecret_' + i\" [(ngModel)]=\"field.isSecret\" [disabled]=\"isSaving\" />\n                                        <span><i class=\"fa-solid fa-lock\"></i> Secret</span>\n                                    </label>\n                                </div>\n                            </div>\n\n                            <button\n                                type=\"button\"\n                                class=\"remove-field-btn\"\n                                (click)=\"removeSchemaField(i)\"\n                                [disabled]=\"isSaving\"\n                                title=\"Remove field\"\n                            >\n                                <i class=\"fa-solid fa-trash\"></i>\n                            </button>\n                        </div>\n                    </div>\n\n                    <div class=\"no-fields-message\" *ngIf=\"schemaFields.length === 0\">\n                        <i class=\"fa-solid fa-info-circle\"></i>\n                        <span>No fields defined. Add fields that credentials of this type will need to store.</span>\n                    </div>\n                </div>\n            </form>\n        </div>\n\n        <!-- Panel Footer -->\n        <div class=\"panel-footer\">\n            <div class=\"footer-left\">\n                <button\n                    class=\"btn-delete\"\n                    *ngIf=\"!isNew\"\n                    (click)=\"deleteType()\"\n                    [disabled]=\"isSaving\"\n                >\n                    <i class=\"fa-solid fa-trash\"></i>\n                    <span>Delete</span>\n                </button>\n            </div>\n            <div class=\"footer-right\">\n                <button\n                    class=\"btn-secondary\"\n                    (click)=\"closePanel()\"\n                    [disabled]=\"isSaving\"\n                >\n                    Cancel\n                </button>\n                <button\n                    class=\"btn-primary\"\n                    (click)=\"save()\"\n                    [disabled]=\"isSaving || !canSave\"\n                >\n                    <i class=\"fa-solid fa-spinner fa-spin\" *ngIf=\"isSaving\"></i>\n                    <i class=\"fa-solid fa-check\" *ngIf=\"!isSaving\"></i>\n                    <span>{{isNew ? 'Create' : 'Save'}}</span>\n                </button>\n            </div>\n        </div>\n    </div>\n</div>\n", styles: ["/* Panel Backdrop */\n.panel-backdrop {\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(0, 0, 0, 0.5);\n    z-index: 1000;\n    display: flex;\n    justify-content: flex-end;\n    animation: fadeIn 0.2s ease-out;\n}\n\n@keyframes fadeIn {\n    from { opacity: 0; }\n    to { opacity: 1; }\n}\n\n/* Slide-in Panel */\n.edit-panel {\n    width: 100%;\n    max-width: 600px;\n    height: 100%;\n    background: #ffffff;\n    display: flex;\n    flex-direction: column;\n    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.15);\n    transform: translateX(100%);\n    animation: slideIn 0.3s ease-out forwards;\n}\n\n@keyframes slideIn {\n    from { transform: translateX(100%); }\n    to { transform: translateX(0); }\n}\n\n/* Panel Header */\n.panel-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 20px 24px;\n    border-bottom: 1px solid #e5e7eb;\n    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);\n}\n\n.header-content {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n}\n\n.header-icon {\n    width: 48px;\n    height: 48px;\n    border-radius: 12px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 20px;\n    flex-shrink: 0;\n}\n\n.header-text h2 {\n    font-size: 18px;\n    font-weight: 600;\n    color: #1e293b;\n    margin: 0 0 4px 0;\n}\n\n.header-subtitle {\n    font-size: 13px;\n    color: #64748b;\n}\n\n.close-btn {\n    width: 36px;\n    height: 36px;\n    border: none;\n    background: #f1f5f9;\n    border-radius: 8px;\n    cursor: pointer;\n    color: #64748b;\n    font-size: 16px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.15s ease;\n}\n\n.close-btn:hover:not(:disabled) {\n    background: #e2e8f0;\n    color: #334155;\n}\n\n.close-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* Panel Body */\n.panel-body {\n    flex: 1;\n    overflow-y: auto;\n    padding: 24px;\n    scroll-behavior: smooth;\n    -webkit-overflow-scrolling: touch;\n}\n\n/* Form Sections */\n.form-section {\n    margin-bottom: 28px;\n}\n\n.form-section:last-child {\n    margin-bottom: 0;\n}\n\n.section-title {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    font-size: 14px;\n    font-weight: 600;\n    color: #334155;\n    margin: 0 0 16px 0;\n    padding-bottom: 10px;\n    border-bottom: 1px solid #f1f5f9;\n}\n\n.section-title i {\n    color: #6366f1;\n    font-size: 14px;\n}\n\n.section-header-row {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    margin-bottom: 16px;\n}\n\n.section-header-row .section-title {\n    margin: 0;\n    padding: 0;\n    border: none;\n}\n\n.btn-add-field {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    padding: 6px 12px;\n    background: #6366f1;\n    color: white;\n    border: none;\n    border-radius: 6px;\n    font-size: 12px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-add-field:hover:not(:disabled) {\n    background: #4f46e5;\n}\n\n.btn-add-field:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* Form Groups */\n.form-group {\n    margin-bottom: 18px;\n}\n\n.form-group:last-child {\n    margin-bottom: 0;\n}\n\n.form-group label {\n    display: block;\n    font-size: 13px;\n    font-weight: 500;\n    color: #475569;\n    margin-bottom: 6px;\n}\n\n.form-group label.required::after {\n    content: '*';\n    color: #ef4444;\n    margin-left: 4px;\n}\n\n.form-group input[type=\"text\"],\n.form-group input[type=\"number\"],\n.form-group select,\n.form-group textarea {\n    width: 100%;\n    padding: 10px 14px;\n    border: 1px solid #d1d5db;\n    border-radius: 8px;\n    font-size: 14px;\n    color: #1e293b;\n    background: #ffffff;\n    transition: all 0.15s ease;\n    box-sizing: border-box;\n}\n\n.form-group input:focus,\n.form-group select:focus,\n.form-group textarea:focus {\n    outline: none;\n    border-color: #6366f1;\n    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);\n}\n\n.form-group input:disabled,\n.form-group select:disabled,\n.form-group textarea:disabled {\n    background: #f8fafc;\n    color: #94a3b8;\n    cursor: not-allowed;\n}\n\n.form-group textarea {\n    resize: vertical;\n    min-height: 80px;\n}\n\n.field-hint {\n    display: block;\n    font-size: 12px;\n    color: #94a3b8;\n    margin-top: 5px;\n}\n\n.form-row {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 16px;\n}\n\n/* Category Selector */\n.category-selector {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 10px;\n}\n\n.category-btn {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 6px;\n    padding: 12px 8px;\n    border: 2px solid #e5e7eb;\n    border-radius: 10px;\n    background: #ffffff;\n    cursor: pointer;\n    transition: all 0.2s ease;\n    color: #64748b;\n}\n\n.category-btn i {\n    font-size: 18px;\n}\n\n.category-btn span {\n    font-size: 11px;\n    font-weight: 500;\n}\n\n.category-btn:hover:not(:disabled) {\n    border-color: var(--cat-color);\n    background: color-mix(in srgb, var(--cat-color) 5%, white);\n}\n\n.category-btn.selected {\n    border-color: var(--cat-color);\n    background: color-mix(in srgb, var(--cat-color) 10%, white);\n    color: var(--cat-color);\n}\n\n.category-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* Schema Fields */\n.schema-fields {\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n}\n\n.schema-field {\n    display: flex;\n    gap: 12px;\n    padding: 14px;\n    background: #f8fafc;\n    border: 1px solid #e5e7eb;\n    border-radius: 10px;\n}\n\n.field-drag-handle {\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n}\n\n.move-btn {\n    width: 24px;\n    height: 24px;\n    border: none;\n    background: #e2e8f0;\n    border-radius: 4px;\n    cursor: pointer;\n    color: #64748b;\n    font-size: 10px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.15s ease;\n}\n\n.move-btn:hover:not(:disabled) {\n    background: #cbd5e1;\n    color: #334155;\n}\n\n.move-btn:disabled {\n    opacity: 0.3;\n    cursor: not-allowed;\n}\n\n.field-content {\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n}\n\n.field-row {\n    display: flex;\n    gap: 10px;\n}\n\n.field-name-input {\n    flex: 1;\n    padding: 8px 12px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n    font-family: monospace;\n}\n\n.field-title-input {\n    flex: 1;\n    padding: 8px 12px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n}\n\n.field-type-select {\n    width: 100px;\n    padding: 8px 10px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n    cursor: pointer;\n}\n\n.field-desc-input {\n    flex: 1;\n    padding: 8px 12px;\n    border: 1px solid #d1d5db;\n    border-radius: 6px;\n    font-size: 13px;\n}\n\n.field-options {\n    display: flex;\n    gap: 16px;\n}\n\n.checkbox-label {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 12px;\n    color: #64748b;\n    cursor: pointer;\n}\n\n.checkbox-label input[type=\"checkbox\"] {\n    width: 14px;\n    height: 14px;\n    accent-color: #6366f1;\n}\n\n.checkbox-label i {\n    font-size: 10px;\n    color: #f59e0b;\n}\n\n.remove-field-btn {\n    width: 32px;\n    height: 32px;\n    border: none;\n    background: transparent;\n    color: #94a3b8;\n    cursor: pointer;\n    border-radius: 6px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: all 0.15s ease;\n    align-self: flex-start;\n}\n\n.remove-field-btn:hover:not(:disabled) {\n    background: #fef2f2;\n    color: #dc2626;\n}\n\n.remove-field-btn:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.no-fields-message {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 16px;\n    background: #f8fafc;\n    border: 2px dashed #e2e8f0;\n    border-radius: 10px;\n    color: #64748b;\n    font-size: 13px;\n}\n\n.no-fields-message i {\n    color: #94a3b8;\n}\n\n/* Panel Footer */\n.panel-footer {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 16px 24px;\n    border-top: 1px solid #e5e7eb;\n    background: #f8fafc;\n}\n\n.footer-left,\n.footer-right {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n}\n\n.btn-primary,\n.btn-secondary,\n.btn-delete {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    padding: 10px 20px;\n    border: none;\n    border-radius: 8px;\n    font-size: 14px;\n    font-weight: 500;\n    cursor: pointer;\n    transition: all 0.15s ease;\n}\n\n.btn-primary {\n    background: #6366f1;\n    color: #ffffff;\n}\n\n.btn-primary:hover:not(:disabled) {\n    background: #4f46e5;\n}\n\n.btn-primary:disabled {\n    background: #c7d2fe;\n    cursor: not-allowed;\n}\n\n.btn-secondary {\n    background: #ffffff;\n    color: #475569;\n    border: 1px solid #d1d5db;\n}\n\n.btn-secondary:hover:not(:disabled) {\n    background: #f1f5f9;\n    border-color: #94a3b8;\n}\n\n.btn-secondary:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.btn-delete {\n    background: transparent;\n    color: #dc2626;\n    padding: 10px 16px;\n}\n\n.btn-delete:hover:not(:disabled) {\n    background: #fef2f2;\n}\n\n.btn-delete:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n/* Mobile Responsiveness */\n@media (max-width: 768px) {\n    .edit-panel {\n        max-width: 100%;\n    }\n\n    .panel-header {\n        padding: 16px 20px;\n    }\n\n    .header-icon {\n        width: 40px;\n        height: 40px;\n        font-size: 18px;\n    }\n\n    .header-text h2 {\n        font-size: 16px;\n    }\n\n    .panel-body {\n        padding: 20px;\n    }\n\n    .form-row {\n        grid-template-columns: 1fr;\n    }\n\n    .category-selector {\n        grid-template-columns: repeat(2, 1fr);\n    }\n\n    .schema-field {\n        flex-direction: column;\n    }\n\n    .field-drag-handle {\n        flex-direction: row;\n        justify-content: flex-end;\n        order: 1;\n    }\n\n    .field-content {\n        order: 0;\n    }\n\n    .remove-field-btn {\n        order: 2;\n        align-self: flex-end;\n    }\n\n    .field-row {\n        flex-direction: column;\n    }\n\n    .field-type-select {\n        width: 100%;\n    }\n\n    .panel-footer {\n        padding: 14px 20px;\n        flex-direction: column-reverse;\n        gap: 12px;\n    }\n\n    .footer-left,\n    .footer-right {\n        width: 100%;\n    }\n\n    .footer-right {\n        flex-direction: row;\n    }\n\n    .footer-right .btn-primary,\n    .footer-right .btn-secondary {\n        flex: 1;\n        justify-content: center;\n    }\n\n    .btn-delete {\n        width: 100%;\n        justify-content: center;\n        background: #fef2f2;\n    }\n}\n\n@media (max-width: 480px) {\n    .panel-header {\n        padding: 14px 16px;\n    }\n\n    .header-content {\n        gap: 12px;\n    }\n\n    .header-icon {\n        width: 36px;\n        height: 36px;\n        font-size: 16px;\n        border-radius: 10px;\n    }\n\n    .header-text h2 {\n        font-size: 15px;\n    }\n\n    .header-subtitle {\n        font-size: 12px;\n    }\n\n    .panel-body {\n        padding: 16px;\n    }\n\n    .category-selector {\n        grid-template-columns: repeat(3, 1fr);\n    }\n\n    .category-btn {\n        padding: 10px 6px;\n    }\n\n    .category-btn i {\n        font-size: 16px;\n    }\n\n    .category-btn span {\n        font-size: 10px;\n    }\n\n    .schema-field {\n        padding: 12px;\n    }\n\n    .field-name-input,\n    .field-title-input,\n    .field-desc-input,\n    .field-type-select {\n        font-size: 14px;\n        padding: 10px 12px;\n    }\n\n    .panel-footer {\n        padding: 12px 16px;\n    }\n\n    .btn-primary,\n    .btn-secondary {\n        padding: 10px 16px;\n        font-size: 13px;\n    }\n}\n\n/* Custom scrollbar */\n.panel-body::-webkit-scrollbar {\n    width: 6px;\n}\n\n.panel-body::-webkit-scrollbar-track {\n    background: transparent;\n}\n\n.panel-body::-webkit-scrollbar-thumb {\n    background: #d1d5db;\n    border-radius: 3px;\n}\n\n.panel-body::-webkit-scrollbar-thumb:hover {\n    background: #94a3b8;\n}\n\n/* Animations */\n@keyframes spin {\n    from { transform: rotate(0deg); }\n    to { transform: rotate(360deg); }\n}\n\n.fa-spin {\n    animation: spin 1s linear infinite;\n}\n"] }]
-    }], () => [{ type: i0.ChangeDetectorRef }], { credentialType: [{
-            type: Input
-        }], isOpen: [{
-            type: Input
-        }], close: [{
-            type: Output
-        }], saved: [{
-            type: Output
-        }], deleted: [{
-            type: Output
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CredentialTypeEditPanelComponent, { className: "CredentialTypeEditPanelComponent" }); })();
-//# sourceMappingURL=credential-type-edit-panel.component.js.map