@openziti/ziti-console-lib 0.5.1 → 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/scripts/growler.js +4 -0
- package/assets/styles/forms.css +7 -7
- package/assets/styles/global.scss +61 -19
- package/assets/styles/header.css +1 -1
- package/assets/styles/ziti.css +40 -40
- package/esm2022/lib/features/card/card.component.mjs +2 -2
- package/esm2022/lib/features/data-table/cells/table-cell-menu/table-cell-menu.component.mjs +2 -2
- package/esm2022/lib/features/data-table/column-headers/table-column-default/table-column-default.component.mjs +2 -2
- package/esm2022/lib/features/data-table/column-headers/table-column-menu/table-column-menu.component.mjs +2 -2
- package/esm2022/lib/features/data-table/data-table.component.mjs +2 -2
- package/esm2022/lib/features/dynamic-widgets/object/object.component.mjs +2 -2
- package/esm2022/lib/features/dynamic-widgets/text-list/text-list-input.component.mjs +2 -2
- package/esm2022/lib/features/json-view/json-view.component.mjs +2 -2
- package/esm2022/lib/features/multi-action-button/multi-action-button.component.mjs +2 -2
- package/esm2022/lib/features/overrides/overrides.component.mjs +2 -2
- package/esm2022/lib/features/preview-list/preview-list.component.mjs +2 -2
- package/esm2022/lib/features/projectable-forms/edge-router/edge-router-form.component.mjs +2 -2
- package/esm2022/lib/features/projectable-forms/form-field-container/form-field-container.component.mjs +2 -2
- package/esm2022/lib/features/projectable-forms/form-header/form-header.component.mjs +2 -2
- package/esm2022/lib/features/projectable-forms/identity/identity-form.component.mjs +2 -2
- package/esm2022/lib/features/projectable-forms/jwt-signer/jwt-signer-form.component.mjs +280 -0
- package/esm2022/lib/features/projectable-forms/jwt-signer/jwt-signer-form.service.mjs +92 -0
- package/esm2022/lib/features/projectable-forms/service/service-form.component.mjs +2 -2
- package/esm2022/lib/features/projectable-forms/service/simple-service/simple-service.component.mjs +14 -11
- package/esm2022/lib/features/reset-enrollment/reset-enrollment.component.mjs +2 -2
- package/esm2022/lib/features/sidebars/side-navbar/side-navbar.component.mjs +2 -2
- package/esm2022/lib/features/tag-selector/tag-selector.component.mjs +2 -2
- package/esm2022/lib/features/visualizer/network-visualizer/network-visualizer.component.mjs +2 -2
- package/esm2022/lib/features/wrappers/zac-wrapper.component.mjs +3 -3
- package/esm2022/lib/models/jwt-signer.mjs +17 -0
- package/esm2022/lib/pages/edge-routers/edge-routers-page.component.mjs +2 -2
- package/esm2022/lib/pages/identities/identities-page.component.mjs +2 -2
- package/esm2022/lib/pages/jwt-signers/jwt-signers-page.component.mjs +96 -0
- package/esm2022/lib/pages/jwt-signers/jwt-signers-page.service.mjs +177 -0
- package/esm2022/lib/pages/services/services-page.component.mjs +2 -2
- package/esm2022/lib/services/login-service.class.mjs +1 -1
- package/esm2022/lib/services/node-data.service.mjs +6 -3
- package/esm2022/lib/services/noop-login.service.mjs +1 -4
- package/esm2022/lib/services/settings-service.class.mjs +1 -1
- package/esm2022/lib/services/settings.service.mjs +6 -1
- package/esm2022/lib/services/validation.service.mjs +14 -1
- package/esm2022/lib/services/ziti-data.service.mjs +4 -4
- package/esm2022/lib/ziti-console-lib.module.mjs +15 -5
- package/esm2022/public-api.mjs +5 -1
- package/fesm2022/openziti-ziti-console-lib.mjs +807 -180
- package/fesm2022/openziti-ziti-console-lib.mjs.map +1 -1
- package/lib/features/projectable-forms/jwt-signer/jwt-signer-form.component.d.ts +60 -0
- package/lib/features/projectable-forms/jwt-signer/jwt-signer-form.component.d.ts.map +1 -0
- package/lib/features/projectable-forms/jwt-signer/jwt-signer-form.service.d.ts +21 -0
- package/lib/features/projectable-forms/jwt-signer/jwt-signer-form.service.d.ts.map +1 -0
- package/lib/features/projectable-forms/service/simple-service/simple-service.component.d.ts.map +1 -1
- package/lib/models/jwt-signer.d.ts +14 -0
- package/lib/models/jwt-signer.d.ts.map +1 -0
- package/lib/pages/jwt-signers/jwt-signers-page.component.d.ts +29 -0
- package/lib/pages/jwt-signers/jwt-signers-page.component.d.ts.map +1 -0
- package/lib/pages/jwt-signers/jwt-signers-page.service.d.ts +31 -0
- package/lib/pages/jwt-signers/jwt-signers-page.service.d.ts.map +1 -0
- package/lib/services/login-service.class.d.ts +0 -1
- package/lib/services/login-service.class.d.ts.map +1 -1
- package/lib/services/node-data.service.d.ts.map +1 -1
- package/lib/services/noop-login.service.d.ts +0 -1
- package/lib/services/noop-login.service.d.ts.map +1 -1
- package/lib/services/settings-service.class.d.ts +1 -0
- package/lib/services/settings-service.class.d.ts.map +1 -1
- package/lib/services/settings.service.d.ts +1 -0
- package/lib/services/settings.service.d.ts.map +1 -1
- package/lib/services/validation.service.d.ts +1 -0
- package/lib/services/validation.service.d.ts.map +1 -1
- package/lib/services/ziti-data.service.d.ts +3 -3
- package/lib/services/ziti-data.service.d.ts.map +1 -1
- package/lib/ziti-console-lib.module.d.ts +19 -17
- package/lib/ziti-console-lib.module.d.ts.map +1 -1
- package/package.json +1 -1
- package/public-api.d.ts +4 -0
- package/public-api.d.ts.map +1 -1
|
@@ -65,7 +65,7 @@ class ObjectComponent {
|
|
|
65
65
|
<div *ngIf="showAdd" class="save-button button" (click)="addClicked()">Add</div>
|
|
66
66
|
</div>
|
|
67
67
|
</div>
|
|
68
|
-
`, isInline: true, styles: [":host>label{margin-top:0}.wrapper{border-radius:.5rem;padding:var(--paddingMedium);display:flex;flex-direction:column;gap:5px;margin-top:var(--marginMedium)}.wrapper.closed{cursor:pointer}.wrapper .object-main-content[hidden]{display:none}.wrapper .save-button{margin-top:var(--marginSmall);height:35px;min-width:140px}.object-header-container{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}.object-header-container .object-header-title{width:100%;display:flex;justify-content:space-between;align-items:center;height:23px;cursor:pointer}.object-header-container .object-label{margin:0;cursor:pointer}.expand-toggle{font-family:zac;font-weight:600;font-size:23px;width:27px;color:var(--stroke);height:20px;margin-top:-3px;cursor:pointer}.expand-toggle:before{content:\"\\e91f\"}.expand-toggle.open{transform:rotate(270deg)}.added-items-list{margin-top:var(--marginSmall);width:100%}.added-items-list label,.added-items-list .added-items-label{margin-top:0}.added-items-list .object-list-items-container{background-color:#ffffff4d;border-radius:
|
|
68
|
+
`, isInline: true, styles: [":host>label{margin-top:0}.wrapper{border-radius:.5rem;padding:var(--paddingMedium);display:flex;flex-direction:column;gap:5px;margin-top:var(--marginMedium)}.wrapper.closed{cursor:pointer}.wrapper .object-main-content[hidden]{display:none}.wrapper .save-button{margin-top:var(--marginSmall);height:35px;min-width:140px}.object-header-container{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}.object-header-container .object-header-title{width:100%;display:flex;justify-content:space-between;align-items:center;height:23px;cursor:pointer}.object-header-container .object-label{margin:0;cursor:pointer}.expand-toggle{font-family:zac;font-weight:600;font-size:23px;width:27px;color:var(--stroke);height:20px;margin-top:-3px;cursor:pointer}.expand-toggle:before{content:\"\\e91f\"}.expand-toggle.open{transform:rotate(270deg)}.added-items-list{margin-top:var(--marginSmall);width:100%}.added-items-list label,.added-items-list .added-items-label{margin-top:0}.added-items-list .object-list-items-container{background-color:#ffffff4d;border-radius:var(--inputBorderRadius);display:flex;flex-direction:column;padding:5px}.added-items-list .object-list-items-container .none-added-label{padding-left:var(--paddingSmall);color:var(--white);opacity:.7}.added-items-list .object-list-item{display:flex;flex-direction:row;justify-content:flex-start;align-items:center}.added-items-list .object-list-item .preview-name{color:var(--formBackground);font-weight:600;margin-left:var(--marginSmall);margin-bottom:2px}.added-items-list .object-list-item .icon-clear{color:var(--formBackground);cursor:pointer}.added-items-list .object-list-item .icon-clear:hover{color:var(--primary)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] }); }
|
|
69
69
|
}
|
|
70
70
|
export { ObjectComponent };
|
|
71
71
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ObjectComponent, decorators: [{
|
|
@@ -92,7 +92,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
92
92
|
<div *ngIf="showAdd" class="save-button button" (click)="addClicked()">Add</div>
|
|
93
93
|
</div>
|
|
94
94
|
</div>
|
|
95
|
-
`, styles: [":host>label{margin-top:0}.wrapper{border-radius:.5rem;padding:var(--paddingMedium);display:flex;flex-direction:column;gap:5px;margin-top:var(--marginMedium)}.wrapper.closed{cursor:pointer}.wrapper .object-main-content[hidden]{display:none}.wrapper .save-button{margin-top:var(--marginSmall);height:35px;min-width:140px}.object-header-container{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}.object-header-container .object-header-title{width:100%;display:flex;justify-content:space-between;align-items:center;height:23px;cursor:pointer}.object-header-container .object-label{margin:0;cursor:pointer}.expand-toggle{font-family:zac;font-weight:600;font-size:23px;width:27px;color:var(--stroke);height:20px;margin-top:-3px;cursor:pointer}.expand-toggle:before{content:\"\\e91f\"}.expand-toggle.open{transform:rotate(270deg)}.added-items-list{margin-top:var(--marginSmall);width:100%}.added-items-list label,.added-items-list .added-items-label{margin-top:0}.added-items-list .object-list-items-container{background-color:#ffffff4d;border-radius:
|
|
95
|
+
`, styles: [":host>label{margin-top:0}.wrapper{border-radius:.5rem;padding:var(--paddingMedium);display:flex;flex-direction:column;gap:5px;margin-top:var(--marginMedium)}.wrapper.closed{cursor:pointer}.wrapper .object-main-content[hidden]{display:none}.wrapper .save-button{margin-top:var(--marginSmall);height:35px;min-width:140px}.object-header-container{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}.object-header-container .object-header-title{width:100%;display:flex;justify-content:space-between;align-items:center;height:23px;cursor:pointer}.object-header-container .object-label{margin:0;cursor:pointer}.expand-toggle{font-family:zac;font-weight:600;font-size:23px;width:27px;color:var(--stroke);height:20px;margin-top:-3px;cursor:pointer}.expand-toggle:before{content:\"\\e91f\"}.expand-toggle.open{transform:rotate(270deg)}.added-items-list{margin-top:var(--marginSmall);width:100%}.added-items-list label,.added-items-list .added-items-label{margin-top:0}.added-items-list .object-list-items-container{background-color:#ffffff4d;border-radius:var(--inputBorderRadius);display:flex;flex-direction:column;padding:5px}.added-items-list .object-list-items-container .none-added-label{padding-left:var(--paddingSmall);color:var(--white);opacity:.7}.added-items-list .object-list-item{display:flex;flex-direction:row;justify-content:flex-start;align-items:center}.added-items-list .object-list-item .preview-name{color:var(--formBackground);font-weight:600;margin-left:var(--marginSmall);margin-bottom:2px}.added-items-list .object-list-item .icon-clear{color:var(--formBackground);cursor:pointer}.added-items-list .object-list-item .icon-clear:hover{color:var(--primary)}\n"] }]
|
|
96
96
|
}], ctorParameters: function () { return []; }, propDecorators: { wrapperContents: [{
|
|
97
97
|
type: ViewChild,
|
|
98
98
|
args: ["wrappercontents", { read: ViewContainerRef, static: true }]
|
|
@@ -77,7 +77,7 @@ class TextListInputComponent {
|
|
|
77
77
|
</p-chips>
|
|
78
78
|
<div *ngIf="error" class="error">{{error}}</div>
|
|
79
79
|
</div>
|
|
80
|
-
`, isInline: true, styles: ["::ng-deep .p-element .p-chips.p-component{width:100%;font-weight:400;font-family:Open Sans,Arial,sans-serif;height:var(--defaultInputHeight);border-color:var(--stroke);border-style:solid;border-width:
|
|
80
|
+
`, isInline: true, styles: ["::ng-deep .p-element .p-chips.p-component{width:100%;font-weight:400;font-family:Open Sans,Arial,sans-serif;height:var(--defaultInputHeight);border-color:var(--stroke);border-style:solid;border-width:var(--inputBorderWidth);border-radius:var(--inputBorderRadius);padding-left:10px;padding-right:10px;outline:none;box-sizing:border-box;font-size:15px;background-color:var(--background)!important;color:var(--text);-webkit-appearance:none}::ng-deep .p-element .p-chips.p-component .p-inputtext.p-chips-multiple-container{width:100%;padding:0;border-width:var(--inputBorderWidth)}::ng-deep .p-element .p-chips.p-component .p-inputtext.p-chips-multiple-container.p-focus{border-color:var(--primaryColor)!important;box-shadow:0 0 7px 0 var(--primaryColorOpaque)!important}::ng-deep .p-element .p-chips.p-component .p-inputtext.p-chips-multiple-container.p-focus.error{border-color:var(--red)!important}::ng-deep .p-element .p-chips .p-chips-multiple-container .p-chips-input-token input{height:25px;font-size:14px;color:#495057;padding:0;margin:0;border:0 none;outline:0 none;background-color:transparent;box-shadow:none;border-radius:0;width:100%}::ng-deep .p-element .p-chips .p-chips-multiple-container .p-chips-token{margin-right:.5rem;font-family:Open Sans,sans-serif;font-weight:600;margin-top:5px;margin-bottom:5px;background:var(--primary);color:var(--white);border-radius:var(--inputBorderRadius);cursor:default;display:inline-flex;align-items:center;flex:0 0 auto;max-width:100%}::ng-deep .p-element .p-chips-token-icon{margin-left:.5rem;cursor:pointer;color:#00f;fill:red}::ng-deep .p-element .p-chips{display:inline-flex}::ng-deep .p-element .p-chips-token-label{min-width:0;overflow:auto}::ng-deep .p-element .p-chips-token-label::-webkit-scrollbar{display:none}::ng-deep .p-element .p-fluid .p-chips{display:flex}::ng-deep .p-element .p-chips-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}::ng-deep .p-element .p-chips-clearable .p-inputtext{position:relative}::ng-deep .p-element .p-inputtext{border:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.Chips, selector: "p-chips", inputs: ["style", "styleClass", "disabled", "field", "placeholder", "max", "ariaLabel", "ariaLabelledBy", "tabindex", "inputId", "allowDuplicate", "inputStyle", "inputStyleClass", "addOnTab", "addOnBlur", "separator", "showClear"], outputs: ["onAdd", "onRemove", "onFocus", "onBlur", "onChipClick", "onClear"] }] }); }
|
|
81
81
|
}
|
|
82
82
|
export { TextListInputComponent };
|
|
83
83
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TextListInputComponent, decorators: [{
|
|
@@ -97,7 +97,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
97
97
|
</p-chips>
|
|
98
98
|
<div *ngIf="error" class="error">{{error}}</div>
|
|
99
99
|
</div>
|
|
100
|
-
`, styles: ["::ng-deep .p-element .p-chips.p-component{width:100%;font-weight:400;font-family:Open Sans,Arial,sans-serif;height:var(--defaultInputHeight);border-color:var(--stroke);border-style:solid;border-width:
|
|
100
|
+
`, styles: ["::ng-deep .p-element .p-chips.p-component{width:100%;font-weight:400;font-family:Open Sans,Arial,sans-serif;height:var(--defaultInputHeight);border-color:var(--stroke);border-style:solid;border-width:var(--inputBorderWidth);border-radius:var(--inputBorderRadius);padding-left:10px;padding-right:10px;outline:none;box-sizing:border-box;font-size:15px;background-color:var(--background)!important;color:var(--text);-webkit-appearance:none}::ng-deep .p-element .p-chips.p-component .p-inputtext.p-chips-multiple-container{width:100%;padding:0;border-width:var(--inputBorderWidth)}::ng-deep .p-element .p-chips.p-component .p-inputtext.p-chips-multiple-container.p-focus{border-color:var(--primaryColor)!important;box-shadow:0 0 7px 0 var(--primaryColorOpaque)!important}::ng-deep .p-element .p-chips.p-component .p-inputtext.p-chips-multiple-container.p-focus.error{border-color:var(--red)!important}::ng-deep .p-element .p-chips .p-chips-multiple-container .p-chips-input-token input{height:25px;font-size:14px;color:#495057;padding:0;margin:0;border:0 none;outline:0 none;background-color:transparent;box-shadow:none;border-radius:0;width:100%}::ng-deep .p-element .p-chips .p-chips-multiple-container .p-chips-token{margin-right:.5rem;font-family:Open Sans,sans-serif;font-weight:600;margin-top:5px;margin-bottom:5px;background:var(--primary);color:var(--white);border-radius:var(--inputBorderRadius);cursor:default;display:inline-flex;align-items:center;flex:0 0 auto;max-width:100%}::ng-deep .p-element .p-chips-token-icon{margin-left:.5rem;cursor:pointer;color:#00f;fill:red}::ng-deep .p-element .p-chips{display:inline-flex}::ng-deep .p-element .p-chips-token-label{min-width:0;overflow:auto}::ng-deep .p-element .p-chips-token-label::-webkit-scrollbar{display:none}::ng-deep .p-element .p-fluid .p-chips{display:flex}::ng-deep .p-element .p-chips-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}::ng-deep .p-element .p-chips-clearable .p-inputtext{position:relative}::ng-deep .p-element .p-inputtext{border:none}\n"] }]
|
|
101
101
|
}], propDecorators: { fieldName: [{
|
|
102
102
|
type: Input
|
|
103
103
|
}], fieldValue: [{
|
|
@@ -181,12 +181,12 @@ class JsonViewComponent {
|
|
|
181
181
|
this.growlerService.show(growlerData);
|
|
182
182
|
}
|
|
183
183
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JsonViewComponent, deps: [{ token: i1.GrowlerService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
184
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: JsonViewComponent, selector: "lib-json-view", inputs: { data: "data", schema: "schema", readOnly: "readOnly", jsonInvalid: "jsonInvalid", showCopy: "showCopy" }, outputs: { dataChange: "dataChange", jsonChange: "jsonChange", jsonInvalidChange: "jsonInvalidChange" }, viewQueries: [{ propertyName: "editorDiv", first: true, predicate: ["editor"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div id=\"jsoneditor\" [ngClass]=\"{'read-only': readOnly}\" #editor (keyup.enter)=\"enterKeyPressed($event)\" (keyup)=\"jsonChanged($event)\"></div>\n<div *ngIf=\"showCopy\" class=\"icon-copy copy\" (click)=\"copyToClipboad()\"></div>", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column;position:relative}#jsoneditor{height:100%;min-height:200px;border-color:var(--inputBorder);border-style:solid;border-radius:
|
|
184
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: JsonViewComponent, selector: "lib-json-view", inputs: { data: "data", schema: "schema", readOnly: "readOnly", jsonInvalid: "jsonInvalid", showCopy: "showCopy" }, outputs: { dataChange: "dataChange", jsonChange: "jsonChange", jsonInvalidChange: "jsonInvalidChange" }, viewQueries: [{ propertyName: "editorDiv", first: true, predicate: ["editor"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div id=\"jsoneditor\" [ngClass]=\"{'read-only': readOnly}\" #editor (keyup.enter)=\"enterKeyPressed($event)\" (keyup)=\"jsonChanged($event)\"></div>\n<div *ngIf=\"showCopy\" class=\"icon-copy copy\" (click)=\"copyToClipboad()\"></div>", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column;position:relative}#jsoneditor{height:100%;min-height:200px;border-color:var(--inputBorder);border-style:solid;border-radius:var(--inputBorderRadius);overflow:hidden}#jsoneditor.read-only .jse-menu{display:none}.copy.icon-copy{position:absolute;top:10px;right:10px;background:transparent}::ng-deep #jsoneditor .jse-json-node.svelte-1wlxti1 .jse-insert-area.svelte-1wlxti1.svelte-1wlxti1.svelte-1wlxti1{display:none}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
185
185
|
}
|
|
186
186
|
export { JsonViewComponent };
|
|
187
187
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JsonViewComponent, decorators: [{
|
|
188
188
|
type: Component,
|
|
189
|
-
args: [{ selector: 'lib-json-view', template: "<div id=\"jsoneditor\" [ngClass]=\"{'read-only': readOnly}\" #editor (keyup.enter)=\"enterKeyPressed($event)\" (keyup)=\"jsonChanged($event)\"></div>\n<div *ngIf=\"showCopy\" class=\"icon-copy copy\" (click)=\"copyToClipboad()\"></div>", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column;position:relative}#jsoneditor{height:100%;min-height:200px;border-color:var(--inputBorder);border-style:solid;border-radius:
|
|
189
|
+
args: [{ selector: 'lib-json-view', template: "<div id=\"jsoneditor\" [ngClass]=\"{'read-only': readOnly}\" #editor (keyup.enter)=\"enterKeyPressed($event)\" (keyup)=\"jsonChanged($event)\"></div>\n<div *ngIf=\"showCopy\" class=\"icon-copy copy\" (click)=\"copyToClipboad()\"></div>", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column;position:relative}#jsoneditor{height:100%;min-height:200px;border-color:var(--inputBorder);border-style:solid;border-radius:var(--inputBorderRadius);overflow:hidden}#jsoneditor.read-only .jse-menu{display:none}.copy.icon-copy{position:absolute;top:10px;right:10px;background:transparent}::ng-deep #jsoneditor .jse-json-node.svelte-1wlxti1 .jse-insert-area.svelte-1wlxti1.svelte-1wlxti1.svelte-1wlxti1{display:none}\n"] }]
|
|
190
190
|
}], ctorParameters: function () { return [{ type: i1.GrowlerService }]; }, propDecorators: { data: [{
|
|
191
191
|
type: Input
|
|
192
192
|
}], schema: [{
|
|
@@ -17,12 +17,12 @@ class MultiActionButtonComponent {
|
|
|
17
17
|
this.actionRequested.emit(action);
|
|
18
18
|
}
|
|
19
19
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiActionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
20
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MultiActionButtonComponent, selector: "lib-multi-action-button", inputs: { actions: "actions" }, outputs: { actionRequested: "actionRequested" }, ngImport: i0, template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:15px;top:10px;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:25px}.multi-action-button-container .form-field-action .primary-action-button{padding-left:10px;padding-right:10px;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;background:var(--primary);color:var(--white);cursor:pointer;border-top-left-radius:
|
|
20
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MultiActionButtonComponent, selector: "lib-multi-action-button", inputs: { actions: "actions" }, outputs: { actionRequested: "actionRequested" }, ngImport: i0, template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:15px;top:10px;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:25px}.multi-action-button-container .form-field-action .primary-action-button{padding-left:10px;padding-right:10px;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;background:var(--primary);color:var(--white);cursor:pointer;border-top-left-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 3px 9px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:active{background:#648293;box-shadow:none;transform:translateY(1px)}.multi-action-button-container .form-field-action .secondary-action-button{height:100%;width:30px;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;background:var(--primary);color:var(--white);cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 3px 9px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:active{background:#648293;box-shadow:none;transform:translateY(1px)}.multi-action-button-container .form-field-action .secondary-action-button .secondary-actions-arrow{transform:rotate(270deg)}.multi-action-button-container .multi-action-button-dropdown{position:absolute;background:var(--background);width:100%}.multi-action-button-container .multi-action-button-dropdown ul{width:100%;margin:0;padding:0}.multi-action-button-container .multi-action-button-dropdown ul li{list-style-type:none;padding:5px 5px 5px 10px;cursor:pointer}.multi-action-button-container .multi-action-button-dropdown ul li:hover{background-color:var(--inputBorder)}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
|
|
21
21
|
}
|
|
22
22
|
export { MultiActionButtonComponent };
|
|
23
23
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiActionButtonComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
|
-
args: [{ selector: 'lib-multi-action-button', template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:15px;top:10px;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:25px}.multi-action-button-container .form-field-action .primary-action-button{padding-left:10px;padding-right:10px;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;background:var(--primary);color:var(--white);cursor:pointer;border-top-left-radius:
|
|
25
|
+
args: [{ selector: 'lib-multi-action-button', template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:15px;top:10px;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:25px}.multi-action-button-container .form-field-action .primary-action-button{padding-left:10px;padding-right:10px;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;background:var(--primary);color:var(--white);cursor:pointer;border-top-left-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 3px 9px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:active{background:#648293;box-shadow:none;transform:translateY(1px)}.multi-action-button-container .form-field-action .secondary-action-button{height:100%;width:30px;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;background:var(--primary);color:var(--white);cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 3px 9px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:active{background:#648293;box-shadow:none;transform:translateY(1px)}.multi-action-button-container .form-field-action .secondary-action-button .secondary-actions-arrow{transform:rotate(270deg)}.multi-action-button-container .multi-action-button-dropdown{position:absolute;background:var(--background);width:100%}.multi-action-button-container .multi-action-button-dropdown ul{width:100%;margin:0;padding:0}.multi-action-button-container .multi-action-button-dropdown ul li{list-style-type:none;padding:5px 5px 5px 10px;cursor:pointer}.multi-action-button-container .multi-action-button-dropdown ul li:hover{background-color:var(--inputBorder)}\n"] }]
|
|
26
26
|
}], propDecorators: { actions: [{
|
|
27
27
|
type: Input
|
|
28
28
|
}], actionRequested: [{
|
|
@@ -99,12 +99,12 @@ class OverridesComponent {
|
|
|
99
99
|
return isEmpty(this.selectedServiceId) || isEmpty(this.selectedConfigId);
|
|
100
100
|
}
|
|
101
101
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverridesComponent, deps: [{ token: i1.OverridesService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
102
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OverridesComponent, selector: "lib-overrides", inputs: { identity: "identity" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "servicesList", first: true, predicate: ["servicesList"], descendants: true }, { propertyName: "configList", first: true, predicate: ["configList"], descendants: true }], ngImport: i0, template: "<div id=\"OverrideModal\" class=\"overrides-wrapper\">\n <div class=\"overrides-container sized large\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-button\" (click)=\"close.emit()\">\n <div class=\"form-title-back-button-image\"></div>\n <div class=\"form-title-back-button-line\"></div>\n </div>\n <span class=\"title\">IDENTITY OVERRIDES</span>\n </div>\n <div class=\"subtitle\">Manage the Service Config Identity Overrides</div>\n <div class=\"darkened overrides\" *ngIf=\"overrides.length > 0\">Current Overrides</div>\n <div id=\"OverrideList\" class=\"grid splitRemove overrides\">\n <div id=\"OverrideTemplate\" class=\"row grid threedelete\" *ngFor=\"let override of overrides\">\n <div>{{override.service.name}}</div>\n <div>{{override.config.name}}</div>\n <div class=\"relative\">\n <div class=\"remove icon-minus removeAssoc\" (click)=\"removeOverride(override)\"></div>\n </div>\n </div>\n </div>\n <div class=\"darkened\">ADD OVERRIDE CONFIG</div>\n <div class=\"grid split override-list-container\">\n <div>\n <label for=\"ServiceList\">Service</label>\n <p-dropdown\n #servicesList\n id=\"ServiceList\"\n [options]=\"services\"\n [(ngModel)]=\"selectedServiceId\"\n placeholder=\"Select a service\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onFocus)=\"servicesList.show()\"\n (onChange)=\"serviceSelectionChanged($event)\"\n (keyup)=\"filterServicesDebounced($event)\"\n ></p-dropdown>\n </div>\n <div>\n <label for=\"ConfigList\">Configuration</label>\n <p-dropdown\n #configList\n id=\"ConfigList\"\n [options]=\"configs\"\n [(ngModel)]=\"selectedConfigId\"\n placeholder=\"Select a config\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onChange)=\"configSelectionChanged($event)\"\n (keyup)=\"filterConfigsDebounced($event)\"\n (onFocus)=\"configList.show()\"\n ></p-dropdown>\n </div>\n </div>\n <div class=\"buttons\">\n <div\n id=\"AssociateButton\"\n class=\"button confirm\"\n [ngClass]=\"{disabled: disableAddButton}\"\n (click)=\"addOverride()\"\n >\n Add\n </div>\n </div>\n </div>\n</div>", styles: [".overrides-wrapper{display:flex;justify-content:center;padding:10px}.overrides-wrapper .overrides-container{max-width:1024px;flex:1 1 auto}.overrides-wrapper .overrides-container .form-title-container{margin-left:-10px}.overrides-wrapper .overrides-container .title{display:flex;margin-left:5px}.overrides-wrapper .overrides-container .button.confirm.disabled{pointer-events:none;filter:grayscale(1);opacity:.5}.overrides-wrapper .overrides-container .button.confirm:hover{outline:0;filter:brightness(90%);background-color:var(--primaryColor);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}::ng-deep .override-list-container .p-element.p-icon-wrapper path{stroke:var(--formSubGroup)!important;fill:var(--formSubGroup)!important}::ng-deep .override-list-container .p-dropdown{font-weight:400;font-family:Open Sans,Arial,sans-serif;height:50px;width:100%;border-color:var(--stroke);border-style:solid;border-width:
|
|
102
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OverridesComponent, selector: "lib-overrides", inputs: { identity: "identity" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "servicesList", first: true, predicate: ["servicesList"], descendants: true }, { propertyName: "configList", first: true, predicate: ["configList"], descendants: true }], ngImport: i0, template: "<div id=\"OverrideModal\" class=\"overrides-wrapper\">\n <div class=\"overrides-container sized large\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-button\" (click)=\"close.emit()\">\n <div class=\"form-title-back-button-image\"></div>\n <div class=\"form-title-back-button-line\"></div>\n </div>\n <span class=\"title\">IDENTITY OVERRIDES</span>\n </div>\n <div class=\"subtitle\">Manage the Service Config Identity Overrides</div>\n <div class=\"darkened overrides\" *ngIf=\"overrides.length > 0\">Current Overrides</div>\n <div id=\"OverrideList\" class=\"grid splitRemove overrides\">\n <div id=\"OverrideTemplate\" class=\"row grid threedelete\" *ngFor=\"let override of overrides\">\n <div>{{override.service.name}}</div>\n <div>{{override.config.name}}</div>\n <div class=\"relative\">\n <div class=\"remove icon-minus removeAssoc\" (click)=\"removeOverride(override)\"></div>\n </div>\n </div>\n </div>\n <div class=\"darkened\">ADD OVERRIDE CONFIG</div>\n <div class=\"grid split override-list-container\">\n <div>\n <label for=\"ServiceList\">Service</label>\n <p-dropdown\n #servicesList\n id=\"ServiceList\"\n [options]=\"services\"\n [(ngModel)]=\"selectedServiceId\"\n placeholder=\"Select a service\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onFocus)=\"servicesList.show()\"\n (onChange)=\"serviceSelectionChanged($event)\"\n (keyup)=\"filterServicesDebounced($event)\"\n ></p-dropdown>\n </div>\n <div>\n <label for=\"ConfigList\">Configuration</label>\n <p-dropdown\n #configList\n id=\"ConfigList\"\n [options]=\"configs\"\n [(ngModel)]=\"selectedConfigId\"\n placeholder=\"Select a config\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onChange)=\"configSelectionChanged($event)\"\n (keyup)=\"filterConfigsDebounced($event)\"\n (onFocus)=\"configList.show()\"\n ></p-dropdown>\n </div>\n </div>\n <div class=\"buttons\">\n <div\n id=\"AssociateButton\"\n class=\"button confirm\"\n [ngClass]=\"{disabled: disableAddButton}\"\n (click)=\"addOverride()\"\n >\n Add\n </div>\n </div>\n </div>\n</div>", styles: [".overrides-wrapper{display:flex;justify-content:center;padding:10px}.overrides-wrapper .overrides-container{max-width:1024px;flex:1 1 auto}.overrides-wrapper .overrides-container .form-title-container{margin-left:-10px}.overrides-wrapper .overrides-container .title{display:flex;margin-left:5px}.overrides-wrapper .overrides-container .button.confirm.disabled{pointer-events:none;filter:grayscale(1);opacity:.5}.overrides-wrapper .overrides-container .button.confirm:hover{outline:0;filter:brightness(90%);background-color:var(--primaryColor);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}::ng-deep .override-list-container .p-element.p-icon-wrapper path{stroke:var(--formSubGroup)!important;fill:var(--formSubGroup)!important}::ng-deep .override-list-container .p-dropdown{font-weight:400;font-family:Open Sans,Arial,sans-serif;height:50px;width:100%;border-color:var(--stroke);border-style:solid;border-width:var(--inputBorderWidth);border-radius:var(--inputBorderRadius);padding-left:10px;padding-right:10px;outline:none;box-sizing:border-box;font-size:15px;background-color:var(--navigation)!important;color:var(--text);-webkit-appearance:none}::ng-deep .override-list-container .p-inputtext{border-radius:var(--inputBorderRadius);border-color:transparent!important;height:46px}::ng-deep .override-list-container .p-inputtext:hover{border-color:transparent!important}::ng-deep .override-list-container .p-inputtext:active{border-color:transparent!important}::ng-deep .override-list-container .p-dropdown:not(.p-disabled).p-focus{box-shadow:none}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }] }); }
|
|
103
103
|
}
|
|
104
104
|
export { OverridesComponent };
|
|
105
105
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OverridesComponent, decorators: [{
|
|
106
106
|
type: Component,
|
|
107
|
-
args: [{ selector: 'lib-overrides', template: "<div id=\"OverrideModal\" class=\"overrides-wrapper\">\n <div class=\"overrides-container sized large\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-button\" (click)=\"close.emit()\">\n <div class=\"form-title-back-button-image\"></div>\n <div class=\"form-title-back-button-line\"></div>\n </div>\n <span class=\"title\">IDENTITY OVERRIDES</span>\n </div>\n <div class=\"subtitle\">Manage the Service Config Identity Overrides</div>\n <div class=\"darkened overrides\" *ngIf=\"overrides.length > 0\">Current Overrides</div>\n <div id=\"OverrideList\" class=\"grid splitRemove overrides\">\n <div id=\"OverrideTemplate\" class=\"row grid threedelete\" *ngFor=\"let override of overrides\">\n <div>{{override.service.name}}</div>\n <div>{{override.config.name}}</div>\n <div class=\"relative\">\n <div class=\"remove icon-minus removeAssoc\" (click)=\"removeOverride(override)\"></div>\n </div>\n </div>\n </div>\n <div class=\"darkened\">ADD OVERRIDE CONFIG</div>\n <div class=\"grid split override-list-container\">\n <div>\n <label for=\"ServiceList\">Service</label>\n <p-dropdown\n #servicesList\n id=\"ServiceList\"\n [options]=\"services\"\n [(ngModel)]=\"selectedServiceId\"\n placeholder=\"Select a service\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onFocus)=\"servicesList.show()\"\n (onChange)=\"serviceSelectionChanged($event)\"\n (keyup)=\"filterServicesDebounced($event)\"\n ></p-dropdown>\n </div>\n <div>\n <label for=\"ConfigList\">Configuration</label>\n <p-dropdown\n #configList\n id=\"ConfigList\"\n [options]=\"configs\"\n [(ngModel)]=\"selectedConfigId\"\n placeholder=\"Select a config\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onChange)=\"configSelectionChanged($event)\"\n (keyup)=\"filterConfigsDebounced($event)\"\n (onFocus)=\"configList.show()\"\n ></p-dropdown>\n </div>\n </div>\n <div class=\"buttons\">\n <div\n id=\"AssociateButton\"\n class=\"button confirm\"\n [ngClass]=\"{disabled: disableAddButton}\"\n (click)=\"addOverride()\"\n >\n Add\n </div>\n </div>\n </div>\n</div>", styles: [".overrides-wrapper{display:flex;justify-content:center;padding:10px}.overrides-wrapper .overrides-container{max-width:1024px;flex:1 1 auto}.overrides-wrapper .overrides-container .form-title-container{margin-left:-10px}.overrides-wrapper .overrides-container .title{display:flex;margin-left:5px}.overrides-wrapper .overrides-container .button.confirm.disabled{pointer-events:none;filter:grayscale(1);opacity:.5}.overrides-wrapper .overrides-container .button.confirm:hover{outline:0;filter:brightness(90%);background-color:var(--primaryColor);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}::ng-deep .override-list-container .p-element.p-icon-wrapper path{stroke:var(--formSubGroup)!important;fill:var(--formSubGroup)!important}::ng-deep .override-list-container .p-dropdown{font-weight:400;font-family:Open Sans,Arial,sans-serif;height:50px;width:100%;border-color:var(--stroke);border-style:solid;border-width:
|
|
107
|
+
args: [{ selector: 'lib-overrides', template: "<div id=\"OverrideModal\" class=\"overrides-wrapper\">\n <div class=\"overrides-container sized large\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-button\" (click)=\"close.emit()\">\n <div class=\"form-title-back-button-image\"></div>\n <div class=\"form-title-back-button-line\"></div>\n </div>\n <span class=\"title\">IDENTITY OVERRIDES</span>\n </div>\n <div class=\"subtitle\">Manage the Service Config Identity Overrides</div>\n <div class=\"darkened overrides\" *ngIf=\"overrides.length > 0\">Current Overrides</div>\n <div id=\"OverrideList\" class=\"grid splitRemove overrides\">\n <div id=\"OverrideTemplate\" class=\"row grid threedelete\" *ngFor=\"let override of overrides\">\n <div>{{override.service.name}}</div>\n <div>{{override.config.name}}</div>\n <div class=\"relative\">\n <div class=\"remove icon-minus removeAssoc\" (click)=\"removeOverride(override)\"></div>\n </div>\n </div>\n </div>\n <div class=\"darkened\">ADD OVERRIDE CONFIG</div>\n <div class=\"grid split override-list-container\">\n <div>\n <label for=\"ServiceList\">Service</label>\n <p-dropdown\n #servicesList\n id=\"ServiceList\"\n [options]=\"services\"\n [(ngModel)]=\"selectedServiceId\"\n placeholder=\"Select a service\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onFocus)=\"servicesList.show()\"\n (onChange)=\"serviceSelectionChanged($event)\"\n (keyup)=\"filterServicesDebounced($event)\"\n ></p-dropdown>\n </div>\n <div>\n <label for=\"ConfigList\">Configuration</label>\n <p-dropdown\n #configList\n id=\"ConfigList\"\n [options]=\"configs\"\n [(ngModel)]=\"selectedConfigId\"\n placeholder=\"Select a config\"\n [editable]=\"true\"\n [optionValue]=\"'id'\"\n [optionLabel]=\"'name'\"\n (onChange)=\"configSelectionChanged($event)\"\n (keyup)=\"filterConfigsDebounced($event)\"\n (onFocus)=\"configList.show()\"\n ></p-dropdown>\n </div>\n </div>\n <div class=\"buttons\">\n <div\n id=\"AssociateButton\"\n class=\"button confirm\"\n [ngClass]=\"{disabled: disableAddButton}\"\n (click)=\"addOverride()\"\n >\n Add\n </div>\n </div>\n </div>\n</div>", styles: [".overrides-wrapper{display:flex;justify-content:center;padding:10px}.overrides-wrapper .overrides-container{max-width:1024px;flex:1 1 auto}.overrides-wrapper .overrides-container .form-title-container{margin-left:-10px}.overrides-wrapper .overrides-container .title{display:flex;margin-left:5px}.overrides-wrapper .overrides-container .button.confirm.disabled{pointer-events:none;filter:grayscale(1);opacity:.5}.overrides-wrapper .overrides-container .button.confirm:hover{outline:0;filter:brightness(90%);background-color:var(--primaryColor);box-shadow:0 2px 3px 0 var(--primaryColorOpaque)}::ng-deep .override-list-container .p-element.p-icon-wrapper path{stroke:var(--formSubGroup)!important;fill:var(--formSubGroup)!important}::ng-deep .override-list-container .p-dropdown{font-weight:400;font-family:Open Sans,Arial,sans-serif;height:50px;width:100%;border-color:var(--stroke);border-style:solid;border-width:var(--inputBorderWidth);border-radius:var(--inputBorderRadius);padding-left:10px;padding-right:10px;outline:none;box-sizing:border-box;font-size:15px;background-color:var(--navigation)!important;color:var(--text);-webkit-appearance:none}::ng-deep .override-list-container .p-inputtext{border-radius:var(--inputBorderRadius);border-color:transparent!important;height:46px}::ng-deep .override-list-container .p-inputtext:hover{border-color:transparent!important}::ng-deep .override-list-container .p-inputtext:active{border-color:transparent!important}::ng-deep .override-list-container .p-dropdown:not(.p-disabled).p-focus{box-shadow:none}\n"] }]
|
|
108
108
|
}], ctorParameters: function () { return [{ type: i1.OverridesService }]; }, propDecorators: { identity: [{
|
|
109
109
|
type: Input
|
|
110
110
|
}], close: [{
|
|
@@ -99,12 +99,12 @@ class PreviewListComponent {
|
|
|
99
99
|
event.preventDefault();
|
|
100
100
|
}
|
|
101
101
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreviewListComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
102
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreviewListComponent, selector: "lib-preview-list", inputs: { label: "label", clickable: "clickable", isLoading: "isLoading", allNames: "allNames", items: "items", allowRemove: "allowRemove", tooltip: "tooltip", showfilter: "showfilter" }, outputs: { itemSelected: "itemSelected", itemRemoved: "itemRemoved" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item }}</span>\n <a *ngIf=\"item.href\" [href]=\"'./' + item.href\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0}.listBox{background-color:var(--stroke);padding:10px;border-radius:
|
|
102
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreviewListComponent, selector: "lib-preview-list", inputs: { label: "label", clickable: "clickable", isLoading: "isLoading", allNames: "allNames", items: "items", allowRemove: "allowRemove", tooltip: "tooltip", showfilter: "showfilter" }, outputs: { itemSelected: "itemSelected", itemRemoved: "itemRemoved" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item }}</span>\n <a *ngIf=\"item.href\" [href]=\"'./' + item.href\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0}.listBox{background-color:var(--stroke);padding:10px;border-radius:var(--inputBorderRadius);height:100%;min-height:60px}.listBox input{height:40px;border-radius:27px;font-size:14px;font-weight:600;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAuCAYAAABTTPsKAAAD4klEQVRYhc2ZyYsUSRSHvypLbRfGDfWgzngYFRR3EUQPOm5oOyMuKIoo4kk9iAriQfAPcAMvKuJBPAyiXmbAwWVUFGEYmMHlIi24ogd3cW3trpYnv4CooLKrKiuzqn5QUBmZEe/Lly9fvIjMPH36CmA4cABYAHSnsdQK/AVsBR4Y8E/ATaA30KXBYJ3agffA+Cywt8FhEZsx7jUPf/bC4BNwuc5woWYBPdTWmgti9hSwrv6MBToOrFVD92xwsqOOYFEqYAqBGzGOC5gshv07aANuNZCnM8A4IOcacsEFdjyp9lzly0KipZEBA7VYSKwEfpf7nTqU4uqpHkWYVlkInAR+ATZ4AZ4HmoErdQKeCVz0eGymO2asrpawE38D0xXHdjcfFM93aww7Avgf6CUPWyK4Dsw2cJfW7A4WA4/1P6NHcgHoV0PYfrLpwqFdTIv1vyAPvwXmyLMd8voQ4A+gaw1gu8rWENl2T3mO2AiBTfeARYphFB7TgMM1AD4sWy7V5sVyz78oBDZd0wvoZHe7HtiWIuw22fBntQ1iKVAxYFRw7PE8nVEZ2pwCbLPGdimsXbaPF7vYZYmi54A/gfneY7JSdCpwOyHYscC/QJOOLSOcA36NKg+iPIw6rNBM2Ka2bnqLBycAO1hjdfNgW2QzspbpDNj0EZintzSv6wdojdVUom9natIYAzRmXjbmyWakSgGbnigsnJdzepQngqmzXGXUd6wXam2y8aTUGOUAm/4DVnvHZmgpsDsG8G719SvF1bJRUuUCm84Au7zMkfWMl6sl6uPs5jXmmXIH6CxLRMkqu+Weh94BPwJvSvTrAzwCftCxhcFpq8AqMR4W8OXIFqk/AxPUv0lJfl/Q114gP4yGAT092BtxFrxxgL8Ay4D7OrYa4LciwKOBNRHrxKye0pdKjVcSw74eBSuV4RHXtUW0W9+HcQzHBUaVlFPUflxU+4eI9pKqBriUDqm+db9nSQwaJ4bLldUDOzyn9G904KHAxKRtpBkSpsQ3ZNL0sG1EW9r6quNw2R5Lab90vbX67ZXUS5cUcJTnZmjqtjQ2KAlD1QB/9v4PVAETbgnk5OWeSYQDVQKf9WayjKbnO9oxT03VAO8HrgZbAubpS1pU2tLHKrh/VOtGTdMVqdqQmAvs1Eo37z32LarGWrXXMAV4WW9gBGlL8sn2DS1YRo3U57TNScUvCWYJAxsDHPXarKy00vMgcD6pD5ZJ5mELkU3AQuC15+2stk/7JmEkjYnDlu+jtL/rpuZwRn0Rd/C0Zrrn+m69UauK71ulkt2EbU7HUtrFzxF9BXLpzzZLtusDZuUCvgHvMdO9Y7xsIwAAAABJRU5ErkJggg==);background-size:auto 21px;background-position:top 8px right 12px;background-repeat:no-repeat;margin-bottom:10px;padding-left:14px}.text{overflow-y:scroll;height:100%}.listText{width:100%;position:relative;float:left;font-size:14px;font-weight:600;padding-left:10px;padding-right:10px;margin-bottom:2px;color:var(--primary);display:flex;flex-direction:row;align-items:center;gap:5px}.listText a{color:var(--primary);display:flex;flex-direction:row;align-items:center}.listText a:hover .preview-item-icon{text-decoration:underline}.listText .icon-clear{margin-top:2px}.listText .icon-clear:hover{color:var(--background)}::-webkit-scrollbar-thumb{background-color:var(--background)!important}.clickable{color:var(--primary);cursor:pointer}.clickable:hover,.clickable:focus{filter:brightness(90%)}.clickable:active{color:var(--icon);transform:translateY(1px)}.clickable .preview-name:hover,.clickable .preview-name:focus{text-decoration:underline}.clickable .preview-name:active{text-decoration:underline}.preview-name{white-space:pre}.preview-item-icon{margin-left:7px;font-family:zac!important}.preview-more-results{margin-top:5px}.spinner-container{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.spinner-container .spinner{display:inline-block;width:32px;height:32px;border-radius:50%;background:transparent;border-top:5px solid var(--tableText);border-right:5px solid var(--tableText);border-bottom:5px solid transparent;border-left:5px solid transparent;animation:loading .5s infinite linear;opacity:.7}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] }); }
|
|
103
103
|
}
|
|
104
104
|
export { PreviewListComponent };
|
|
105
105
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreviewListComponent, decorators: [{
|
|
106
106
|
type: Component,
|
|
107
|
-
args: [{ selector: 'lib-preview-list', template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item }}</span>\n <a *ngIf=\"item.href\" [href]=\"'./' + item.href\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0}.listBox{background-color:var(--stroke);padding:10px;border-radius:
|
|
107
|
+
args: [{ selector: 'lib-preview-list', template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item }}</span>\n <a *ngIf=\"item.href\" [href]=\"'./' + item.href\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0}.listBox{background-color:var(--stroke);padding:10px;border-radius:var(--inputBorderRadius);height:100%;min-height:60px}.listBox input{height:40px;border-radius:27px;font-size:14px;font-weight:600;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAuCAYAAABTTPsKAAAD4klEQVRYhc2ZyYsUSRSHvypLbRfGDfWgzngYFRR3EUQPOm5oOyMuKIoo4kk9iAriQfAPcAMvKuJBPAyiXmbAwWVUFGEYmMHlIi24ogd3cW3trpYnv4CooLKrKiuzqn5QUBmZEe/Lly9fvIjMPH36CmA4cABYAHSnsdQK/AVsBR4Y8E/ATaA30KXBYJ3agffA+Cywt8FhEZsx7jUPf/bC4BNwuc5woWYBPdTWmgti9hSwrv6MBToOrFVD92xwsqOOYFEqYAqBGzGOC5gshv07aANuNZCnM8A4IOcacsEFdjyp9lzly0KipZEBA7VYSKwEfpf7nTqU4uqpHkWYVlkInAR+ATZ4AZ4HmoErdQKeCVz0eGymO2asrpawE38D0xXHdjcfFM93aww7Avgf6CUPWyK4Dsw2cJfW7A4WA4/1P6NHcgHoV0PYfrLpwqFdTIv1vyAPvwXmyLMd8voQ4A+gaw1gu8rWENl2T3mO2AiBTfeARYphFB7TgMM1AD4sWy7V5sVyz78oBDZd0wvoZHe7HtiWIuw22fBntQ1iKVAxYFRw7PE8nVEZ2pwCbLPGdimsXbaPF7vYZYmi54A/gfneY7JSdCpwOyHYscC/QJOOLSOcA36NKg+iPIw6rNBM2Ka2bnqLBycAO1hjdfNgW2QzspbpDNj0EZintzSv6wdojdVUom9natIYAzRmXjbmyWakSgGbnigsnJdzepQngqmzXGXUd6wXam2y8aTUGOUAm/4DVnvHZmgpsDsG8G719SvF1bJRUuUCm84Au7zMkfWMl6sl6uPs5jXmmXIH6CxLRMkqu+Weh94BPwJvSvTrAzwCftCxhcFpq8AqMR4W8OXIFqk/AxPUv0lJfl/Q114gP4yGAT092BtxFrxxgL8Ay4D7OrYa4LciwKOBNRHrxKye0pdKjVcSw74eBSuV4RHXtUW0W9+HcQzHBUaVlFPUflxU+4eI9pKqBriUDqm+db9nSQwaJ4bLldUDOzyn9G904KHAxKRtpBkSpsQ3ZNL0sG1EW9r6quNw2R5Lab90vbX67ZXUS5cUcJTnZmjqtjQ2KAlD1QB/9v4PVAETbgnk5OWeSYQDVQKf9WayjKbnO9oxT03VAO8HrgZbAubpS1pU2tLHKrh/VOtGTdMVqdqQmAvs1Eo37z32LarGWrXXMAV4WW9gBGlL8sn2DS1YRo3U57TNScUvCWYJAxsDHPXarKy00vMgcD6pD5ZJ5mELkU3AQuC15+2stk/7JmEkjYnDlu+jtL/rpuZwRn0Rd/C0Zrrn+m69UauK71ulkt2EbU7HUtrFzxF9BXLpzzZLtusDZuUCvgHvMdO9Y7xsIwAAAABJRU5ErkJggg==);background-size:auto 21px;background-position:top 8px right 12px;background-repeat:no-repeat;margin-bottom:10px;padding-left:14px}.text{overflow-y:scroll;height:100%}.listText{width:100%;position:relative;float:left;font-size:14px;font-weight:600;padding-left:10px;padding-right:10px;margin-bottom:2px;color:var(--primary);display:flex;flex-direction:row;align-items:center;gap:5px}.listText a{color:var(--primary);display:flex;flex-direction:row;align-items:center}.listText a:hover .preview-item-icon{text-decoration:underline}.listText .icon-clear{margin-top:2px}.listText .icon-clear:hover{color:var(--background)}::-webkit-scrollbar-thumb{background-color:var(--background)!important}.clickable{color:var(--primary);cursor:pointer}.clickable:hover,.clickable:focus{filter:brightness(90%)}.clickable:active{color:var(--icon);transform:translateY(1px)}.clickable .preview-name:hover,.clickable .preview-name:focus{text-decoration:underline}.clickable .preview-name:active{text-decoration:underline}.preview-name{white-space:pre}.preview-item-icon{margin-left:7px;font-family:zac!important}.preview-more-results{margin-top:5px}.spinner-container{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.spinner-container .spinner{display:inline-block;width:32px;height:32px;border-radius:50%;background:transparent;border-top:5px solid var(--tableText);border-right:5px solid var(--tableText);border-bottom:5px solid transparent;border-left:5px solid transparent;animation:loading .5s infinite linear;opacity:.7}\n"] }]
|
|
108
108
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { label: [{
|
|
109
109
|
type: Input
|
|
110
110
|
}], clickable: [{
|
|
@@ -192,7 +192,7 @@ class EdgeRouterFormComponent extends ProjectableForm {
|
|
|
192
192
|
provide: MatDialogRef,
|
|
193
193
|
useValue: {}
|
|
194
194
|
}
|
|
195
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router: ' : 'Create New Edge Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Edge Router attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Edge Routers to form a group of Edge Routers.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"edgeRouterRoleAttributes\"\n [placeholder]=\"'Add attributes to group Edge Routers'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'TUNNELER'\"\n [title2]=\"'TRAVERSAL'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">TUNNELER ENABLED</div>\n <div\n (click)=\"toggleTunnelerEnabled()\"\n [ngClass]=\"{ on: formData.isTunnelerEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isTunnelerEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isTunnelerEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentities.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:15px}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right 10px;background-repeat:no-repeat;background-size:18px;padding-right:28px}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:10px;padding-right:10px;border-color:var(--inputBorder);border-style:solid;border-width:2px;border-bottom-right-radius:7px;border-bottom-left-radius:7px;border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -2px 11px 0 var(--boxShadow);padding-bottom:15px;padding-top:15px}.svc-test-result .close.icon-close{top:10px;right:10px;font-size:18px;height:18px;width:18px;line-height:18px}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:2px}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:1px}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: i7.FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "showHeader", "headerActions"], outputs: ["actionRequested"] }, { kind: "component", type: i8.PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: i9.LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: i10.FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: i11.JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: i12.TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: i13.QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: i14.CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
195
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router: ' : 'Create New Edge Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Edge Router attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Edge Routers to form a group of Edge Routers.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"edgeRouterRoleAttributes\"\n [placeholder]=\"'Add attributes to group Edge Routers'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'TUNNELER'\"\n [title2]=\"'TRAVERSAL'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">TUNNELER ENABLED</div>\n <div\n (click)=\"toggleTunnelerEnabled()\"\n [ngClass]=\"{ on: formData.isTunnelerEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isTunnelerEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isTunnelerEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentities.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:15px}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right 10px;background-repeat:no-repeat;background-size:18px;padding-right:28px}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:10px;padding-right:10px;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -2px 11px 0 var(--boxShadow);padding-bottom:15px;padding-top:15px}.svc-test-result .close.icon-close{top:10px;right:10px;font-size:18px;height:18px;width:18px;line-height:18px}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:1px}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: i7.FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "showHeader", "headerActions"], outputs: ["actionRequested"] }, { kind: "component", type: i8.PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: i9.LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: i10.FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: i11.JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: i12.TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: i13.QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: i14.CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
196
196
|
}
|
|
197
197
|
export { EdgeRouterFormComponent };
|
|
198
198
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EdgeRouterFormComponent, decorators: [{
|
|
@@ -202,7 +202,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
202
202
|
provide: MatDialogRef,
|
|
203
203
|
useValue: {}
|
|
204
204
|
}
|
|
205
|
-
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router: ' : 'Create New Edge Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Edge Router attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Edge Routers to form a group of Edge Routers.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"edgeRouterRoleAttributes\"\n [placeholder]=\"'Add attributes to group Edge Routers'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'TUNNELER'\"\n [title2]=\"'TRAVERSAL'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">TUNNELER ENABLED</div>\n <div\n (click)=\"toggleTunnelerEnabled()\"\n [ngClass]=\"{ on: formData.isTunnelerEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isTunnelerEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isTunnelerEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentities.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:15px}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right 10px;background-repeat:no-repeat;background-size:18px;padding-right:28px}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:10px;padding-right:10px;border-color:var(--inputBorder);border-style:solid;border-width:2px;border-bottom-right-radius:7px;border-bottom-left-radius:7px;border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -2px 11px 0 var(--boxShadow);padding-bottom:15px;padding-top:15px}.svc-test-result .close.icon-close{top:10px;right:10px;font-size:18px;height:18px;width:18px;line-height:18px}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:2px}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:1px}\n"] }]
|
|
205
|
+
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router: ' : 'Create New Edge Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Edge Router attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Edge Routers to form a group of Edge Routers.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"edgeRouterRoleAttributes\"\n [placeholder]=\"'Add attributes to group Edge Routers'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'TUNNELER'\"\n [title2]=\"'TRAVERSAL'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">TUNNELER ENABLED</div>\n <div\n (click)=\"toggleTunnelerEnabled()\"\n [ngClass]=\"{ on: formData.isTunnelerEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isTunnelerEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isTunnelerEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentities.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:15px}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right 10px;background-repeat:no-repeat;background-size:18px;padding-right:28px}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:10px;padding-right:10px;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -2px 11px 0 var(--boxShadow);padding-bottom:15px;padding-top:15px}.svc-test-result .close.icon-close{top:10px;right:10px;font-size:18px;height:18px;width:18px;line-height:18px}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:1px}\n"] }]
|
|
206
206
|
}], ctorParameters: function () { return [{ type: i15.SettingsService, decorators: [{
|
|
207
207
|
type: Inject,
|
|
208
208
|
args: [SETTINGS_SERVICE]
|
|
@@ -37,12 +37,12 @@ class FormFieldContainerComponent {
|
|
|
37
37
|
this.actionRequested.emit(action);
|
|
38
38
|
}
|
|
39
39
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
40
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: { title: "title", title2: "title2", layout: "layout", helpText: "helpText", helpText2: "helpText2", label: "label", count: "count", action: "action", actionLabel: "actionLabel", class: "class", contentStyle: "contentStyle", showHeader: "showHeader", headerActions: "headerActions" }, outputs: { actionRequested: "actionRequested" }, ngImport: i0, template: "<div class=\"form-field-container\" class=\"{{class}}\" [ngClass]=\"{'form-field-row': layout === 'row'}\">\n <div class=\"form-field-header\" *ngIf=\"showHeader\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">{{title}}</span>\n <div\n *ngIf=\"helpText\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText}}\"\n matTooltipPosition=\"above\"\n ></div>\n </div>\n <span class=\"form-field-label\" *ngIf=\"label\">{{label}}</span>\n <span class=\"form-field-count\" *ngIf=\"count || count === 0\">{{count}}</span>\n <div class=\"form-field-title-container title-container-2\" *ngIf=\"title2\">\n <span class=\"form-field-title title2\">{{title2}}</span>\n <div\n *ngIf=\"helpText2\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText2}}\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n </div>\n <div class=\"form-field-content\" [style]=\"contentStyle\">\n <ng-content></ng-content>\n </div>\n <lib-multi-action-button\n *ngIf=\"headerActions\"\n [actions]=\"headerActions\"\n (actionRequested)=\"actionClicked($event)\"\n ></lib-multi-action-button>\n</div>\n", styles: [":host{height:-moz-fit-content;height:fit-content;display:flex;width:100%;flex-direction:column;position:relative}.form-field-container{display:flex;flex-direction:column;background-color:var(--navigation);padding:15px;border-radius:10px;gap:
|
|
40
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: { title: "title", title2: "title2", layout: "layout", helpText: "helpText", helpText2: "helpText2", label: "label", count: "count", action: "action", actionLabel: "actionLabel", class: "class", contentStyle: "contentStyle", showHeader: "showHeader", headerActions: "headerActions" }, outputs: { actionRequested: "actionRequested" }, ngImport: i0, template: "<div class=\"form-field-container\" class=\"{{class}}\" [ngClass]=\"{'form-field-row': layout === 'row'}\">\n <div class=\"form-field-header\" *ngIf=\"showHeader\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">{{title}}</span>\n <div\n *ngIf=\"helpText\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText}}\"\n matTooltipPosition=\"above\"\n ></div>\n </div>\n <span class=\"form-field-label\" *ngIf=\"label\">{{label}}</span>\n <span class=\"form-field-count\" *ngIf=\"count || count === 0\">{{count}}</span>\n <div class=\"form-field-title-container title-container-2\" *ngIf=\"title2\">\n <span class=\"form-field-title title2\">{{title2}}</span>\n <div\n *ngIf=\"helpText2\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText2}}\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n </div>\n <div class=\"form-field-content\" [style]=\"contentStyle\">\n <ng-content></ng-content>\n </div>\n <lib-multi-action-button\n *ngIf=\"headerActions\"\n [actions]=\"headerActions\"\n (actionRequested)=\"actionClicked($event)\"\n ></lib-multi-action-button>\n</div>\n", styles: [":host{height:-moz-fit-content;height:fit-content;display:flex;width:100%;flex-direction:column;position:relative}.form-field-container{display:flex;flex-direction:column;background-color:var(--navigation);padding:15px;border-radius:10px;gap:var(--marginMedium);height:100%;position:relative}.form-field-container.hide-overflow .form-field-content{overflow:hidden}.form-field-container.no-gap .form-field-content{gap:0}.form-field-container .form-field-content{display:flex;flex-direction:column;width:100%;gap:15px;z-index:99999;position:relative;border-radius:var(--inputBorderRadius)}.form-field-container.form-field-row .form-field-content{flex-direction:row;width:100%}.form-field-container .form-field-title-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;flex:1 1 auto;width:100%}.form-field-container .form-field-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;height:14px;z-index:9999}.form-field-container .form-field-title{display:flex;align-items:center;font-size:14px;font-weight:600;color:var(--tableText);text-transform:uppercase;height:14px}.form-field-container .form-field-label{font-size:14px;font-weight:600;color:var(--placeholder)}.form-field-container .form-field-count{background-color:#4c5566;color:var(--white);display:flex;align-items:center;font-weight:700;border-radius:14px;height:24px;padding-left:13px;padding-right:13px;font-size:13px}.form-field-container .form-field-input::placeholder{font-weight:600}.form-field-container .save-button{text-wrap:nowrap;height:25px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i3.MultiActionButtonComponent, selector: "lib-multi-action-button", inputs: ["actions"], outputs: ["actionRequested"] }] }); }
|
|
41
41
|
}
|
|
42
42
|
export { FormFieldContainerComponent };
|
|
43
43
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFieldContainerComponent, decorators: [{
|
|
44
44
|
type: Component,
|
|
45
|
-
args: [{ selector: 'lib-form-field-container', template: "<div class=\"form-field-container\" class=\"{{class}}\" [ngClass]=\"{'form-field-row': layout === 'row'}\">\n <div class=\"form-field-header\" *ngIf=\"showHeader\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">{{title}}</span>\n <div\n *ngIf=\"helpText\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText}}\"\n matTooltipPosition=\"above\"\n ></div>\n </div>\n <span class=\"form-field-label\" *ngIf=\"label\">{{label}}</span>\n <span class=\"form-field-count\" *ngIf=\"count || count === 0\">{{count}}</span>\n <div class=\"form-field-title-container title-container-2\" *ngIf=\"title2\">\n <span class=\"form-field-title title2\">{{title2}}</span>\n <div\n *ngIf=\"helpText2\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText2}}\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n </div>\n <div class=\"form-field-content\" [style]=\"contentStyle\">\n <ng-content></ng-content>\n </div>\n <lib-multi-action-button\n *ngIf=\"headerActions\"\n [actions]=\"headerActions\"\n (actionRequested)=\"actionClicked($event)\"\n ></lib-multi-action-button>\n</div>\n", styles: [":host{height:-moz-fit-content;height:fit-content;display:flex;width:100%;flex-direction:column;position:relative}.form-field-container{display:flex;flex-direction:column;background-color:var(--navigation);padding:15px;border-radius:10px;gap:
|
|
45
|
+
args: [{ selector: 'lib-form-field-container', template: "<div class=\"form-field-container\" class=\"{{class}}\" [ngClass]=\"{'form-field-row': layout === 'row'}\">\n <div class=\"form-field-header\" *ngIf=\"showHeader\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">{{title}}</span>\n <div\n *ngIf=\"helpText\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText}}\"\n matTooltipPosition=\"above\"\n ></div>\n </div>\n <span class=\"form-field-label\" *ngIf=\"label\">{{label}}</span>\n <span class=\"form-field-count\" *ngIf=\"count || count === 0\">{{count}}</span>\n <div class=\"form-field-title-container title-container-2\" *ngIf=\"title2\">\n <span class=\"form-field-title title2\">{{title2}}</span>\n <div\n *ngIf=\"helpText2\"\n class=\"form-field-info infoicon\"\n matTooltip=\"{{helpText2}}\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n </div>\n <div class=\"form-field-content\" [style]=\"contentStyle\">\n <ng-content></ng-content>\n </div>\n <lib-multi-action-button\n *ngIf=\"headerActions\"\n [actions]=\"headerActions\"\n (actionRequested)=\"actionClicked($event)\"\n ></lib-multi-action-button>\n</div>\n", styles: [":host{height:-moz-fit-content;height:fit-content;display:flex;width:100%;flex-direction:column;position:relative}.form-field-container{display:flex;flex-direction:column;background-color:var(--navigation);padding:15px;border-radius:10px;gap:var(--marginMedium);height:100%;position:relative}.form-field-container.hide-overflow .form-field-content{overflow:hidden}.form-field-container.no-gap .form-field-content{gap:0}.form-field-container .form-field-content{display:flex;flex-direction:column;width:100%;gap:15px;z-index:99999;position:relative;border-radius:var(--inputBorderRadius)}.form-field-container.form-field-row .form-field-content{flex-direction:row;width:100%}.form-field-container .form-field-title-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;flex:1 1 auto;width:100%}.form-field-container .form-field-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;height:14px;z-index:9999}.form-field-container .form-field-title{display:flex;align-items:center;font-size:14px;font-weight:600;color:var(--tableText);text-transform:uppercase;height:14px}.form-field-container .form-field-label{font-size:14px;font-weight:600;color:var(--placeholder)}.form-field-container .form-field-count{background-color:#4c5566;color:var(--white);display:flex;align-items:center;font-weight:700;border-radius:14px;height:24px;padding-left:13px;padding-right:13px;font-size:13px}.form-field-container .form-field-input::placeholder{font-weight:600}.form-field-container .save-button{text-wrap:nowrap;height:25px}\n"] }]
|
|
46
46
|
}], ctorParameters: function () { return []; }, propDecorators: { title: [{
|
|
47
47
|
type: Input
|
|
48
48
|
}], title2: [{
|