@dereekb/dbx-web 5.0.0 → 5.2.0

package/fesm2020/dereekb-dbx-web.mjs

@@ -70,7 +70,7 @@ class AbstractProgressButtonDirective extends AbstractSubscriptionDirective {
         this._disabled = new BehaviorSubject(false);
         this._buttonId = new BehaviorSubject(undefined);
         this._options = new BehaviorSubject(undefined);
-        this.globalOptions$ = this._buttonId.pipe(map((buttonId) => (buttonId) ? this.globalConfig.find((config) => config.id === buttonId) : undefined));
+        this.globalOptions$ = this._buttonId.pipe(map((buttonId) => (buttonId ? this.globalConfig.find((config) => config.id === buttonId) : undefined)));
         this.options$ = combineLatest([this._options, this.globalOptions$, this._working, this._disabled]).pipe(map(([options, globalConfig, working, disabled]) => {
             let completeOptions;
             if (options || globalConfig) {
@@ -107,7 +107,7 @@ class AbstractProgressButtonDirective extends AbstractSubscriptionDirective {
     }
     get customSpinnerStyle() {
         const customSpinnerColor = this._computedOptions.customSpinnerColor;
-        return (customSpinnerColor) ? { stroke: customSpinnerColor } : undefined;
+        return customSpinnerColor ? { stroke: customSpinnerColor } : undefined;
     }
     get options() {
         return this._computedOptions;
@@ -181,10 +181,10 @@ class DbxSpinnerButtonComponent extends AbstractProgressButtonDirective {
     }
 }
 DbxSpinnerButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSpinnerButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DbxSpinnerButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxSpinnerButtonComponent, selector: "dbx-spinner-button", viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["button"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<button #button mat-button\n  [type]=\"options.type\"\n  [color]=\"options.buttonColor\"\n  [class.working]=\"options.working\"\n  [class.fullWidth]=\"options.fullWidth\"\n  [class.mat-raised-button]=\"options.raised\"\n  [class.mat-stroked-button]=\"options.stroked\"\n  [class.mat-flat-button]=\"options.flat\"\n  [class.mat-fab]=\"options.fab\"\n  [ngClass]=\"options.customClass!\"\n  [ngStyle]=\"options.customStyle!\"\n  [disabled]=\"options.working || options.disabled\">\n\n  <ng-container\n    *ngIf=\"options.buttonIcon\">\n    <mat-icon\n      class=\"mat-button-icon\"\n      [class.is-mat-icon]=\"!options.buttonIcon.fontSet\"\n      [class.working]=\"options.working && !options.disabled\"\n      [ngClass]=\"options.buttonIcon.customClass!\"\n      [fontSet]=\"options.buttonIcon.fontSet!\"\n      [fontIcon]=\"options.buttonIcon.fontIcon!\"\n      [color]=\"options.buttonIcon.color!\"\n      [svgIcon]=\"options.buttonIcon.svgIcon!\"\n      [inline]=\"options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span\n    class=\"button-text\"\n    *ngIf=\"!options.fab\"\n    [class.working]=\"options.working && !options.disabled\">\n      {{ options.text }}\n      <ng-content></ng-content>\n  </span>\n\n  <ng-container\n    *ngIf=\"options.fab && options.icon\">\n    <mat-icon\n      [fontSet]=\"options.icon.fontSet!\"\n      [fontIcon]=\"options.icon.fontIcon!\"\n      [color]=\"options.icon.color!\"\n      [svgIcon]=\"options.icon.svgIcon!\"\n      [inline]=\"options.icon.inline!\">\n        {{ options.icon.fontSet ? '' : options.icon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <mat-spinner class=\"spinner\"\n    *ngIf=\"options.working && !options.disabled\"\n    [diameter]=\"calcSpinnerSize()\"\n    [color]=\"options.spinnerColor!\"\n    [mode]=\"options.mode!\"\n    [value]=\"options.value!\"\n    [ngStyle]=\"customSpinnerStyle!\"\n    [ngClass]=\"{ 'dbx-spinner-custom': customSpinnerStyle! }\"\n    [class.working]=\"options.working && !options.disabled\">\n  </mat-spinner>\n</button>\n", styles: [":host button{outline:none}:host button.working{cursor:not-allowed}:host button ::ng-deep .mat-button-wrapper{display:flex;align-items:center;justify-content:center}:host button.fullWidth{width:100%}:host button .spinner{position:absolute;opacity:0;transition:opacity .3s ease-in-out}:host button .spinner.working{opacity:1}:host button .button-text{opacity:1;transition:opacity .3s ease-in-out}:host button .button-text.working{opacity:0}:host button mat-icon.mat-button-icon{padding-right:5px;transition:opacity .3s ease-in-out}:host button mat-icon.mat-button-icon.is-mat-icon{font-size:18px;position:relative;top:3px}:host button mat-icon.mat-button-icon.working{opacity:0}\n"], components: [{ type: i1.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: i3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+DbxSpinnerButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxSpinnerButtonComponent, selector: "dbx-spinner-button", viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["button"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<button #button mat-button [type]=\"options.type\" [color]=\"options.buttonColor\" [class.working]=\"options.working\" [class.fullWidth]=\"options.fullWidth\" [class.mat-raised-button]=\"options.raised\" [class.mat-stroked-button]=\"options.stroked\" [class.mat-flat-button]=\"options.flat\" [class.mat-fab]=\"options.fab\" [ngClass]=\"options.customClass!\" [ngStyle]=\"options.customStyle!\" [disabled]=\"options.working || options.disabled\">\n  <ng-container *ngIf=\"options.buttonIcon\">\n    <mat-icon class=\"mat-button-icon\" [class.is-mat-icon]=\"!options.buttonIcon.fontSet\" [class.working]=\"options.working && !options.disabled\" [ngClass]=\"options.buttonIcon.customClass!\" [fontSet]=\"options.buttonIcon.fontSet!\" [fontIcon]=\"options.buttonIcon.fontIcon!\" [color]=\"options.buttonIcon.color!\" [svgIcon]=\"options.buttonIcon.svgIcon!\" [inline]=\"options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span class=\"button-text\" *ngIf=\"!options.fab\" [class.working]=\"options.working && !options.disabled\">\n    {{ options.text }}\n    <ng-content></ng-content>\n  </span>\n\n  <ng-container *ngIf=\"options.fab && options.icon\">\n    <mat-icon [fontSet]=\"options.icon.fontSet!\" [fontIcon]=\"options.icon.fontIcon!\" [color]=\"options.icon.color!\" [svgIcon]=\"options.icon.svgIcon!\" [inline]=\"options.icon.inline!\">\n      {{ options.icon.fontSet ? '' : options.icon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <mat-spinner class=\"spinner\" *ngIf=\"options.working && !options.disabled\" [diameter]=\"calcSpinnerSize()\" [color]=\"options.spinnerColor!\" [mode]=\"options.mode!\" [value]=\"options.value!\" [ngStyle]=\"customSpinnerStyle!\" [ngClass]=\"{ 'dbx-spinner-custom': customSpinnerStyle! }\" [class.working]=\"options.working && !options.disabled\"></mat-spinner>\n</button>\n", styles: [":host button{outline:none}:host button.working{cursor:not-allowed}:host button ::ng-deep .mat-button-wrapper{display:flex;align-items:center;justify-content:center}:host button.fullWidth{width:100%}:host button .spinner{position:absolute;opacity:0;transition:opacity .3s ease-in-out}:host button .spinner.working{opacity:1}:host button .button-text{opacity:1;transition:opacity .3s ease-in-out}:host button .button-text.working{opacity:0}:host button mat-icon.mat-button-icon{padding-right:5px;transition:opacity .3s ease-in-out}:host button mat-icon.mat-button-icon.is-mat-icon{font-size:18px;position:relative;top:3px}:host button mat-icon.mat-button-icon.working{opacity:0}\n"], components: [{ type: i1.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: i3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSpinnerButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dbx-spinner-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #button mat-button\n  [type]=\"options.type\"\n  [color]=\"options.buttonColor\"\n  [class.working]=\"options.working\"\n  [class.fullWidth]=\"options.fullWidth\"\n  [class.mat-raised-button]=\"options.raised\"\n  [class.mat-stroked-button]=\"options.stroked\"\n  [class.mat-flat-button]=\"options.flat\"\n  [class.mat-fab]=\"options.fab\"\n  [ngClass]=\"options.customClass!\"\n  [ngStyle]=\"options.customStyle!\"\n  [disabled]=\"options.working || options.disabled\">\n\n  <ng-container\n    *ngIf=\"options.buttonIcon\">\n    <mat-icon\n      class=\"mat-button-icon\"\n      [class.is-mat-icon]=\"!options.buttonIcon.fontSet\"\n      [class.working]=\"options.working && !options.disabled\"\n      [ngClass]=\"options.buttonIcon.customClass!\"\n      [fontSet]=\"options.buttonIcon.fontSet!\"\n      [fontIcon]=\"options.buttonIcon.fontIcon!\"\n      [color]=\"options.buttonIcon.color!\"\n      [svgIcon]=\"options.buttonIcon.svgIcon!\"\n      [inline]=\"options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span\n    class=\"button-text\"\n    *ngIf=\"!options.fab\"\n    [class.working]=\"options.working && !options.disabled\">\n      {{ options.text }}\n      <ng-content></ng-content>\n  </span>\n\n  <ng-container\n    *ngIf=\"options.fab && options.icon\">\n    <mat-icon\n      [fontSet]=\"options.icon.fontSet!\"\n      [fontIcon]=\"options.icon.fontIcon!\"\n      [color]=\"options.icon.color!\"\n      [svgIcon]=\"options.icon.svgIcon!\"\n      [inline]=\"options.icon.inline!\">\n        {{ options.icon.fontSet ? '' : options.icon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <mat-spinner class=\"spinner\"\n    *ngIf=\"options.working && !options.disabled\"\n    [diameter]=\"calcSpinnerSize()\"\n    [color]=\"options.spinnerColor!\"\n    [mode]=\"options.mode!\"\n    [value]=\"options.value!\"\n    [ngStyle]=\"customSpinnerStyle!\"\n    [ngClass]=\"{ 'dbx-spinner-custom': customSpinnerStyle! }\"\n    [class.working]=\"options.working && !options.disabled\">\n  </mat-spinner>\n</button>\n", styles: [":host button{outline:none}:host button.working{cursor:not-allowed}:host button ::ng-deep .mat-button-wrapper{display:flex;align-items:center;justify-content:center}:host button.fullWidth{width:100%}:host button .spinner{position:absolute;opacity:0;transition:opacity .3s ease-in-out}:host button .spinner.working{opacity:1}:host button .button-text{opacity:1;transition:opacity .3s ease-in-out}:host button .button-text.working{opacity:0}:host button mat-icon.mat-button-icon{padding-right:5px;transition:opacity .3s ease-in-out}:host button mat-icon.mat-button-icon.is-mat-icon{font-size:18px;position:relative;top:3px}:host button mat-icon.mat-button-icon.working{opacity:0}\n"] }]
+            args: [{ selector: 'dbx-spinner-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #button mat-button [type]=\"options.type\" [color]=\"options.buttonColor\" [class.working]=\"options.working\" [class.fullWidth]=\"options.fullWidth\" [class.mat-raised-button]=\"options.raised\" [class.mat-stroked-button]=\"options.stroked\" [class.mat-flat-button]=\"options.flat\" [class.mat-fab]=\"options.fab\" [ngClass]=\"options.customClass!\" [ngStyle]=\"options.customStyle!\" [disabled]=\"options.working || options.disabled\">\n  <ng-container *ngIf=\"options.buttonIcon\">\n    <mat-icon class=\"mat-button-icon\" [class.is-mat-icon]=\"!options.buttonIcon.fontSet\" [class.working]=\"options.working && !options.disabled\" [ngClass]=\"options.buttonIcon.customClass!\" [fontSet]=\"options.buttonIcon.fontSet!\" [fontIcon]=\"options.buttonIcon.fontIcon!\" [color]=\"options.buttonIcon.color!\" [svgIcon]=\"options.buttonIcon.svgIcon!\" [inline]=\"options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span class=\"button-text\" *ngIf=\"!options.fab\" [class.working]=\"options.working && !options.disabled\">\n    {{ options.text }}\n    <ng-content></ng-content>\n  </span>\n\n  <ng-container *ngIf=\"options.fab && options.icon\">\n    <mat-icon [fontSet]=\"options.icon.fontSet!\" [fontIcon]=\"options.icon.fontIcon!\" [color]=\"options.icon.color!\" [svgIcon]=\"options.icon.svgIcon!\" [inline]=\"options.icon.inline!\">\n      {{ options.icon.fontSet ? '' : options.icon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <mat-spinner class=\"spinner\" *ngIf=\"options.working && !options.disabled\" [diameter]=\"calcSpinnerSize()\" [color]=\"options.spinnerColor!\" [mode]=\"options.mode!\" [value]=\"options.value!\" [ngStyle]=\"customSpinnerStyle!\" [ngClass]=\"{ 'dbx-spinner-custom': customSpinnerStyle! }\" [class.working]=\"options.working && !options.disabled\"></mat-spinner>\n</button>\n", styles: [":host button{outline:none}:host button.working{cursor:not-allowed}:host button ::ng-deep .mat-button-wrapper{display:flex;align-items:center;justify-content:center}:host button.fullWidth{width:100%}:host button .spinner{position:absolute;opacity:0;transition:opacity .3s ease-in-out}:host button .spinner.working{opacity:1}:host button .button-text{opacity:1;transition:opacity .3s ease-in-out}:host button .button-text.working{opacity:0}:host button mat-icon.mat-button-icon{padding-right:5px;transition:opacity .3s ease-in-out}:host button mat-icon.mat-button-icon.is-mat-icon{font-size:18px;position:relative;top:3px}:host button mat-icon.mat-button-icon.working{opacity:0}\n"] }]
         }], propDecorators: { buttonRef: [{
                 type: ViewChild,
                 args: ['button', { static: true, read: ElementRef }]
@@ -229,9 +229,11 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
         }
     }
     get btnOptions() {
-        const buttonIcon = (this.icon) ? {
-            fontIcon: this.icon
-        } : undefined;
+        const buttonIcon = this.icon
+            ? {
+                fontIcon: this.icon
+            }
+            : undefined;
         const customStyle = {};
         if (this.customButtonColor) {
             customStyle['background'] = this.customButtonColor;
@@ -246,7 +248,7 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
             active: this.working,
             buttonIcon,
             customStyle,
-            customClass: 'dbx-button ' + ((buttonIcon && !this.text) ? 'dbx-button-no-text' : ''),
+            customClass: 'dbx-button ' + (buttonIcon && !this.text ? 'dbx-button-no-text' : ''),
             // buttonIcon: icon,
             text: this.text ?? '',
             buttonColor: this.color,
@@ -255,7 +257,7 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
             stroked: this.stroked,
             flat: this.flat,
             mode: 'indeterminate',
-            spinnerColor: (this.color === 'primary') ? 'accent' : 'primary',
+            spinnerColor: this.color === 'primary' ? 'accent' : 'primary',
             customSpinnerColor,
             disabled
         };
@@ -305,7 +307,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-spacer, [dbxSpacer]',
                     host: {
-                        'class': 'dbx-spacer'
+                        class: 'dbx-spacer'
                     }
                 }]
         }] });
@@ -338,9 +340,9 @@ class DbxActionSnackbarComponent extends AbstractSubscriptionDirective {
         this._durationTimeout = new Subject();
         this._actionRef = new BehaviorSubject(undefined);
         this.value$ = of(0); // value passed to the action.
-        this.sourceInstance$ = this._actionRef.pipe(filterMaybe(), map(x => x?.sourceInstance));
-        this.complete$ = this.sourceInstance$.pipe(switchMap(x => x.isSuccess$), startWith(false), shareReplay(1));
-        this.loadingStateType$ = this.sourceInstance$.pipe(switchMap(x => x.loadingStateType$), startWith(LoadingStateType.IDLE), shareReplay(1));
+        this.sourceInstance$ = this._actionRef.pipe(filterMaybe(), map((x) => x?.sourceInstance));
+        this.complete$ = this.sourceInstance$.pipe(switchMap((x) => x.isSuccess$), startWith(false), shareReplay(1));
+        this.loadingStateType$ = this.sourceInstance$.pipe(switchMap((x) => x.loadingStateType$), startWith(LoadingStateType.IDLE), shareReplay(1));
         this.snackbarStatusClass$ = this.loadingStateType$.pipe(map((x) => {
             let classes = 'dbx-action-snackbar-';
             switch (x) {
@@ -379,7 +381,9 @@ class DbxActionSnackbarComponent extends AbstractSubscriptionDirective {
     }
     ngOnInit() {
         // Subscribe and close if the duration is up and the action state is idle.
-        this.sub = this._durationTimeout.pipe(switchMap(() => this.loadingStateType$), filter(x => x === LoadingStateType.IDLE)).subscribe(() => {
+        this.sub = this._durationTimeout
+            .pipe(switchMap(() => this.loadingStateType$), filter((x) => x === LoadingStateType.IDLE))
+            .subscribe(() => {
             this.dismiss();
         });
     }
@@ -399,17 +403,17 @@ class DbxActionSnackbarComponent extends AbstractSubscriptionDirective {
     }
 }
 DbxActionSnackbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarComponent, deps: [{ token: i1$1.MatSnackBarRef }, { token: MAT_SNACK_BAR_DATA }], target: i0.ɵɵFactoryTarget.Component });
-DbxActionSnackbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxActionSnackbarComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-action-snackbar\" [ngClass]=\"(snackbarStatusClass$ | async)!\">\n  <ng-container [ngSwitch]=\"complete$ | async\">\n    <ng-container *ngSwitchCase=\"true\">\n      <dbx-spacer></dbx-spacer>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"done\" text=\"Success\"></dbx-button>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"false\">\n      <span>{{ message }}</span>\n      <dbx-spacer></dbx-spacer>\n      <ng-container *ngIf=\"hasAction\">\n        <dbx-action [dbxActionValueStream]=\"value$\" [dbxActionSource]=\"sourceInstance$ | async\"\n          [dbxActionSuccessHandler]=\"dismissAfterActionCompletes\">\n          <dbx-button dbxActionButton color=\"warn\" [text]=\"button\"></dbx-button>\n        </dbx-action>\n        <dbx-button-spacer></dbx-button-spacer>\n      </ng-container>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"close\"></dbx-button>\n    </ng-container>\n  </ng-container>\n</div>\n", components: [{ type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: DbxSpacerDirective, selector: "dbx-spacer, [dbxSpacer]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.DbxActionDirective, selector: "dbx-action,[dbxAction],dbx-action-context,[dbxActionContext]", exportAs: ["action", "dbxAction"] }, { type: i1$2.dbxActionValueStreamDirective, selector: "[dbxActionValueStream]", inputs: ["dbxActionValueStream", "dbxActionValueStreamIsNotEmpty", "dbxActionValueStreamModified"] }, { type: i1$2.DbxActionSourceDirective, selector: "[dbxActionSource]", inputs: ["dbxActionSource"] }, { type: i1$2.DbxActionSuccessHandlerDirective, selector: "[dbxActionSuccessHandler]", inputs: ["dbxActionSuccessHandler"] }, { type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }], pipes: { "async": i3$1.AsyncPipe } });
+DbxActionSnackbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxActionSnackbarComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-action-snackbar\" [ngClass]=\"(snackbarStatusClass$ | async)!\">\n  <ng-container [ngSwitch]=\"complete$ | async\">\n    <ng-container *ngSwitchCase=\"true\">\n      <dbx-spacer></dbx-spacer>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"done\" text=\"Success\"></dbx-button>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"false\">\n      <span>{{ message }}</span>\n      <dbx-spacer></dbx-spacer>\n      <ng-container *ngIf=\"hasAction\">\n        <dbx-action [dbxActionValueStream]=\"value$\" [dbxActionSource]=\"sourceInstance$ | async\" [dbxActionSuccessHandler]=\"dismissAfterActionCompletes\">\n          <dbx-button dbxActionButton color=\"warn\" [text]=\"button\"></dbx-button>\n        </dbx-action>\n        <dbx-button-spacer></dbx-button-spacer>\n      </ng-container>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"close\"></dbx-button>\n    </ng-container>\n  </ng-container>\n</div>\n", components: [{ type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: DbxSpacerDirective, selector: "dbx-spacer, [dbxSpacer]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$2.DbxActionDirective, selector: "dbx-action,[dbxAction],dbx-action-context,[dbxActionContext]", exportAs: ["action", "dbxAction"] }, { type: i1$2.dbxActionValueStreamDirective, selector: "[dbxActionValueStream]", inputs: ["dbxActionValueStream", "dbxActionValueStreamIsNotEmpty", "dbxActionValueStreamModified"] }, { type: i1$2.DbxActionSourceDirective, selector: "[dbxActionSource]", inputs: ["dbxActionSource"] }, { type: i1$2.DbxActionSuccessHandlerDirective, selector: "[dbxActionSuccessHandler]", inputs: ["dbxActionSuccessHandler"] }, { type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarComponent, decorators: [{
             type: Component,
-            args: [{ template: "<div class=\"dbx-action-snackbar\" [ngClass]=\"(snackbarStatusClass$ | async)!\">\n  <ng-container [ngSwitch]=\"complete$ | async\">\n    <ng-container *ngSwitchCase=\"true\">\n      <dbx-spacer></dbx-spacer>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"done\" text=\"Success\"></dbx-button>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"false\">\n      <span>{{ message }}</span>\n      <dbx-spacer></dbx-spacer>\n      <ng-container *ngIf=\"hasAction\">\n        <dbx-action [dbxActionValueStream]=\"value$\" [dbxActionSource]=\"sourceInstance$ | async\"\n          [dbxActionSuccessHandler]=\"dismissAfterActionCompletes\">\n          <dbx-button dbxActionButton color=\"warn\" [text]=\"button\"></dbx-button>\n        </dbx-action>\n        <dbx-button-spacer></dbx-button-spacer>\n      </ng-container>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"close\"></dbx-button>\n    </ng-container>\n  </ng-container>\n</div>\n" }]
+            args: [{ template: "<div class=\"dbx-action-snackbar\" [ngClass]=\"(snackbarStatusClass$ | async)!\">\n  <ng-container [ngSwitch]=\"complete$ | async\">\n    <ng-container *ngSwitchCase=\"true\">\n      <dbx-spacer></dbx-spacer>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"done\" text=\"Success\"></dbx-button>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"false\">\n      <span>{{ message }}</span>\n      <dbx-spacer></dbx-spacer>\n      <ng-container *ngIf=\"hasAction\">\n        <dbx-action [dbxActionValueStream]=\"value$\" [dbxActionSource]=\"sourceInstance$ | async\" [dbxActionSuccessHandler]=\"dismissAfterActionCompletes\">\n          <dbx-button dbxActionButton color=\"warn\" [text]=\"button\"></dbx-button>\n        </dbx-action>\n        <dbx-button-spacer></dbx-button-spacer>\n      </ng-container>\n      <dbx-button (buttonClick)=\"dismiss()\" color=\"accent\" icon=\"close\"></dbx-button>\n    </ng-container>\n  </ng-container>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i1$1.MatSnackBarRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_SNACK_BAR_DATA]
                 }] }]; } });
 
 const DBX_ACTION_SNACKBAR_DEFAULTS = {
-    'create': {
+    create: {
         loading: {
             message: 'Creating...'
         },
@@ -422,7 +426,7 @@ const DBX_ACTION_SNACKBAR_DEFAULTS = {
             message: 'Create Failed'
         }
     },
-    'save': {
+    save: {
         loading: {
             message: 'Saving...'
         },
@@ -435,7 +439,7 @@ const DBX_ACTION_SNACKBAR_DEFAULTS = {
             message: 'Save Failed'
         }
     },
-    'merge': {
+    merge: {
         loading: {
             message: 'Merging...'
         },
@@ -448,7 +452,7 @@ const DBX_ACTION_SNACKBAR_DEFAULTS = {
             message: 'Merge Failed'
         }
     },
-    'delete': {
+    delete: {
         loading: {
             message: 'Deleting...'
         },
@@ -461,7 +465,7 @@ const DBX_ACTION_SNACKBAR_DEFAULTS = {
             message: 'Delete Failed'
         }
     },
-    'cancel': {
+    cancel: {
         loading: {
             message: 'Cancelling...'
         },
@@ -474,7 +478,7 @@ const DBX_ACTION_SNACKBAR_DEFAULTS = {
             message: 'Cancel Failed'
         }
     },
-    'restore': {
+    restore: {
         loading: {
             message: 'Restoring...'
         },
@@ -487,7 +491,7 @@ const DBX_ACTION_SNACKBAR_DEFAULTS = {
             message: 'Restore Failed'
         }
     },
-    'refresh': {
+    refresh: {
         loading: {
             message: 'Refreshing...'
         },
@@ -500,7 +504,7 @@ const DBX_ACTION_SNACKBAR_DEFAULTS = {
             message: 'Refresh Failed'
         }
     },
-    'do': {
+    do: {
         loading: {
             message: 'Doing...'
         },
@@ -649,7 +653,9 @@ class DbxActionSnackbarDirective extends AbstractSubscriptionDirective {
         }
     }
     ngOnInit() {
-        this.sub = this.source.pipeStore((store) => store.loadingState$).subscribe((loadingState) => {
+        this.sub = this.source
+            .pipeStore((store) => store.loadingState$)
+            .subscribe((loadingState) => {
             const event = { value: loadingState.value, error: loadingState.error, type: loadingStateType(loadingState) };
             const config = this.buildConfigurationForEvent(event);
             if (config) {
@@ -662,7 +668,7 @@ class DbxActionSnackbarDirective extends AbstractSubscriptionDirective {
             event,
             undo: event.type === LoadingStateType.SUCCESS ? this.dbxActionSnackbarUndo : undefined // only show undo on success.
         };
-        return (this.snackbarFunction) ? this.snackbarFunction(input) : this.dbxActionSnackbarService.generateDisplayConfig(this.dbxActionSnackbarDefault, input);
+        return this.snackbarFunction ? this.snackbarFunction(input) : this.dbxActionSnackbarService.generateDisplayConfig(this.dbxActionSnackbarDefault, input);
     }
     showSnackbarForConfiguration(config, event) {
         this.dbxActionSnackbarService.openSnackbar(config);
@@ -689,93 +695,48 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxBarButtonComponent extends AbstractProgressButtonDirective {
 }
 DbxBarButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DbxBarButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxBarButtonComponent, selector: "dbx-bar-button", usesInheritance: true, ngImport: i0, template: "<button\n  mat-button\n  [type]=\"options.type\"\n  [color]=\"options.buttonColor\"\n  [class.working]=\"options.working\"\n  [class.mat-raised-button]=\"options.raised\"\n  [class.mat-stroked-button]=\"options.stroked\"\n  [class.mat-flat-button]=\"options.flat\"\n  [class.fullWidth]=\"options.fullWidth\"\n  [ngClass]=\"options.customClass!\"\n  [ngStyle]=\"options.customStyle!\"\n  [disabled]=\"options.working || options.disabled\"\n>\n  <ng-container *ngIf=\"options.buttonIcon\">\n    <mat-icon\n      [class.is-mat-icon]=\"!options.buttonIcon.fontSet\"\n      [ngClass]=\"options.buttonIcon.customClass!\"\n      [fontSet]=\"options.buttonIcon.fontSet!\"\n      [fontIcon]=\"options.buttonIcon.fontIcon!\"\n      [color]=\"options.buttonIcon.color!\"\n      [svgIcon]=\"options.buttonIcon.svgIcon!\"\n      [inline]=\"options.buttonIcon.inline!\"\n    >\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span>{{ options.text }}<ng-content></ng-content></span>\n\n  <mat-progress-bar\n    class=\"bar\"\n    *ngIf=\"options.working && !options.disabled\"\n    [color]=\"options.barColor!\"\n    [mode]=\"options.mode!\"\n    [value]=\"options.value!\"\n  >\n  </mat-progress-bar>\n</button>\n", styles: [":host button.working{cursor:not-allowed}:host button.fullWidth{width:100%}:host button .bar{position:absolute;top:0;left:0}:host button mat-icon{padding-right:5px}:host button mat-icon.is-mat-icon{font-size:18px;position:relative;top:3px}\n"], components: [{ type: i1.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: i3$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+DbxBarButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxBarButtonComponent, selector: "dbx-bar-button", usesInheritance: true, ngImport: i0, template: "<button mat-button [type]=\"options.type\" [color]=\"options.buttonColor\" [class.working]=\"options.working\" [class.mat-raised-button]=\"options.raised\" [class.mat-stroked-button]=\"options.stroked\" [class.mat-flat-button]=\"options.flat\" [class.fullWidth]=\"options.fullWidth\" [ngClass]=\"options.customClass!\" [ngStyle]=\"options.customStyle!\" [disabled]=\"options.working || options.disabled\">\n  <ng-container *ngIf=\"options.buttonIcon\">\n    <mat-icon [class.is-mat-icon]=\"!options.buttonIcon.fontSet\" [ngClass]=\"options.buttonIcon.customClass!\" [fontSet]=\"options.buttonIcon.fontSet!\" [fontIcon]=\"options.buttonIcon.fontIcon!\" [color]=\"options.buttonIcon.color!\" [svgIcon]=\"options.buttonIcon.svgIcon!\" [inline]=\"options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span>\n    {{ options.text }}\n    <ng-content></ng-content>\n  </span>\n\n  <mat-progress-bar class=\"bar\" *ngIf=\"options.working && !options.disabled\" [color]=\"options.barColor!\" [mode]=\"options.mode!\" [value]=\"options.value!\"></mat-progress-bar>\n</button>\n", styles: [":host button.working{cursor:not-allowed}:host button.fullWidth{width:100%}:host button .bar{position:absolute;top:0;left:0}:host button mat-icon{padding-right:5px}:host button mat-icon.is-mat-icon{font-size:18px;position:relative;top:3px}\n"], components: [{ type: i1.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: i3$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dbx-bar-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  mat-button\n  [type]=\"options.type\"\n  [color]=\"options.buttonColor\"\n  [class.working]=\"options.working\"\n  [class.mat-raised-button]=\"options.raised\"\n  [class.mat-stroked-button]=\"options.stroked\"\n  [class.mat-flat-button]=\"options.flat\"\n  [class.fullWidth]=\"options.fullWidth\"\n  [ngClass]=\"options.customClass!\"\n  [ngStyle]=\"options.customStyle!\"\n  [disabled]=\"options.working || options.disabled\"\n>\n  <ng-container *ngIf=\"options.buttonIcon\">\n    <mat-icon\n      [class.is-mat-icon]=\"!options.buttonIcon.fontSet\"\n      [ngClass]=\"options.buttonIcon.customClass!\"\n      [fontSet]=\"options.buttonIcon.fontSet!\"\n      [fontIcon]=\"options.buttonIcon.fontIcon!\"\n      [color]=\"options.buttonIcon.color!\"\n      [svgIcon]=\"options.buttonIcon.svgIcon!\"\n      [inline]=\"options.buttonIcon.inline!\"\n    >\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span>{{ options.text }}<ng-content></ng-content></span>\n\n  <mat-progress-bar\n    class=\"bar\"\n    *ngIf=\"options.working && !options.disabled\"\n    [color]=\"options.barColor!\"\n    [mode]=\"options.mode!\"\n    [value]=\"options.value!\"\n  >\n  </mat-progress-bar>\n</button>\n", styles: [":host button.working{cursor:not-allowed}:host button.fullWidth{width:100%}:host button .bar{position:absolute;top:0;left:0}:host button mat-icon{padding-right:5px}:host button mat-icon.is-mat-icon{font-size:18px;position:relative;top:3px}\n"] }]
+            args: [{ selector: 'dbx-bar-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button mat-button [type]=\"options.type\" [color]=\"options.buttonColor\" [class.working]=\"options.working\" [class.mat-raised-button]=\"options.raised\" [class.mat-stroked-button]=\"options.stroked\" [class.mat-flat-button]=\"options.flat\" [class.fullWidth]=\"options.fullWidth\" [ngClass]=\"options.customClass!\" [ngStyle]=\"options.customStyle!\" [disabled]=\"options.working || options.disabled\">\n  <ng-container *ngIf=\"options.buttonIcon\">\n    <mat-icon [class.is-mat-icon]=\"!options.buttonIcon.fontSet\" [ngClass]=\"options.buttonIcon.customClass!\" [fontSet]=\"options.buttonIcon.fontSet!\" [fontIcon]=\"options.buttonIcon.fontIcon!\" [color]=\"options.buttonIcon.color!\" [svgIcon]=\"options.buttonIcon.svgIcon!\" [inline]=\"options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n    </mat-icon>\n  </ng-container>\n\n  <span>\n    {{ options.text }}\n    <ng-content></ng-content>\n  </span>\n\n  <mat-progress-bar class=\"bar\" *ngIf=\"options.working && !options.disabled\" [color]=\"options.barColor!\" [mode]=\"options.mode!\" [value]=\"options.value!\"></mat-progress-bar>\n</button>\n", styles: [":host button.working{cursor:not-allowed}:host button.fullWidth{width:100%}:host button .bar{position:absolute;top:0;left:0}:host button mat-icon{padding-right:5px}:host button mat-icon.is-mat-icon{font-size:18px;position:relative;top:3px}\n"] }]
         }] });
 
 class DbxProgressButtonsModule {
     static forRoot(config) {
         return {
             ngModule: DbxProgressButtonsModule,
-            providers: [{
+            providers: [
+                {
                     provide: DBX_MAT_PROGRESS_BUTTON_GLOBAL_CONFIG,
                     useValue: config
-                }]
+                }
+            ]
         };
     }
 }
 DbxProgressButtonsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxProgressButtonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxProgressButtonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxProgressButtonsModule, declarations: [DbxSpinnerButtonComponent,
-        DbxBarButtonComponent], imports: [CommonModule,
-        MatButtonModule,
-        MatProgressBarModule,
-        MatProgressSpinnerModule,
-        MatRippleModule,
-        MatIconModule], exports: [DbxSpinnerButtonComponent,
-        DbxBarButtonComponent] });
-DbxProgressButtonsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxProgressButtonsModule, imports: [[
-            CommonModule,
-            MatButtonModule,
-            MatProgressBarModule,
-            MatProgressSpinnerModule,
-            MatRippleModule,
-            MatIconModule,
-        ]] });
+DbxProgressButtonsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxProgressButtonsModule, declarations: [DbxSpinnerButtonComponent, DbxBarButtonComponent], imports: [CommonModule, MatButtonModule, MatProgressBarModule, MatProgressSpinnerModule, MatRippleModule, MatIconModule], exports: [DbxSpinnerButtonComponent, DbxBarButtonComponent] });
+DbxProgressButtonsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxProgressButtonsModule, imports: [[CommonModule, MatButtonModule, MatProgressBarModule, MatProgressSpinnerModule, MatRippleModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxProgressButtonsModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatButtonModule,
-                        MatProgressBarModule,
-                        MatProgressSpinnerModule,
-                        MatRippleModule,
-                        MatIconModule,
-                    ],
-                    exports: [
-                        DbxSpinnerButtonComponent,
-                        DbxBarButtonComponent
-                    ],
-                    declarations: [
-                        DbxSpinnerButtonComponent,
-                        DbxBarButtonComponent
-                    ],
+                    imports: [CommonModule, MatButtonModule, MatProgressBarModule, MatProgressSpinnerModule, MatRippleModule, MatIconModule],
+                    exports: [DbxSpinnerButtonComponent, DbxBarButtonComponent],
+                    declarations: [DbxSpinnerButtonComponent, DbxBarButtonComponent]
                 }]
         }] });
 
 class DbxButtonModule {
 }
 DbxButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxButtonModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxButtonModule, declarations: [DbxButtonComponent,
-        DbxButtonSpacerDirective], imports: [CommonModule,
-        DbxProgressButtonsModule], exports: [DbxCoreButtonModule,
-        DbxProgressButtonsModule,
-        DbxButtonComponent,
-        DbxButtonSpacerDirective] });
-DbxButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxButtonModule, imports: [[
-            CommonModule,
-            DbxProgressButtonsModule
-        ], DbxCoreButtonModule,
-        DbxProgressButtonsModule] });
+DbxButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxButtonModule, declarations: [DbxButtonComponent, DbxButtonSpacerDirective], imports: [CommonModule, DbxProgressButtonsModule], exports: [DbxCoreButtonModule, DbxProgressButtonsModule, DbxButtonComponent, DbxButtonSpacerDirective] });
+DbxButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxButtonModule, imports: [[CommonModule, DbxProgressButtonsModule], DbxCoreButtonModule, DbxProgressButtonsModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxButtonModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxProgressButtonsModule
-                    ],
-                    declarations: [
-                        DbxButtonComponent,
-                        DbxButtonSpacerDirective
-                    ],
-                    exports: [
-                        DbxCoreButtonModule,
-                        DbxProgressButtonsModule,
-                        DbxButtonComponent,
-                        DbxButtonSpacerDirective
-                    ],
+                    imports: [CommonModule, DbxProgressButtonsModule],
+                    declarations: [DbxButtonComponent, DbxButtonSpacerDirective],
+                    exports: [DbxCoreButtonModule, DbxProgressButtonsModule, DbxButtonComponent, DbxButtonSpacerDirective]
                 }]
         }] });
 
