@dbg-riskit/angular-view
Version:
850 lines (839 loc) • 82.5 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, ChangeDetectionStrategy, Input, Directive, Inject, Pipe, Injectable, Optional, ContentChildren, NgModule } from '@angular/core';
import * as i1 from '@angular/material/card';
import { MatCardModule } from '@angular/material/card';
import * as i4 from '@angular/material/progress-spinner';
import { MatProgressSpinnerModule, MatSpinner } from '@angular/material/progress-spinner';
import * as i1$1 from '@angular/common';
import { CommonModule, DecimalPipe, DatePipe } from '@angular/common';
import { Subject, BehaviorSubject, of } from 'rxjs';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatBadgeModule } from '@angular/material/badge';
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
import * as i5 from '@angular/material/button';
import { MatButtonModule } from '@angular/material/button';
import { MatButtonToggleModule } from '@angular/material/button-toggle';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatChipsModule } from '@angular/material/chips';
import { MatDatepickerModule } from '@angular/material/datepicker';
import * as i1$2 from '@angular/material/dialog';
import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
import { MatDividerModule } from '@angular/material/divider';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatGridListModule } from '@angular/material/grid-list';
import * as i2 from '@angular/material/icon';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatMenuModule } from '@angular/material/menu';
import { MatPaginatorModule } from '@angular/material/paginator';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatRadioModule } from '@angular/material/radio';
import { MatSelectModule } from '@angular/material/select';
import * as i6 from '@angular/material/sidenav';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatSliderModule } from '@angular/material/slider';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatSortModule } from '@angular/material/sort';
import { MatStepperModule } from '@angular/material/stepper';
import { MatTableModule } from '@angular/material/table';
import { MatTabsModule } from '@angular/material/tabs';
import * as i2$1 from '@angular/material/toolbar';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatTreeModule } from '@angular/material/tree';
import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
import * as i1$4 from '@angular/router';
import { NavigationEnd, RouterLink, RouterLinkWithHref, RouterModule } from '@angular/router';
import { AUTH_PROVIDER, MAIN_LOGO, DATE_FORMAT } from '@dbg-riskit/angular-common';
import { LoggingModule } from '@dbg-riskit/angular-logging';
import { first, filter, takeUntil } from 'rxjs/operators';
import * as i1$3 from '@dbg-riskit/common';
import { CONTENT_TYPE } from '@dbg-riskit/common';
const RISK_ERROR_SELECTOR = 'risk-error';
const RISK_GOOD_SELECTOR = 'risk-good';
const RISK_INFO_SELECTOR = 'risk-info';
const RISK_MESSAGE_SELECTOR = 'risk-message';
const RISK_WARN_SELECTOR = 'risk-warn';
const RISK_INITIAL_LOAD_SELECTOR = 'risk-initial-load';
const RISK_NO_DATA_SELECTOR = 'risk-no-data';
const RISK_UPDATE_FAILED_SELECTOR = 'risk-update-failed';
const COMPONENT_SELECTOR = RISK_ERROR_SELECTOR + ', ' + RISK_GOOD_SELECTOR + ', ' + RISK_INFO_SELECTOR + ', '
+ RISK_MESSAGE_SELECTOR + ', ' + RISK_WARN_SELECTOR + ', '
+ RISK_INITIAL_LOAD_SELECTOR + ', ' + RISK_NO_DATA_SELECTOR + ', '
+ RISK_UPDATE_FAILED_SELECTOR;
const COLOR_EQUALS = 'color === "';
class MessageComponent {
constructor(elementRef) {
const tagName = elementRef.nativeElement.tagName.toLowerCase();
this._initialLoad = tagName === RISK_INITIAL_LOAD_SELECTOR;
this._noData = tagName === RISK_NO_DATA_SELECTOR;
this._updateError = tagName === RISK_UPDATE_FAILED_SELECTOR;
switch (tagName) {
case RISK_INFO_SELECTOR:
case RISK_NO_DATA_SELECTOR:
this._color = RISK_INFO_SELECTOR;
break;
case RISK_WARN_SELECTOR:
case RISK_INITIAL_LOAD_SELECTOR:
this._color = RISK_WARN_SELECTOR;
break;
case RISK_ERROR_SELECTOR:
case RISK_UPDATE_FAILED_SELECTOR:
this._color = RISK_ERROR_SELECTOR;
break;
case RISK_GOOD_SELECTOR:
this._color = RISK_GOOD_SELECTOR;
break;
default:
this._color = null;
}
}
get color() {
return this._color;
}
get initialLoad() {
return this._initialLoad;
}
get noData() {
return this._noData;
}
get updateError() {
return this._updateError;
}
}
MessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: MessageComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
MessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: MessageComponent, selector: "risk-error, risk-good, risk-info, risk-message, risk-warn, risk-initial-load, risk-no-data, risk-update-failed", inputs: { message: "message" }, host: { properties: { "class.risk-message": "true", "class.risk-message-error": "color === \"risk-error\"", "class.risk-message-warn": "color === \"risk-warn\"", "class.risk-message-good": "color === \"risk-good\"", "class.risk-message-info": "color === \"risk-info\"", "class.risk-message-initial-load": "initialLoad", "class.risk-message-no-data": "noData", "class.risk-message-update-error": "updateError" } }, ngImport: i0, template: "<mat-card [ngClass]=\"color\">\n <ng-template [ngIf]=\"initialLoad\">\n <mat-spinner [diameter]=\"50\"></mat-spinner>\n Loading...\n </ng-template>\n <ng-template [ngIf]=\"noData\">No data available.</ng-template>\n <ng-template [ngIf]=\"updateError\">Failed to update the data: {{message}}.</ng-template>\n <ng-template [ngIf]=\"!initialLoad && !noData && !updateError\">{{message}}</ng-template>\n <ng-content></ng-content>\n</mat-card>", styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n", ":host(.risk-message-initial-load) .mat-card{display:-webkit-flex;display:flex;line-height:50px;padding:15px 24px}:host(.risk-message-initial-load) .mat-card .mat-spinner{margin-right:15px}\n"], components: [{ type: i1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], directives: [{ type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: MessageComponent, decorators: [{
type: Component,
args: [{ selector: COMPONENT_SELECTOR, host: {
'[class.risk-message]': 'true',
'[class.risk-message-error]': COLOR_EQUALS + RISK_ERROR_SELECTOR + '"',
'[class.risk-message-warn]': COLOR_EQUALS + RISK_WARN_SELECTOR + '"',
'[class.risk-message-good]': COLOR_EQUALS + RISK_GOOD_SELECTOR + '"',
'[class.risk-message-info]': COLOR_EQUALS + RISK_INFO_SELECTOR + '"',
'[class.risk-message-initial-load]': 'initialLoad',
'[class.risk-message-no-data]': 'noData',
'[class.risk-message-update-error]': 'updateError'
}, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<mat-card [ngClass]=\"color\">\n <ng-template [ngIf]=\"initialLoad\">\n <mat-spinner [diameter]=\"50\"></mat-spinner>\n Loading...\n </ng-template>\n <ng-template [ngIf]=\"noData\">No data available.</ng-template>\n <ng-template [ngIf]=\"updateError\">Failed to update the data: {{message}}.</ng-template>\n <ng-template [ngIf]=\"!initialLoad && !noData && !updateError\">{{message}}</ng-template>\n <ng-content></ng-content>\n</mat-card>", styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n", ":host(.risk-message-initial-load) .mat-card{display:-webkit-flex;display:flex;line-height:50px;padding:15px 24px}:host(.risk-message-initial-load) .mat-card .mat-spinner{margin-right:15px}\n"] }]
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { message: [{
type: Input,
args: ['message']
}] } });
class BaseComponent {
constructor() {
this._destroyed = new Subject();
}
ngOnDestroy() {
this._destroyed.next();
this._destroyed.complete();
}
get destroyed() {
return this._destroyed.asObservable();
}
}
BaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: BaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
BaseComponent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.6", type: BaseComponent, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: BaseComponent, decorators: [{
type: Directive
}] });
class FlexComponent {
constructor() {
this.wrapContent = false;
}
}
FlexComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: FlexComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
FlexComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: FlexComponent, selector: "risk-flex", inputs: { wrapContent: "wrapContent" }, host: { properties: { "class.risk-flex": "!wrapContent", "class.risk-flex-wrap": "wrapContent" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n", ":host{display:-webkit-flex;display:flex}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: FlexComponent, decorators: [{
type: Component,
args: [{ selector: 'risk-flex', template: '<ng-content></ng-content>', host: {
'[class.risk-flex]': '!wrapContent',
'[class.risk-flex-wrap]': 'wrapContent'
}, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n", ":host{display:-webkit-flex;display:flex}\n"] }]
}], propDecorators: { wrapContent: [{
type: Input
}] } });
class FlexSpacerComponent {
}
FlexSpacerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: FlexSpacerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
FlexSpacerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: FlexSpacerComponent, selector: "risk-flex-spacer", host: { properties: { "class.risk-flex-spacer": "true" } }, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: FlexSpacerComponent, decorators: [{
type: Component,
args: [{ selector: 'risk-flex-spacer', template: '', host: {
'[class.risk-flex-spacer]': 'true'
}, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n"] }]
}] });
class LoaderComponent {
constructor(dialogRef, data) {
this.dialogRef = dialogRef;
this.data = data;
}
get dialogData() {
return this.data;
}
close() {
this.dialogRef.close();
}
}
LoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: LoaderComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
LoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: LoaderComponent, selector: "ng-component", host: { properties: { "class.risk-loader-dialog": "true" } }, ngImport: i0, template: `
<risk-flex [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<mat-spinner></mat-spinner>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.title" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<h3>{{ dialogData.title }}</h3>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.cancel != null" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<button mat-button color="warn" (click)="dialogData.cancel()">Cancel</button>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
`, isInline: true, styles: ["h3{margin-bottom:0}\n"], components: [{ type: FlexComponent, selector: "risk-flex", inputs: ["wrapContent"] }, { type: FlexSpacerComponent, selector: "risk-flex-spacer" }, { type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: LoaderComponent, decorators: [{
type: Component,
args: [{
template: `
<risk-flex [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<mat-spinner></mat-spinner>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.title" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<h3>{{ dialogData.title }}</h3>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.cancel != null" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<button mat-button color="warn" (click)="dialogData.cancel()">Cancel</button>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
`,
styles: [
`
h3 {
margin-bottom: 0;
}`
],
host: {
'[class.risk-loader-dialog]': 'true'
},
changeDetection: ChangeDetectionStrategy.OnPush,
preserveWhitespaces: false
}]
}], ctorParameters: function () { return [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_DIALOG_DATA]
}] }]; } });
class MessageDialogComponent {
constructor(dialogRef, data) {
this.dialogRef = dialogRef;
this.data = data;
}
get customIcon() {
return this.dialogData.icon;
}
get dialogType() {
return this.dialogData.dialogType || 'info';
}
get buttons() {
return this.dialogData.buttons || [
{
label: 'OK'
}
];
}
get color() {
switch (this.dialogType) {
case 'error':
return 'warn';
case 'warning':
return 'warn';
case 'info':
return 'accent';
case 'question':
return 'accent';
case 'success':
return 'primary';
}
return null;
}
get icon() {
if (this.customIcon) {
return this.customIcon;
}
switch (this.dialogType) {
case 'error':
return 'error';
case 'warning':
return 'warning';
case 'info':
return 'info';
case 'question':
return 'help';
case 'success':
return 'check';
}
return 'info';
}
get dialogData() {
return this.data;
}
close(button) {
this.dialogRef.close(button.value);
}
}
MessageDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: MessageDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
MessageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: MessageDialogComponent, selector: "ng-component", host: { properties: { "class.risk-message-dialog": "true" } }, ngImport: i0, template: "<div class=\"risk-message-dialog-message\">\n <h3 *ngIf=\"dialogData.title\">\n <mat-icon [color]=\"color\">{{ icon }}</mat-icon>\n <strong>{{dialogData.title}}</strong>\n </h3>\n <h3>\n <mat-icon *ngIf=\"!dialogData.title\" [color]=\"color\">{{ icon }}</mat-icon>\n {{dialogData.message}}\n </h3>\n <small *ngIf=\"dialogData.note\">NOTE: {{dialogData.note}}</small>\n</div>\n<a *ngFor=\"let button of buttons\"\n mat-button\n [color]=\"button.primary ? color : null\"\n (click)=\"close(button)\">{{ button.label }}</a>\n", styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n", ".risk-message-dialog-message{padding:10px;margin-bottom:10px}.risk-message-dialog-message h3{margin:0;white-space:pre-line}.risk-message-dialog-message h3 .mat-icon{font-size:40px;float:left;height:40px;width:40px;margin-right:10px;margin-top:-6px}.risk-message-dialog-message small{white-space:pre-line}\n"], components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i5.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab], a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: MessageDialogComponent, decorators: [{
type: Component,
args: [{ host: {
'[class.risk-message-dialog]': 'true'
}, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<div class=\"risk-message-dialog-message\">\n <h3 *ngIf=\"dialogData.title\">\n <mat-icon [color]=\"color\">{{ icon }}</mat-icon>\n <strong>{{dialogData.title}}</strong>\n </h3>\n <h3>\n <mat-icon *ngIf=\"!dialogData.title\" [color]=\"color\">{{ icon }}</mat-icon>\n {{dialogData.message}}\n </h3>\n <small *ngIf=\"dialogData.note\">NOTE: {{dialogData.note}}</small>\n</div>\n<a *ngFor=\"let button of buttons\"\n mat-button\n [color]=\"button.primary ? color : null\"\n (click)=\"close(button)\">{{ button.label }}</a>\n", styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n", ".risk-message-dialog-message{padding:10px;margin-bottom:10px}.risk-message-dialog-message h3{margin:0;white-space:pre-line}.risk-message-dialog-message h3 .mat-icon{font-size:40px;float:left;height:40px;width:40px;margin-right:10px;margin-top:-6px}.risk-message-dialog-message small{white-space:pre-line}\n"] }]
}], ctorParameters: function () { return [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_DIALOG_DATA]
}] }]; } });
class PercentPipe {
constructor(decimalPipe) {
this.decimalPipe = decimalPipe;
}
transform(value, digits) {
const transformedNumber = this.decimalPipe.transform(value, digits);
if (transformedNumber) {
return transformedNumber + '%';
}
return undefined;
}
}
PercentPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: PercentPipe, deps: [{ token: i1$1.DecimalPipe }], target: i0.ɵɵFactoryTarget.Pipe });
PercentPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: PercentPipe, name: "percent" });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: PercentPipe, decorators: [{
type: Pipe,
args: [{
name: 'percent'
}]
}], ctorParameters: function () { return [{ type: i1$1.DecimalPipe }]; } });
class ProgressLoaderComponent {
constructor(dialogRef, data, changeDetector) {
this.dialogRef = dialogRef;
this.data = data;
this.changeDetector = changeDetector;
}
get value() {
if (this.dialogData.value == null || this.dialogData.value < 0) {
return 0;
}
return this.dialogData.value;
}
set value(value) {
this.dialogData.value = value;
this.changeDetector.markForCheck();
}
get total() {
return this.dialogData.total;
}
set total(value) {
this.dialogData.total = value;
this.changeDetector.markForCheck();
}
get dialogData() {
return this.data;
}
get valueFormatter() {
return this.data.valueFormatter || { transform: (data) => data };
}
get mode() {
switch (true) {
case this.total == null:
case this.total != null && this.total <= 0:
case this.value <= 0:
case this.value === this.total:
return 'indeterminate';
default:
return 'determinate';
}
}
close() {
this.dialogRef.close();
}
}
ProgressLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: ProgressLoaderComponent, deps: [{ token: i1$2.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
ProgressLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: ProgressLoaderComponent, selector: "ng-component", host: { properties: { "class.risk-progress-loader-dialog": "true" } }, ngImport: i0, template: `
<risk-flex [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<mat-progress-spinner
[mode]="mode"
[value]="value / (total || 1) * 100">
</mat-progress-spinner>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.title" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<h3>{{ dialogData.title }}</h3>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<h5 *ngIf="total != null && total > 0; else valueOnly">{{ valueFormatter.transform(value) }}
/{{ valueFormatter.transform(total) }}
- {{ value / total * 100 | percent:'.1-1' }}</h5>
<ng-template #valueOnly><h5>{{ valueFormatter.transform(value) }}</h5></ng-template>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.cancel != null" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<button mat-button color="warn" (click)="dialogData.cancel()">Cancel</button>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
`, isInline: true, styles: ["h3{margin-bottom:0}\n"], components: [{ type: FlexComponent, selector: "risk-flex", inputs: ["wrapContent"] }, { type: FlexSpacerComponent, selector: "risk-flex-spacer" }, { type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "percent": PercentPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: ProgressLoaderComponent, decorators: [{
type: Component,
args: [{
template: `
<risk-flex [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<mat-progress-spinner
[mode]="mode"
[value]="value / (total || 1) * 100">
</mat-progress-spinner>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.title" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<h3>{{ dialogData.title }}</h3>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<h5 *ngIf="total != null && total > 0; else valueOnly">{{ valueFormatter.transform(value) }}
/{{ valueFormatter.transform(total) }}
- {{ value / total * 100 | percent:'.1-1' }}</h5>
<ng-template #valueOnly><h5>{{ valueFormatter.transform(value) }}</h5></ng-template>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
<risk-flex *ngIf="dialogData.cancel != null" [wrapContent]="true">
<risk-flex-spacer></risk-flex-spacer>
<button mat-button color="warn" (click)="dialogData.cancel()">Cancel</button>
<risk-flex-spacer></risk-flex-spacer>
</risk-flex>
`,
styles: [
`
h3 {
margin-bottom: 0;
}`
],
host: {
'[class.risk-progress-loader-dialog]': 'true'
},
changeDetection: ChangeDetectionStrategy.OnPush,
preserveWhitespaces: false
}]
}], ctorParameters: function () { return [{ type: i1$2.MatDialogRef }, { type: undefined, decorators: [{
type: Inject,
args: [MAT_DIALOG_DATA]
}] }, { type: i0.ChangeDetectorRef }]; } });
class DialogService {
constructor(dialog) {
this.dialog = dialog;
}
showWarnDialog(message, note) {
return this.showMessageDialog({
dialogType: 'warning',
message,
note
});
}
showWarnQuestionDialog(destroyCallback, destructiveButtonLabel, message, note) {
return this.showMessageDialog({
dialogType: 'warning',
message,
note,
buttons: [
{
label: destructiveButtonLabel,
value: true,
primary: true
},
{
label: 'Cancel',
value: false
}
],
answerCallback(result) {
if (result) {
destroyCallback();
}
}
});
}
showErrorDialog(message, note) {
return this.showMessageDialog({
dialogType: 'error',
message,
note
});
}
showInfoDialog(message, note) {
return this.showMessageDialog({
dialogType: 'info',
message,
note
});
}
showSuccessDialog(message, note) {
return this.showMessageDialog({
dialogType: 'success',
message,
note
});
}
showQuestionDialog(buttons, answerCallback, message, note) {
return this.showMessageDialog({
dialogType: 'question',
message,
note,
buttons,
answerCallback
});
}
showMessageDialog(config) {
return this.showDialog(MessageDialogComponent, {
...config.config,
data: {
dialogType: config.dialogType,
buttons: config.buttons,
title: config.title,
message: config.message,
note: config.note,
icon: config.icon
}
}, config.answerCallback);
}
/* eslint-enable */
showLoaderDialog(data) {
if (typeof data === 'string') {
data = {
title: data
};
}
return this.showDialog(LoaderComponent, {
disableClose: true,
hasBackdrop: true,
data
});
}
/* eslint-enable */
showProgressLoaderDialog(data) {
if (typeof data === 'string') {
data = {
title: data
};
}
return this.showDialog(ProgressLoaderComponent, {
disableClose: true,
hasBackdrop: true,
data
});
}
/* eslint-enable */
showDialog(dialogClass, configOrCallback, callback) {
let config;
if (typeof configOrCallback === 'function') {
callback = configOrCallback;
}
else {
config = configOrCallback;
}
const dialogRef = this.dialog.open(dialogClass, config);
dialogRef.afterClosed().pipe(first()).subscribe((result) => {
if (callback) {
callback(result);
}
});
return dialogRef.componentInstance;
}
}
DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: DialogService, deps: [{ token: i1$2.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: DialogService });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: DialogService, decorators: [{
type: Injectable
}], ctorParameters: function () { return [{ type: i1$2.MatDialog }]; } });
/**
* Class instances emitted [to observers] for each mql notification
*/
class MediaChange {
constructor(mediaQuery = 'all') {
this.mediaQuery = mediaQuery;
}
}
/**
* MediaMonitor configures listeners to mediaQuery changes and publishes an Observable facade to
* convert mediaQuery change callbacks to subscriber notifications. These notifications will be
* performed within the ng Zone to trigger change detections and component updates.
*
* NOTE: both mediaQuery activations and de-activations are announced in notifications
*/
class MatchMedia {
constructor(ngZone, logger) {
this.ngZone = ngZone;
this.logger = logger;
this._registry = new Map();
this._source = new BehaviorSubject(new MediaChange());
this._observable$ = this._source.asObservable();
}
/**
* For the specified mediaQuery?
*/
isActive(mediaQuery) {
if (this._registry.has(mediaQuery)) {
const mql = this._registry.get(mediaQuery);
return mql.matches;
}
return false;
}
/**
* External observers can watch for all (or a specific) mql changes.
* Typically used by the MediaQueryAdaptor; optionally available to components
* who wish to use the MediaMonitor as mediaMonitor$ observable service.
*
* NOTE: if a mediaQuery is not specified, then ALL mediaQuery activations will
* be announced.
*/
observe(mediaQuery) {
this.registerQuery(mediaQuery);
return this._observable$.pipe(filter((change) => {
return mediaQuery ? (change.mediaQuery === mediaQuery) : true;
}));
}
/**
* Based on the BreakPointRegistry provider, register internal listeners for each unique
* mediaQuery. Each listener emits specific MediaChange data to observers
*/
registerQuery(mediaQuery) {
const list = normalizeQuery(mediaQuery);
if (list.length > 0) {
prepareQueryCSS(list, this.logger);
list.forEach((query) => {
let mql = this._registry.get(query);
const onMQLEvent = () => {
this.ngZone.run(() => {
const change = new MediaChange(query);
this._source.next(change);
});
};
if (!mql) {
mql = this._buildMQL(query);
mql.addEventListener('change', onMQLEvent);
this._registry.set(query, mql);
}
if (mql.matches) {
onMQLEvent(); // Announce activate range for initial subscribers
}
});
}
}
/**
* Call window.matchMedia() to build a MediaQueryList; which
* supports 0..n listeners for activation/deactivation
*/
_buildMQL(query) {
const canListen = !!window.matchMedia('all').addEventListener;
return canListen ? window.matchMedia(query) : {
matches: query === 'all' || query === '',
media: query,
addListener: () => undefined,
addEventListener: () => undefined,
removeListener: () => undefined,
removeEventListener: () => undefined,
dispatchEvent: () => false,
onchange: () => undefined
};
}
}
MatchMedia.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: MatchMedia, deps: [{ token: i0.NgZone }, { token: i1$3.Logger }], target: i0.ɵɵFactoryTarget.Injectable });
MatchMedia.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: MatchMedia });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: MatchMedia, decorators: [{
type: Injectable
}], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i1$3.Logger }]; } });
/**
* Private global registry for all dynamically-created, injected style tags
* @see prepare(query)
*/
const ALL_STYLES = {};
/**
* For Webkit engines that only trigger the MediaQueryList Listener
* when there is at least one CSS selector for the respective media query.
*
* @param mediaQueries string[] The mediaQueries used to create a faux CSS selector
*
*/
function prepareQueryCSS(mediaQueries, logger) {
const list = mediaQueries.filter((it) => !ALL_STYLES[it]);
if (list.length > 0) {
const query = list.join(', ');
try {
const style = document.createElement('style');
style.setAttribute('type', CONTENT_TYPE.TEXT_CSS);
// Older IEs
if (!style.styleSheet) {
const cssText = `/*
@angular/flex-layout - workaround for possible browser quirk with mediaQuery listeners
see http://bit.ly/2sd4HMP
*/
@media ${query} {.fx-query-test{ }}`;
style.appendChild(document.createTextNode(cssText));
}
document.getElementsByTagName('head')[0].appendChild(style);
// Store in private global registry
list.forEach((mq) => ALL_STYLES[mq] = style);
}
catch (e) {
logger.error(e);
}
}
}
/**
* Always convert to unique list of queries; for iteration in ::registerQuery()
*/
function normalizeQuery(mediaQuery) {
return (typeof mediaQuery === 'undefined') ? [] :
(typeof mediaQuery === 'string') ? [mediaQuery] : unique(mediaQuery);
}
/**
* Filter duplicate mediaQueries in the list
*/
function unique(list) {
const seen = {};
return list.filter((item) => {
return seen.hasOwnProperty(item) ? false : (seen[item] = true);
});
}
const SMALL_SCREEN_MEDIA_QUERY = (width) => `screen and (max-width:${width}px)`;
class VerticalLayoutDirective {
}
VerticalLayoutDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: VerticalLayoutDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
VerticalLayoutDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.6", type: VerticalLayoutDirective, selector: "risk-layout-vertical", host: { properties: { "class": "\"risk-layout-vertical\"" } }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: VerticalLayoutDirective, decorators: [{
type: Directive,
args: [{
selector: 'risk-layout-vertical',
host: {
'[class]': '"risk-layout-vertical"'
}
}]
}] });
class VerticalLayoutTitleDirective {
}
VerticalLayoutTitleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: VerticalLayoutTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
VerticalLayoutTitleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.6", type: VerticalLayoutTitleDirective, selector: "risk-layout-vertical-title", host: { properties: { "class": "\"risk-layout-vertical-title\"" } }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: VerticalLayoutTitleDirective, decorators: [{
type: Directive,
args: [{
selector: 'risk-layout-vertical-title',
host: {
'[class]': '"risk-layout-vertical-title"'
}
}]
}] });
class VerticalLayoutIconDirective {
}
VerticalLayoutIconDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: VerticalLayoutIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
VerticalLayoutIconDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.6", type: VerticalLayoutIconDirective, selector: "risk-layout-vertical-icon", host: { properties: { "class": "\"risk-layout-vertical-icon\"" } }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: VerticalLayoutIconDirective, decorators: [{
type: Directive,
args: [{
selector: 'risk-layout-vertical-icon',
host: {
'[class]': '"risk-layout-vertical-icon"'
}
}]
}] });
class HorizontalLayoutDirective {
}
HorizontalLayoutDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: HorizontalLayoutDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
HorizontalLayoutDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.6", type: HorizontalLayoutDirective, selector: "risk-layout-horizontal", host: { properties: { "class": "\"mat-toolbar-row mat-toolbar-single-row risk-layout-horizontal\"" } }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: HorizontalLayoutDirective, decorators: [{
type: Directive,
args: [{
selector: 'risk-layout-horizontal',
host: {
'[class]': '"mat-toolbar-row mat-toolbar-single-row risk-layout-horizontal"'
}
}]
}] });
class FooterLayoutDirective {
}
FooterLayoutDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: FooterLayoutDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
FooterLayoutDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.2.6", type: FooterLayoutDirective, selector: "risk-layout-footer", host: { properties: { "class": "\"risk-layout-footer\"" } }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: FooterLayoutDirective, decorators: [{
type: Directive,
args: [{
selector: 'risk-layout-footer',
host: {
'[class]': '"risk-layout-footer"'
}
}]
}] });
class LayoutComponent extends BaseComponent {
constructor(authProvider, mainLogo, changeDetectorRef, matchMedia) {
super();
this.authProvider = authProvider;
this.mainLogo = mainLogo;
this.changeDetectorRef = changeDetectorRef;
this.matchMedia = matchMedia;
this.smallScreenMenuVisible = true;
this.smallScreenWidth = 600;
this.footerVisible = true;
// Detect changes once logged-in/out
if (authProvider) {
authProvider.loggedInStream.pipe(takeUntil(this.destroyed)).subscribe(() => changeDetectorRef.markForCheck());
}
this.observeSmallScreenWidth();
}
ngOnChanges(changes) {
if ('smallScreenWidth' in changes) {
this.observeSmallScreenWidth();
}
}
get authStatus() {
if (!this.authProvider) {
return of(true);
}
return this.authProvider.loggedIn;
}
observeSmallScreenWidth() {
if (this.smallScreenWidthObserver != null) {
this.smallScreenWidthObserver.unsubscribe();
}
this.smallScreenWidthObserver = this.matchMedia.observe(SMALL_SCREEN_MEDIA_QUERY(this.smallScreenWidth)).pipe(takeUntil(this.destroyed)).subscribe(() => this.changeDetectorRef.markForCheck());
}
get mediaSmall() {
return this.matchMedia.isActive(SMALL_SCREEN_MEDIA_QUERY(this.smallScreenWidth));
}
get logo() {
return this.mainLogo;
}
closeSideNav(sidenav) {
this.authStatus.subscribe((res) => {
if (!res) {
sidenav.close();
this.changeDetectorRef.markForCheck();
}
});
}
}
LayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: LayoutComponent, deps: [{ token: AUTH_PROVIDER, optional: true }, { token: MAIN_LOGO }, { token: i0.ChangeDetectorRef }, { token: MatchMedia }], target: i0.ɵɵFactoryTarget.Component });
LayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.6", type: LayoutComponent, selector: "risk-layout", inputs: { smallScreenMenuVisible: "smallScreenMenuVisible", smallScreenWidth: "smallScreenWidth", footerVisible: "footerVisible", toolbarBackgroundColor: "toolbarBackgroundColor", backgroundColor: "backgroundColor" }, host: { properties: { "class.risk-layout": "true" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<mat-toolbar class=\"mat-elevation-z2\"\n [style.backgroundColor]=\"toolbarBackgroundColor\">\n <div class=\"risk-layout-logo\">\n <img [src]=\"logo\" alt=\"Company logo\">\n </div>\n\n <ng-template [ngIf]=\"authStatus | async\">\n <ng-template [ngIf]=\"!mediaSmall\">\n <ng-content select=\"[menu-horizontal], risk-layout-horizontal > *\"></ng-content>\n </ng-template>\n\n <ng-template [ngIf]=\"mediaSmall\">\n <ng-content select=\"[menu-vertical-title], risk-layout-vertical-title > *\"></ng-content>\n\n <risk-flex-spacer></risk-flex-spacer>\n\n <ng-content select=\"[menu-vertical-icon], risk-layout-vertical-icon > *\"></ng-content>\n\n <button mat-icon-button\n (click)=\"sidenav.toggle()\"\n type=\"button\"\n *ngIf=\"smallScreenMenuVisible\">\n <mat-icon>menu</mat-icon>\n </button>\n </ng-template>\n </ng-template>\n</mat-toolbar>\n\n<mat-sidenav-container [class.risk-layout-with-footer]=\"footerVisible\"\n [style.backgroundColor]=\"backgroundColor\">\n <mat-sidenav #sidenav=\"matSidenav\" (click)=\"closeSideNav(sidenav)\">\n <ng-content select=\"[menu-vertical], risk-layout-vertical > *\"></ng-content>\n </mat-sidenav>\n\n <div class=\"risk-layout-content\">\n <ng-content></ng-content>\n </div>\n</mat-sidenav-container>\n\n<div class=\"risk-layout-footer\" *ngIf=\"footerVisible\">\n <ng-content select=\"risk-layout-footer > *\"></ng-content>\n</div>\n", styles: [":host{display:block;padding:0;margin:0}:host>*{vertical-align:bottom}\n", ".risk-layout-logo{margin:0 16px;text-align:center;-webkit-flex:0 0 auto;flex:0 0 auto}@media (max-width: 600px){.risk-layout-logo{margin:0 10px 0 0}}.risk-layout-logo img{height:30px;vertical-align:sub}@media (max-width: 600px){.risk-layout-logo img{height:25px}}.mat-toolbar{border-radius:0!important;position:fixed;z-index:100}@media (max-width: 600px){.mat-toolbar{font-size:17px}.mat-toolbar ::ng-deep h1,.mat-toolbar ::ng-deep h2,.mat-toolbar ::ng-deep h3,.mat-toolbar ::ng-deep h4,.mat-toolbar ::ng-deep h5,.mat-toolbar ::ng-deep h6{font-size:17px}}::ng-deep .risk-layout-horizontal{padding:0!important}::ng-deep .risk-layout-vertical,::ng-deep .risk-layout-vertical-title,::ng-deep .risk-layout-vertical-icon,::ng-deep .risk-layout-footer{display:block}.risk-layout-content{padding:0 50px 50px}@media screen and (max-width: 800px){.risk-layout-content{padding:0 10px}}.mat-sidenav-container{padding-top:69px}@media (max-width: 600px){.mat-sidenav-container{padding-top:61px}}.mat-sidenav{padding-top:77px}@media (max-width: 600px){.mat-sidenav{padding-top:69px}}.risk-layout-with-footer{padding-bottom:30px}.risk-layout-footer{position:fixed;right:0;bottom:0;left:0;overflow:hidden;display:-webkit-flex;display:flex;padding:0 .5rem;height:30px;line-height:32px;font-size:.7em;z-index:2}\n"], components: [{ type: i2$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { type: FlexSpacerComponent, selector: "risk-flex-spacer" }, { type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i6.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { type: i6.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i1$1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.6", ngImport: i0, type: LayoutComponent, decorators: [{
type: Component,
args: [{ selector: 'risk-layout', host: {
'[class.risk-layout]': 'true'
}, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<mat-toolbar class=\"mat-elevation-z2\"\n [style.backgroundColor]=\"toolbarBackgroundColor\">\n <div class=\"risk-layout-logo\">\n <img [src]=\"logo\" alt=\"Company logo\">\n </div>\n\n <ng-template [ngIf]=\"authStatus | async\">\n <ng-template [ngIf]=\"!mediaSmall\">\n <ng-content select=\"[menu-horizontal], risk-layout-horizontal > *\"></ng-content>\n </ng-template>\n\n <ng-template [ngIf]=