@@ -827,7 +788,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-dialog-content,[dbxDialogContent].dbx-dialog-content',
                     host: {
-                        'class': 'dbx-dialog-content',
+                        class: 'dbx-dialog-content',
                         '[class]': `width + '-dialog-content'`
                     }
                 }]
@@ -902,7 +863,7 @@ class DbxStyleService {
         return combineLatest([configObs, this.suffix$]).pipe(map(([config, suffix]) => {
             let style = config.style;
             if (suffix != null && config.suffixes) {
-                const sanitizedSuffix = ((suffix[0] === '-') ? suffix?.slice(1) : suffix);
+                const sanitizedSuffix = suffix[0] === '-' ? suffix?.slice(1) : suffix;
                 if (config.suffixes.has(sanitizedSuffix)) {
                     style = `${style}-${sanitizedSuffix}`;
                 }
@@ -911,7 +872,7 @@ class DbxStyleService {
         }), distinctUntilChanged());
     }
     toggleDarkSuffix(dark) {
-        const toggle = (dark != null) ? dark : this.suffix !== '-dark';
+        const toggle = dark != null ? dark : this.suffix !== '-dark';
         if (toggle) {
             this.suffix = '-dark';
         }
@@ -995,7 +956,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: '[dbxSetStyle]',
                     host: {
-                        'class': 'dbx-style-root',
+                        class: 'dbx-style-root',
                         '[class]': 'outputStyle'
                     }
                 }]
@@ -1064,34 +1025,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxStyleLayoutModule {
 }
 DbxStyleLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStyleLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxStyleLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStyleLayoutModule, declarations: [DbxSpacerDirective,
-        DbxStyleDirective,
-        DbxSetStyleDirective,
-        DbxStyleBodyDirective], imports: [CommonModule], exports: [DbxSpacerDirective,
-        DbxStyleDirective,
-        DbxSetStyleDirective,
-        DbxStyleBodyDirective] });
-DbxStyleLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStyleLayoutModule, imports: [[
-            CommonModule
-        ]] });
+DbxStyleLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStyleLayoutModule, declarations: [DbxSpacerDirective, DbxStyleDirective, DbxSetStyleDirective, DbxStyleBodyDirective], imports: [CommonModule], exports: [DbxSpacerDirective, DbxStyleDirective, DbxSetStyleDirective, DbxStyleBodyDirective] });
+DbxStyleLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStyleLayoutModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStyleLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule
-                    ],
-                    declarations: [
-                        DbxSpacerDirective,
-                        DbxStyleDirective,
-                        DbxSetStyleDirective,
-                        DbxStyleBodyDirective
-                    ],
-                    exports: [
-                        DbxSpacerDirective,
-                        DbxStyleDirective,
-                        DbxSetStyleDirective,
-                        DbxStyleBodyDirective
-                    ]
+                    imports: [CommonModule],
+                    declarations: [DbxSpacerDirective, DbxStyleDirective, DbxSetStyleDirective, DbxStyleBodyDirective],
+                    exports: [DbxSpacerDirective, DbxStyleDirective, DbxSetStyleDirective, DbxStyleBodyDirective]
                 }]
         }] });
 
@@ -1101,36 +1042,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxDialogInteractionModule {
 }
 DbxDialogInteractionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxDialogInteractionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxDialogInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxDialogInteractionModule, declarations: [DbxDialogContentDirective,
-        DbxActionDialogDirective], imports: [CommonModule,
-        DbxStyleLayoutModule], exports: [DbxDialogContentDirective,
-        DbxActionDialogDirective] });
-DbxDialogInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxDialogInteractionModule, imports: [[
-            CommonModule,
-            DbxStyleLayoutModule
-        ]] });
+DbxDialogInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxDialogInteractionModule, declarations: [DbxDialogContentDirective, DbxActionDialogDirective], imports: [CommonModule, DbxStyleLayoutModule], exports: [DbxDialogContentDirective, DbxActionDialogDirective] });
+DbxDialogInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxDialogInteractionModule, imports: [[CommonModule, DbxStyleLayoutModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxDialogInteractionModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxStyleLayoutModule
-                    ],
-                    declarations: [
-                        DbxDialogContentDirective,
-                        DbxActionDialogDirective
-                    ],
-                    exports: [
-                        DbxDialogContentDirective,
-                        DbxActionDialogDirective
-                    ]
+                    imports: [CommonModule, DbxStyleLayoutModule],
+                    declarations: [DbxDialogContentDirective, DbxActionDialogDirective],
+                    exports: [DbxDialogContentDirective, DbxActionDialogDirective]
                 }]
         }] });
 
 class PopoverPositionStrategy {
     static make(overlay, elementRef, config) {
-        const [originX, origin2ndX, origin3rdX] = config.originX === 'end' ? ['end', 'start', 'center'] :
-            config.originX === 'start' ? ['start', 'end', 'center'] : ['center', 'start', 'end'];
+        const [originX, origin2ndX, origin3rdX] = config.originX === 'end' ? ['end', 'start', 'center'] : config.originX === 'start' ? ['start', 'end', 'center'] : ['center', 'start', 'end'];
         const overlayX = originX;
         const [overlayY, overlayFallbackY] = config.overlayY === 'bottom' ? ['bottom', 'top'] : ['top', 'bottom'];
         const [originY, originFallbackY] = [overlayFallbackY, overlayY];
@@ -1145,43 +1070,43 @@ class PopoverPositionStrategy {
                 originY,
                 overlayX,
                 overlayY,
-                offsetY,
+                offsetY
             },
             {
                 originX: origin2ndX,
                 originY,
                 overlayX: origin2ndX,
                 overlayY,
-                offsetY,
+                offsetY
             },
             {
                 originX,
                 originY: originFallbackY,
                 overlayX,
                 overlayY: overlayFallbackY,
-                offsetY: -offsetY,
+                offsetY: -offsetY
             },
             {
                 originX: origin2ndX,
                 originY: originFallbackY,
                 overlayX: origin2ndX,
                 overlayY: overlayFallbackY,
-                offsetY: -offsetY,
+                offsetY: -offsetY
             },
             {
                 originX: origin3rdX,
                 originY,
                 overlayX: origin3rdX,
                 overlayY,
-                offsetY,
+                offsetY
             },
             {
                 originX: origin3rdX,
                 originY: originFallbackY,
                 overlayX: origin3rdX,
                 overlayY: overlayFallbackY,
-                offsetY: -offsetY,
-            },
+                offsetY: -offsetY
+            }
         ])
             .withDefaultOffsetX(offsetX)
             .withDefaultOffsetY(offsetY);
@@ -1200,7 +1125,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-bar,[dbxBar]',
                     host: {
-                        'class': 'dbx-bar',
+                        class: 'dbx-bar',
                         '[class.dbx-primary-bg]': 'color === "primary"',
                         '[class.dbx-accent-bg]': 'color === "accent"',
                         '[class.dbx-warn-bg]': 'color === "warn"'
@@ -1221,7 +1146,7 @@ DbxBarHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
       <mat-icon class="button-spacer" *ngIf="icon">{{ icon }}</mat-icon>
       <span *ngIf="text">{{ text }}</span>
     </dbx-bar>
-    `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: DbxBarDirective, selector: "dbx-bar,[dbxBar]", inputs: ["color"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+  `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: DbxBarDirective, selector: "dbx-bar,[dbxBar]", inputs: ["color"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarHeaderComponent, decorators: [{
             type: Component,
             args: [{
@@ -1231,9 +1156,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
       <mat-icon class="button-spacer" *ngIf="icon">{{ icon }}</mat-icon>
       <span *ngIf="text">{{ text }}</span>
     </dbx-bar>
-    `,
+  `,
                     host: {
-                        'class': 'dbx-bar-header dbx-hint'
+                        class: 'dbx-bar-header dbx-hint'
                     }
                 }]
         }], propDecorators: { text: [{
@@ -1247,10 +1172,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxPagebarComponent {
 }
 DbxPagebarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPagebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxPagebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPagebarComponent, selector: "dbx-pagebar", inputs: { color: "color" }, ngImport: i0, template: "<mat-toolbar class=\"dbx-pagebar\" [ngClass]=\"(color) ? ('dbx-bar-' + color) : ''\">\n  <ng-content select=\"[left]\"></ng-content>\n  <span class=\"spacer\"></span>\n  <ng-content select=\"[right]\"></ng-content>\n</mat-toolbar>\n", components: [{ type: i1$4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+DbxPagebarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPagebarComponent, selector: "dbx-pagebar", inputs: { color: "color" }, ngImport: i0, template: "<mat-toolbar class=\"dbx-pagebar\" [ngClass]=\"color ? 'dbx-bar-' + color : ''\">\n  <ng-content select=\"[left]\"></ng-content>\n  <span class=\"spacer\"></span>\n  <ng-content select=\"[right]\"></ng-content>\n</mat-toolbar>\n", components: [{ type: i1$4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPagebarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dbx-pagebar', template: "<mat-toolbar class=\"dbx-pagebar\" [ngClass]=\"(color) ? ('dbx-bar-' + color) : ''\">\n  <ng-content select=\"[left]\"></ng-content>\n  <span class=\"spacer\"></span>\n  <ng-content select=\"[right]\"></ng-content>\n</mat-toolbar>\n" }]
+            args: [{ selector: 'dbx-pagebar', template: "<mat-toolbar class=\"dbx-pagebar\" [ngClass]=\"color ? 'dbx-bar-' + color : ''\">\n  <ng-content select=\"[left]\"></ng-content>\n  <span class=\"spacer\"></span>\n  <ng-content select=\"[right]\"></ng-content>\n</mat-toolbar>\n" }]
         }], propDecorators: { color: [{
                 type: Input
             }] } });
@@ -1261,36 +1186,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxBarLayoutModule {
 }
 DbxBarLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxBarLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarLayoutModule, declarations: [DbxBarDirective,
-        DbxBarHeaderComponent,
-        DbxPagebarComponent], imports: [CommonModule,
-        MatToolbarModule,
-        MatIconModule], exports: [DbxBarDirective,
-        DbxBarHeaderComponent,
-        DbxPagebarComponent] });
-DbxBarLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarLayoutModule, imports: [[
-            CommonModule,
-            MatToolbarModule,
-            MatIconModule
-        ]] });
+DbxBarLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarLayoutModule, declarations: [DbxBarDirective, DbxBarHeaderComponent, DbxPagebarComponent], imports: [CommonModule, MatToolbarModule, MatIconModule], exports: [DbxBarDirective, DbxBarHeaderComponent, DbxPagebarComponent] });
+DbxBarLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarLayoutModule, imports: [[CommonModule, MatToolbarModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBarLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatToolbarModule,
-                        MatIconModule
-                    ],
-                    declarations: [
-                        DbxBarDirective,
-                        DbxBarHeaderComponent,
-                        DbxPagebarComponent
-                    ],
-                    exports: [
-                        DbxBarDirective,
-                        DbxBarHeaderComponent,
-                        DbxPagebarComponent
-                    ]
+                    imports: [CommonModule, MatToolbarModule, MatIconModule],
+                    declarations: [DbxBarDirective, DbxBarHeaderComponent, DbxPagebarComponent],
+                    exports: [DbxBarDirective, DbxBarHeaderComponent, DbxPagebarComponent]
                 }]
         }] });
 
@@ -1306,8 +1209,8 @@ class DbxAnchorComponent extends AbstractDbxAnchorDirective {
         this.dbNgxRouterWebProviderConfig = dbNgxRouterWebProviderConfig;
         this._templateRef = new BehaviorSubject(undefined);
         this.templateRef$ = this._templateRef.pipe(skipFirstMaybe(), shareReplay(1));
-        this.url$ = this.anchor$.pipe(map(x => x?.url), distinctUntilChanged(), shareReplay(1));
-        this.target$ = this.anchor$.pipe(map(x => x?.target), distinctUntilChanged(), shareReplay(1));
+        this.url$ = this.anchor$.pipe(map((x) => x?.url), distinctUntilChanged(), shareReplay(1));
+        this.target$ = this.anchor$.pipe(map((x) => x?.target), distinctUntilChanged(), shareReplay(1));
     }
     get templateRef() {
         return this._templateRef.value;
@@ -1327,13 +1230,13 @@ class DbxAnchorComponent extends AbstractDbxAnchorDirective {
     }
 }
 DbxAnchorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorComponent, deps: [{ token: DbxRouterWebProviderConfig }], target: i0.ɵɵFactoryTarget.Component });
-DbxAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: { block: "block" }, host: { attributes: { "dbx-anchor-block": "block" }, classAttribute: "d-inline dbx-anchor" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["content"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"(type$ | async)\">\n  <!-- Plain -->\n  <ng-container *ngSwitchCase=\"0\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </ng-container>\n  <!-- Click -->\n  <a class=\"dbx-anchor-a dbx-anchor-click\" (click)=\"clickAnchor()\" *ngSwitchCase=\"1\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Router -->\n  <dbx-injection [config]=\"srefAnchorConfig\" *ngSwitchCase=\"2\">\n    <!-- Injected in child. -->\n  </dbx-injection>\n  <!-- Href -->\n  <a class=\"dbx-anchor-a dbx-anchor-href\" [href]=\"url$ | async\" [attr.target]=\"target$ | async\"\n    *ngSwitchCase=\"3\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Disabled or None -->\n  <a class=\"dbx-anchor-a dbx-anchor-disabled\" *ngSwitchDefault>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n</ng-container>\n<!-- Template content -->\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", components: [{ type: i1$2.DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], pipes: { "async": i3$1.AsyncPipe } });
+DbxAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: { block: "block" }, host: { attributes: { "dbx-anchor-block": "block" }, classAttribute: "d-inline dbx-anchor" }, viewQueries: [{ propertyName: "templateRef", first: true, predicate: ["content"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"type$ | async\">\n  <!-- Plain -->\n  <ng-container *ngSwitchCase=\"0\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </ng-container>\n  <!-- Click -->\n  <a class=\"dbx-anchor-a dbx-anchor-click\" (click)=\"clickAnchor()\" *ngSwitchCase=\"1\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Router -->\n  <dbx-injection [config]=\"srefAnchorConfig\" *ngSwitchCase=\"2\">\n    <!-- Injected in child. -->\n  </dbx-injection>\n  <!-- Href -->\n  <a class=\"dbx-anchor-a dbx-anchor-href\" [href]=\"url$ | async\" [attr.target]=\"target$ | async\" *ngSwitchCase=\"3\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Disabled or None -->\n  <a class=\"dbx-anchor-a dbx-anchor-disabled\" *ngSwitchDefault>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n</ng-container>\n<!-- Template content -->\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", components: [{ type: i1$2.DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dbx-anchor, [dbx-anchor]', host: {
                         class: 'd-inline dbx-anchor',
                         'dbx-anchor-block': 'block'
-                    }, template: "<ng-container [ngSwitch]=\"(type$ | async)\">\n  <!-- Plain -->\n  <ng-container *ngSwitchCase=\"0\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </ng-container>\n  <!-- Click -->\n  <a class=\"dbx-anchor-a dbx-anchor-click\" (click)=\"clickAnchor()\" *ngSwitchCase=\"1\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Router -->\n  <dbx-injection [config]=\"srefAnchorConfig\" *ngSwitchCase=\"2\">\n    <!-- Injected in child. -->\n  </dbx-injection>\n  <!-- Href -->\n  <a class=\"dbx-anchor-a dbx-anchor-href\" [href]=\"url$ | async\" [attr.target]=\"target$ | async\"\n    *ngSwitchCase=\"3\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Disabled or None -->\n  <a class=\"dbx-anchor-a dbx-anchor-disabled\" *ngSwitchDefault>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n</ng-container>\n<!-- Template content -->\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n" }]
+                    }, template: "<ng-container [ngSwitch]=\"type$ | async\">\n  <!-- Plain -->\n  <ng-container *ngSwitchCase=\"0\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </ng-container>\n  <!-- Click -->\n  <a class=\"dbx-anchor-a dbx-anchor-click\" (click)=\"clickAnchor()\" *ngSwitchCase=\"1\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Router -->\n  <dbx-injection [config]=\"srefAnchorConfig\" *ngSwitchCase=\"2\">\n    <!-- Injected in child. -->\n  </dbx-injection>\n  <!-- Href -->\n  <a class=\"dbx-anchor-a dbx-anchor-href\" [href]=\"url$ | async\" [attr.target]=\"target$ | async\" *ngSwitchCase=\"3\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n  <!-- Disabled or None -->\n  <a class=\"dbx-anchor-a dbx-anchor-disabled\" *ngSwitchDefault>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </a>\n</ng-container>\n<!-- Template content -->\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n" }]
         }], ctorParameters: function () { return [{ type: DbxRouterWebProviderConfig }]; }, propDecorators: { block: [{
                 type: Input
             }], templateRef: [{
@@ -1348,19 +1251,23 @@ class DbxAnchorIconComponent {
 }
 DbxAnchorIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxAnchorIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxAnchorIconComponent, selector: "dbx-anchor-icon", inputs: { anchor: "anchor" }, ngImport: i0, template: `
-  <dbx-anchor [anchor]="anchor">
-    <button mat-icon-button><mat-icon>{{ anchor?.icon }}</mat-icon></button>
-  </dbx-anchor>
-`, isInline: true, components: [{ type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { type: i1.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"] }] });
+    <dbx-anchor [anchor]="anchor">
+      <button mat-icon-button>
+        <mat-icon>{{ anchor?.icon }}</mat-icon>
+      </button>
+    </dbx-anchor>
+  `, isInline: true, components: [{ type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { type: i1.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"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorIconComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-anchor-icon',
                     template: `
-  <dbx-anchor [anchor]="anchor">
-    <button mat-icon-button><mat-icon>{{ anchor?.icon }}</mat-icon></button>
-  </dbx-anchor>
-`
+    <dbx-anchor [anchor]="anchor">
+      <button mat-icon-button>
+        <mat-icon>{{ anchor?.icon }}</mat-icon>
+      </button>
+    </dbx-anchor>
+  `
                 }]
         }], propDecorators: { anchor: [{
                 type: Input
@@ -1390,7 +1297,7 @@ DbxAnchorLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
     <dbx-anchor [anchor]="anchor">
       <ng-content></ng-content>
     </dbx-anchor>
-    `, isInline: true, components: [{ type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }] });
+  `, isInline: true, components: [{ type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorLinkComponent, decorators: [{
             type: Component,
             args: [{
@@ -1399,9 +1306,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     <dbx-anchor [anchor]="anchor">
       <ng-content></ng-content>
     </dbx-anchor>
-    `,
+  `,
                     host: {
-                        'class': 'd-inline dbx-link'
+                        class: 'd-inline dbx-link'
                     }
                 }]
         }], propDecorators: { anchor: [{
@@ -1418,11 +1325,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxAnchorContentComponent {
     constructor(parent) {
         this.parent = parent;
-        this._parentAnchor = (this.parent) ? this.parent.anchor$ : of(undefined);
+        this._parentAnchor = this.parent ? this.parent.anchor$ : of(undefined);
         this._inputAnchor = new BehaviorSubject(undefined);
         this.anchor$ = combineLatest([this._inputAnchor, this._parentAnchor]).pipe(map(([input, parent]) => input ?? parent), shareReplay(1));
-        this.icon$ = this.anchor$.pipe(map(x => x?.icon));
-        this.title$ = this.anchor$.pipe(map(x => x?.title));
+        this.icon$ = this.anchor$.pipe(map((x) => x?.icon));
+        this.title$ = this.anchor$.pipe(map((x) => x?.title));
     }
     set anchor(anchor) {
         this._inputAnchor.next(anchor);
@@ -1432,14 +1339,20 @@ class DbxAnchorContentComponent {
     }
 }
 DbxAnchorContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorContentComponent, deps: [{ token: DbxAnchorComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-DbxAnchorContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxAnchorContentComponent, selector: "dbx-anchor-content", inputs: { anchor: "anchor" }, host: { classAttribute: "dbx-anchor-content" }, ngImport: i0, template: `<mat-icon class="dbx-icon-spacer" *ngIf="icon$ | async">{{ icon$ | async }}</mat-icon><span *ngIf="title$ | async">{{ title$ | async }}</span>`, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3$1.AsyncPipe } });
+DbxAnchorContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxAnchorContentComponent, selector: "dbx-anchor-content", inputs: { anchor: "anchor" }, host: { classAttribute: "dbx-anchor-content" }, ngImport: i0, template: `
+    <mat-icon class="dbx-icon-spacer" *ngIf="icon$ | async">{{ icon$ | async }}</mat-icon>
+    <span *ngIf="title$ | async">{{ title$ | async }}</span>
+  `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorContentComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-anchor-content',
-                    template: `<mat-icon class="dbx-icon-spacer" *ngIf="icon$ | async">{{ icon$ | async }}</mat-icon><span *ngIf="title$ | async">{{ title$ | async }}</span>`,
+                    template: `
+    <mat-icon class="dbx-icon-spacer" *ngIf="icon$ | async">{{ icon$ | async }}</mat-icon>
+    <span *ngIf="title$ | async">{{ title$ | async }}</span>
+  `,
                     host: {
-                        'class': 'dbx-anchor-content'
+                        class: 'dbx-anchor-content'
                     }
                 }]
         }], ctorParameters: function () { return [{ type: DbxAnchorComponent, decorators: [{
@@ -1451,43 +1364,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxRouterAnchorModule {
 }
 DbxRouterAnchorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxRouterAnchorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorModule, declarations: [DbxAnchorComponent,
-        DbxAnchorIconComponent,
-        DbxAnchorLinkComponent,
-        DbxAnchorContentComponent], imports: [CommonModule,
-        MatIconModule,
-        MatButtonModule,
-        DbxInjectionComponentModule], exports: [DbxAnchorComponent,
-        DbxAnchorIconComponent,
-        DbxAnchorLinkComponent,
-        DbxAnchorContentComponent] });
-DbxRouterAnchorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorModule, imports: [[
-            CommonModule,
-            MatIconModule,
-            MatButtonModule,
-            DbxInjectionComponentModule
-        ]] });
+DbxRouterAnchorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorModule, declarations: [DbxAnchorComponent, DbxAnchorIconComponent, DbxAnchorLinkComponent, DbxAnchorContentComponent], imports: [CommonModule, MatIconModule, MatButtonModule, DbxInjectionComponentModule], exports: [DbxAnchorComponent, DbxAnchorIconComponent, DbxAnchorLinkComponent, DbxAnchorContentComponent] });
+DbxRouterAnchorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorModule, imports: [[CommonModule, MatIconModule, MatButtonModule, DbxInjectionComponentModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        DbxInjectionComponentModule
-                    ],
-                    declarations: [
-                        DbxAnchorComponent,
-                        DbxAnchorIconComponent,
-                        DbxAnchorLinkComponent,
-                        DbxAnchorContentComponent
-                    ],
-                    exports: [
-                        DbxAnchorComponent,
-                        DbxAnchorIconComponent,
-                        DbxAnchorLinkComponent,
-                        DbxAnchorContentComponent
-                    ]
+                    imports: [CommonModule, MatIconModule, MatButtonModule, DbxInjectionComponentModule],
+                    declarations: [DbxAnchorComponent, DbxAnchorIconComponent, DbxAnchorLinkComponent, DbxAnchorContentComponent],
+                    exports: [DbxAnchorComponent, DbxAnchorIconComponent, DbxAnchorLinkComponent, DbxAnchorContentComponent]
                 }]
         }] });
 
@@ -1498,10 +1382,10 @@ class AbstractDbxSegueAnchorDirective {
     constructor(parent) {
         this.parent = parent;
         this.target$ = this.parent.target$;
-        this.ref$ = this.parent.anchor$.pipe(map(x => x?.ref), distinctUntilChanged(), shareReplay(1));
-        this.refParams$ = this.parent.anchor$.pipe(map(x => x?.refParams), distinctUntilChanged(), shareReplay(1));
-        this.refOptions$ = this.parent.anchor$.pipe(map(x => x?.refOptions), distinctUntilChanged(), shareReplay(1));
-        this.template$ = this.parent.templateRef$.pipe(distinctUntilChanged(), map(templateRef => ({
+        this.ref$ = this.parent.anchor$.pipe(map((x) => x?.ref), distinctUntilChanged(), shareReplay(1));
+        this.refParams$ = this.parent.anchor$.pipe(map((x) => x?.refParams), distinctUntilChanged(), shareReplay(1));
+        this.refOptions$ = this.parent.anchor$.pipe(map((x) => x?.refOptions), distinctUntilChanged(), shareReplay(1));
+        this.template$ = this.parent.templateRef$.pipe(distinctUntilChanged(), map((templateRef) => ({
             templateRef
         })), shareReplay(1));
     }
@@ -1521,7 +1405,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxAnchorListComponent {
     constructor() {
         this._anchors = new BehaviorSubject([]);
-        this.expandedAnchors$ = this._anchors.pipe(distinctUntilChanged(), map(x => expandClickableAnchorLinkTrees(x)), shareReplay(1));
+        this.expandedAnchors$ = this._anchors.pipe(distinctUntilChanged(), map((x) => expandClickableAnchorLinkTrees(x)), shareReplay(1));
     }
     set anchors(anchors) {
         this._anchors.next(anchors ?? []);
@@ -1531,10 +1415,10 @@ class DbxAnchorListComponent {
     }
 }
 DbxAnchorListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxAnchorListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxAnchorListComponent, selector: "dbx-anchor-list", inputs: { anchors: "anchors" }, ngImport: i0, template: "<mat-nav-list class=\"dbx-anchor-list\">\n  <ng-container *ngFor=\"let expanded of expandedAnchors$ | async; let last = last;\">\n    <span dbx-anchor [anchor]=\"expanded.value\">\n      <a mat-list-item [disabled]=\"expanded.value.disabled\" [ngClass]=\"(expanded.depth) ? 'dbx-anchor-list-child' : 'dbx-anchor-list-root'\">\n        <mat-icon mat-list-icon *ngIf=\"expanded.value.icon\">{{ expanded.value.icon }}</mat-icon>\n        <!-- TODO: Add an icon from a letter if anchor.icon is unavailable. -->\n        <div mat-line>{{ expanded.value.title }}</div>\n        <mat-divider *ngIf=\"!last\"></mat-divider>\n      </a>\n    </span>\n  </ng-container>\n</mat-nav-list>\n", components: [{ type: i1$5.MatNavList, selector: "mat-nav-list", inputs: ["disableRipple", "disabled"], exportAs: ["matNavList"] }, { type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { type: i1$5.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$5.MatListIconCssMatStyler, selector: "[mat-list-icon], [matListIcon]" }, { type: i6.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "async": i3$1.AsyncPipe } });
+DbxAnchorListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxAnchorListComponent, selector: "dbx-anchor-list", inputs: { anchors: "anchors" }, ngImport: i0, template: "<mat-nav-list class=\"dbx-anchor-list\">\n  <ng-container *ngFor=\"let expanded of expandedAnchors$ | async; let last = last\">\n    <span dbx-anchor [anchor]=\"expanded.value\">\n      <a mat-list-item [disabled]=\"expanded.value.disabled\" [ngClass]=\"expanded.depth ? 'dbx-anchor-list-child' : 'dbx-anchor-list-root'\">\n        <mat-icon mat-list-icon *ngIf=\"expanded.value.icon\">{{ expanded.value.icon }}</mat-icon>\n        <!-- TODO: Add an icon from a letter if anchor.icon is unavailable. -->\n        <div mat-line>{{ expanded.value.title }}</div>\n        <mat-divider *ngIf=\"!last\"></mat-divider>\n      </a>\n    </span>\n  </ng-container>\n</mat-nav-list>\n", components: [{ type: i1$5.MatNavList, selector: "mat-nav-list", inputs: ["disableRipple", "disabled"], exportAs: ["matNavList"] }, { type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { type: i1$5.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$5.MatListIconCssMatStyler, selector: "[mat-list-icon], [matListIcon]" }, { type: i6.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxAnchorListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dbx-anchor-list', template: "<mat-nav-list class=\"dbx-anchor-list\">\n  <ng-container *ngFor=\"let expanded of expandedAnchors$ | async; let last = last;\">\n    <span dbx-anchor [anchor]=\"expanded.value\">\n      <a mat-list-item [disabled]=\"expanded.value.disabled\" [ngClass]=\"(expanded.depth) ? 'dbx-anchor-list-child' : 'dbx-anchor-list-root'\">\n        <mat-icon mat-list-icon *ngIf=\"expanded.value.icon\">{{ expanded.value.icon }}</mat-icon>\n        <!-- TODO: Add an icon from a letter if anchor.icon is unavailable. -->\n        <div mat-line>{{ expanded.value.title }}</div>\n        <mat-divider *ngIf=\"!last\"></mat-divider>\n      </a>\n    </span>\n  </ng-container>\n</mat-nav-list>\n" }]
+            args: [{ selector: 'dbx-anchor-list', template: "<mat-nav-list class=\"dbx-anchor-list\">\n  <ng-container *ngFor=\"let expanded of expandedAnchors$ | async; let last = last\">\n    <span dbx-anchor [anchor]=\"expanded.value\">\n      <a mat-list-item [disabled]=\"expanded.value.disabled\" [ngClass]=\"expanded.depth ? 'dbx-anchor-list-child' : 'dbx-anchor-list-root'\">\n        <mat-icon mat-list-icon *ngIf=\"expanded.value.icon\">{{ expanded.value.icon }}</mat-icon>\n        <!-- TODO: Add an icon from a letter if anchor.icon is unavailable. -->\n        <div mat-line>{{ expanded.value.title }}</div>\n        <mat-divider *ngIf=\"!last\"></mat-divider>\n      </a>\n    </span>\n  </ng-container>\n</mat-nav-list>\n" }]
         }], propDecorators: { anchors: [{
                 type: Input
             }] } });
@@ -1542,40 +1426,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxRouterAnchorListModule {
 }
 DbxRouterAnchorListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxRouterAnchorListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorListModule, declarations: [DbxAnchorListComponent], imports: [CommonModule,
-        MatTabsModule,
-        MatButtonModule,
-        MatIconModule,
-        MatListModule,
-        MatMenuModule,
-        DbxRouterAnchorModule], exports: [DbxAnchorListComponent] });
-DbxRouterAnchorListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorListModule, imports: [[
-            CommonModule,
-            MatTabsModule,
-            MatButtonModule,
-            MatIconModule,
-            MatListModule,
-            MatMenuModule,
-            DbxRouterAnchorModule,
-        ]] });
+DbxRouterAnchorListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorListModule, declarations: [DbxAnchorListComponent], imports: [CommonModule, MatTabsModule, MatButtonModule, MatIconModule, MatListModule, MatMenuModule, DbxRouterAnchorModule], exports: [DbxAnchorListComponent] });
+DbxRouterAnchorListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorListModule, imports: [[CommonModule, MatTabsModule, MatButtonModule, MatIconModule, MatListModule, MatMenuModule, DbxRouterAnchorModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterAnchorListModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatTabsModule,
-                        MatButtonModule,
-                        MatIconModule,
-                        MatListModule,
-                        MatMenuModule,
-                        DbxRouterAnchorModule,
-                    ],
-                    declarations: [
-                        DbxAnchorListComponent
-                    ],
-                    exports: [
-                        DbxAnchorListComponent
-                    ]
+                    imports: [CommonModule, MatTabsModule, MatButtonModule, MatIconModule, MatListModule, MatMenuModule, DbxRouterAnchorModule],
+                    declarations: [DbxAnchorListComponent],
+                    exports: [DbxAnchorListComponent]
                 }]
         }] });
 
@@ -1583,10 +1441,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxValueListItemModifier {
 }
 function provideDbxValueListViewModifier(sourceType) {
-    return [{
+    return [
+        {
             provide: DbxValueListItemModifier,
             useExisting: forwardRef(() => sourceType)
-        }];
+        }
+    ];
 }
 function listItemModifier(key, modify) {
     return modifier(key, modify);
@@ -1600,7 +1460,7 @@ class DbxValueListItemModifierDirective {
         this._modifiers = new BehaviorSubject(undefined);
         this._inputModifiers = new BehaviorSubject(undefined);
         this.modifiers$ = combineLatest([this._modifiers, this._inputModifiers]).pipe(map(([modifiers, inputModifiers]) => {
-            return combineMaps(modifiers, (inputModifiers) ? addModifiers(inputModifiers) : undefined);
+            return combineMaps(modifiers, inputModifiers ? addModifiers(inputModifiers) : undefined);
         }), shareReplay(1));
     }
     ngOnDestroy() {
@@ -1623,7 +1483,7 @@ DbxValueListItemModifierDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxValueListItemModifierDirective, decorators: [{
             type: Directive,
             args: [{
-                    'selector': '[dbxListItemModifier]',
+                    selector: '[dbxListItemModifier]',
                     providers: provideDbxValueListViewModifier(DbxValueListItemModifierDirective)
                 }]
         }], propDecorators: { inputModifiers: [{
@@ -1713,21 +1573,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             type: NgModule,
             args: [{
                     imports: [],
-                    declarations: [
-                        DbxListItemAnchorModifierDirective
-                    ],
-                    exports: [
-                        DbxListItemAnchorModifierDirective
-                    ]
+                    declarations: [DbxListItemAnchorModifierDirective],
+                    exports: [DbxListItemAnchorModifierDirective]
                 }]
         }] });
 
 const SCREEN_MEDIA_WIDTH_TYPE_SIZE_MAP = {
-    'micro': 0,
-    'small': 1,
-    'tablet': 2,
-    'large': 3,
-    'full': 4
+    micro: 0,
+    small: 1,
+    tablet: 2,
+    large: 3,
+    full: 4
 };
 /**
  * Compares the breakpoint with the current width and determines if it is "active" or not.
@@ -1846,7 +1702,7 @@ class DbxNavbarComponent extends AbstractTransitionDirective {
         this._anchors = new BehaviorSubject([]);
         this.isBreakpointActive$ = this._dbxScreenMediaService.isBreakpointActive(this._breakpoint);
         this.mode$ = combineLatest([this._inputMode, this.isBreakpointActive$]).pipe(map(([inputMode, breakpointActive]) => {
-            return (breakpointActive) ? (inputMode ?? 'bar') : 'button';
+            return breakpointActive ? inputMode ?? 'bar' : 'button';
         }), distinctUntilChanged(), tapDetectChanges(this.cdRef), shareReplay(1));
         this.anchors$ = combineLatest([this._anchors, this.initAndUpdateOnTransitionSuccess$]).pipe(map(([anchors]) => {
             const results = anchors.map((anchor) => {
@@ -1876,12 +1732,12 @@ class DbxNavbarComponent extends AbstractTransitionDirective {
     }
 }
 DbxNavbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxNavbarComponent, deps: [{ token: i1$2.DbxRouterTransitionService }, { token: i0.ChangeDetectorRef }, { token: DbxScreenMediaService }, { token: i1$2.DbxRouterService }], target: i0.ɵɵFactoryTarget.Component });
-DbxNavbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxNavbarComponent, selector: "dbx-navbar", inputs: { navAlign: "navAlign", anchors: "anchors", mode: "mode", breakpoint: "breakpoint" }, host: { classAttribute: "dbx-navbar" }, usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"mode$ | async\">\n  <!-- Button -->\n  <ng-container *ngSwitchCase=\"'button'\">\n    <button mat-icon-button [matMenuTriggerFor]=\"menu\" class=\"nav-menu-button\" aria-label=\"open navigation\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <mat-menu #menu>\n      <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n        <button mat-menu-item [ngClass]=\"(x.selected) ? 'active' : ''\">{{ x.anchor.title }}</button>\n      </dbx-anchor>\n    </mat-menu>\n  </ng-container>\n  <!-- Bar -->\n  <nav *ngSwitchDefault mat-tab-nav-bar [attr.mat-align-tabs]=\"navAlign\">\n    <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n      <a mat-tab-link [active]=\"x.selected\">{{ x.anchor.title }}</a>\n    </dbx-anchor>\n  </nav>\n</ng-container>\n", components: [{ type: i1.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: i5.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i7.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["color"], exportAs: ["matTabNavBar", "matTabNav"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i5.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i7.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matTabLink"] }], pipes: { "async": i3$1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+DbxNavbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxNavbarComponent, selector: "dbx-navbar", inputs: { navAlign: "navAlign", anchors: "anchors", mode: "mode", breakpoint: "breakpoint" }, host: { classAttribute: "dbx-navbar" }, usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"mode$ | async\">\n  <!-- Button -->\n  <ng-container *ngSwitchCase=\"'button'\">\n    <button mat-icon-button [matMenuTriggerFor]=\"menu\" class=\"nav-menu-button\" aria-label=\"open navigation\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <mat-menu #menu>\n      <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n        <button mat-menu-item [ngClass]=\"x.selected ? 'active' : ''\">{{ x.anchor.title }}</button>\n      </dbx-anchor>\n    </mat-menu>\n  </ng-container>\n  <!-- Bar -->\n  <nav *ngSwitchDefault mat-tab-nav-bar [attr.mat-align-tabs]=\"navAlign\">\n    <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n      <a mat-tab-link [active]=\"x.selected\">{{ x.anchor.title }}</a>\n    </dbx-anchor>\n  </nav>\n</ng-container>\n", components: [{ type: i1.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: i5.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: DbxAnchorComponent, selector: "dbx-anchor, [dbx-anchor]", inputs: ["block"] }, { type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: i7.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["color"], exportAs: ["matTabNavBar", "matTabNav"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i5.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i7.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matTabLink"] }], pipes: { "async": i3$1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxNavbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dbx-navbar', changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        'class': 'dbx-navbar'
-                    }, template: "<ng-container [ngSwitch]=\"mode$ | async\">\n  <!-- Button -->\n  <ng-container *ngSwitchCase=\"'button'\">\n    <button mat-icon-button [matMenuTriggerFor]=\"menu\" class=\"nav-menu-button\" aria-label=\"open navigation\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <mat-menu #menu>\n      <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n        <button mat-menu-item [ngClass]=\"(x.selected) ? 'active' : ''\">{{ x.anchor.title }}</button>\n      </dbx-anchor>\n    </mat-menu>\n  </ng-container>\n  <!-- Bar -->\n  <nav *ngSwitchDefault mat-tab-nav-bar [attr.mat-align-tabs]=\"navAlign\">\n    <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n      <a mat-tab-link [active]=\"x.selected\">{{ x.anchor.title }}</a>\n    </dbx-anchor>\n  </nav>\n</ng-container>\n" }]
+                        class: 'dbx-navbar'
+                    }, template: "<ng-container [ngSwitch]=\"mode$ | async\">\n  <!-- Button -->\n  <ng-container *ngSwitchCase=\"'button'\">\n    <button mat-icon-button [matMenuTriggerFor]=\"menu\" class=\"nav-menu-button\" aria-label=\"open navigation\">\n      <mat-icon>menu</mat-icon>\n    </button>\n    <mat-menu #menu>\n      <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n        <button mat-menu-item [ngClass]=\"x.selected ? 'active' : ''\">{{ x.anchor.title }}</button>\n      </dbx-anchor>\n    </mat-menu>\n  </ng-container>\n  <!-- Bar -->\n  <nav *ngSwitchDefault mat-tab-nav-bar [attr.mat-align-tabs]=\"navAlign\">\n    <dbx-anchor *ngFor=\"let x of anchors$ | async\" [anchor]=\"x.anchor\">\n      <a mat-tab-link [active]=\"x.selected\">{{ x.anchor.title }}</a>\n    </dbx-anchor>\n  </nav>\n</ng-container>\n" }]
         }], ctorParameters: function () { return [{ type: i1$2.DbxRouterTransitionService }, { type: i0.ChangeDetectorRef }, { type: DbxScreenMediaService }, { type: i1$2.DbxRouterService }]; }, propDecorators: { navAlign: [{
                 type: Input
             }], anchors: [{
@@ -1895,37 +1751,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxRouterNavbarModule {
 }
 DbxRouterNavbarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterNavbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxRouterNavbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterNavbarModule, declarations: [DbxNavbarComponent], imports: [CommonModule,
-        MatTabsModule,
-        MatButtonModule,
-        MatIconModule,
-        MatMenuModule,
-        DbxRouterAnchorModule], exports: [DbxNavbarComponent] });
-DbxRouterNavbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterNavbarModule, imports: [[
-            CommonModule,
-            MatTabsModule,
-            MatButtonModule,
-            MatIconModule,
-            MatMenuModule,
-            DbxRouterAnchorModule,
-        ]] });
+DbxRouterNavbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterNavbarModule, declarations: [DbxNavbarComponent], imports: [CommonModule, MatTabsModule, MatButtonModule, MatIconModule, MatMenuModule, DbxRouterAnchorModule], exports: [DbxNavbarComponent] });
+DbxRouterNavbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterNavbarModule, imports: [[CommonModule, MatTabsModule, MatButtonModule, MatIconModule, MatMenuModule, DbxRouterAnchorModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterNavbarModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatTabsModule,
-                        MatButtonModule,
-                        MatIconModule,
-                        MatMenuModule,
-                        DbxRouterAnchorModule,
-                    ],
-                    declarations: [
-                        DbxNavbarComponent
-                    ],
-                    exports: [
-                        DbxNavbarComponent
-                    ]
+                    imports: [CommonModule, MatTabsModule, MatButtonModule, MatIconModule, MatMenuModule, DbxRouterAnchorModule],
+                    declarations: [DbxNavbarComponent],
+                    exports: [DbxNavbarComponent]
                 }]
         }] });
 
@@ -1981,7 +1814,7 @@ class DbxSidenavComponent extends AbstractTransitionWatcherDirective {
             }
             return mode;
         }), shareReplay(1));
-        this.disableBackdrop$ = this.mode$.pipe(map(x => x !== SideNavDisplayMode.MOBILE), distinctUntilChanged(), shareReplay(1));
+        this.disableBackdrop$ = this.mode$.pipe(map((x) => x !== SideNavDisplayMode.MOBILE), distinctUntilChanged(), shareReplay(1));
         this.sizeClass$ = this.mode$.pipe(map((mode) => `dbx-sidenav-${mode}`), distinctUntilChanged(), shareReplay(1));
         this.state$ = this.mode$.pipe(map((mode) => {
             let drawer;
@@ -2003,7 +1836,7 @@ class DbxSidenavComponent extends AbstractTransitionWatcherDirective {
                 open
             };
         }), shareReplay(1));
-        this.drawer$ = this.state$.pipe(map(x => x.drawer), distinctUntilChanged(), shareReplay(1));
+        this.drawer$ = this.state$.pipe(map((x) => x.drawer), distinctUntilChanged(), shareReplay(1));
         this._watcherSub = new SubscriptionObject();
         this._stateSub = new SubscriptionObject();
     }
@@ -2078,7 +1911,7 @@ class DbxSidenavButtonComponent {
     constructor(parent) {
         this.parent = parent;
         this.mode$ = this.parent.mode$;
-        this.showMenuButton$ = this.mode$.pipe(map(x => x === SideNavDisplayMode.MOBILE));
+        this.showMenuButton$ = this.mode$.pipe(map((x) => x === SideNavDisplayMode.MOBILE));
     }
     toggleNav() {
         this.parent.toggleNav();
@@ -2086,18 +1919,18 @@ class DbxSidenavButtonComponent {
 }
 DbxSidenavButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSidenavButtonComponent, deps: [{ token: DbxSidenavComponent }], target: i0.ɵɵFactoryTarget.Component });
 DbxSidenavButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxSidenavButtonComponent, selector: "dbx-sidenav-button", ngImport: i0, template: `
-  <button class="dbx-sidenav-button" mat-icon-button *ngIf="showMenuButton$ | async" (click)="toggleNav()" aria-label="open sidenav button">
-    <mat-icon>view_sidebar</mat-icon>
-  </button>
+    <button class="dbx-sidenav-button" mat-icon-button *ngIf="showMenuButton$ | async" (click)="toggleNav()" aria-label="open sidenav button">
+      <mat-icon>view_sidebar</mat-icon>
+    </button>
   `, isInline: true, components: [{ type: i1.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"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSidenavButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-sidenav-button',
                     template: `
-  <button class="dbx-sidenav-button" mat-icon-button *ngIf="showMenuButton$ | async" (click)="toggleNav()" aria-label="open sidenav button">
-    <mat-icon>view_sidebar</mat-icon>
-  </button>
+    <button class="dbx-sidenav-button" mat-icon-button *ngIf="showMenuButton$ | async" (click)="toggleNav()" aria-label="open sidenav button">
+      <mat-icon>view_sidebar</mat-icon>
+    </button>
   `
                 }]
         }], ctorParameters: function () { return [{ type: DbxSidenavComponent }]; } });
@@ -2144,7 +1977,7 @@ class DbxSidenavPageComponent {
     constructor(parent) {
         this.parent = parent;
         this._mobileOnly = new BehaviorSubject(false);
-        this.hidePagebar$ = this._mobileOnly.pipe(switchMap((mobileOnly) => (mobileOnly) ? this.parent.mode$.pipe(map(x => x !== SideNavDisplayMode.MOBILE)) : of(true)), shareReplay(1));
+        this.hidePagebar$ = this._mobileOnly.pipe(switchMap((mobileOnly) => (mobileOnly ? this.parent.mode$.pipe(map((x) => x !== SideNavDisplayMode.MOBILE)) : of(true))), shareReplay(1));
     }
     ngOnDestroy() {
         this._mobileOnly.complete();
@@ -2202,7 +2035,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-content-elevate,[dbxContentElevate]',
                     host: {
-                        'class': 'd-block dbx-content-elevate'
+                        class: 'd-block dbx-content-elevate'
                     }
                 }]
         }] });
@@ -2219,7 +2052,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-content,[dbxContent]',
                     host: {
-                        'class': 'd-block dbx-content'
+                        class: 'd-block dbx-content'
                     }
                 }]
         }] });
@@ -2236,7 +2069,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-content-border,[dbxContentBorder]',
                     host: {
-                        'class': 'd-block dbx-content-border'
+                        class: 'd-block dbx-content-border'
                     }
                 }]
         }] });
@@ -2257,7 +2090,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-content-container,[dbxContentContainer],.dbx-content-container',
                     host: {
-                        'class': 'd-block dbx-content-container',
+                        class: 'd-block dbx-content-container',
                         '[class]': `"container-" + grow + " container-padding-" + padding`
                     }
                 }]
@@ -2283,7 +2116,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-content-box, [dbxContentBox]',
                     host: {
-                        'class': 'd-block dbx-content-box',
+                        class: 'd-block dbx-content-box',
                         '[class.dbx-content-elevate]': 'elevated',
                         '[class.dbx-content-box-wide]': 'wide'
                     }
@@ -2306,7 +2139,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-content-page,[dbxContentPage]',
                     host: {
-                        'class': 'd-block dbx-content-page'
+                        class: 'd-block dbx-content-page'
                     }
                 }]
         }] });
@@ -2317,112 +2150,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxContentLayoutModule {
 }
 DbxContentLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxContentLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxContentLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxContentLayoutModule, declarations: [DbxContentDirective,
-        DbxContentContainerDirective,
-        DbxContentBorderDirective,
-        DbxContentElevateDirective,
-        DbxContentBoxDirective,
-        DbxContentPageDirective], imports: [CommonModule], exports: [DbxContentDirective,
-        DbxContentContainerDirective,
-        DbxContentBorderDirective,
-        DbxContentElevateDirective,
-        DbxContentBoxDirective,
-        DbxContentPageDirective] });
-DbxContentLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxContentLayoutModule, imports: [[
-            CommonModule
-        ]] });
+DbxContentLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxContentLayoutModule, declarations: [DbxContentDirective, DbxContentContainerDirective, DbxContentBorderDirective, DbxContentElevateDirective, DbxContentBoxDirective, DbxContentPageDirective], imports: [CommonModule], exports: [DbxContentDirective, DbxContentContainerDirective, DbxContentBorderDirective, DbxContentElevateDirective, DbxContentBoxDirective, DbxContentPageDirective] });
+DbxContentLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxContentLayoutModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxContentLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule
-                    ],
-                    declarations: [
-                        DbxContentDirective,
-                        DbxContentContainerDirective,
-                        DbxContentBorderDirective,
-                        DbxContentElevateDirective,
-                        DbxContentBoxDirective,
-                        DbxContentPageDirective
-                    ],
-                    exports: [
-                        DbxContentDirective,
-                        DbxContentContainerDirective,
-                        DbxContentBorderDirective,
-                        DbxContentElevateDirective,
-                        DbxContentBoxDirective,
-                        DbxContentPageDirective
-                    ]
+                    imports: [CommonModule],
+                    declarations: [DbxContentDirective, DbxContentContainerDirective, DbxContentBorderDirective, DbxContentElevateDirective, DbxContentBoxDirective, DbxContentPageDirective],
+                    exports: [DbxContentDirective, DbxContentContainerDirective, DbxContentBorderDirective, DbxContentElevateDirective, DbxContentBoxDirective, DbxContentPageDirective]
                 }]
         }] });
 
 class DbxRouterSidenavModule {
 }
 DbxRouterSidenavModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterSidenavModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxRouterSidenavModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterSidenavModule, declarations: [DbxSidenavComponent,
-        DbxSidenavButtonComponent,
-        DbxSidenavPagebarComponent,
-        DbxSidenavPageComponent], imports: [CommonModule,
-        DbxBarLayoutModule,
-        DbxRouterAnchorModule,
-        DbxRouterAnchorListModule,
-        DbxButtonModule,
-        DbxContentLayoutModule,
-        MatToolbarModule,
-        MatButtonModule,
-        MatIconModule,
-        MatSidenavModule,
-        MatListModule,
-        MatDividerModule,
-        UIRouterModule], exports: [DbxSidenavComponent,
-        DbxSidenavButtonComponent,
-        DbxSidenavPagebarComponent,
-        DbxSidenavPageComponent] });
-DbxRouterSidenavModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterSidenavModule, imports: [[
-            CommonModule,
-            DbxBarLayoutModule,
-            DbxRouterAnchorModule,
-            DbxRouterAnchorListModule,
-            DbxButtonModule,
-            DbxContentLayoutModule,
-            MatToolbarModule,
-            MatButtonModule,
-            MatIconModule,
-            MatSidenavModule,
-            MatListModule,
-            MatDividerModule,
-            UIRouterModule
-        ]] });
+DbxRouterSidenavModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterSidenavModule, declarations: [DbxSidenavComponent, DbxSidenavButtonComponent, DbxSidenavPagebarComponent, DbxSidenavPageComponent], imports: [CommonModule, DbxBarLayoutModule, DbxRouterAnchorModule, DbxRouterAnchorListModule, DbxButtonModule, DbxContentLayoutModule, MatToolbarModule, MatButtonModule, MatIconModule, MatSidenavModule, MatListModule, MatDividerModule, UIRouterModule], exports: [DbxSidenavComponent, DbxSidenavButtonComponent, DbxSidenavPagebarComponent, DbxSidenavPageComponent] });
+DbxRouterSidenavModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterSidenavModule, imports: [[CommonModule, DbxBarLayoutModule, DbxRouterAnchorModule, DbxRouterAnchorListModule, DbxButtonModule, DbxContentLayoutModule, MatToolbarModule, MatButtonModule, MatIconModule, MatSidenavModule, MatListModule, MatDividerModule, UIRouterModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterSidenavModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxBarLayoutModule,
-                        DbxRouterAnchorModule,
-                        DbxRouterAnchorListModule,
-                        DbxButtonModule,
-                        DbxContentLayoutModule,
-                        MatToolbarModule,
-                        MatButtonModule,
-                        MatIconModule,
-                        MatSidenavModule,
-                        MatListModule,
-                        MatDividerModule,
-                        UIRouterModule
-                    ],
-                    declarations: [
-                        DbxSidenavComponent,
-                        DbxSidenavButtonComponent,
-                        DbxSidenavPagebarComponent,
-                        DbxSidenavPageComponent
-                    ],
-                    exports: [
-                        DbxSidenavComponent,
-                        DbxSidenavButtonComponent,
-                        DbxSidenavPagebarComponent,
-                        DbxSidenavPageComponent
-                    ]
+                    imports: [CommonModule, DbxBarLayoutModule, DbxRouterAnchorModule, DbxRouterAnchorListModule, DbxButtonModule, DbxContentLayoutModule, MatToolbarModule, MatButtonModule, MatIconModule, MatSidenavModule, MatListModule, MatDividerModule, UIRouterModule],
+                    declarations: [DbxSidenavComponent, DbxSidenavButtonComponent, DbxSidenavPagebarComponent, DbxSidenavPageComponent],
+                    exports: [DbxSidenavComponent, DbxSidenavButtonComponent, DbxSidenavPagebarComponent, DbxSidenavPageComponent]
                 }]
         }] });
 
@@ -2433,26 +2182,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxRouterLayoutModule {
 }
 DbxRouterLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxRouterLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterLayoutModule, exports: [DbxRouterAnchorModule,
-        DbxRouterAnchorListModule,
-        DbxRouterListModule,
-        DbxRouterNavbarModule,
-        DbxRouterSidenavModule] });
-DbxRouterLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterLayoutModule, imports: [DbxRouterAnchorModule,
-        DbxRouterAnchorListModule,
-        DbxRouterListModule,
-        DbxRouterNavbarModule,
-        DbxRouterSidenavModule] });
+DbxRouterLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterLayoutModule, exports: [DbxRouterAnchorModule, DbxRouterAnchorListModule, DbxRouterListModule, DbxRouterNavbarModule, DbxRouterSidenavModule] });
+DbxRouterLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterLayoutModule, imports: [DbxRouterAnchorModule, DbxRouterAnchorListModule, DbxRouterListModule, DbxRouterNavbarModule, DbxRouterSidenavModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxRouterLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    exports: [
-                        DbxRouterAnchorModule,
-                        DbxRouterAnchorListModule,
-                        DbxRouterListModule,
-                        DbxRouterNavbarModule,
-                        DbxRouterSidenavModule
-                    ]
+                    exports: [DbxRouterAnchorModule, DbxRouterAnchorListModule, DbxRouterListModule, DbxRouterNavbarModule, DbxRouterSidenavModule]
                 }]
         }] });
 
@@ -2486,22 +2221,12 @@ class DbxWebAngularRouterModule {
     }
 }
 DbxWebAngularRouterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebAngularRouterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxWebAngularRouterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebAngularRouterModule, declarations: [DbxAngularRouterSegueAnchorComponent], imports: [CommonModule,
-        UIRouterModule,
-        DbxInjectionComponentModule], exports: [DbxAngularRouterSegueAnchorComponent] });
-DbxWebAngularRouterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebAngularRouterModule, imports: [[
-            CommonModule,
-            UIRouterModule,
-            DbxInjectionComponentModule
-        ]] });
+DbxWebAngularRouterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebAngularRouterModule, declarations: [DbxAngularRouterSegueAnchorComponent], imports: [CommonModule, UIRouterModule, DbxInjectionComponentModule], exports: [DbxAngularRouterSegueAnchorComponent] });
+DbxWebAngularRouterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebAngularRouterModule, imports: [[CommonModule, UIRouterModule, DbxInjectionComponentModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebAngularRouterModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        UIRouterModule,
-                        DbxInjectionComponentModule
-                    ],
+                    imports: [CommonModule, UIRouterModule, DbxInjectionComponentModule],
                     declarations: [DbxAngularRouterSegueAnchorComponent],
                     exports: [DbxAngularRouterSegueAnchorComponent]
                 }]
@@ -2513,15 +2238,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxUIRouterSegueAnchorComponent extends AbstractDbxSegueAnchorDirective {
     constructor() {
         super(...arguments);
-        this.uiRef$ = this.ref$.pipe(filter(x => typeof x === 'string'));
+        this.uiRef$ = this.ref$.pipe(filter((x) => typeof x === 'string'));
         this.uiOptions$ = this.refOptions$;
     }
 }
 DbxUIRouterSegueAnchorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxUIRouterSegueAnchorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DbxUIRouterSegueAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxUIRouterSegueAnchorComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<a class=\"dbx-anchor-a dbx-anchor-sref\" [attr.target]=\"target$ | async\" [uiSref]=\"(uiRef$ | async) ?? ''\"\n  [uiParams]=\"refParams$ | async\" [uiOptions]=\"(uiOptions$ | async) ?? {}\" uiSrefActive=\"dbx-anchor-active\" uiSrefActiveEq=\"dbx-anchor-active-eq\">\n  <dbx-injection [template]=\"template$ | async\"></dbx-injection>\n</a>\n", components: [{ type: i1$2.DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], directives: [{ type: i2$1.AnchorUISref, selector: "a[uiSref]" }, { type: i2$1.UISrefActive, selector: "[uiSrefActive],[uiSrefActiveEq]", inputs: ["uiSrefActive", "uiSrefActiveEq"] }, { type: i2$1.UISrefStatus, selector: "[uiSrefStatus],[uiSrefActive],[uiSrefActiveEq]", outputs: ["uiSrefStatus"], exportAs: ["uiSrefStatus"] }, { type: i2$1.UISref, selector: "[uiSref]", inputs: ["uiSref", "uiParams", "uiOptions"], exportAs: ["uiSref"] }], pipes: { "async": i3$1.AsyncPipe } });
+DbxUIRouterSegueAnchorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxUIRouterSegueAnchorComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<a class=\"dbx-anchor-a dbx-anchor-sref\" [attr.target]=\"target$ | async\" [uiSref]=\"(uiRef$ | async) ?? ''\" [uiParams]=\"refParams$ | async\" [uiOptions]=\"(uiOptions$ | async) ?? {}\" uiSrefActive=\"dbx-anchor-active\" uiSrefActiveEq=\"dbx-anchor-active-eq\">\n  <dbx-injection [template]=\"template$ | async\"></dbx-injection>\n</a>\n", components: [{ type: i1$2.DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], directives: [{ type: i2$1.AnchorUISref, selector: "a[uiSref]" }, { type: i2$1.UISrefActive, selector: "[uiSrefActive],[uiSrefActiveEq]", inputs: ["uiSrefActive", "uiSrefActiveEq"] }, { type: i2$1.UISrefStatus, selector: "[uiSrefStatus],[uiSrefActive],[uiSrefActiveEq]", outputs: ["uiSrefStatus"], exportAs: ["uiSrefStatus"] }, { type: i2$1.UISref, selector: "[uiSref]", inputs: ["uiSref", "uiParams", "uiOptions"], exportAs: ["uiSref"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxUIRouterSegueAnchorComponent, decorators: [{
             type: Component,
-            args: [{ template: "<a class=\"dbx-anchor-a dbx-anchor-sref\" [attr.target]=\"target$ | async\" [uiSref]=\"(uiRef$ | async) ?? ''\"\n  [uiParams]=\"refParams$ | async\" [uiOptions]=\"(uiOptions$ | async) ?? {}\" uiSrefActive=\"dbx-anchor-active\" uiSrefActiveEq=\"dbx-anchor-active-eq\">\n  <dbx-injection [template]=\"template$ | async\"></dbx-injection>\n</a>\n" }]
+            args: [{ template: "<a class=\"dbx-anchor-a dbx-anchor-sref\" [attr.target]=\"target$ | async\" [uiSref]=\"(uiRef$ | async) ?? ''\" [uiParams]=\"refParams$ | async\" [uiOptions]=\"(uiOptions$ | async) ?? {}\" uiSrefActive=\"dbx-anchor-active\" uiSrefActiveEq=\"dbx-anchor-active-eq\">\n  <dbx-injection [template]=\"template$ | async\"></dbx-injection>\n</a>\n" }]
         }] });
 
 class DbxWebUIRouterModule {
@@ -2542,22 +2267,12 @@ class DbxWebUIRouterModule {
     }
 }
 DbxWebUIRouterModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebUIRouterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxWebUIRouterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebUIRouterModule, declarations: [DbxUIRouterSegueAnchorComponent], imports: [CommonModule,
-        UIRouterModule,
-        DbxInjectionComponentModule], exports: [DbxUIRouterSegueAnchorComponent] });
-DbxWebUIRouterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebUIRouterModule, imports: [[
-            CommonModule,
-            UIRouterModule,
-            DbxInjectionComponentModule
-        ]] });
+DbxWebUIRouterModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebUIRouterModule, declarations: [DbxUIRouterSegueAnchorComponent], imports: [CommonModule, UIRouterModule, DbxInjectionComponentModule], exports: [DbxUIRouterSegueAnchorComponent] });
+DbxWebUIRouterModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebUIRouterModule, imports: [[CommonModule, UIRouterModule, DbxInjectionComponentModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebUIRouterModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        UIRouterModule,
-                        DbxInjectionComponentModule
-                    ],
+                    imports: [CommonModule, UIRouterModule, DbxInjectionComponentModule],
                     declarations: [DbxUIRouterSegueAnchorComponent],
                     exports: [DbxUIRouterSegueAnchorComponent]
                 }]
@@ -2592,31 +2307,31 @@ class DbxTwoBlocksComponent {
 }
 DbxTwoBlocksComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoBlocksComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxTwoBlocksComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxTwoBlocksComponent, selector: "dbx-two-block", inputs: { fixedTop: "fixedTop" }, host: { properties: { "class": "{ \"dbx-two-block-fixed-top\": fixedTop }" }, classAttribute: "dbx-two-block d-block" }, viewQueries: [{ propertyName: "twoElement", first: true, predicate: ["two"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: `
-  <div #two class="dbx-two-block-content">
-    <div #top class="dbx-two-block-top" (resized)="onResized($event)">
-      <ng-content select="[top]"></ng-content>
-    </div>
-    <div #bottom class="dbx-two-block-bottom">
-      <ng-content></ng-content>
+    <div #two class="dbx-two-block-content">
+      <div #top class="dbx-two-block-top" (resized)="onResized($event)">
+        <ng-content select="[top]"></ng-content>
+      </div>
+      <div #bottom class="dbx-two-block-bottom">
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
   `, isInline: true, directives: [{ type: i1$7.ResizedDirective, selector: "[resized]", outputs: ["resized"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoBlocksComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-two-block',
                     template: `
-  <div #two class="dbx-two-block-content">
-    <div #top class="dbx-two-block-top" (resized)="onResized($event)">
-      <ng-content select="[top]"></ng-content>
-    </div>
-    <div #bottom class="dbx-two-block-bottom">
-      <ng-content></ng-content>
+    <div #two class="dbx-two-block-content">
+      <div #top class="dbx-two-block-top" (resized)="onResized($event)">
+        <ng-content select="[top]"></ng-content>
+      </div>
+      <div #bottom class="dbx-two-block-bottom">
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
   `,
                     host: {
-                        'class': 'dbx-two-block d-block',
+                        class: 'dbx-two-block d-block',
                         '[class]': '{ "dbx-two-block-fixed-top": fixedTop }'
                     }
                 }]
@@ -2633,28 +2348,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxBlockLayoutModule {
 }
 DbxBlockLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBlockLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxBlockLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBlockLayoutModule, declarations: [DbxTwoBlocksComponent], imports: [CommonModule,
-        DbxRouterAnchorModule,
-        AngularResizeEventModule], exports: [DbxTwoBlocksComponent] });
-DbxBlockLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBlockLayoutModule, imports: [[
-            CommonModule,
-            DbxRouterAnchorModule,
-            AngularResizeEventModule
-        ]] });
+DbxBlockLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBlockLayoutModule, declarations: [DbxTwoBlocksComponent], imports: [CommonModule, DbxRouterAnchorModule, AngularResizeEventModule], exports: [DbxTwoBlocksComponent] });
+DbxBlockLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBlockLayoutModule, imports: [[CommonModule, DbxRouterAnchorModule, AngularResizeEventModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBlockLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxRouterAnchorModule,
-                        AngularResizeEventModule
-                    ],
-                    declarations: [
-                        DbxTwoBlocksComponent
-                    ],
-                    exports: [
-                        DbxTwoBlocksComponent
-                    ]
+                    imports: [CommonModule, DbxRouterAnchorModule, AngularResizeEventModule],
+                    declarations: [DbxTwoBlocksComponent],
+                    exports: [DbxTwoBlocksComponent]
                 }]
         }] });
 
@@ -2665,36 +2366,42 @@ class DbxCardBoxComponent {
 }
 DbxCardBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxCardBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxCardBoxComponent, selector: "dbx-card-box", inputs: { header: "header", icon: "icon" }, ngImport: i0, template: `
-  <div class="dbx-card-box">
-    <div class="dbx-section-header">
-      <div class="dbx-section-header-content">
-        <h4 class="dbx-section-header-content-title"><mat-icon *ngIf="icon">{{icon}}</mat-icon><span *ngIf="header" class="title-text">{{ header }}</span></h4>
-        <span class="spacer"></span>
-        <ng-content select="[sectionHeader]"></ng-content>
+    <div class="dbx-card-box">
+      <div class="dbx-section-header">
+        <div class="dbx-section-header-content">
+          <h4 class="dbx-section-header-content-title">
+            <mat-icon *ngIf="icon">{{ icon }}</mat-icon>
+            <span *ngIf="header" class="title-text">{{ header }}</span>
+          </h4>
+          <span class="spacer"></span>
+          <ng-content select="[sectionHeader]"></ng-content>
+        </div>
+      </div>
+      <div class="dbx-card-box-content">
+        <ng-content></ng-content>
       </div>
     </div>
-    <div class="dbx-card-box-content">
-      <ng-content></ng-content>
-    </div>
-  </div>
   `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-card-box',
                     template: `
-  <div class="dbx-card-box">
-    <div class="dbx-section-header">
-      <div class="dbx-section-header-content">
-        <h4 class="dbx-section-header-content-title"><mat-icon *ngIf="icon">{{icon}}</mat-icon><span *ngIf="header" class="title-text">{{ header }}</span></h4>
-        <span class="spacer"></span>
-        <ng-content select="[sectionHeader]"></ng-content>
+    <div class="dbx-card-box">
+      <div class="dbx-section-header">
+        <div class="dbx-section-header-content">
+          <h4 class="dbx-section-header-content-title">
+            <mat-icon *ngIf="icon">{{ icon }}</mat-icon>
+            <span *ngIf="header" class="title-text">{{ header }}</span>
+          </h4>
+          <span class="spacer"></span>
+          <ng-content select="[sectionHeader]"></ng-content>
+        </div>
+      </div>
+      <div class="dbx-card-box-content">
+        <ng-content></ng-content>
       </div>
     </div>
-    <div class="dbx-card-box-content">
-      <ng-content></ng-content>
-    </div>
-  </div>
   `
                 }]
         }], propDecorators: { header: [{
@@ -2710,18 +2417,18 @@ class DbxCardBoxContainerComponent {
 }
 DbxCardBoxContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxCardBoxContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxCardBoxContainerComponent, selector: "dbx-card-box-container", ngImport: i0, template: `
-  <div class="dbx-card-box-container">
-    <ng-content></ng-content>
-  </div>
+    <div class="dbx-card-box-container">
+      <ng-content></ng-content>
+    </div>
   `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxContainerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-card-box-container',
                     template: `
-  <div class="dbx-card-box-container">
-    <ng-content></ng-content>
-  </div>
+    <div class="dbx-card-box-container">
+      <ng-content></ng-content>
+    </div>
   `
                 }]
         }] });
@@ -2729,29 +2436,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxCardBoxLayoutModule {
 }
 DbxCardBoxLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxCardBoxLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxLayoutModule, declarations: [DbxCardBoxComponent,
-        DbxCardBoxContainerComponent], imports: [CommonModule,
-        MatIconModule], exports: [DbxCardBoxComponent,
-        DbxCardBoxContainerComponent] });
-DbxCardBoxLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxLayoutModule, imports: [[
-            CommonModule,
-            MatIconModule
-        ]] });
+DbxCardBoxLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxLayoutModule, declarations: [DbxCardBoxComponent, DbxCardBoxContainerComponent], imports: [CommonModule, MatIconModule], exports: [DbxCardBoxComponent, DbxCardBoxContainerComponent] });
+DbxCardBoxLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxLayoutModule, imports: [[CommonModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCardBoxLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatIconModule
-                    ],
-                    declarations: [
-                        DbxCardBoxComponent,
-                        DbxCardBoxContainerComponent
-                    ],
-                    exports: [
-                        DbxCardBoxComponent,
-                        DbxCardBoxContainerComponent
-                    ]
+                    imports: [CommonModule, MatIconModule],
+                    declarations: [DbxCardBoxComponent, DbxCardBoxContainerComponent],
+                    exports: [DbxCardBoxComponent, DbxCardBoxContainerComponent]
                 }]
         }] });
 
@@ -2796,11 +2488,11 @@ class TwoColumnsContextStore extends ComponentStore {
         /**
          * Changes the state to show right or not.
          */
-        this.setShowRight = this.updater((state, showRight) => isMaybeNot(showRight) ? state : ({ ...state, showRight }));
+        this.setShowRight = this.updater((state, showRight) => (isMaybeNot(showRight) ? state : { ...state, showRight }));
         /**
          * Sets the full left. If undefined is passed, no change occurs.
          */
-        this.setFullLeft = this.updater((state, fullLeft) => isMaybeNot(fullLeft) ? state : ({ ...state, fullLeft }));
+        this.setFullLeft = this.updater((state, fullLeft) => (isMaybeNot(fullLeft) ? state : { ...state, fullLeft }));
         /**
          * Sets the new back ref.
          */
@@ -2824,10 +2516,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             type: Injectable
         }], ctorParameters: function () { return []; } });
 function provideTwoColumnsContext() {
-    return [{
+    return [
+        {
             provide: TwoColumnsContextStore,
             useClass: TwoColumnsContextStore
-        }];
+        }
+    ];
 }
 
 /**
@@ -2878,8 +2572,7 @@ class DbxTwoColumnComponent extends AbstractSubscriptionDirective {
         this.hideRight$ = this.twoColumnsContextStore.hideRight$;
     }
     ngOnInit() {
-        this.sub = combineLatest([this.showRight$, this.showFullLeft$, this._reverseSizing, this._inSectionPage])
-            .subscribe(([showRight, showFullLeft, reverseSizing, inSectionPage]) => {
+        this.sub = combineLatest([this.showRight$, this.showFullLeft$, this._reverseSizing, this._inSectionPage]).subscribe(([showRight, showFullLeft, reverseSizing, inSectionPage]) => {
             this._view = {
                 showRight,
                 showFullLeft,
@@ -2905,13 +2598,13 @@ class DbxTwoColumnComponent extends AbstractSubscriptionDirective {
     }
 }
 DbxTwoColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnComponent, deps: [{ token: TwoColumnsContextStore }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-DbxTwoColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxTwoColumnComponent, selector: "dbx-two-column", inputs: { reverseSizing: "reverseSizing", inSectionPage: "inSectionPage" }, host: { properties: { "class": "{ 'right-shown': v.showRight, 'full-left': v.fullLeft, 'two-column-reverse-sizing': v.reverseSizing, 'dbx-section-page-two': v.inSectionPage }" }, classAttribute: "dbx-two-column" }, exportAs: ["columns"], usesInheritance: true, ngImport: i0, template: "<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height left-column\">\n  <ng-content select=\"[left]\"></ng-content>\n</dbx-content-container>\n<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height right-column\"\n  *ngIf=\"v.showRight\">\n  <ng-content select=\"[right]\"></ng-content>\n</dbx-content-container>\n", directives: [{ type: DbxContentContainerDirective, selector: "dbx-content-container,[dbxContentContainer],.dbx-content-container", inputs: ["grow", "padding"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+DbxTwoColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxTwoColumnComponent, selector: "dbx-two-column", inputs: { reverseSizing: "reverseSizing", inSectionPage: "inSectionPage" }, host: { properties: { "class": "{ 'right-shown': v.showRight, 'full-left': v.fullLeft, 'two-column-reverse-sizing': v.reverseSizing, 'dbx-section-page-two': v.inSectionPage }" }, classAttribute: "dbx-two-column" }, exportAs: ["columns"], usesInheritance: true, ngImport: i0, template: "<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height left-column\">\n  <ng-content select=\"[left]\"></ng-content>\n</dbx-content-container>\n<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height right-column\" *ngIf=\"v.showRight\">\n  <ng-content select=\"[right]\"></ng-content>\n</dbx-content-container>\n", directives: [{ type: DbxContentContainerDirective, selector: "dbx-content-container,[dbxContentContainer],.dbx-content-container", inputs: ["grow", "padding"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dbx-two-column', exportAs: 'columns', host: {
-                        "class": "dbx-two-column",
-                        "[class]": "{ 'right-shown': v.showRight, 'full-left': v.fullLeft, 'two-column-reverse-sizing': v.reverseSizing, 'dbx-section-page-two': v.inSectionPage }"
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height left-column\">\n  <ng-content select=\"[left]\"></ng-content>\n</dbx-content-container>\n<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height right-column\"\n  *ngIf=\"v.showRight\">\n  <ng-content select=\"[right]\"></ng-content>\n</dbx-content-container>\n" }]
+                        class: 'dbx-two-column',
+                        '[class]': "{ 'right-shown': v.showRight, 'full-left': v.fullLeft, 'two-column-reverse-sizing': v.reverseSizing, 'dbx-section-page-two': v.inSectionPage }"
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height left-column\">\n  <ng-content select=\"[left]\"></ng-content>\n</dbx-content-container>\n<dbx-content-container grow=\"full\" padding=\"none\" class=\"dbx-content dbx-content-auto-height right-column\" *ngIf=\"v.showRight\">\n  <ng-content select=\"[right]\"></ng-content>\n</dbx-content-container>\n" }]
         }], ctorParameters: function () { return [{ type: TwoColumnsContextStore, decorators: [{
                     type: Inject,
                     args: [TwoColumnsContextStore]
@@ -2963,7 +2656,7 @@ class DbxTwoColumnFullLeftDirective {
         return this._fullLeft.value;
     }
     set fullLeft(fullLeft) {
-        if (fullLeft != null && (fullLeft !== '')) {
+        if (fullLeft != null && fullLeft !== '') {
             this._fullLeft.next(fullLeft);
         }
     }
@@ -2993,7 +2686,7 @@ class DbxTwoColumnColumnHeadComponent {
 }
 DbxTwoColumnColumnHeadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnColumnHeadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxTwoColumnColumnHeadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxTwoColumnColumnHeadComponent, selector: "dbx-two-column-head", inputs: { block: "block", full: "full" }, ngImport: i0, template: `
-    <div class="dbx-two-column-head" [ngClass]="{ 'block': block, 'full': full }">
+    <div class="dbx-two-column-head" [ngClass]="{ block: block, full: full }">
       <ng-content></ng-content>
     </div>
   `, isInline: true, directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
@@ -3002,7 +2695,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-two-column-head',
                     template: `
-    <div class="dbx-two-column-head" [ngClass]="{ 'block': block, 'full': full }">
+    <div class="dbx-two-column-head" [ngClass]="{ block: block, full: full }">
       <ng-content></ng-content>
     </div>
   `
@@ -3048,7 +2741,8 @@ class DbxTwoColumnRightComponent {
         this._showBack = new BehaviorSubject(true);
         this.ref$ = this.twoColumnsContextStore.backRef$;
         this.showBack$ = combineLatest([
-            this._showBack, this.ref$.pipe(map((x) => !x)) // TODO: Is this correct? Show back if ref is not defined?
+            this._showBack,
+            this.ref$.pipe(map((x) => !x)) // TODO: Is this correct? Show back if ref is not defined?
         ]).pipe(map(([a, b]) => a && b));
     }
     ngAfterViewInit() {
@@ -3075,7 +2769,7 @@ DbxTwoColumnRightComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnRightComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dbx-two-column-right', host: {
-                        'class': "dbx-two-column-right d-block"
+                        class: 'dbx-two-column-right d-block'
                     }, template: "<dbx-two-column-head>\n  <!-- Back Buttons -->\n  <ng-container *ngIf=\"showBack$ | async\">\n    <button mat-icon-button class=\"back-button\" (click)=\"backClicked()\" aria-label=\"back button\">\n      <mat-icon>navigate_before</mat-icon>\n    </button>\n  </ng-container>\n  <ng-container *ngIf=\"ref$ | async\">\n    <dbx-anchor [anchor]=\"ref$ | async\">\n      <button mat-icon-button class=\"back-button\" aria-label=\"back button\">\n        <mat-icon>navigate_before</mat-icon>\n      </button>\n    </dbx-anchor>\n  </ng-container>\n  <span *ngIf=\"header\" class=\"right-nav-title\">{{ header }}</span>\n  <span class=\"right-nav-spacer\"></span>\n  <span class=\"spacer\"></span>\n  <ng-content select=\"[nav]\"></ng-content>\n</dbx-two-column-head>\n<div class=\"dbx-two-column-right-content\">\n  <ng-content></ng-content>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: TwoColumnsContextStore, decorators: [{
                     type: Inject,
@@ -3089,58 +2783,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxTwoColumnLayoutModule {
 }
 DbxTwoColumnLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxTwoColumnLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnLayoutModule, declarations: [DbxTwoColumnComponent,
-        DbxTwoColumnRightComponent,
-        DbxTwoColumnColumnHeadComponent,
-        DbxTwoColumnSrefDirective,
-        DbxTwoColumnBackDirective,
-        DbxTwoColumnFullLeftDirective,
-        DbxTwoColumnContextDirective], imports: [CommonModule,
-        MatIconModule,
-        MatButtonModule,
-        DbxRouterAnchorModule,
-        DbxContentLayoutModule], exports: [DbxTwoColumnComponent,
-        DbxTwoColumnRightComponent,
-        DbxTwoColumnColumnHeadComponent,
-        DbxTwoColumnSrefDirective,
-        DbxTwoColumnBackDirective,
-        DbxTwoColumnFullLeftDirective,
-        DbxTwoColumnContextDirective] });
-DbxTwoColumnLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnLayoutModule, imports: [[
-            CommonModule,
-            MatIconModule,
-            MatButtonModule,
-            DbxRouterAnchorModule,
-            DbxContentLayoutModule
-        ]] });
+DbxTwoColumnLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnLayoutModule, declarations: [DbxTwoColumnComponent, DbxTwoColumnRightComponent, DbxTwoColumnColumnHeadComponent, DbxTwoColumnSrefDirective, DbxTwoColumnBackDirective, DbxTwoColumnFullLeftDirective, DbxTwoColumnContextDirective], imports: [CommonModule, MatIconModule, MatButtonModule, DbxRouterAnchorModule, DbxContentLayoutModule], exports: [DbxTwoColumnComponent, DbxTwoColumnRightComponent, DbxTwoColumnColumnHeadComponent, DbxTwoColumnSrefDirective, DbxTwoColumnBackDirective, DbxTwoColumnFullLeftDirective, DbxTwoColumnContextDirective] });
+DbxTwoColumnLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnLayoutModule, imports: [[CommonModule, MatIconModule, MatButtonModule, DbxRouterAnchorModule, DbxContentLayoutModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTwoColumnLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        DbxRouterAnchorModule,
-                        DbxContentLayoutModule
-                    ],
-                    declarations: [
-                        DbxTwoColumnComponent,
-                        DbxTwoColumnRightComponent,
-                        DbxTwoColumnColumnHeadComponent,
-                        DbxTwoColumnSrefDirective,
-                        DbxTwoColumnBackDirective,
-                        DbxTwoColumnFullLeftDirective,
-                        DbxTwoColumnContextDirective
-                    ],
-                    exports: [
-                        DbxTwoColumnComponent,
-                        DbxTwoColumnRightComponent,
-                        DbxTwoColumnColumnHeadComponent,
-                        DbxTwoColumnSrefDirective,
-                        DbxTwoColumnBackDirective,
-                        DbxTwoColumnFullLeftDirective,
-                        DbxTwoColumnContextDirective
-                    ],
+                    imports: [CommonModule, MatIconModule, MatButtonModule, DbxRouterAnchorModule, DbxContentLayoutModule],
+                    declarations: [DbxTwoColumnComponent, DbxTwoColumnRightComponent, DbxTwoColumnColumnHeadComponent, DbxTwoColumnSrefDirective, DbxTwoColumnBackDirective, DbxTwoColumnFullLeftDirective, DbxTwoColumnContextDirective],
+                    exports: [DbxTwoColumnComponent, DbxTwoColumnRightComponent, DbxTwoColumnColumnHeadComponent, DbxTwoColumnSrefDirective, DbxTwoColumnBackDirective, DbxTwoColumnFullLeftDirective, DbxTwoColumnContextDirective]
                 }]
         }] });
 
@@ -3188,42 +2838,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxOneColumnLayoutModule {
 }
 DbxOneColumnLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOneColumnLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxOneColumnLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOneColumnLayoutModule, declarations: [DbxOneColumnComponent], imports: [CommonModule,
-        DbxTwoColumnLayoutModule], exports: [DbxOneColumnComponent] });
-DbxOneColumnLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOneColumnLayoutModule, imports: [[
-            CommonModule,
-            DbxTwoColumnLayoutModule
-        ]] });
+DbxOneColumnLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOneColumnLayoutModule, declarations: [DbxOneColumnComponent], imports: [CommonModule, DbxTwoColumnLayoutModule], exports: [DbxOneColumnComponent] });
+DbxOneColumnLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOneColumnLayoutModule, imports: [[CommonModule, DbxTwoColumnLayoutModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOneColumnLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxTwoColumnLayoutModule
-                    ],
-                    declarations: [
-                        DbxOneColumnComponent
-                    ],
-                    exports: [
-                        DbxOneColumnComponent
-                    ],
+                    imports: [CommonModule, DbxTwoColumnLayoutModule],
+                    declarations: [DbxOneColumnComponent],
+                    exports: [DbxOneColumnComponent]
                 }]
         }] });
 
 class DbxColumnLayoutModule {
 }
 DbxColumnLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxColumnLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxColumnLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxColumnLayoutModule, exports: [DbxOneColumnLayoutModule,
-        DbxTwoColumnLayoutModule] });
-DbxColumnLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxColumnLayoutModule, imports: [DbxOneColumnLayoutModule,
-        DbxTwoColumnLayoutModule] });
+DbxColumnLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxColumnLayoutModule, exports: [DbxOneColumnLayoutModule, DbxTwoColumnLayoutModule] });
+DbxColumnLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxColumnLayoutModule, imports: [DbxOneColumnLayoutModule, DbxTwoColumnLayoutModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxColumnLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    exports: [
-                        DbxOneColumnLayoutModule,
-                        DbxTwoColumnLayoutModule
-                    ]
+                    exports: [DbxOneColumnLayoutModule, DbxTwoColumnLayoutModule]
                 }]
         }] });
 
@@ -3234,14 +2868,14 @@ var CompactMode;
 })(CompactMode || (CompactMode = {}));
 function compactModeFromInput(input) {
     if (isBoolean(input)) {
-        input = (input) ? CompactMode.COMPACT : CompactMode.FULL;
+        input = input ? CompactMode.COMPACT : CompactMode.FULL;
     }
     return input === CompactMode.COMPACT ? CompactMode.COMPACT : CompactMode.FULL;
 }
 function mapCompactModeObs(mode$, config) {
     const modeObs = mode$ ?? of(config.defaultMode ?? CompactMode.FULL);
     return modeObs.pipe(map((inputMode) => {
-        const isCompact = ((inputMode ?? config.defaultMode) === CompactMode.COMPACT);
+        const isCompact = (inputMode ?? config.defaultMode) === CompactMode.COMPACT;
         if (isCompact) {
             return config.compact;
         }
@@ -3255,7 +2889,7 @@ class CompactContextStore extends ComponentStore {
     constructor() {
         super({ mode: CompactMode.FULL });
         // MARK: Accessors
-        this.mode$ = this.state$.pipe(map(x => x.mode));
+        this.mode$ = this.state$.pipe(map((x) => x.mode));
         this.setMode = this.updater((state, mode) => ({ mode: compactModeFromInput(mode) }));
     }
 }
@@ -3284,7 +2918,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: '[dbxCompact]',
                     providers: [CompactContextStore],
-                    exportAs: 'compact',
+                    exportAs: 'compact'
                 }]
         }], ctorParameters: function () { return [{ type: CompactContextStore }]; }, propDecorators: { mode: [{
                 type: Input,
@@ -3298,21 +2932,13 @@ class DbxCompactLayoutModule {
 }
 DbxCompactLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCompactLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 DbxCompactLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCompactLayoutModule, declarations: [DbxCompactDirective], imports: [CommonModule], exports: [DbxCompactDirective] });
-DbxCompactLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCompactLayoutModule, imports: [[
-            CommonModule
-        ]] });
+DbxCompactLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCompactLayoutModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxCompactLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule
-                    ],
-                    declarations: [
-                        DbxCompactDirective
-                    ],
-                    exports: [
-                        DbxCompactDirective
-                    ]
+                    imports: [CommonModule],
+                    declarations: [DbxCompactDirective],
+                    exports: [DbxCompactDirective]
                 }]
         }] });
 
@@ -3342,7 +2968,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
         <ng-content></ng-content>
       </mat-toolbar>
     </div>
-  `,
+  `
                     // TODO: styleUrls: ['./container.scss']
                 }]
         }], propDecorators: { color: [{
@@ -3375,7 +3001,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
       <span class="dbx-flag-spacer"></span>
       <ng-content></ng-content>
     </dbx-flag>
-  `,
+  `
                     // TODO: styleUrls: ['./container.scss']
                 }]
         }], propDecorators: { color: [{
@@ -3390,29 +3016,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxFlagLayoutModule {
 }
 DbxFlagLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlagLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxFlagLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlagLayoutModule, declarations: [DbxFlagComponent,
-        DbxFlagPromptComponent], imports: [CommonModule,
-        MatToolbarModule], exports: [DbxFlagComponent,
-        DbxFlagPromptComponent] });
-DbxFlagLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlagLayoutModule, imports: [[
-            CommonModule,
-            MatToolbarModule
-        ]] });
+DbxFlagLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlagLayoutModule, declarations: [DbxFlagComponent, DbxFlagPromptComponent], imports: [CommonModule, MatToolbarModule], exports: [DbxFlagComponent, DbxFlagPromptComponent] });
+DbxFlagLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlagLayoutModule, imports: [[CommonModule, MatToolbarModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlagLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatToolbarModule
-                    ],
-                    declarations: [
-                        DbxFlagComponent,
-                        DbxFlagPromptComponent
-                    ],
-                    exports: [
-                        DbxFlagComponent,
-                        DbxFlagPromptComponent
-                    ]
+                    imports: [CommonModule, MatToolbarModule],
+                    declarations: [DbxFlagComponent, DbxFlagPromptComponent],
+                    exports: [DbxFlagComponent, DbxFlagPromptComponent]
                 }]
         }] });
 
@@ -3428,7 +3039,7 @@ class DbxFlexGroupDirective extends AbstractSubscriptionDirective {
         this.relative = false;
         this._small = false;
         this._breakpoint = new BehaviorSubject('tablet');
-        this.isSmallScreen$ = this._dbxScreenMediaService.isBreakpointActive(this._breakpoint).pipe(map(x => !x), distinctUntilChanged(), shareReplay(1));
+        this.isSmallScreen$ = this._dbxScreenMediaService.isBreakpointActive(this._breakpoint).pipe(map((x) => !x), distinctUntilChanged(), shareReplay(1));
     }
     get small() {
         return this._small;
@@ -3493,26 +3104,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxFlexLayoutModule {
 }
 DbxFlexLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlexLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxFlexLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlexLayoutModule, declarations: [DbxFlexGroupDirective,
-        DbxFlexSizeDirective], imports: [CommonModule], exports: [DbxFlexGroupDirective,
-        DbxFlexSizeDirective] });
-DbxFlexLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlexLayoutModule, imports: [[
-            CommonModule
-        ]] });
+DbxFlexLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlexLayoutModule, declarations: [DbxFlexGroupDirective, DbxFlexSizeDirective], imports: [CommonModule], exports: [DbxFlexGroupDirective, DbxFlexSizeDirective] });
+DbxFlexLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlexLayoutModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFlexLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule
-                    ],
-                    declarations: [
-                        DbxFlexGroupDirective,
-                        DbxFlexSizeDirective
-                    ],
-                    exports: [
-                        DbxFlexGroupDirective,
-                        DbxFlexSizeDirective
-                    ]
+                    imports: [CommonModule],
+                    declarations: [DbxFlexGroupDirective, DbxFlexSizeDirective],
+                    exports: [DbxFlexGroupDirective, DbxFlexSizeDirective]
                 }]
         }] });
 
@@ -3523,34 +3122,34 @@ class DbxIconItemComponent {
 }
 DbxIconItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxIconItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxIconItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxIconItemComponent, selector: "dbx-icon-item", inputs: { icon: "icon", header: "header" }, ngImport: i0, template: `
-  <div class="dbx-icon-item">
-    <div class="left">
-      <mat-icon>{{ icon }}</mat-icon>
-    </div>
-    <div class="right">
-      <h3 *ngIf="header" class="dbx-icon-item-header">{{ header }}</h3>
-      <div class="right-content">
-        <ng-content></ng-content>
+    <div class="dbx-icon-item">
+      <div class="left">
+        <mat-icon>{{ icon }}</mat-icon>
+      </div>
+      <div class="right">
+        <h3 *ngIf="header" class="dbx-icon-item-header">{{ header }}</h3>
+        <div class="right-content">
+          <ng-content></ng-content>
+        </div>
       </div>
     </div>
-  </div>
   `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxIconItemComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-icon-item',
                     template: `
-  <div class="dbx-icon-item">
-    <div class="left">
-      <mat-icon>{{ icon }}</mat-icon>
-    </div>
-    <div class="right">
-      <h3 *ngIf="header" class="dbx-icon-item-header">{{ header }}</h3>
-      <div class="right-content">
-        <ng-content></ng-content>
+    <div class="dbx-icon-item">
+      <div class="left">
+        <mat-icon>{{ icon }}</mat-icon>
+      </div>
+      <div class="right">
+        <h3 *ngIf="header" class="dbx-icon-item-header">{{ header }}</h3>
+        <div class="right-content">
+          <ng-content></ng-content>
+        </div>
       </div>
     </div>
-  </div>
   `
                 }]
         }], propDecorators: { icon: [{
@@ -3562,25 +3161,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxItemLayoutModule {
 }
 DbxItemLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxItemLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxItemLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxItemLayoutModule, declarations: [DbxIconItemComponent], imports: [CommonModule,
-        MatIconModule], exports: [DbxIconItemComponent] });
-DbxItemLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxItemLayoutModule, imports: [[
-            CommonModule,
-            MatIconModule
-        ]] });
+DbxItemLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxItemLayoutModule, declarations: [DbxIconItemComponent], imports: [CommonModule, MatIconModule], exports: [DbxIconItemComponent] });
+DbxItemLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxItemLayoutModule, imports: [[CommonModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxItemLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatIconModule
-                    ],
-                    declarations: [
-                        DbxIconItemComponent
-                    ],
-                    exports: [
-                        DbxIconItemComponent
-                    ]
+                    imports: [CommonModule, MatIconModule],
+                    declarations: [DbxIconItemComponent],
+                    exports: [DbxIconItemComponent]
                 }]
         }] });
 
@@ -3603,7 +3191,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     <div class="dbx-list-empty-content">
       <ng-content></ng-content>
     </div>
-  `,
+  `
                     // TODO: styleUrls: ['./container.scss']
                 }]
         }] });
@@ -3634,26 +3222,26 @@ class DbxLoadingProgressComponent {
 }
 DbxLoadingProgressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxLoadingProgressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxLoadingProgressComponent, selector: "dbx-loading-progress", inputs: { text: "text", linear: "linear", mode: "mode", color: "color", value: "value", bufferValue: "bufferValue", diameter: "diameter" }, ngImport: i0, template: `
-  <div class="loading-progress-view">
-    <ng-container [ngSwitch]="linear">
-      <mat-progress-bar *ngSwitchCase="true" [mode]="bmode" [color]="color" [bufferValue]="bufferValue" [value]="value" style="margin: auto;"></mat-progress-bar>
-      <mat-progress-spinner *ngSwitchDefault [diameter]="diameter || 96" [mode]="smode" [color]="color" [value]="value" style="margin: auto;"></mat-progress-spinner>
-    </ng-container>
-    <div *ngIf="text" class="hint">{{ text }}</div>
-  </div>
+    <div class="loading-progress-view">
+      <ng-container [ngSwitch]="linear">
+        <mat-progress-bar *ngSwitchCase="true" [mode]="bmode" [color]="color" [bufferValue]="bufferValue" [value]="value" style="margin: auto;"></mat-progress-bar>
+        <mat-progress-spinner *ngSwitchDefault [diameter]="diameter || 96" [mode]="smode" [color]="color" [value]="value" style="margin: auto;"></mat-progress-spinner>
+      </ng-container>
+      <div *ngIf="text" class="hint">{{ text }}</div>
+    </div>
   `, isInline: true, components: [{ type: i3$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingProgressComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-loading-progress',
                     template: `
-  <div class="loading-progress-view">
-    <ng-container [ngSwitch]="linear">
-      <mat-progress-bar *ngSwitchCase="true" [mode]="bmode" [color]="color" [bufferValue]="bufferValue" [value]="value" style="margin: auto;"></mat-progress-bar>
-      <mat-progress-spinner *ngSwitchDefault [diameter]="diameter || 96" [mode]="smode" [color]="color" [value]="value" style="margin: auto;"></mat-progress-spinner>
-    </ng-container>
-    <div *ngIf="text" class="hint">{{ text }}</div>
-  </div>
+    <div class="loading-progress-view">
+      <ng-container [ngSwitch]="linear">
+        <mat-progress-bar *ngSwitchCase="true" [mode]="bmode" [color]="color" [bufferValue]="bufferValue" [value]="value" style="margin: auto;"></mat-progress-bar>
+        <mat-progress-spinner *ngSwitchDefault [diameter]="diameter || 96" [mode]="smode" [color]="color" [value]="value" style="margin: auto;"></mat-progress-spinner>
+      </ng-container>
+      <div *ngIf="text" class="hint">{{ text }}</div>
+    </div>
   `
                 }]
         }], propDecorators: { text: [{
@@ -3720,7 +3308,8 @@ class DbxBasicLoadingComponent {
             if (error) {
                 state = LoadingComponentState.ERROR;
             }
-            else if (loading == null) { // If loading has not yet been defined and no error has occured, we're waiting for some input on loading or error.
+            else if (loading == null) {
+                // If loading has not yet been defined and no error has occured, we're waiting for some input on loading or error.
                 state = LoadingComponentState.NONE;
             }
             else if (loading || !show) {
@@ -3732,8 +3321,8 @@ class DbxBasicLoadingComponent {
             return state;
         }), distinctUntilChanged(), startWith(LoadingComponentState.NONE), shareReplay(1));
         this.error$ = this._error.asObservable();
-        this.hasNoCustomError$ = this._customErrorContent.pipe(map(x => !checkNgContentWrapperHasContent(x)));
-        this.hasNoCustomLoading$ = this._customLoadingContent.pipe(map(x => !checkNgContentWrapperHasContent(x)));
+        this.hasNoCustomError$ = this._customErrorContent.pipe(map((x) => !checkNgContentWrapperHasContent(x)));
+        this.hasNoCustomLoading$ = this._customLoadingContent.pipe(map((x) => !checkNgContentWrapperHasContent(x)));
         this.mode = 'indeterminate';
         this.color = 'primary';
         this.linear = false;
@@ -3775,10 +3364,10 @@ class DbxBasicLoadingComponent {
     }
 }
 DbxBasicLoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBasicLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxBasicLoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxBasicLoadingComponent, selector: "dbx-basic-loading", inputs: { diameter: "diameter", mode: "mode", color: "color", text: "text", linear: "linear", show: "show", loading: "loading", error: "error" }, viewQueries: [{ propertyName: "customErrorContent", first: true, predicate: ["customError"], descendants: true }, { propertyName: "customLoadingContent", first: true, predicate: ["customLoading"], descendants: true }], ngImport: i0, template: "<ng-container [ngSwitch]=\"state$ | async\">\n  <ng-container *ngSwitchCase=\"0\">\n    <!-- Loading -->\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"1\">\n    <!-- Content -->\n    <ng-content></ng-content>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"2\">\n    <!-- Error -->\n    <ng-container *ngTemplateOutlet=\"errorTemplate\"></ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #loadingTemplate>\n  <dbx-loading-progress *ngIf=\"hasNoCustomLoading$ | async\" [mode]=\"mode\" [color]=\"color\" [text]=\"text\"\n    [linear]=\"linear\" [diameter]=\"diameter\"></dbx-loading-progress>\n  <div #customLoading>\n    <ng-content select=\"[loading]\"></ng-content>\n  </div>\n</ng-template>\n\n<ng-template #errorTemplate>\n  <dbx-error *ngIf=\"hasNoCustomError$ | async\" [error]=\"error$ | async\"></dbx-error>\n  <div #customError>\n    <ng-content select=\"[error]\"></ng-content>\n  </div>\n  <ng-content select=\"[errorAction]\"></ng-content>\n</ng-template>\n", components: [{ type: DbxLoadingProgressComponent, selector: "dbx-loading-progress", inputs: ["text", "linear", "mode", "color", "value", "bufferValue", "diameter"] }, { type: DbxReadableErrorComponent, selector: "dbx-error", inputs: ["error"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3$1.AsyncPipe } });
+DbxBasicLoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxBasicLoadingComponent, selector: "dbx-basic-loading", inputs: { diameter: "diameter", mode: "mode", color: "color", text: "text", linear: "linear", show: "show", loading: "loading", error: "error" }, viewQueries: [{ propertyName: "customErrorContent", first: true, predicate: ["customError"], descendants: true }, { propertyName: "customLoadingContent", first: true, predicate: ["customLoading"], descendants: true }], ngImport: i0, template: "<ng-container [ngSwitch]=\"state$ | async\">\n  <ng-container *ngSwitchCase=\"0\">\n    <!-- Loading -->\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"1\">\n    <!-- Content -->\n    <ng-content></ng-content>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"2\">\n    <!-- Error -->\n    <ng-container *ngTemplateOutlet=\"errorTemplate\"></ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #loadingTemplate>\n  <dbx-loading-progress *ngIf=\"hasNoCustomLoading$ | async\" [mode]=\"mode\" [color]=\"color\" [text]=\"text\" [linear]=\"linear\" [diameter]=\"diameter\"></dbx-loading-progress>\n  <div #customLoading>\n    <ng-content select=\"[loading]\"></ng-content>\n  </div>\n</ng-template>\n\n<ng-template #errorTemplate>\n  <dbx-error *ngIf=\"hasNoCustomError$ | async\" [error]=\"error$ | async\"></dbx-error>\n  <div #customError>\n    <ng-content select=\"[error]\"></ng-content>\n  </div>\n  <ng-content select=\"[errorAction]\"></ng-content>\n</ng-template>\n", components: [{ type: DbxLoadingProgressComponent, selector: "dbx-loading-progress", inputs: ["text", "linear", "mode", "color", "value", "bufferValue", "diameter"] }, { type: DbxReadableErrorComponent, selector: "dbx-error", inputs: ["error"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxBasicLoadingComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dbx-basic-loading', template: "<ng-container [ngSwitch]=\"state$ | async\">\n  <ng-container *ngSwitchCase=\"0\">\n    <!-- Loading -->\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"1\">\n    <!-- Content -->\n    <ng-content></ng-content>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"2\">\n    <!-- Error -->\n    <ng-container *ngTemplateOutlet=\"errorTemplate\"></ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #loadingTemplate>\n  <dbx-loading-progress *ngIf=\"hasNoCustomLoading$ | async\" [mode]=\"mode\" [color]=\"color\" [text]=\"text\"\n    [linear]=\"linear\" [diameter]=\"diameter\"></dbx-loading-progress>\n  <div #customLoading>\n    <ng-content select=\"[loading]\"></ng-content>\n  </div>\n</ng-template>\n\n<ng-template #errorTemplate>\n  <dbx-error *ngIf=\"hasNoCustomError$ | async\" [error]=\"error$ | async\"></dbx-error>\n  <div #customError>\n    <ng-content select=\"[error]\"></ng-content>\n  </div>\n  <ng-content select=\"[errorAction]\"></ng-content>\n</ng-template>\n" }]
+            args: [{ selector: 'dbx-basic-loading', template: "<ng-container [ngSwitch]=\"state$ | async\">\n  <ng-container *ngSwitchCase=\"0\">\n    <!-- Loading -->\n    <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"1\">\n    <!-- Content -->\n    <ng-content></ng-content>\n  </ng-container>\n  <ng-container *ngSwitchCase=\"2\">\n    <!-- Error -->\n    <ng-container *ngTemplateOutlet=\"errorTemplate\"></ng-container>\n  </ng-container>\n</ng-container>\n\n<ng-template #loadingTemplate>\n  <dbx-loading-progress *ngIf=\"hasNoCustomLoading$ | async\" [mode]=\"mode\" [color]=\"color\" [text]=\"text\" [linear]=\"linear\" [diameter]=\"diameter\"></dbx-loading-progress>\n  <div #customLoading>\n    <ng-content select=\"[loading]\"></ng-content>\n  </div>\n</ng-template>\n\n<ng-template #errorTemplate>\n  <dbx-error *ngIf=\"hasNoCustomError$ | async\" [error]=\"error$ | async\"></dbx-error>\n  <div #customError>\n    <ng-content select=\"[error]\"></ng-content>\n  </div>\n  <ng-content select=\"[errorAction]\"></ng-content>\n</ng-template>\n" }]
         }], propDecorators: { diameter: [{
                 type: Input
             }], mode: [{
@@ -3811,7 +3400,7 @@ class DbxLoadingComponent {
         this._context = new BehaviorSubject(undefined);
         this._inputLoading = new BehaviorSubject(true);
         this._inputError = new BehaviorSubject(undefined);
-        this.state$ = combineLatest([this._inputLoading, this._inputError, this._context.pipe(switchMap(x => (x != null) ? x.stream$ : of(undefined)))]).pipe(map(([inputLoading, inputError, loadingState]) => {
+        this.state$ = combineLatest([this._inputLoading, this._inputError, this._context.pipe(switchMap((x) => (x != null ? x.stream$ : of(undefined))))]).pipe(map(([inputLoading, inputError, loadingState]) => {
             if (loadingState) {
                 return loadingState;
             }
@@ -3822,8 +3411,8 @@ class DbxLoadingComponent {
                 };
             }
         }), distinctUntilChanged((a, b) => a.loading === b.loading && a.error === b.error), shareReplay(1));
-        this.loading$ = this.state$.pipe(map(x => x.loading), distinctUntilChanged(), shareReplay(1));
-        this.error$ = this.state$.pipe(map(x => x.error), distinctUntilChanged(), shareReplay(1));
+        this.loading$ = this.state$.pipe(map((x) => x.loading), distinctUntilChanged(), shareReplay(1));
+        this.error$ = this.state$.pipe(map((x) => x.error), distinctUntilChanged(), shareReplay(1));
         this.mode = 'indeterminate';
         this.color = 'primary';
     }
@@ -3853,24 +3442,24 @@ class DbxLoadingComponent {
 }
 DbxLoadingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxLoadingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxLoadingComponent, selector: "dbx-loading", inputs: { show: "show", text: "text", mode: "mode", color: "color", diameter: "diameter", linear: "linear", context: "context", loading: "loading", error: "error" }, ngImport: i0, template: `
-  <dbx-basic-loading [show]="show" [color]="color" [text]="text" [mode]="mode" [linear]="linear" [diameter]="diameter" [error]="error$ | async" [loading]="loading$ | async">
-    <ng-content loading select="[loading]"></ng-content>
-    <ng-content></ng-content>
-    <ng-content error select="[error]"></ng-content>
-    <ng-content errorAction select="[errorAction]"></ng-content>
-  </dbx-basic-loading>
+    <dbx-basic-loading [show]="show" [color]="color" [text]="text" [mode]="mode" [linear]="linear" [diameter]="diameter" [error]="error$ | async" [loading]="loading$ | async">
+      <ng-content loading select="[loading]"></ng-content>
+      <ng-content></ng-content>
+      <ng-content error select="[error]"></ng-content>
+      <ng-content errorAction select="[errorAction]"></ng-content>
+    </dbx-basic-loading>
   `, isInline: true, components: [{ type: DbxBasicLoadingComponent, selector: "dbx-basic-loading", inputs: ["diameter", "mode", "color", "text", "linear", "show", "loading", "error"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-loading',
                     template: `
-  <dbx-basic-loading [show]="show" [color]="color" [text]="text" [mode]="mode" [linear]="linear" [diameter]="diameter" [error]="error$ | async" [loading]="loading$ | async">
-    <ng-content loading select="[loading]"></ng-content>
-    <ng-content></ng-content>
-    <ng-content error select="[error]"></ng-content>
-    <ng-content errorAction select="[errorAction]"></ng-content>
-  </dbx-basic-loading>
+    <dbx-basic-loading [show]="show" [color]="color" [text]="text" [mode]="mode" [linear]="linear" [diameter]="diameter" [error]="error$ | async" [loading]="loading$ | async">
+      <ng-content loading select="[loading]"></ng-content>
+      <ng-content></ng-content>
+      <ng-content error select="[error]"></ng-content>
+      <ng-content errorAction select="[errorAction]"></ng-content>
+    </dbx-basic-loading>
   `
                 }]
         }], propDecorators: { show: [{
@@ -3922,13 +3511,13 @@ class DbxListComponent {
         this.isEmpty$ = this.context.isEmpty$;
         this.disabled$ = this._disabled.asObservable();
         this.selectionMode$ = this._selectionMode.asObservable();
-        this.hideOnEmpty$ = this._config.pipe(filterMaybe(), map(x => Boolean(x.hideOnEmpty)), distinctUntilChanged(), shareReplay(1));
-        this.invertedList$ = this._config.pipe(filterMaybe(), map(x => Boolean(x?.throttle)), distinctUntilChanged(), shareReplay(1));
-        this.throttleScroll$ = this._config.pipe(map(x => (x?.throttle) ?? this.DEFAULT_THROTTLE_SCROLL), distinctUntilChanged(), shareReplay(1));
-        this.scrollDistance$ = this._config.pipe(map(x => (x?.scrollDistance) ?? this.DEFAULT_SCROLL_DISTANCE), distinctUntilChanged(), shareReplay(1));
+        this.hideOnEmpty$ = this._config.pipe(filterMaybe(), map((x) => Boolean(x.hideOnEmpty)), distinctUntilChanged(), shareReplay(1));
+        this.invertedList$ = this._config.pipe(filterMaybe(), map((x) => Boolean(x?.throttle)), distinctUntilChanged(), shareReplay(1));
+        this.throttleScroll$ = this._config.pipe(map((x) => x?.throttle ?? this.DEFAULT_THROTTLE_SCROLL), distinctUntilChanged(), shareReplay(1));
+        this.scrollDistance$ = this._config.pipe(map((x) => x?.scrollDistance ?? this.DEFAULT_SCROLL_DISTANCE), distinctUntilChanged(), shareReplay(1));
         this.scrollLoadMoreTrigger$ = this._config.pipe(switchMap((config) => {
             const loadNextDirection = config?.invertedList ? 'up' : 'down';
-            return this._scrollTrigger.pipe(filter(x => x === loadNextDirection));
+            return this._scrollTrigger.pipe(filter((x) => x === loadNextDirection));
         }));
         this.loadMore$ = merge(this.scrollLoadMoreTrigger$, this._loadMoreTrigger);
         this.injectedComponentConfig$ = this._config.pipe(distinctUntilChanged(), map((config) => {
@@ -3947,7 +3536,8 @@ class DbxListComponent {
                         }
                         instance.setListContext(this.context);
                         if (loadMore) {
-                            this._loadMoreSub.subscription = this.loadMore$.pipe(
+                            this._loadMoreSub.subscription = this.loadMore$
+                                .pipe(
                             // Throttle additional loading calls using exhaustMap until observable returns, if one is returned.
                             exhaustMap(() => {
                                 const result = loadMore();
@@ -3959,7 +3549,8 @@ class DbxListComponent {
                                     obs = of();
                                 }
                                 return obs;
-                            })).subscribe();
+                            }))
+                                .subscribe();
                         }
                         if (onClick) {
                             if (instance.clickValue) {
@@ -3987,7 +3578,7 @@ class DbxListComponent {
                 return of(true);
             }
             else {
-                return this.hideOnEmpty$.pipe(switchMap((hide) => (hide === false) ? of(false) : this.isEmpty$), distinctUntilChanged(), tapDetectChanges(this.cdRef), shareReplay(1));
+                return this.hideOnEmpty$.pipe(switchMap((hide) => (hide === false ? of(false) : this.isEmpty$)), distinctUntilChanged(), tapDetectChanges(this.cdRef), shareReplay(1));
             }
         }));
     }
@@ -4080,13 +3671,13 @@ class DbxListComponent {
     }
 }
 DbxListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-DbxListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxListComponent, selector: "dbx-list", inputs: { padded: "padded", state$: "state$", config: "config", disabled: "disabled", selectionMode: "selectionMode" }, outputs: { contentScrolled: "contentScrolled" }, host: { properties: { "class.dbx-list-padded": "padded" }, classAttribute: "d-block dbx-list" }, ngImport: i0, template: "<dbx-loading [context]=\"context\" [linear]=\"true\"></dbx-loading>\n<div dbxListInternalContent infinite-scroll [infiniteScrollDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\"\n  [infiniteScrollUpDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\" [hide]=\"hideContent$ | async\"\n  [infiniteScrollThrottle]=\"(throttleScroll$ | async) ?? DEFAULT_THROTTLE_SCROLL\" [scrollWindow]=\"false\"\n  (scrolled)=\"onScrollDown()\" (scrolledUp)=\"onScrollUp()\">\n  <ng-content select=\"[top]\"></ng-content>\n  <dbx-injection [config]=\"injectedComponentConfig$ | async\"></dbx-injection>\n  <ng-content select=\"[bottom]\"></ng-content>\n</div>\n<ng-content *ngIf=\"isEmpty$ | async\" select=\"[empty]\"></ng-content>\n", components: [{ type: i0.forwardRef(function () { return DbxLoadingComponent; }), selector: "dbx-loading", inputs: ["show", "text", "mode", "color", "diameter", "linear", "context", "loading", "error"] }, { type: i0.forwardRef(function () { return i1$2.DbxInjectionComponent; }), selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], directives: [{ type: i0.forwardRef(function () { return DbxListInternalContentDirective; }), selector: "[dbxListInternalContent]", inputs: ["hide"] }, { type: i0.forwardRef(function () { return i3$4.InfiniteScrollDirective; }), selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i0.forwardRef(function () { return i3$1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i0.forwardRef(function () { return i3$1.AsyncPipe; }) } });
+DbxListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxListComponent, selector: "dbx-list", inputs: { padded: "padded", state$: "state$", config: "config", disabled: "disabled", selectionMode: "selectionMode" }, outputs: { contentScrolled: "contentScrolled" }, host: { properties: { "class.dbx-list-padded": "padded" }, classAttribute: "d-block dbx-list" }, ngImport: i0, template: "<dbx-loading [context]=\"context\" [linear]=\"true\"></dbx-loading>\n<div dbxListInternalContent infinite-scroll [infiniteScrollDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\" [infiniteScrollUpDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\" [hide]=\"hideContent$ | async\" [infiniteScrollThrottle]=\"(throttleScroll$ | async) ?? DEFAULT_THROTTLE_SCROLL\" [scrollWindow]=\"false\" (scrolled)=\"onScrollDown()\" (scrolledUp)=\"onScrollUp()\">\n  <ng-content select=\"[top]\"></ng-content>\n  <dbx-injection [config]=\"injectedComponentConfig$ | async\"></dbx-injection>\n  <ng-content select=\"[bottom]\"></ng-content>\n</div>\n<ng-content *ngIf=\"isEmpty$ | async\" select=\"[empty]\"></ng-content>\n", components: [{ type: i0.forwardRef(function () { return DbxLoadingComponent; }), selector: "dbx-loading", inputs: ["show", "text", "mode", "color", "diameter", "linear", "context", "loading", "error"] }, { type: i0.forwardRef(function () { return i1$2.DbxInjectionComponent; }), selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], directives: [{ type: i0.forwardRef(function () { return DbxListInternalContentDirective; }), selector: "[dbxListInternalContent]", inputs: ["hide"] }, { type: i0.forwardRef(function () { return i3$4.InfiniteScrollDirective; }), selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i0.forwardRef(function () { return i3$1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i0.forwardRef(function () { return i3$1.AsyncPipe; }) } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dbx-list', host: {
-                        'class': 'd-block dbx-list',
+                        class: 'd-block dbx-list',
                         '[class.dbx-list-padded]': 'padded'
-                    }, template: "<dbx-loading [context]=\"context\" [linear]=\"true\"></dbx-loading>\n<div dbxListInternalContent infinite-scroll [infiniteScrollDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\"\n  [infiniteScrollUpDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\" [hide]=\"hideContent$ | async\"\n  [infiniteScrollThrottle]=\"(throttleScroll$ | async) ?? DEFAULT_THROTTLE_SCROLL\" [scrollWindow]=\"false\"\n  (scrolled)=\"onScrollDown()\" (scrolledUp)=\"onScrollUp()\">\n  <ng-content select=\"[top]\"></ng-content>\n  <dbx-injection [config]=\"injectedComponentConfig$ | async\"></dbx-injection>\n  <ng-content select=\"[bottom]\"></ng-content>\n</div>\n<ng-content *ngIf=\"isEmpty$ | async\" select=\"[empty]\"></ng-content>\n" }]
+                    }, template: "<dbx-loading [context]=\"context\" [linear]=\"true\"></dbx-loading>\n<div dbxListInternalContent infinite-scroll [infiniteScrollDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\" [infiniteScrollUpDistance]=\"(scrollDistance$ | async) ?? DEFAULT_SCROLL_DISTANCE\" [hide]=\"hideContent$ | async\" [infiniteScrollThrottle]=\"(throttleScroll$ | async) ?? DEFAULT_THROTTLE_SCROLL\" [scrollWindow]=\"false\" (scrolled)=\"onScrollDown()\" (scrolledUp)=\"onScrollUp()\">\n  <ng-content select=\"[top]\"></ng-content>\n  <dbx-injection [config]=\"injectedComponentConfig$ | async\"></dbx-injection>\n  <ng-content select=\"[bottom]\"></ng-content>\n</div>\n<ng-content *ngIf=\"isEmpty$ | async\" select=\"[empty]\"></ng-content>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { padded: [{
                 type: Input
             }], contentScrolled: [{
@@ -4122,7 +3713,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: '[dbxListInternalContent]',
                     host: {
-                        'class': 'd-block dbx-list-content',
+                        class: 'd-block dbx-list-content',
                         '[class.dbx-list-content-hidden]': 'hide'
                     }
                 }]
@@ -4324,30 +3915,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxReadableErrorModule {
 }
 DbxReadableErrorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxReadableErrorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxReadableErrorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxReadableErrorModule, declarations: [DbxReadableErrorComponent,
-        DbxLoadingErrorDirective,
-        DbxActionErrorDirective], imports: [CommonModule], exports: [DbxReadableErrorComponent,
-        DbxLoadingErrorDirective,
-        DbxActionErrorDirective] });
-DbxReadableErrorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxReadableErrorModule, imports: [[
-            CommonModule
-        ]] });
+DbxReadableErrorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxReadableErrorModule, declarations: [DbxReadableErrorComponent, DbxLoadingErrorDirective, DbxActionErrorDirective], imports: [CommonModule], exports: [DbxReadableErrorComponent, DbxLoadingErrorDirective, DbxActionErrorDirective] });
+DbxReadableErrorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxReadableErrorModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxReadableErrorModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule
-                    ],
-                    declarations: [
-                        DbxReadableErrorComponent,
-                        DbxLoadingErrorDirective,
-                        DbxActionErrorDirective
-                    ],
-                    exports: [
-                        DbxReadableErrorComponent,
-                        DbxLoadingErrorDirective,
-                        DbxActionErrorDirective
-                    ]
+                    imports: [CommonModule],
+                    declarations: [DbxReadableErrorComponent, DbxLoadingErrorDirective, DbxActionErrorDirective],
+                    exports: [DbxReadableErrorComponent, DbxLoadingErrorDirective, DbxActionErrorDirective]
                 }]
         }] });
 
@@ -4361,7 +3936,7 @@ function convertServerErrorParams(httpError) {
 /**
  * Catches error server params and feeds them to an action that takes ServerErrorParams as a prop.
  */
-function catchErrorServerParams(action, mapError = ((error) => error)) {
+function catchErrorServerParams(action, mapError = (error) => error) {
     return catchError((error) => {
         const serverErrorParams = convertServerErrorParams(error);
         const mappedError = mapError(serverErrorParams);
@@ -4403,48 +3978,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxLoadingModule {
 }
 DbxLoadingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxLoadingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingModule, declarations: [DbxLoadingComponent,
-        DbxBasicLoadingComponent,
-        DbxLoadingProgressComponent,
-        DbxActionLoadingContextDirective], imports: [CommonModule,
-        DbxReadableErrorModule,
-        MatProgressSpinnerModule,
-        MatProgressBarModule], exports: [DbxLoadingComponent,
-        DbxBasicLoadingComponent,
-        DbxLoadingProgressComponent,
-        MatProgressSpinnerModule,
-        MatProgressBarModule,
-        DbxActionLoadingContextDirective] });
-DbxLoadingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingModule, imports: [[
-            CommonModule,
-            DbxReadableErrorModule,
-            MatProgressSpinnerModule,
-            MatProgressBarModule
-        ], MatProgressSpinnerModule,
-        MatProgressBarModule] });
+DbxLoadingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingModule, declarations: [DbxLoadingComponent, DbxBasicLoadingComponent, DbxLoadingProgressComponent, DbxActionLoadingContextDirective], imports: [CommonModule, DbxReadableErrorModule, MatProgressSpinnerModule, MatProgressBarModule], exports: [DbxLoadingComponent, DbxBasicLoadingComponent, DbxLoadingProgressComponent, MatProgressSpinnerModule, MatProgressBarModule, DbxActionLoadingContextDirective] });
+DbxLoadingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingModule, imports: [[CommonModule, DbxReadableErrorModule, MatProgressSpinnerModule, MatProgressBarModule], MatProgressSpinnerModule, MatProgressBarModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLoadingModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxReadableErrorModule,
-                        MatProgressSpinnerModule,
-                        MatProgressBarModule
-                    ],
-                    declarations: [
-                        DbxLoadingComponent,
-                        DbxBasicLoadingComponent,
-                        DbxLoadingProgressComponent,
-                        DbxActionLoadingContextDirective
-                    ],
-                    exports: [
-                        DbxLoadingComponent,
-                        DbxBasicLoadingComponent,
-                        DbxLoadingProgressComponent,
-                        MatProgressSpinnerModule,
-                        MatProgressBarModule,
-                        DbxActionLoadingContextDirective
-                    ]
+                    imports: [CommonModule, DbxReadableErrorModule, MatProgressSpinnerModule, MatProgressBarModule],
+                    declarations: [DbxLoadingComponent, DbxBasicLoadingComponent, DbxLoadingProgressComponent, DbxActionLoadingContextDirective],
+                    exports: [DbxLoadingComponent, DbxBasicLoadingComponent, DbxLoadingProgressComponent, MatProgressSpinnerModule, MatProgressBarModule, DbxActionLoadingContextDirective]
                 }]
         }] });
 
@@ -4455,14 +3996,17 @@ class DbxListView {
 }
 // eslint-disable-next-line
 function provideDbxListView(sourceType) {
-    return [{
+    // use of any here is allowed as typings are not relevant for providers
+    return [
+        {
             provide: DbxListView,
             useExisting: forwardRef(() => sourceType)
-        }];
+        }
+    ];
 }
 
 const DBX_VALUE_LIST_VIEW_ITEM = new InjectionToken('DbxValueListViewItem');
-const DEFAULT_DBX_VALUE_LIST_CONFIG_MAP_VALUES = (itemValues) => of(itemValues.map(itemValue => ({ itemValue })));
+const DEFAULT_DBX_VALUE_LIST_CONFIG_MAP_VALUES = (itemValues) => of(itemValues.map((itemValue) => ({ itemValue })));
 function mapValuesToValuesListItemConfigObs(listViewConfig, itemValues) {
     const makeObs = listViewConfig.mapValuesToItemValues ?? DEFAULT_DBX_VALUE_LIST_CONFIG_MAP_VALUES;
     return makeObs(itemValues).pipe(map((listItems) => {
@@ -4482,10 +4026,12 @@ function addConfigToValueListItems(listViewConfig, listItems) {
         const anchor = listItem.anchor;
         listItem.disabled = listItem.disabled || anchor?.disabled;
         listItem.config = Object.assign({
-            providers: [{
+            providers: [
+                {
                     provide: DBX_VALUE_LIST_VIEW_ITEM,
                     useValue: listItem
-                }]
+                }
+            ]
         }, listViewConfig);
         return listItem;
     });
@@ -4495,10 +4041,12 @@ function addConfigToValueListItems(listViewConfig, listItems) {
 class DbxValueListView {
 }
 function provideDbxValueListView(sourceType) {
-    return [{
+    return [
+        {
             provide: DbxValueListView,
             useExisting: forwardRef(() => sourceType)
-        }];
+        }
+    ];
 }
 
 /**
@@ -4510,8 +4058,7 @@ class AbstractDbxValueListViewDirective {
         this.dbxValueListViewModifier = dbxValueListViewModifier;
         this._config = new BehaviorSubject(undefined);
         this.config$ = this._config.pipe(filterMaybe(), distinctUntilChanged());
-        this.modifyFn$ = (this.dbxValueListViewModifier) ?
-            this.dbxValueListViewModifier.modifiers$.pipe(map(maybeModifierMapToFunction)) : of(undefined);
+        this.modifyFn$ = this.dbxValueListViewModifier ? this.dbxValueListViewModifier.modifiers$.pipe(map(maybeModifierMapToFunction)) : of(undefined);
         this.items$ = combineLatest([this.config$, this.dbxListView.values$, this.modifyFn$]).pipe(switchMap(([listViewConfig, values, modifyFn]) => mapValuesToValuesListItemConfigObs(listViewConfig, values).pipe(mapForEach(modifyFn))), shareReplay(1));
     }
     ngOnDestroy() {
@@ -4540,7 +4087,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxValueListViewComponent extends AbstractDbxValueListViewDirective {
     constructor() {
         super(...arguments);
-        this.emitAllClicks$ = this.config$.pipe(map(x => x.emitAllClicks), shareReplay(1));
+        this.emitAllClicks$ = this.config$.pipe(map((x) => x.emitAllClicks), shareReplay(1));
     }
 }
 DbxValueListViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxValueListViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
@@ -4603,7 +4150,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     </mat-nav-list>
   `,
                     host: {
-                        'class': 'dbx-list-view'
+                        class: 'dbx-list-view'
                     }
                 }]
         }], ctorParameters: function () { return [{ type: DbxListView }]; }, propDecorators: { emitAllClicks: [{
@@ -4618,9 +4165,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxSelectionValueListViewComponent extends AbstractDbxValueListViewDirective {
     constructor() {
         super(...arguments);
-        this.selectionMode$ = (this.dbxListView.selectionMode$ ?? of('select'))
-            .pipe(map(x => x ?? 'select'), distinctUntilChanged());
-        this.multiple$ = this.config$.pipe(map(x => x.multiple ?? true), distinctUntilChanged(), shareReplay(1));
+        this.selectionMode$ = (this.dbxListView.selectionMode$ ?? of('select')).pipe(map((x) => x ?? 'select'), distinctUntilChanged());
+        this.multiple$ = this.config$.pipe(map((x) => x.multiple ?? true), distinctUntilChanged(), shareReplay(1));
     }
 }
 DbxSelectionValueListViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSelectionValueListViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
@@ -4648,11 +4194,12 @@ class DbxSelectionValueListItemViewComponent extends DbxValueListItemViewCompone
     }
     matSelectionChanged(selection) {
         const options = selection.source.selectedOptions.selected;
-        const items = options.map(x => {
+        const items = options.map((x) => {
             const { value: itemValue, selected, disabled } = x;
-            return ({ itemValue, selected, disabled });
+            return { itemValue, selected, disabled };
         });
         this.dbxListView.selectionChange.next({
+            // asserted in constructor
             items
         });
     }
@@ -4693,7 +4240,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     </ng-container>
   `,
                     host: {
-                        'class': 'dbx-list-view dbx-selection-list-view'
+                        class: 'dbx-list-view dbx-selection-list-view'
                     }
                 }]
         }], ctorParameters: function () { return [{ type: DbxListView }]; }, propDecorators: { multiple: [{
@@ -4745,70 +4292,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxListLayoutModule {
 }
 DbxListLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxListLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListLayoutModule, declarations: [DbxListComponent,
-        DbxListInternalContentDirective,
-        DbxListEmptyContentComponent,
-        DbxValueListViewComponent,
-        DbxValueListItemViewComponent,
-        DbxSelectionValueListViewComponent,
-        DbxSelectionValueListItemViewComponent,
-        DbxValueListItemModifierDirective,
-        DbxListItemDisableRippleModifierDirective], imports: [CommonModule,
-        DbxLoadingModule,
-        DbxRouterAnchorModule,
-        InfiniteScrollModule,
-        DbxInjectionComponentModule,
-        MatListModule,
-        MatIconModule], exports: [DbxListComponent,
-        DbxListEmptyContentComponent,
-        DbxValueListViewComponent,
-        DbxValueListItemViewComponent,
-        DbxSelectionValueListViewComponent,
-        DbxSelectionValueListItemViewComponent,
-        DbxValueListItemModifierDirective,
-        DbxListItemDisableRippleModifierDirective] });
-DbxListLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListLayoutModule, imports: [[
-            CommonModule,
-            DbxLoadingModule,
-            DbxRouterAnchorModule,
-            InfiniteScrollModule,
-            DbxInjectionComponentModule,
-            MatListModule,
-            MatIconModule
-        ]] });
+DbxListLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListLayoutModule, declarations: [DbxListComponent, DbxListInternalContentDirective, DbxListEmptyContentComponent, DbxValueListViewComponent, DbxValueListItemViewComponent, DbxSelectionValueListViewComponent, DbxSelectionValueListItemViewComponent, DbxValueListItemModifierDirective, DbxListItemDisableRippleModifierDirective], imports: [CommonModule, DbxLoadingModule, DbxRouterAnchorModule, InfiniteScrollModule, DbxInjectionComponentModule, MatListModule, MatIconModule], exports: [DbxListComponent, DbxListEmptyContentComponent, DbxValueListViewComponent, DbxValueListItemViewComponent, DbxSelectionValueListViewComponent, DbxSelectionValueListItemViewComponent, DbxValueListItemModifierDirective, DbxListItemDisableRippleModifierDirective] });
+DbxListLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListLayoutModule, imports: [[CommonModule, DbxLoadingModule, DbxRouterAnchorModule, InfiniteScrollModule, DbxInjectionComponentModule, MatListModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxListLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxLoadingModule,
-                        DbxRouterAnchorModule,
-                        InfiniteScrollModule,
-                        DbxInjectionComponentModule,
-                        MatListModule,
-                        MatIconModule
-                    ],
-                    declarations: [
-                        DbxListComponent,
-                        DbxListInternalContentDirective,
-                        DbxListEmptyContentComponent,
-                        DbxValueListViewComponent,
-                        DbxValueListItemViewComponent,
-                        DbxSelectionValueListViewComponent,
-                        DbxSelectionValueListItemViewComponent,
-                        DbxValueListItemModifierDirective,
-                        DbxListItemDisableRippleModifierDirective
-                    ],
-                    exports: [
-                        DbxListComponent,
-                        DbxListEmptyContentComponent,
-                        DbxValueListViewComponent,
-                        DbxValueListItemViewComponent,
-                        DbxSelectionValueListViewComponent,
-                        DbxSelectionValueListItemViewComponent,
-                        DbxValueListItemModifierDirective,
-                        DbxListItemDisableRippleModifierDirective
-                    ]
+                    imports: [CommonModule, DbxLoadingModule, DbxRouterAnchorModule, InfiniteScrollModule, DbxInjectionComponentModule, MatListModule, MatIconModule],
+                    declarations: [DbxListComponent, DbxListInternalContentDirective, DbxListEmptyContentComponent, DbxValueListViewComponent, DbxValueListItemViewComponent, DbxSelectionValueListViewComponent, DbxSelectionValueListItemViewComponent, DbxValueListItemModifierDirective, DbxListItemDisableRippleModifierDirective],
+                    exports: [DbxListComponent, DbxListEmptyContentComponent, DbxValueListViewComponent, DbxValueListItemViewComponent, DbxSelectionValueListViewComponent, DbxSelectionValueListItemViewComponent, DbxValueListItemModifierDirective, DbxListItemDisableRippleModifierDirective]
                 }]
         }] });
 
@@ -4879,9 +4370,9 @@ class AbstractDbxSelectionListViewDirective extends AbstractDbxListViewDirective
     }
     matSelectionChanged(selection) {
         const options = selection.source.selectedOptions.selected;
-        const items = options.map(x => {
+        const items = options.map((x) => {
             const { value: itemValue, selected, disabled } = x;
-            return ({ itemValue, selected, disabled });
+            return { itemValue, selected, disabled };
         });
         this.selectionChanged({ items });
     }
@@ -4917,10 +4408,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxListViewWrapper {
 }
 function provideDbxListViewWrapper(sourceType) {
-    return [{
+    return [
+        {
             provide: DbxListViewWrapper,
             useExisting: forwardRef(() => sourceType)
-        }];
+        }
+    ];
 }
 
 /**
@@ -4956,7 +4449,8 @@ DbxSectionHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
     </div>
     <p *ngIf="hint" class="dbx-section-hint dbx-hint">{{ hint }}</p>
     <ng-template #headerContentTitleTemplate>
-        <mat-icon *ngIf="icon">{{icon}}</mat-icon><span class="title-text">{{ header }}</span>
+      <mat-icon *ngIf="icon">{{ icon }}</mat-icon>
+      <span class="title-text">{{ header }}</span>
     </ng-template>
   `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionHeaderComponent, decorators: [{
@@ -4987,7 +4481,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     </div>
     <p *ngIf="hint" class="dbx-section-hint dbx-hint">{{ hint }}</p>
     <ng-template #headerContentTitleTemplate>
-        <mat-icon *ngIf="icon">{{icon}}</mat-icon><span class="title-text">{{ header }}</span>
+      <mat-icon *ngIf="icon">{{ icon }}</mat-icon>
+      <span class="title-text">{{ header }}</span>
     </ng-template>
   `
                 }]
@@ -5032,7 +4527,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     </div>
   `,
                     host: {
-                        'class': 'd-block, dbx-section',
+                        class: 'd-block, dbx-section',
                         '[class]': `(elevated) ? 'dbx-section-elevated' : ''`
                     }
                 }]
@@ -5057,40 +4552,40 @@ class DbxIntroActionSectionComponent extends DbxSectionComponent {
 }
 DbxIntroActionSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxIntroActionSectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
 DbxIntroActionSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxIntroActionSectionComponent, selector: "dbx-intro-action-section", inputs: { showIntro: "showIntro", action: "action" }, outputs: { showAction: "showAction" }, usesInheritance: true, ngImport: i0, template: `
-  <div class="dbx-intro-action-section" [ngSwitch]="showIntro">
-    <div *ngSwitchCase="true" class="dbx-intro-action-section-intro">
-      <p>{{ hint }}</p>
-      <div>
-        <ng-content select="[info]"></ng-content>
-      </div>
-      <div>
-        <button mat-raised-button color="accent" (click)="actionClicked()">{{ action }}</button>
+    <div class="dbx-intro-action-section" [ngSwitch]="showIntro">
+      <div *ngSwitchCase="true" class="dbx-intro-action-section-intro">
+        <p>{{ hint }}</p>
+        <div>
+          <ng-content select="[info]"></ng-content>
+        </div>
+        <div>
+          <button mat-raised-button color="accent" (click)="actionClicked()">{{ action }}</button>
+        </div>
       </div>
+      <ng-container *ngSwitchCase="false">
+        <ng-content></ng-content>
+      </ng-container>
     </div>
-    <ng-container *ngSwitchCase="false">
-      <ng-content></ng-content>
-    </ng-container>
-  </div>
   `, isInline: true, components: [{ type: i1.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: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxIntroActionSectionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-intro-action-section',
                     template: `
-  <div class="dbx-intro-action-section" [ngSwitch]="showIntro">
-    <div *ngSwitchCase="true" class="dbx-intro-action-section-intro">
-      <p>{{ hint }}</p>
-      <div>
-        <ng-content select="[info]"></ng-content>
-      </div>
-      <div>
-        <button mat-raised-button color="accent" (click)="actionClicked()">{{ action }}</button>
+    <div class="dbx-intro-action-section" [ngSwitch]="showIntro">
+      <div *ngSwitchCase="true" class="dbx-intro-action-section-intro">
+        <p>{{ hint }}</p>
+        <div>
+          <ng-content select="[info]"></ng-content>
+        </div>
+        <div>
+          <button mat-raised-button color="accent" (click)="actionClicked()">{{ action }}</button>
+        </div>
       </div>
+      <ng-container *ngSwitchCase="false">
+        <ng-content></ng-content>
+      </ng-container>
     </div>
-    <ng-container *ngSwitchCase="false">
-      <ng-content></ng-content>
-    </ng-container>
-  </div>
   `
                 }]
         }], propDecorators: { showAction: [{
@@ -5108,28 +4603,28 @@ class DbxSubSectionComponent extends DbxSectionComponent {
 }
 DbxSubSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSubSectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
 DbxSubSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxSubSectionComponent, selector: "dbx-subsection", usesInheritance: true, ngImport: i0, template: `
-  <div class="dbx-subsection">
-    <div class="dbx-section-header" [h]="h ?? 4" [header]="header" [icon]="icon" [hint]="hint">
-      <ng-content select="[sectionHeader]"></ng-content>
-    </div>
-    <div class="dbx-section-content">
-      <ng-content></ng-content>
+    <div class="dbx-subsection">
+      <div class="dbx-section-header" [h]="h ?? 4" [header]="header" [icon]="icon" [hint]="hint">
+        <ng-content select="[sectionHeader]"></ng-content>
+      </div>
+      <div class="dbx-section-content">
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
   `, isInline: true, components: [{ type: DbxSectionHeaderComponent, selector: "dbx-section-header,.dbx-section-header", inputs: ["h", "header", "icon", "hint"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSubSectionComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-subsection',
                     template: `
-  <div class="dbx-subsection">
-    <div class="dbx-section-header" [h]="h ?? 4" [header]="header" [icon]="icon" [hint]="hint">
-      <ng-content select="[sectionHeader]"></ng-content>
-    </div>
-    <div class="dbx-section-content">
-      <ng-content></ng-content>
+    <div class="dbx-subsection">
+      <div class="dbx-section-header" [h]="h ?? 4" [header]="header" [icon]="icon" [hint]="hint">
+        <ng-content select="[sectionHeader]"></ng-content>
+      </div>
+      <div class="dbx-section-content">
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
   `
                 }]
         }] });
@@ -5141,24 +4636,24 @@ class DbxSectionPageComponent extends DbxSectionHeaderComponent {
 }
 DbxSectionPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
 DbxSectionPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxSectionPageComponent, selector: "dbx-section-page", usesInheritance: true, ngImport: i0, template: `
-  <div class="dbx-content-page dbx-section-page">
-    <div class="dbx-section-header" [h]="h ?? 2" [header]="header" [icon]="icon" [hint]="hint">
-      <ng-content select="[sectionHeader]"></ng-content>
+    <div class="dbx-content-page dbx-section-page">
+      <div class="dbx-section-header" [h]="h ?? 2" [header]="header" [icon]="icon" [hint]="hint">
+        <ng-content select="[sectionHeader]"></ng-content>
+      </div>
+      <ng-content></ng-content>
     </div>
-    <ng-content></ng-content>
-  </div>
   `, isInline: true, components: [{ type: DbxSectionHeaderComponent, selector: "dbx-section-header,.dbx-section-header", inputs: ["h", "header", "icon", "hint"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionPageComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-section-page',
                     template: `
-  <div class="dbx-content-page dbx-section-page">
-    <div class="dbx-section-header" [h]="h ?? 2" [header]="header" [icon]="icon" [hint]="hint">
-      <ng-content select="[sectionHeader]"></ng-content>
+    <div class="dbx-content-page dbx-section-page">
+      <div class="dbx-section-header" [h]="h ?? 2" [header]="header" [icon]="icon" [hint]="hint">
+        <ng-content select="[sectionHeader]"></ng-content>
+      </div>
+      <ng-content></ng-content>
     </div>
-    <ng-content></ng-content>
-  </div>
   `
                 }]
         }] });
@@ -5169,60 +4664,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxSectionLayoutModule {
 }
 DbxSectionLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxSectionLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionLayoutModule, declarations: [DbxSectionHeaderComponent,
-        DbxSectionPageComponent,
-        DbxSectionComponent,
-        DbxSubSectionComponent,
-        DbxIntroActionSectionComponent], imports: [CommonModule,
-        DbxRouterAnchorModule,
-        MatButtonModule,
-        MatRippleModule,
-        MatIconModule], exports: [DbxSectionHeaderComponent,
-        DbxSectionPageComponent,
-        DbxSectionComponent,
-        DbxSubSectionComponent,
-        DbxIntroActionSectionComponent] });
-DbxSectionLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionLayoutModule, imports: [[
-            CommonModule,
-            DbxRouterAnchorModule,
-            MatButtonModule,
-            MatRippleModule,
-            MatIconModule
-        ]] });
+DbxSectionLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionLayoutModule, declarations: [DbxSectionHeaderComponent, DbxSectionPageComponent, DbxSectionComponent, DbxSubSectionComponent, DbxIntroActionSectionComponent], imports: [CommonModule, DbxRouterAnchorModule, MatButtonModule, MatRippleModule, MatIconModule], exports: [DbxSectionHeaderComponent, DbxSectionPageComponent, DbxSectionComponent, DbxSubSectionComponent, DbxIntroActionSectionComponent] });
+DbxSectionLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionLayoutModule, imports: [[CommonModule, DbxRouterAnchorModule, MatButtonModule, MatRippleModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSectionLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxRouterAnchorModule,
-                        MatButtonModule,
-                        MatRippleModule,
-                        MatIconModule
-                    ],
-                    declarations: [
-                        DbxSectionHeaderComponent,
-                        DbxSectionPageComponent,
-                        DbxSectionComponent,
-                        DbxSubSectionComponent,
-                        DbxIntroActionSectionComponent
-                    ],
-                    exports: [
-                        DbxSectionHeaderComponent,
-                        DbxSectionPageComponent,
-                        DbxSectionComponent,
-                        DbxSubSectionComponent,
-                        DbxIntroActionSectionComponent
-                    ]
+                    imports: [CommonModule, DbxRouterAnchorModule, MatButtonModule, MatRippleModule, MatIconModule],
+                    declarations: [DbxSectionHeaderComponent, DbxSectionPageComponent, DbxSectionComponent, DbxSubSectionComponent, DbxIntroActionSectionComponent],
+                    exports: [DbxSectionHeaderComponent, DbxSectionPageComponent, DbxSectionComponent, DbxSubSectionComponent, DbxIntroActionSectionComponent]
                 }]
         }] });
 
 class DbxStepComponent {
 }
 DbxStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxStepComponent, selector: "dbx-step", inputs: { done: "done", step: "step", text: "text", hint: "hint" }, ngImport: i0, template: "<div class=\"step-section\" [ngClass]=\"(done) ? 'done' : ''\">\n  <div class=\"step-section-header\">\n    <span class=\"step\">{{ step }}.</span>\n    <mat-icon class=\"done-check\" *ngIf=\"done\">done</mat-icon>\n    <span class=\"text\">{{ text }}</span>\n    <p *ngIf=\"hint\" class=\"hint\">{{ hint }}</p>\n  </div>\n  <div class=\"step-section-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+DbxStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxStepComponent, selector: "dbx-step", inputs: { done: "done", step: "step", text: "text", hint: "hint" }, ngImport: i0, template: "<div class=\"step-section\" [ngClass]=\"done ? 'done' : ''\">\n  <div class=\"step-section-header\">\n    <span class=\"step\">{{ step }}.</span>\n    <mat-icon class=\"done-check\" *ngIf=\"done\">done</mat-icon>\n    <span class=\"text\">{{ text }}</span>\n    <p *ngIf=\"hint\" class=\"hint\">{{ hint }}</p>\n  </div>\n  <div class=\"step-section-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n", components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dbx-step', template: "<div class=\"step-section\" [ngClass]=\"(done) ? 'done' : ''\">\n  <div class=\"step-section-header\">\n    <span class=\"step\">{{ step }}.</span>\n    <mat-icon class=\"done-check\" *ngIf=\"done\">done</mat-icon>\n    <span class=\"text\">{{ text }}</span>\n    <p *ngIf=\"hint\" class=\"hint\">{{ hint }}</p>\n  </div>\n  <div class=\"step-section-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'dbx-step', template: "<div class=\"step-section\" [ngClass]=\"done ? 'done' : ''\">\n  <div class=\"step-section-header\">\n    <span class=\"step\">{{ step }}.</span>\n    <mat-icon class=\"done-check\" *ngIf=\"done\">done</mat-icon>\n    <span class=\"text\">{{ text }}</span>\n    <p *ngIf=\"hint\" class=\"hint\">{{ hint }}</p>\n  </div>\n  <div class=\"step-section-content\">\n    <ng-content></ng-content>\n  </div>\n</div>\n" }]
         }], propDecorators: { done: [{
                 type: Input
             }], step: [{
@@ -5236,39 +4695,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxStepLayoutModule {
 }
 DbxStepLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxStepLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepLayoutModule, declarations: [DbxStepComponent], imports: [CommonModule,
-        MatIconModule], exports: [DbxStepComponent] });
-DbxStepLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepLayoutModule, imports: [[
-            CommonModule,
-            MatIconModule
-        ]] });
+DbxStepLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepLayoutModule, declarations: [DbxStepComponent], imports: [CommonModule, MatIconModule], exports: [DbxStepComponent] });
+DbxStepLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepLayoutModule, imports: [[CommonModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxStepLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatIconModule
-                    ],
-                    declarations: [
-                        DbxStepComponent
-                    ],
-                    exports: [
-                        DbxStepComponent
-                    ],
+                    imports: [CommonModule, MatIconModule],
+                    declarations: [DbxStepComponent],
+                    exports: [DbxStepComponent]
                 }]
         }] });
 
 class DbxHintComponent {
 }
 DbxHintComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxHintComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxHintComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxHintComponent, selector: "dbx-hint", host: { classAttribute: "dbx-hint" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxHintComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxHintComponent, selector: "dbx-hint", host: { classAttribute: "dbx-hint" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxHintComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-hint',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'dbx-hint'
+                        class: 'dbx-hint'
                     }
                 }]
         }] });
@@ -5293,14 +4745,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxLabelComponent {
 }
 DbxLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxLabelComponent, selector: "dbx-label", host: { classAttribute: "dbx-label" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxLabelComponent, selector: "dbx-label", host: { classAttribute: "dbx-label" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLabelComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-label',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'dbx-label'
+                        class: 'dbx-label'
                     }
                 }]
         }] });
@@ -5312,13 +4768,13 @@ class DbxLinkifyComponent {
     constructor(sanitizer) {
         this.sanitizer = sanitizer;
         this._text = new BehaviorSubject('');
-        this.linkifiedText$ = this._text.pipe(distinctUntilChanged(), map(x => linkifyStr(x, {
+        this.linkifiedText$ = this._text.pipe(distinctUntilChanged(), map((x) => linkifyStr(x, {
             defaultProtocol: 'https',
             target: {
                 url: '_blank'
             }
         })), shareReplay(1));
-        this.linkifiedBody$ = this.linkifiedText$.pipe(map(x => {
+        this.linkifiedBody$ = this.linkifiedText$.pipe(map((x) => {
             return this.sanitizer.bypassSecurityTrustHtml(x);
         }), shareReplay(1));
     }
@@ -5333,12 +4789,16 @@ class DbxLinkifyComponent {
     }
 }
 DbxLinkifyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLinkifyComponent, deps: [{ token: i1$8.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-DbxLinkifyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxLinkifyComponent, selector: "dbx-linkify", inputs: { text: "text" }, ngImport: i0, template: `<span class="dbx-linkify" [innerHTML]="linkifiedBody$ | async"></span>`, isInline: true, pipes: { "async": i3$1.AsyncPipe } });
+DbxLinkifyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxLinkifyComponent, selector: "dbx-linkify", inputs: { text: "text" }, ngImport: i0, template: `
+    <span class="dbx-linkify" [innerHTML]="linkifiedBody$ | async"></span>
+  `, isInline: true, pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLinkifyComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-linkify',
-                    template: `<span class="dbx-linkify" [innerHTML]="linkifiedBody$ | async"></span>`
+                    template: `
+    <span class="dbx-linkify" [innerHTML]="linkifiedBody$ | async"></span>
+  `
                 }]
         }], ctorParameters: function () { return [{ type: i1$8.DomSanitizer }]; }, propDecorators: { text: [{
                 type: Input
@@ -5347,14 +4807,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxNoteComponent {
 }
 DbxNoteComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxNoteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxNoteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxNoteComponent, selector: "dbx-note", host: { classAttribute: "dbx-note" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxNoteComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxNoteComponent, selector: "dbx-note", host: { classAttribute: "dbx-note" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxNoteComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-note',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'dbx-note'
+                        class: 'dbx-note'
                     }
                 }]
         }] });
@@ -5362,14 +4826,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxNoticeComponent {
 }
 DbxNoticeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxNoticeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxNoticeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxNoticeComponent, selector: "dbx-notice", host: { classAttribute: "dbx-notice" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxNoticeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxNoticeComponent, selector: "dbx-notice", host: { classAttribute: "dbx-notice" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxNoticeComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-notice',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'dbx-notice'
+                        class: 'dbx-notice'
                     }
                 }]
         }] });
@@ -5377,14 +4845,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxOkComponent {
 }
 DbxOkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxOkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxOkComponent, selector: "dbx-ok", host: { classAttribute: "dbx-ok" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxOkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxOkComponent, selector: "dbx-ok", host: { classAttribute: "dbx-ok" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxOkComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-ok',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'dbx-ok'
+                        class: 'dbx-ok'
                     }
                 }]
         }] });
@@ -5392,14 +4864,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxSuccessComponent {
 }
 DbxSuccessComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSuccessComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxSuccessComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxSuccessComponent, selector: "dbx-success", host: { classAttribute: "dbx-success" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxSuccessComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxSuccessComponent, selector: "dbx-success", host: { classAttribute: "dbx-success" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxSuccessComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-success',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'dbx-success'
+                        class: 'dbx-success'
                     }
                 }]
         }] });
@@ -5408,22 +4884,22 @@ class DbxTextChipsComponent {
 }
 DbxTextChipsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextChipsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxTextChipsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxTextChipsComponent, selector: "dbx-text-chips", inputs: { chips: "chips" }, ngImport: i0, template: `
-  <mat-chip-list *ngIf="chips" [multiple]="false">
-    <mat-chip *ngFor="let chip of chips" selected [color]="chip.color" [matTooltip]="chip.tooltip!" matTooltipPosition="above">
-      {{chip.text}}
-    </mat-chip>
-  </mat-chip-list>
+    <mat-chip-list *ngIf="chips" [multiple]="false">
+      <mat-chip *ngFor="let chip of chips" selected [color]="chip.color" [matTooltip]="chip.tooltip!" matTooltipPosition="above">
+        {{ chip.text }}
+      </mat-chip>
+    </mat-chip-list>
   `, isInline: true, components: [{ type: i1$9.MatChipList, selector: "mat-chip-list", inputs: ["errorStateMatcher", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$9.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i3$5.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextChipsComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-text-chips',
                     template: `
-  <mat-chip-list *ngIf="chips" [multiple]="false">
-    <mat-chip *ngFor="let chip of chips" selected [color]="chip.color" [matTooltip]="chip.tooltip!" matTooltipPosition="above">
-      {{chip.text}}
-    </mat-chip>
-  </mat-chip-list>
+    <mat-chip-list *ngIf="chips" [multiple]="false">
+      <mat-chip *ngFor="let chip of chips" selected [color]="chip.color" [matTooltip]="chip.tooltip!" matTooltipPosition="above">
+        {{ chip.text }}
+      </mat-chip>
+    </mat-chip-list>
   `
                 }]
         }], propDecorators: { chips: [{
@@ -5433,14 +4909,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxWarnComponent {
 }
 DbxWarnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWarnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxWarnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxWarnComponent, selector: "dbx-warn", host: { classAttribute: "dbx-warn" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxWarnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxWarnComponent, selector: "dbx-warn", host: { classAttribute: "dbx-warn" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWarnComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-warn',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'dbx-warn'
+                        class: 'dbx-warn'
                     }
                 }]
         }] });
@@ -5448,120 +4928,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxTextModule {
 }
 DbxTextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextModule, declarations: [DbxNoteComponent,
-        DbxNoticeComponent,
-        DbxSuccessComponent,
-        DbxWarnComponent,
-        DbxHintComponent,
-        DbxLabelComponent,
-        DbxLinkifyComponent,
-        DbxOkComponent,
-        DbxTextChipsComponent,
-        DbxIconSpacerDirective], imports: [CommonModule,
-        MatChipsModule,
-        MatTooltipModule,
-        MatIconModule], exports: [DbxNoteComponent,
-        DbxNoticeComponent,
-        DbxSuccessComponent,
-        DbxWarnComponent,
-        DbxHintComponent,
-        DbxLabelComponent,
-        DbxLinkifyComponent,
-        DbxOkComponent,
-        DbxTextChipsComponent,
-        DbxIconSpacerDirective] });
-DbxTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextModule, imports: [[
-            CommonModule,
-            MatChipsModule,
-            MatTooltipModule,
-            MatIconModule
-        ]] });
+DbxTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextModule, declarations: [DbxNoteComponent, DbxNoticeComponent, DbxSuccessComponent, DbxWarnComponent, DbxHintComponent, DbxLabelComponent, DbxLinkifyComponent, DbxOkComponent, DbxTextChipsComponent, DbxIconSpacerDirective], imports: [CommonModule, MatChipsModule, MatTooltipModule, MatIconModule], exports: [DbxNoteComponent, DbxNoticeComponent, DbxSuccessComponent, DbxWarnComponent, DbxHintComponent, DbxLabelComponent, DbxLinkifyComponent, DbxOkComponent, DbxTextChipsComponent, DbxIconSpacerDirective] });
+DbxTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextModule, imports: [[CommonModule, MatChipsModule, MatTooltipModule, MatIconModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxTextModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatChipsModule,
-                        MatTooltipModule,
-                        MatIconModule
-                    ],
-                    declarations: [
-                        DbxNoteComponent,
-                        DbxNoticeComponent,
-                        DbxSuccessComponent,
-                        DbxWarnComponent,
-                        DbxHintComponent,
-                        DbxLabelComponent,
-                        DbxLinkifyComponent,
-                        DbxOkComponent,
-                        DbxTextChipsComponent,
-                        DbxIconSpacerDirective
-                    ],
-                    exports: [
-                        DbxNoteComponent,
-                        DbxNoticeComponent,
-                        DbxSuccessComponent,
-                        DbxWarnComponent,
-                        DbxHintComponent,
-                        DbxLabelComponent,
-                        DbxLinkifyComponent,
-                        DbxOkComponent,
-                        DbxTextChipsComponent,
-                        DbxIconSpacerDirective
-                    ],
+                    imports: [CommonModule, MatChipsModule, MatTooltipModule, MatIconModule],
+                    declarations: [DbxNoteComponent, DbxNoticeComponent, DbxSuccessComponent, DbxWarnComponent, DbxHintComponent, DbxLabelComponent, DbxLinkifyComponent, DbxOkComponent, DbxTextChipsComponent, DbxIconSpacerDirective],
+                    exports: [DbxNoteComponent, DbxNoticeComponent, DbxSuccessComponent, DbxWarnComponent, DbxHintComponent, DbxLabelComponent, DbxLinkifyComponent, DbxOkComponent, DbxTextChipsComponent, DbxIconSpacerDirective]
                 }]
         }] });
 
 class DbxLayoutModule {
 }
 DbxLayoutModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLayoutModule, exports: [DbxBarLayoutModule,
-        DbxBlockLayoutModule,
-        DbxCardBoxLayoutModule,
-        DbxColumnLayoutModule,
-        DbxCompactLayoutModule,
-        DbxContentLayoutModule,
-        DbxFlagLayoutModule,
-        DbxFlexLayoutModule,
-        DbxItemLayoutModule,
-        DbxListLayoutModule,
-        DbxSectionLayoutModule,
-        DbxStepLayoutModule,
-        DbxStyleLayoutModule,
-        DbxTextModule] });
-DbxLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLayoutModule, imports: [DbxBarLayoutModule,
-        DbxBlockLayoutModule,
-        DbxCardBoxLayoutModule,
-        DbxColumnLayoutModule,
-        DbxCompactLayoutModule,
-        DbxContentLayoutModule,
-        DbxFlagLayoutModule,
-        DbxFlexLayoutModule,
-        DbxItemLayoutModule,
-        DbxListLayoutModule,
-        DbxSectionLayoutModule,
-        DbxStepLayoutModule,
-        DbxStyleLayoutModule,
-        DbxTextModule] });
+DbxLayoutModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLayoutModule, exports: [DbxBarLayoutModule, DbxBlockLayoutModule, DbxCardBoxLayoutModule, DbxColumnLayoutModule, DbxCompactLayoutModule, DbxContentLayoutModule, DbxFlagLayoutModule, DbxFlexLayoutModule, DbxItemLayoutModule, DbxListLayoutModule, DbxSectionLayoutModule, DbxStepLayoutModule, DbxStyleLayoutModule, DbxTextModule] });
+DbxLayoutModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLayoutModule, imports: [DbxBarLayoutModule, DbxBlockLayoutModule, DbxCardBoxLayoutModule, DbxColumnLayoutModule, DbxCompactLayoutModule, DbxContentLayoutModule, DbxFlagLayoutModule, DbxFlexLayoutModule, DbxItemLayoutModule, DbxListLayoutModule, DbxSectionLayoutModule, DbxStepLayoutModule, DbxStyleLayoutModule, DbxTextModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxLayoutModule, decorators: [{
             type: NgModule,
             args: [{
-                    exports: [
-                        DbxBarLayoutModule,
-                        DbxBlockLayoutModule,
-                        DbxCardBoxLayoutModule,
-                        DbxColumnLayoutModule,
-                        DbxCompactLayoutModule,
-                        DbxContentLayoutModule,
-                        DbxFlagLayoutModule,
-                        DbxFlexLayoutModule,
-                        DbxItemLayoutModule,
-                        DbxListLayoutModule,
-                        DbxSectionLayoutModule,
-                        DbxStepLayoutModule,
-                        DbxStyleLayoutModule,
-                        DbxTextModule
-                    ],
+                    exports: [DbxBarLayoutModule, DbxBlockLayoutModule, DbxCardBoxLayoutModule, DbxColumnLayoutModule, DbxCompactLayoutModule, DbxContentLayoutModule, DbxFlagLayoutModule, DbxFlexLayoutModule, DbxItemLayoutModule, DbxListLayoutModule, DbxSectionLayoutModule, DbxStepLayoutModule, DbxStyleLayoutModule, DbxTextModule]
                 }]
         }] });
 
@@ -5618,7 +5004,7 @@ class DbxPopoverCoordinatorComponent {
     constructor(service, popover) {
         this.service = service;
         this.popover = popover;
-        this.isPopoverForKey$ = this.service.popovers$.pipe(map(x => x.get(this.popover.key) === this.popover), shareReplay(1));
+        this.isPopoverForKey$ = this.service.popovers$.pipe(map((x) => x.get(this.popover.key) === this.popover), shareReplay(1));
         this.show$ = this.isPopoverForKey$.pipe(delay(0));
     }
     ngOnInit() {
@@ -5630,19 +5016,19 @@ class DbxPopoverCoordinatorComponent {
 }
 DbxPopoverCoordinatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverCoordinatorComponent, deps: [{ token: DbxPopoverCoordinatorService }, { token: DbxPopoverController }], target: i0.ɵɵFactoryTarget.Component });
 DbxPopoverCoordinatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopoverCoordinatorComponent, selector: "dbx-popover-coordinator", ngImport: i0, template: `
-  <ng-container *ngIf="show$ | async">
-    <ng-content></ng-content>
-  </ng-container>
+    <ng-container *ngIf="show$ | async">
+      <ng-content></ng-content>
+    </ng-container>
   `, isInline: true, directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverCoordinatorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-popover-coordinator',
                     template: `
-  <ng-container *ngIf="show$ | async">
-    <ng-content></ng-content>
-  </ng-container>
-  `,
+    <ng-container *ngIf="show$ | async">
+      <ng-content></ng-content>
+    </ng-container>
+  `
                     // TODO: styleUrls: ['./popover.scss']
                 }]
         }], ctorParameters: function () { return [{ type: DbxPopoverCoordinatorService }, { type: DbxPopoverController }]; } });
@@ -5702,13 +5088,13 @@ class DbxPopoverComponent extends AbstractTransitionWatcherDirective {
         this.lockSet = new LockSet();
         this.contentConfig = {
             componentClass: this.config.componentClass,
-            init: this.config.init ? ((instance) => this.config.init(instance, this)) : undefined
+            init: this.config.init ? (instance) => this.config.init(instance, this) : undefined
         };
         this._startedClosing = false;
         this._closing = new Subject();
         this._triggerCloseKeys = [];
         this.isClosing$ = this._closing.pipe(first(), map(() => true), startWith(false), shareReplay(1));
-        this.closing$ = this.isClosing$.pipe(filter(x => x));
+        this.closing$ = this.isClosing$.pipe(filter((x) => x));
         // Override Close to properly signal to listeners when a close is occuring.
         const originalClose = this.popoverRef.close;
         this.popoverRef.close = (x) => {
@@ -5779,30 +5165,36 @@ class DbxPopoverComponent extends AbstractTransitionWatcherDirective {
     }
 }
 DbxPopoverComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverComponent, deps: [{ token: i1$a.NgPopoverRef }, { token: CompactContextStore }, { token: i1$2.DbxRouterTransitionService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-DbxPopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopoverComponent, selector: "ng-component", providers: [{
+DbxPopoverComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopoverComponent, selector: "ng-component", providers: [
+        {
             provide: DbxPopoverController,
             useExisting: DbxPopoverComponent
-        }, {
+        },
+        {
             provide: CompactContextStore
-        }], usesInheritance: true, ngImport: i0, template: `
-  <dbx-popover-coordinator (dbxWindowKeyDownListener)="handleKeydown()" [appWindowKeyDownFilter]="triggerCloseKeys">
-    <div dbxStyle class="dbx-popover-component" dbx-injection [config]="contentConfig"></div>
-  </dbx-popover-coordinator>
+        }
+    ], usesInheritance: true, ngImport: i0, template: `
+    <dbx-popover-coordinator (dbxWindowKeyDownListener)="handleKeydown()" [appWindowKeyDownFilter]="triggerCloseKeys">
+      <div dbxStyle class="dbx-popover-component" dbx-injection [config]="contentConfig"></div>
+    </dbx-popover-coordinator>
   `, isInline: true, components: [{ type: DbxPopoverCoordinatorComponent, selector: "dbx-popover-coordinator" }, { type: i1$2.DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }], directives: [{ type: DbxWindowKeyDownListenerDirective, selector: "[dbxWindowKeyDownListener]", inputs: ["appWindowKeyDownEnabled", "appWindowKeyDownFilter"], outputs: ["dbxWindowKeyDownListener"] }, { type: DbxStyleDirective, selector: "dbx-style, [dbxStyle], .dbx-style" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverComponent, decorators: [{
             type: Component,
             args: [{
                     template: `
-  <dbx-popover-coordinator (dbxWindowKeyDownListener)="handleKeydown()" [appWindowKeyDownFilter]="triggerCloseKeys">
-    <div dbxStyle class="dbx-popover-component" dbx-injection [config]="contentConfig"></div>
-  </dbx-popover-coordinator>
+    <dbx-popover-coordinator (dbxWindowKeyDownListener)="handleKeydown()" [appWindowKeyDownFilter]="triggerCloseKeys">
+      <div dbxStyle class="dbx-popover-component" dbx-injection [config]="contentConfig"></div>
+    </dbx-popover-coordinator>
   `,
-                    providers: [{
+                    providers: [
+                        {
                             provide: DbxPopoverController,
                             useExisting: DbxPopoverComponent
-                        }, {
+                        },
+                        {
                             provide: CompactContextStore
-                        }]
+                        }
+                    ]
                 }]
         }], ctorParameters: function () { return [{ type: i1$a.NgPopoverRef }, { type: CompactContextStore }, { type: i1$2.DbxRouterTransitionService }, { type: i0.NgZone }]; } });
 
@@ -5816,7 +5208,7 @@ class DbxPopoverService {
         this._overlayContainerService = new NgOverlayContainerService(this._overlay, this._injector);
     }
     open(config) {
-        const service = (config.injector) ? new NgOverlayContainerService(this._overlay, config.injector) : this._overlayContainerService;
+        const service = config.injector ? new NgOverlayContainerService(this._overlay, config.injector) : this._overlayContainerService;
         const configuration = {
             panelClass: 'dbx-popover-container',
             originX: 'start',
@@ -5884,25 +5276,25 @@ class DbxPopoverContentComponent {
 }
 DbxPopoverContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
 DbxPopoverContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopoverContentComponent, selector: "dbx-popover-content", ngImport: i0, template: `
-  <div class="d-block dbx-popover-content" (resized)="onResized($event)" [style.--popoverh]="height$ | async">
-    <ng-content select="[controls]"></ng-content>
-    <div class="dbx-popover-content-container">
-      <ng-content></ng-content>
+    <div class="d-block dbx-popover-content" (resized)="onResized($event)" [style.--popoverh]="height$ | async">
+      <ng-content select="[controls]"></ng-content>
+      <div class="dbx-popover-content-container">
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
-`, isInline: true, directives: [{ type: i1$7.ResizedDirective, selector: "[resized]", outputs: ["resized"] }], pipes: { "async": i3$1.AsyncPipe } });
+  `, isInline: true, directives: [{ type: i1$7.ResizedDirective, selector: "[resized]", outputs: ["resized"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverContentComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-popover-content',
                     template: `
-  <div class="d-block dbx-popover-content" (resized)="onResized($event)" [style.--popoverh]="height$ | async">
-    <ng-content select="[controls]"></ng-content>
-    <div class="dbx-popover-content-container">
-      <ng-content></ng-content>
+    <div class="d-block dbx-popover-content" (resized)="onResized($event)" [style.--popoverh]="height$ | async">
+      <ng-content select="[controls]"></ng-content>
+      <div class="dbx-popover-content-container">
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
-`
+  `
                 }]
         }] });
 
@@ -5918,28 +5310,34 @@ class DbxPopoverHeaderComponent {
 }
 DbxPopoverHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverHeaderComponent, deps: [{ token: DbxPopoverContentComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
 DbxPopoverHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopoverHeaderComponent, selector: "dbx-popover-header", inputs: { header: "header", icon: "icon" }, ngImport: i0, template: `
-  <div class="dbx-popover-header">
-    <div class="dbx-popover-header-content">
-      <h3><mat-icon *ngIf="icon" class="dbx-icon-spacer">{{ icon }}</mat-icon> {{ header }}</h3>
-      <span class="spacer"></span>
-      <ng-content></ng-content>
+    <div class="dbx-popover-header">
+      <div class="dbx-popover-header-content">
+        <h3>
+          <mat-icon *ngIf="icon" class="dbx-icon-spacer">{{ icon }}</mat-icon>
+          {{ header }}
+        </h3>
+        <span class="spacer"></span>
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
-  <mat-divider></mat-divider>
+    <mat-divider></mat-divider>
   `, isInline: true, components: [{ type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverHeaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-popover-header',
                     template: `
-  <div class="dbx-popover-header">
-    <div class="dbx-popover-header-content">
-      <h3><mat-icon *ngIf="icon" class="dbx-icon-spacer">{{ icon }}</mat-icon> {{ header }}</h3>
-      <span class="spacer"></span>
-      <ng-content></ng-content>
+    <div class="dbx-popover-header">
+      <div class="dbx-popover-header-content">
+        <h3>
+          <mat-icon *ngIf="icon" class="dbx-icon-spacer">{{ icon }}</mat-icon>
+          {{ header }}
+        </h3>
+        <span class="spacer"></span>
+        <ng-content></ng-content>
+      </div>
     </div>
-  </div>
-  <mat-divider></mat-divider>
+    <mat-divider></mat-divider>
   `
                 }]
         }], ctorParameters: function () { return [{ type: DbxPopoverContentComponent, decorators: [{
@@ -5980,14 +5378,18 @@ class DbxPopoverScrollContentComponent {
     }
 }
 DbxPopoverScrollContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverScrollContentComponent, deps: [{ token: DbxPopoverContentComponent }], target: i0.ɵɵFactoryTarget.Component });
-DbxPopoverScrollContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopoverScrollContentComponent, selector: "dbx-popover-scroll-content", host: { properties: { "class": "sizingClasses" }, classAttribute: "d-block dbx-popover-scroll-content" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxPopoverScrollContentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopoverScrollContentComponent, selector: "dbx-popover-scroll-content", host: { properties: { "class": "sizingClasses" }, classAttribute: "d-block dbx-popover-scroll-content" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverScrollContentComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-popover-scroll-content',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'd-block dbx-popover-scroll-content',
+                        class: 'd-block dbx-popover-scroll-content',
                         '[class]': 'sizingClasses'
                     }
                 }]
@@ -6147,7 +5549,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
             args: [{
                     selector: 'dbx-popover-controls,[dbxPopoverControls],.dbx-popover-controls',
                     host: {
-                        'class': 'd-block dbx-popover-controls'
+                        class: 'd-block dbx-popover-controls'
                     }
                 }]
         }], ctorParameters: function () { return [{ type: DbxPopoverContentComponent, decorators: [{
@@ -6166,7 +5568,7 @@ class DbxActionPopoverDirective extends AbstractDbxActionValueOnTriggerDirective
         this.isModifiedFunction = isModifiedFunction;
     }
     _getDataFromPopover() {
-        return this._makePopoverRef().afterClosed$.pipe(first(), map(x => x.data));
+        return this._makePopoverRef().afterClosed$.pipe(first(), map((x) => x.data));
     }
     _makePopoverRef() {
         const origin = this.elementRef;
@@ -6197,21 +5599,13 @@ class DbxKeypressModule {
 }
 DbxKeypressModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxKeypressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 DbxKeypressModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxKeypressModule, declarations: [DbxWindowKeyDownListenerDirective], imports: [CommonModule], exports: [DbxWindowKeyDownListenerDirective] });
-DbxKeypressModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxKeypressModule, imports: [[
-            CommonModule
-        ]] });
+DbxKeypressModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxKeypressModule, imports: [[CommonModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxKeypressModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule
-                    ],
-                    declarations: [
-                        DbxWindowKeyDownListenerDirective
-                    ],
-                    exports: [
-                        DbxWindowKeyDownListenerDirective
-                    ]
+                    imports: [CommonModule],
+                    declarations: [DbxWindowKeyDownListenerDirective],
+                    exports: [DbxWindowKeyDownListenerDirective]
                 }]
         }] });
 
@@ -6239,7 +5633,7 @@ DbxActionKeyTriggerDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionKeyTriggerDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[dbxActionKeyTrigger]',
+                    selector: '[dbxActionKeyTrigger]'
                 }]
         }], ctorParameters: function () { return [{ type: i1$2.DbxActionContextStoreSourceInstance, decorators: [{
                     type: Host
@@ -6254,10 +5648,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxPromptConfirm {
 }
 function provideDbxPromptConfirm(sourceType) {
-    return [{
+    return [
+        {
             provide: DbxPromptConfirm,
             useExisting: forwardRef(() => sourceType)
-        }];
+        }
+    ];
 }
 
 /**
@@ -6486,14 +5882,18 @@ class DbxPromptBoxComponent {
     }
 }
 DbxPromptBoxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DbxPromptBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPromptBoxComponent, selector: "dbx-prompt-box", inputs: { elevated: "elevated" }, host: { properties: { "class.elevated": "elevated" }, classAttribute: "d-block dbx-prompt-box" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
+DbxPromptBoxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPromptBoxComponent, selector: "dbx-prompt-box", inputs: { elevated: "elevated" }, host: { properties: { "class.elevated": "elevated" }, classAttribute: "d-block dbx-prompt-box" }, ngImport: i0, template: `
+    <ng-content></ng-content>
+  `, isInline: true });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptBoxComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-prompt-box',
-                    template: `<ng-content></ng-content>`,
+                    template: `
+    <ng-content></ng-content>
+  `,
                     host: {
-                        'class': 'd-block dbx-prompt-box',
+                        class: 'd-block dbx-prompt-box',
                         '[class.elevated]': 'elevated'
                     }
                 }]
@@ -6523,7 +5923,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     </dbx-content-container>
   `,
                     host: {
-                        'class': 'd-block dbx-prompt-page'
+                        class: 'd-block dbx-prompt-page'
                     }
                 }]
         }] });
@@ -6536,7 +5936,7 @@ class DbxPromptConfirmButtonDirective {
         this.appButton = appButton;
         this.prompt = prompt;
         this.interceptButtonClick = () => {
-            return this.prompt.showDialog().pipe(map(x => Boolean(x)));
+            return this.prompt.showDialog().pipe(map((x) => Boolean(x)));
         };
     }
     ngOnInit() {
@@ -6548,7 +5948,7 @@ DbxPromptConfirmButtonDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion:
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptConfirmButtonDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[dbxPromptConfirmButton]',
+                    selector: '[dbxPromptConfirmButton]'
                 }]
         }], ctorParameters: function () { return [{ type: i1$2.DbxButtonDirective, decorators: [{
                     type: Host
@@ -6559,68 +5959,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxPromptModule {
 }
 DbxPromptModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxPromptModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptModule, declarations: [DbxPromptComponent,
-        DbxPromptBoxComponent,
-        DbxPromptPageComponent,
-        DbxPromptConfirmComponent,
-        DbxPromptConfirmButtonDirective,
-        DbxPromptConfirmDialogComponent,
-        DbxPromptConfirmDirective], imports: [CommonModule,
-        MatDialogModule,
-        MatButtonModule,
-        DbxTextModule,
-        DbxButtonModule,
-        DbxInjectionComponentModule,
-        DbxDialogInteractionModule,
-        DbxSectionLayoutModule,
-        DbxContentLayoutModule], exports: [DbxPromptComponent,
-        DbxPromptBoxComponent,
-        DbxPromptPageComponent,
-        DbxPromptConfirmComponent,
-        DbxPromptConfirmButtonDirective,
-        DbxPromptConfirmDirective] });
-DbxPromptModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptModule, imports: [[
-            CommonModule,
-            MatDialogModule,
-            MatButtonModule,
-            DbxTextModule,
-            DbxButtonModule,
-            DbxInjectionComponentModule,
-            DbxDialogInteractionModule,
-            DbxSectionLayoutModule,
-            DbxContentLayoutModule
-        ]] });
+DbxPromptModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptModule, declarations: [DbxPromptComponent, DbxPromptBoxComponent, DbxPromptPageComponent, DbxPromptConfirmComponent, DbxPromptConfirmButtonDirective, DbxPromptConfirmDialogComponent, DbxPromptConfirmDirective], imports: [CommonModule, MatDialogModule, MatButtonModule, DbxTextModule, DbxButtonModule, DbxInjectionComponentModule, DbxDialogInteractionModule, DbxSectionLayoutModule, DbxContentLayoutModule], exports: [DbxPromptComponent, DbxPromptBoxComponent, DbxPromptPageComponent, DbxPromptConfirmComponent, DbxPromptConfirmButtonDirective, DbxPromptConfirmDirective] });
+DbxPromptModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptModule, imports: [[CommonModule, MatDialogModule, MatButtonModule, DbxTextModule, DbxButtonModule, DbxInjectionComponentModule, DbxDialogInteractionModule, DbxSectionLayoutModule, DbxContentLayoutModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPromptModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatDialogModule,
-                        MatButtonModule,
-                        DbxTextModule,
-                        DbxButtonModule,
-                        DbxInjectionComponentModule,
-                        DbxDialogInteractionModule,
-                        DbxSectionLayoutModule,
-                        DbxContentLayoutModule
-                    ],
-                    declarations: [
-                        DbxPromptComponent,
-                        DbxPromptBoxComponent,
-                        DbxPromptPageComponent,
-                        DbxPromptConfirmComponent,
-                        DbxPromptConfirmButtonDirective,
-                        DbxPromptConfirmDialogComponent,
-                        DbxPromptConfirmDirective,
-                    ],
-                    exports: [
-                        DbxPromptComponent,
-                        DbxPromptBoxComponent,
-                        DbxPromptPageComponent,
-                        DbxPromptConfirmComponent,
-                        DbxPromptConfirmButtonDirective,
-                        DbxPromptConfirmDirective,
-                    ],
+                    imports: [CommonModule, MatDialogModule, MatButtonModule, DbxTextModule, DbxButtonModule, DbxInjectionComponentModule, DbxDialogInteractionModule, DbxSectionLayoutModule, DbxContentLayoutModule],
+                    declarations: [DbxPromptComponent, DbxPromptBoxComponent, DbxPromptPageComponent, DbxPromptConfirmComponent, DbxPromptConfirmButtonDirective, DbxPromptConfirmDialogComponent, DbxPromptConfirmDirective],
+                    exports: [DbxPromptComponent, DbxPromptBoxComponent, DbxPromptPageComponent, DbxPromptConfirmComponent, DbxPromptConfirmButtonDirective, DbxPromptConfirmDirective]
                 }]
         }] });
 
@@ -6643,133 +5989,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxActionModule {
 }
 DbxActionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxActionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionModule, declarations: [DbxActionKeyTriggerDirective,
-        DbxActionConfirmDirective,
-        DbxActionProgressComponent], imports: [CommonModule,
-        DbxCoreActionModule,
-        DbxButtonModule,
-        DbxLoadingModule,
-        MatSnackBarModule,
-        MatDialogModule,
-        MatButtonModule,
-        DbxPromptModule], exports: [DbxCoreActionModule,
-        DbxActionKeyTriggerDirective,
-        DbxActionConfirmDirective,
-        DbxActionProgressComponent] });
-DbxActionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionModule, imports: [[
-            CommonModule,
-            DbxCoreActionModule,
-            DbxButtonModule,
-            DbxLoadingModule,
-            MatSnackBarModule,
-            MatDialogModule,
-            MatButtonModule,
-            DbxPromptModule,
-        ], DbxCoreActionModule] });
+DbxActionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionModule, declarations: [DbxActionKeyTriggerDirective, DbxActionConfirmDirective, DbxActionProgressComponent], imports: [CommonModule, DbxCoreActionModule, DbxButtonModule, DbxLoadingModule, MatSnackBarModule, MatDialogModule, MatButtonModule, DbxPromptModule], exports: [DbxCoreActionModule, DbxActionKeyTriggerDirective, DbxActionConfirmDirective, DbxActionProgressComponent] });
+DbxActionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionModule, imports: [[CommonModule, DbxCoreActionModule, DbxButtonModule, DbxLoadingModule, MatSnackBarModule, MatDialogModule, MatButtonModule, DbxPromptModule], DbxCoreActionModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxCoreActionModule,
-                        DbxButtonModule,
-                        DbxLoadingModule,
-                        MatSnackBarModule,
-                        MatDialogModule,
-                        MatButtonModule,
-                        DbxPromptModule,
-                    ],
-                    declarations: [
-                        DbxActionKeyTriggerDirective,
-                        DbxActionConfirmDirective,
-                        DbxActionProgressComponent,
-                    ],
-                    exports: [
-                        DbxCoreActionModule,
-                        DbxActionKeyTriggerDirective,
-                        DbxActionConfirmDirective,
-                        DbxActionProgressComponent,
-                    ]
+                    imports: [CommonModule, DbxCoreActionModule, DbxButtonModule, DbxLoadingModule, MatSnackBarModule, MatDialogModule, MatButtonModule, DbxPromptModule],
+                    declarations: [DbxActionKeyTriggerDirective, DbxActionConfirmDirective, DbxActionProgressComponent],
+                    exports: [DbxCoreActionModule, DbxActionKeyTriggerDirective, DbxActionConfirmDirective, DbxActionProgressComponent]
                 }]
         }] });
 
 class DbxPopoverInteractionModule {
 }
 DbxPopoverInteractionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverInteractionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxPopoverInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverInteractionModule, declarations: [DbxActionPopoverDirective,
-        DbxPopoverComponent,
-        DbxPopoverCoordinatorComponent,
-        DbxPopoverContentComponent,
-        DbxPopoverControlsDirective,
-        DbxPopoverHeaderComponent,
-        DbxPopoverScrollContentComponent], imports: [CommonModule,
-        MatIconModule,
-        MatButtonModule,
-        MatDividerModule,
-        DbxButtonModule,
-        DbxRouterAnchorModule,
-        DbxActionModule,
-        DbxKeypressModule,
-        DbxStyleLayoutModule,
-        DbxInjectionComponentModule,
-        NgOverlayContainerModule,
-        AngularResizeEventModule], exports: [DbxActionPopoverDirective,
-        DbxPopoverContentComponent,
-        DbxPopoverControlsDirective,
-        DbxPopoverHeaderComponent,
-        DbxPopoverScrollContentComponent] });
-DbxPopoverInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverInteractionModule, providers: [
-        DbxPopoverService
-    ], imports: [[
-            CommonModule,
-            MatIconModule,
-            MatButtonModule,
-            MatDividerModule,
-            DbxButtonModule,
-            DbxRouterAnchorModule,
-            DbxActionModule,
-            DbxKeypressModule,
-            DbxStyleLayoutModule,
-            DbxInjectionComponentModule,
-            NgOverlayContainerModule,
-            AngularResizeEventModule
-        ]] });
+DbxPopoverInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverInteractionModule, declarations: [DbxActionPopoverDirective, DbxPopoverComponent, DbxPopoverCoordinatorComponent, DbxPopoverContentComponent, DbxPopoverControlsDirective, DbxPopoverHeaderComponent, DbxPopoverScrollContentComponent], imports: [CommonModule, MatIconModule, MatButtonModule, MatDividerModule, DbxButtonModule, DbxRouterAnchorModule, DbxActionModule, DbxKeypressModule, DbxStyleLayoutModule, DbxInjectionComponentModule, NgOverlayContainerModule, AngularResizeEventModule], exports: [DbxActionPopoverDirective, DbxPopoverContentComponent, DbxPopoverControlsDirective, DbxPopoverHeaderComponent, DbxPopoverScrollContentComponent] });
+DbxPopoverInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverInteractionModule, providers: [DbxPopoverService], imports: [[CommonModule, MatIconModule, MatButtonModule, MatDividerModule, DbxButtonModule, DbxRouterAnchorModule, DbxActionModule, DbxKeypressModule, DbxStyleLayoutModule, DbxInjectionComponentModule, NgOverlayContainerModule, AngularResizeEventModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopoverInteractionModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        MatDividerModule,
-                        DbxButtonModule,
-                        DbxRouterAnchorModule,
-                        DbxActionModule,
-                        DbxKeypressModule,
-                        DbxStyleLayoutModule,
-                        DbxInjectionComponentModule,
-                        NgOverlayContainerModule,
-                        AngularResizeEventModule
-                    ],
-                    declarations: [
-                        DbxActionPopoverDirective,
-                        DbxPopoverComponent,
-                        DbxPopoverCoordinatorComponent,
-                        DbxPopoverContentComponent,
-                        DbxPopoverControlsDirective,
-                        DbxPopoverHeaderComponent,
-                        DbxPopoverScrollContentComponent
-                    ],
-                    exports: [
-                        DbxActionPopoverDirective,
-                        DbxPopoverContentComponent,
-                        DbxPopoverControlsDirective,
-                        DbxPopoverHeaderComponent,
-                        DbxPopoverScrollContentComponent
-                    ],
-                    providers: [
-                        DbxPopoverService
-                    ]
+                    imports: [CommonModule, MatIconModule, MatButtonModule, MatDividerModule, DbxButtonModule, DbxRouterAnchorModule, DbxActionModule, DbxKeypressModule, DbxStyleLayoutModule, DbxInjectionComponentModule, NgOverlayContainerModule, AngularResizeEventModule],
+                    declarations: [DbxActionPopoverDirective, DbxPopoverComponent, DbxPopoverCoordinatorComponent, DbxPopoverContentComponent, DbxPopoverControlsDirective, DbxPopoverHeaderComponent, DbxPopoverScrollContentComponent],
+                    exports: [DbxActionPopoverDirective, DbxPopoverContentComponent, DbxPopoverControlsDirective, DbxPopoverHeaderComponent, DbxPopoverScrollContentComponent],
+                    providers: [DbxPopoverService]
                 }]
         }] });
 
@@ -6804,18 +6046,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxFilterInteractionModule {
 }
 DbxFilterInteractionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFilterInteractionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxFilterInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFilterInteractionModule, declarations: [DbxFilterPopoverComponent,
-        DbxFilterPopoverButtonComponent,
-        DbxFilterWrapperComponent], imports: [CommonModule,
+DbxFilterInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFilterInteractionModule, declarations: [DbxFilterPopoverComponent, DbxFilterPopoverButtonComponent, DbxFilterWrapperComponent], imports: [CommonModule,
         DbxPopoverInteractionModule,
         DbxCoreFilterModule,
         DbxInjectionComponentModule,
         FlexLayoutModule,
         // Material
         MatIconModule,
-        MatButtonModule], exports: [DbxCoreFilterModule,
-        DbxFilterPopoverButtonComponent,
-        DbxFilterWrapperComponent] });
+        MatButtonModule], exports: [DbxCoreFilterModule, DbxFilterPopoverButtonComponent, DbxFilterWrapperComponent] });
 DbxFilterInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxFilterInteractionModule, imports: [[
             CommonModule,
             DbxPopoverInteractionModule,
@@ -6839,16 +6077,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
                         MatIconModule,
                         MatButtonModule
                     ],
-                    declarations: [
-                        DbxFilterPopoverComponent,
-                        DbxFilterPopoverButtonComponent,
-                        DbxFilterWrapperComponent,
-                    ],
-                    exports: [
-                        DbxCoreFilterModule,
-                        DbxFilterPopoverButtonComponent,
-                        DbxFilterWrapperComponent,
-                    ]
+                    declarations: [DbxFilterPopoverComponent, DbxFilterPopoverButtonComponent, DbxFilterWrapperComponent],
+                    exports: [DbxCoreFilterModule, DbxFilterPopoverButtonComponent, DbxFilterWrapperComponent]
                 }]
         }] });
 
@@ -7011,7 +6241,7 @@ class DbxPopupCoordinatorComponent {
     constructor(service, popup) {
         this.service = service;
         this.popup = popup;
-        this.isPopupForKey$ = this.service.popups$.pipe(map(x => x.get(this.popup.key) === this.popup), shareReplay(1));
+        this.isPopupForKey$ = this.service.popups$.pipe(map((x) => x.get(this.popup.key) === this.popup), shareReplay(1));
         this.show$ = this.isPopupForKey$.pipe(delay(0));
     }
     ngOnInit() {
@@ -7023,18 +6253,18 @@ class DbxPopupCoordinatorComponent {
 }
 DbxPopupCoordinatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupCoordinatorComponent, deps: [{ token: DbxPopupCoordinatorService }, { token: DbxPopupController }], target: i0.ɵɵFactoryTarget.Component });
 DbxPopupCoordinatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopupCoordinatorComponent, selector: "dbx-popup-coordinator", ngImport: i0, template: `
-  <ng-container *ngIf="show$ | async">
-    <ng-content></ng-content>
-  </ng-container>
+    <ng-container *ngIf="show$ | async">
+      <ng-content></ng-content>
+    </ng-container>
   `, isInline: true, directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupCoordinatorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'dbx-popup-coordinator',
                     template: `
-  <ng-container *ngIf="show$ | async">
-    <ng-content></ng-content>
-  </ng-container>
+    <ng-container *ngIf="show$ | async">
+      <ng-content></ng-content>
+    </ng-container>
   `
                 }]
         }], ctorParameters: function () { return [{ type: DbxPopupCoordinatorService }, { type: DbxPopupController }]; } });
@@ -7054,11 +6284,11 @@ class DbxPopupComponent extends AbstractTransitionWatcherDirective {
         this.compactContextState = compactContextState;
         this.contentConfig = {
             componentClass: this.config.componentClass,
-            init: this.config.init ? ((instance) => this.config.init(instance, this)) : undefined
+            init: this.config.init ? (instance) => this.config.init(instance, this) : undefined
         };
         this.closing = new Subject();
         this.isClosing$ = this.closing.pipe(first(), map(() => true), startWith(false), shareReplay(1));
-        this.closing$ = this.isClosing$.pipe(filter(x => x));
+        this.closing$ = this.isClosing$.pipe(filter((x) => x));
         this._windowState = new BehaviorSubject(DbxPopupWindowState.NORMAL);
         this.windowState$ = this._windowState.asObservable();
         this.compactContextState.setMode(CompactMode.COMPACT);
@@ -7122,30 +6352,36 @@ class DbxPopupComponent extends AbstractTransitionWatcherDirective {
     }
 }
 DbxPopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupComponent, deps: [{ token: i1$a.NgPopoverRef }, { token: CompactContextStore }, { token: i1$2.DbxRouterTransitionService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
-DbxPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopupComponent, selector: "ng-component", providers: [{
+DbxPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.2", type: DbxPopupComponent, selector: "ng-component", providers: [
+        {
             provide: DbxPopupController,
             useExisting: DbxPopupComponent
-        }, {
+        },
+        {
             provide: CompactContextStore
-        }], usesInheritance: true, ngImport: i0, template: `
-  <dbx-popup-coordinator>
-    <div class="dbx-popup-component" dbx-injection [config]="contentConfig"></div>
-  </dbx-popup-coordinator>
+        }
+    ], usesInheritance: true, ngImport: i0, template: `
+    <dbx-popup-coordinator>
+      <div class="dbx-popup-component" dbx-injection [config]="contentConfig"></div>
+    </dbx-popup-coordinator>
   `, isInline: true, components: [{ type: DbxPopupCoordinatorComponent, selector: "dbx-popup-coordinator" }, { type: i1$2.DbxInjectionComponent, selector: "dbx-injection, [dbxInjection], [dbx-injection]", inputs: ["config", "template"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupComponent, decorators: [{
             type: Component,
             args: [{
                     template: `
-  <dbx-popup-coordinator>
-    <div class="dbx-popup-component" dbx-injection [config]="contentConfig"></div>
-  </dbx-popup-coordinator>
+    <dbx-popup-coordinator>
+      <div class="dbx-popup-component" dbx-injection [config]="contentConfig"></div>
+    </dbx-popup-coordinator>
   `,
-                    providers: [{
+                    providers: [
+                        {
                             provide: DbxPopupController,
                             useExisting: DbxPopupComponent
-                        }, {
+                        },
+                        {
                             provide: CompactContextStore
-                        }]
+                        }
+                    ]
                 }]
         }], ctorParameters: function () { return [{ type: i1$a.NgPopoverRef }, { type: CompactContextStore }, { type: i1$2.DbxRouterTransitionService }, { type: i0.NgZone }]; } });
 
@@ -7172,7 +6408,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxPopupContentComponent {
     constructor(appPopupController) {
         this.appPopupController = appPopupController;
-        this.showContent$ = this.appPopupController.windowState$.pipe(map(x => x !== DbxPopupWindowState.MINIMIZED));
+        this.showContent$ = this.appPopupController.windowState$.pipe(map((x) => x !== DbxPopupWindowState.MINIMIZED));
     }
 }
 DbxPopupContentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupContentComponent, deps: [{ token: DbxPopupController }], target: i0.ɵɵFactoryTarget.Component });
@@ -7193,7 +6429,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     </div>
   `,
                     host: {
-                        'class': 'dbx-popup-content'
+                        class: 'dbx-popup-content'
                     }
                 }]
         }], ctorParameters: function () { return [{ type: DbxPopupController }]; } });
@@ -7204,8 +6440,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxPopupControlButtonsComponent {
     constructor(appPopupController) {
         this.appPopupController = appPopupController;
-        this.isMinimized$ = this.appPopupController.windowState$.pipe(map(x => x === DbxPopupWindowState.MINIMIZED));
-        this.isFullscreen$ = this.appPopupController.windowState$.pipe(map(x => x === DbxPopupWindowState.FULLSCREEN));
+        this.isMinimized$ = this.appPopupController.windowState$.pipe(map((x) => x === DbxPopupWindowState.MINIMIZED));
+        this.isFullscreen$ = this.appPopupController.windowState$.pipe(map((x) => x === DbxPopupWindowState.FULLSCREEN));
     }
     minimizeClicked() {
         this.appPopupController.minimize();
@@ -7255,7 +6491,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     <dbx-button [flat]="true" icon="close" color="warn" (buttonClick)="closeClicked()"></dbx-button>
   `,
                     host: {
-                        'class': 'dbx-popup-control-buttons'
+                        class: 'dbx-popup-control-buttons'
                     }
                 }]
         }], ctorParameters: function () { return [{ type: DbxPopupController }]; } });
@@ -7281,7 +6517,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
     <dbx-popup-control-buttons></dbx-popup-control-buttons>
   `,
                     host: {
-                        'class': 'dbx-popup-controls'
+                        class: 'dbx-popup-controls'
                     }
                 }]
         }], propDecorators: { header: [{
@@ -7298,7 +6534,7 @@ class DbxPopupService {
         this._overlayContainerService = new NgOverlayContainerService(this._overlay, this._injector);
     }
     open(config) {
-        const service = (config.injector) ? new NgOverlayContainerService(this._overlay, config.injector) : this._overlayContainerService;
+        const service = config.injector ? new NgOverlayContainerService(this._overlay, config.injector) : this._overlayContainerService;
         const isDraggable = config.isDraggable ?? false;
         const position = config.position ?? 'bottom_right';
         return service.open({
@@ -7328,130 +6564,41 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxPopupInteractionModule {
 }
 DbxPopupInteractionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupInteractionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxPopupInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupInteractionModule, declarations: [DbxPopupComponent,
-        DbxPopupCoordinatorComponent,
-        DbxPopupContentComponent,
-        DbxPopupControlsComponent,
-        DbxPopupControlButtonsComponent], imports: [CommonModule,
-        MatIconModule,
-        MatButtonModule,
-        DbxButtonModule,
-        DbxRouterAnchorModule,
-        DbxActionModule,
-        DbxStyleLayoutModule,
-        DbxInjectionComponentModule,
-        NgOverlayContainerModule], exports: [DbxPopupContentComponent,
-        DbxPopupControlsComponent,
-        DbxPopupControlButtonsComponent] });
-DbxPopupInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupInteractionModule, providers: [
-        DbxPopupService
-    ], imports: [[
-            CommonModule,
-            MatIconModule,
-            MatButtonModule,
-            DbxButtonModule,
-            DbxRouterAnchorModule,
-            DbxActionModule,
-            DbxStyleLayoutModule,
-            DbxInjectionComponentModule,
-            NgOverlayContainerModule,
-        ]] });
+DbxPopupInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupInteractionModule, declarations: [DbxPopupComponent, DbxPopupCoordinatorComponent, DbxPopupContentComponent, DbxPopupControlsComponent, DbxPopupControlButtonsComponent], imports: [CommonModule, MatIconModule, MatButtonModule, DbxButtonModule, DbxRouterAnchorModule, DbxActionModule, DbxStyleLayoutModule, DbxInjectionComponentModule, NgOverlayContainerModule], exports: [DbxPopupContentComponent, DbxPopupControlsComponent, DbxPopupControlButtonsComponent] });
+DbxPopupInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupInteractionModule, providers: [DbxPopupService], imports: [[CommonModule, MatIconModule, MatButtonModule, DbxButtonModule, DbxRouterAnchorModule, DbxActionModule, DbxStyleLayoutModule, DbxInjectionComponentModule, NgOverlayContainerModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxPopupInteractionModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        DbxButtonModule,
-                        DbxRouterAnchorModule,
-                        DbxActionModule,
-                        DbxStyleLayoutModule,
-                        DbxInjectionComponentModule,
-                        NgOverlayContainerModule,
-                    ],
-                    declarations: [
-                        DbxPopupComponent,
-                        DbxPopupCoordinatorComponent,
-                        DbxPopupContentComponent,
-                        DbxPopupControlsComponent,
-                        DbxPopupControlButtonsComponent
-                    ],
-                    exports: [
-                        DbxPopupContentComponent,
-                        DbxPopupControlsComponent,
-                        DbxPopupControlButtonsComponent
-                    ],
-                    providers: [
-                        DbxPopupService
-                    ]
+                    imports: [CommonModule, MatIconModule, MatButtonModule, DbxButtonModule, DbxRouterAnchorModule, DbxActionModule, DbxStyleLayoutModule, DbxInjectionComponentModule, NgOverlayContainerModule],
+                    declarations: [DbxPopupComponent, DbxPopupCoordinatorComponent, DbxPopupContentComponent, DbxPopupControlsComponent, DbxPopupControlButtonsComponent],
+                    exports: [DbxPopupContentComponent, DbxPopupControlsComponent, DbxPopupControlButtonsComponent],
+                    providers: [DbxPopupService]
                 }]
         }] });
 
 class DbxInteractionModule {
 }
 DbxInteractionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxInteractionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxInteractionModule, exports: [DbxDialogInteractionModule,
-        DbxFilterInteractionModule,
-        DbxPromptModule,
-        DbxPopoverInteractionModule,
-        DbxPopupInteractionModule] });
-DbxInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxInteractionModule, imports: [DbxDialogInteractionModule,
-        DbxFilterInteractionModule,
-        DbxPromptModule,
-        DbxPopoverInteractionModule,
-        DbxPopupInteractionModule] });
+DbxInteractionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxInteractionModule, exports: [DbxDialogInteractionModule, DbxFilterInteractionModule, DbxPromptModule, DbxPopoverInteractionModule, DbxPopupInteractionModule] });
+DbxInteractionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxInteractionModule, imports: [DbxDialogInteractionModule, DbxFilterInteractionModule, DbxPromptModule, DbxPopoverInteractionModule, DbxPopupInteractionModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxInteractionModule, decorators: [{
             type: NgModule,
             args: [{
-                    exports: [
-                        DbxDialogInteractionModule,
-                        DbxFilterInteractionModule,
-                        DbxPromptModule,
-                        DbxPopoverInteractionModule,
-                        DbxPopupInteractionModule
-                    ],
+                    exports: [DbxDialogInteractionModule, DbxFilterInteractionModule, DbxPromptModule, DbxPopoverInteractionModule, DbxPopupInteractionModule]
                 }]
         }] });
 
 class DbxActionSnackbarModule {
 }
 DbxActionSnackbarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxActionSnackbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarModule, declarations: [DbxActionSnackbarComponent,
-        DbxActionSnackbarDirective], imports: [CommonModule,
-        DbxStyleLayoutModule,
-        DbxCoreActionModule,
-        DbxPromptModule,
-        DbxButtonModule,
-        DbxReadableErrorModule], exports: [DbxActionSnackbarComponent,
-        DbxActionSnackbarDirective] });
-DbxActionSnackbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarModule, imports: [[
-            CommonModule,
-            DbxStyleLayoutModule,
-            DbxCoreActionModule,
-            DbxPromptModule,
-            DbxButtonModule,
-            DbxReadableErrorModule
-        ]] });
+DbxActionSnackbarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarModule, declarations: [DbxActionSnackbarComponent, DbxActionSnackbarDirective], imports: [CommonModule, DbxStyleLayoutModule, DbxCoreActionModule, DbxPromptModule, DbxButtonModule, DbxReadableErrorModule], exports: [DbxActionSnackbarComponent, DbxActionSnackbarDirective] });
+DbxActionSnackbarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarModule, imports: [[CommonModule, DbxStyleLayoutModule, DbxCoreActionModule, DbxPromptModule, DbxButtonModule, DbxReadableErrorModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionSnackbarModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxStyleLayoutModule,
-                        DbxCoreActionModule,
-                        DbxPromptModule,
-                        DbxButtonModule,
-                        DbxReadableErrorModule
-                    ],
-                    declarations: [
-                        DbxActionSnackbarComponent,
-                        DbxActionSnackbarDirective
-                    ],
-                    exports: [
-                        DbxActionSnackbarComponent,
-                        DbxActionSnackbarDirective
-                    ]
+                    imports: [CommonModule, DbxStyleLayoutModule, DbxCoreActionModule, DbxPromptModule, DbxButtonModule, DbxReadableErrorModule],
+                    declarations: [DbxActionSnackbarComponent, DbxActionSnackbarDirective],
+                    exports: [DbxActionSnackbarComponent, DbxActionSnackbarDirective]
                 }]
         }] });
 
@@ -7541,7 +6688,8 @@ class DbxActionTransitionSafetyDirective {
         this._closeDialog();
     }
     _handleOnBeforeTransition(transition) {
-        return this.source.isModified$.pipe(first(), mergeMap((isModified) => {
+        return this.source.isModified$
+            .pipe(first(), mergeMap((isModified) => {
             if (isModified) {
                 return race([
                     // Watch for success to occur. At that point, close everything.
@@ -7561,7 +6709,9 @@ class DbxActionTransitionSafetyDirective {
             else {
                 return of(true);
             }
-        })).toPromise().then(x => x); // Resolve/Flatten potential promise result.
+        }))
+            .toPromise()
+            .then((x) => x); // Resolve/Flatten potential promise result.
     }
     _handleIsModifiedState(transition) {
         const safetyType = this.safetyType;
@@ -7628,7 +6778,7 @@ DbxActionTransitionSafetyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersio
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionTransitionSafetyDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[dbxActionTransitionSafety]',
+                    selector: '[dbxActionTransitionSafety]'
                 }]
         }], ctorParameters: function () { return [{ type: i1$2.DbxActionContextStoreSourceInstance }, { type: i2$2.TransitionService }, { type: i0.ViewContainerRef }, { type: i1$3.MatDialog }]; }, propDecorators: { inputSafetyType: [{
                 type: Input,
@@ -7643,56 +6793,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImpor
 class DbxActionUIRouterTransitionModule {
 }
 DbxActionUIRouterTransitionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionUIRouterTransitionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxActionUIRouterTransitionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionUIRouterTransitionModule, declarations: [DbxActionTransitionSafetyDirective,
-        DbxActionUIRouterTransitionSafetyDialogComponent], imports: [CommonModule,
-        DbxCoreActionModule,
-        DbxPromptModule,
-        DbxButtonModule,
-        DbxReadableErrorModule], exports: [DbxActionTransitionSafetyDirective] });
-DbxActionUIRouterTransitionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionUIRouterTransitionModule, imports: [[
-            CommonModule,
-            DbxCoreActionModule,
-            DbxPromptModule,
-            DbxButtonModule,
-            DbxReadableErrorModule
-        ]] });
+DbxActionUIRouterTransitionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionUIRouterTransitionModule, declarations: [DbxActionTransitionSafetyDirective, DbxActionUIRouterTransitionSafetyDialogComponent], imports: [CommonModule, DbxCoreActionModule, DbxPromptModule, DbxButtonModule, DbxReadableErrorModule], exports: [DbxActionTransitionSafetyDirective] });
+DbxActionUIRouterTransitionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionUIRouterTransitionModule, imports: [[CommonModule, DbxCoreActionModule, DbxPromptModule, DbxButtonModule, DbxReadableErrorModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxActionUIRouterTransitionModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        DbxCoreActionModule,
-                        DbxPromptModule,
-                        DbxButtonModule,
-                        DbxReadableErrorModule
-                    ],
-                    declarations: [
-                        DbxActionTransitionSafetyDirective,
-                        DbxActionUIRouterTransitionSafetyDialogComponent
-                    ],
-                    exports: [
-                        DbxActionTransitionSafetyDirective
-                    ]
+                    imports: [CommonModule, DbxCoreActionModule, DbxPromptModule, DbxButtonModule, DbxReadableErrorModule],
+                    declarations: [DbxActionTransitionSafetyDirective, DbxActionUIRouterTransitionSafetyDialogComponent],
+                    exports: [DbxActionTransitionSafetyDirective]
                 }]
         }] });
 
 class DbxWebModule {
 }
 DbxWebModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DbxWebModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebModule, exports: [DbxButtonModule,
-        DbxActionModule,
-        DbxLoadingModule] });
-DbxWebModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebModule, imports: [DbxButtonModule,
-        DbxActionModule,
-        DbxLoadingModule] });
+DbxWebModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebModule, exports: [DbxButtonModule, DbxActionModule, DbxLoadingModule] });
+DbxWebModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebModule, imports: [DbxButtonModule, DbxActionModule, DbxLoadingModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.2", ngImport: i0, type: DbxWebModule, decorators: [{
             type: NgModule,
             args: [{
-                    exports: [
-                        DbxButtonModule,
-                        DbxActionModule,
-                        DbxLoadingModule
-                    ],
+                    exports: [DbxButtonModule, DbxActionModule, DbxLoadingModule]
                 }]
         }] });
 /**