@dereekb/dbx-web 9.21.0 → 9.22.0

package/fesm2020/dereekb-dbx-web.mjs

@@ -34,7 +34,6 @@ import * as i4 from '@angular/material/divider';
 import { MatDividerModule } from '@angular/material/divider';
 import * as i3$2 from '@angular/flex-layout/flex';
 import { FlexLayoutModule } from '@angular/flex-layout';
-import { shareReplay as shareReplay$1, mergeMap as mergeMap$1, map as map$1, catchError as catchError$1, distinctUntilChanged as distinctUntilChanged$1, tap as tap$1, filter as filter$1 } from 'rxjs/operators';
 import * as i4$1 from '@angular/material/list';
 import { MatListModule } from '@angular/material/list';
 import * as i4$3 from '@angular/material/tabs';
@@ -103,6 +102,7 @@ class AbstractProgressButtonDirective extends AbstractSubscriptionDirective {
                     working: options?.working || working,
                     disabled: options?.disabled || disabled
                 };
+                completeOptions.buttonIcon = completeOptions.buttonIcon || completeOptions.icon;
             }
             return completeOptions;
         }), filterMaybe(), distinctUntilChanged(), shareReplay(1));
@@ -125,6 +125,7 @@ class AbstractProgressButtonDirective extends AbstractSubscriptionDirective {
         this.options$.pipe(first()).subscribe((options) => {
             if (!options.disabled && !options.working) {
                 this.btnClick.emit(event);
+                event.stopImmediatePropagation();
             }
         });
     }
@@ -173,13 +174,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
             }] } });
 
 class DbxSpinnerButtonComponent extends AbstractProgressButtonDirective {
+    get showText() {
+        return !(this.options.fab || this.options.iconOnly);
+    }
     calcSpinnerSize() {
         const options = this.options;
         const elem = this.buttonRef?.nativeElement;
         const height = elem.clientHeight;
         let size;
         if (options) {
-            if (options.fab) {
+            if (options.fab || options.iconOnly) {
                 size = height;
             }
             else {
@@ -196,10 +200,10 @@ class DbxSpinnerButtonComponent extends AbstractProgressButtonDirective {
     }
 }
 DbxSpinnerButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxSpinnerButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DbxSpinnerButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", 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 class=\"dbx-spinner-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 class=\"mat-fab-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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.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"] }, { kind: "component", type: i3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+DbxSpinnerButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", 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 class=\"dbx-spinner-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-icon-button]=\"options.iconOnly\" [class.mat-fab]=\"options.fab\" [ngClass]=\"options.customClass!\" [ngStyle]=\"options.customStyle!\" [disabled]=\"options.working || options.disabled\">\n  <ng-container *ngIf=\"showText\">\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!\">\n        {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n      </mat-icon>\n    </ng-container>\n\n    <span class=\"button-text\" [class.working]=\"options.working && !options.disabled\">\n      {{ options.text }}\n      <ng-content></ng-content>\n    </span>\n  </ng-container>\n\n  <ng-container *ngIf=\"!showText && options.buttonIcon\">\n    <mat-icon class=\"mat-fab-icon\" [fontSet]=\"options.buttonIcon.fontSet!\" [fontIcon]=\"options.buttonIcon.fontIcon!\" [color]=\"options.buttonIcon.color!\" [svgIcon]=\"options.buttonIcon.svgIcon!\" [inline]=\"options.fab && options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.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"] }, { kind: "component", type: i3.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxSpinnerButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dbx-spinner-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"dbx-spinner-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 class=\"mat-fab-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"] }]
+            args: [{ selector: 'dbx-spinner-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button class=\"dbx-spinner-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-icon-button]=\"options.iconOnly\" [class.mat-fab]=\"options.fab\" [ngClass]=\"options.customClass!\" [ngStyle]=\"options.customStyle!\" [disabled]=\"options.working || options.disabled\">\n  <ng-container *ngIf=\"showText\">\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!\">\n        {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.fontIcon }}\n      </mat-icon>\n    </ng-container>\n\n    <span class=\"button-text\" [class.working]=\"options.working && !options.disabled\">\n      {{ options.text }}\n      <ng-content></ng-content>\n    </span>\n  </ng-container>\n\n  <ng-container *ngIf=\"!showText && options.buttonIcon\">\n    <mat-icon class=\"mat-fab-icon\" [fontSet]=\"options.buttonIcon.fontSet!\" [fontIcon]=\"options.buttonIcon.fontIcon!\" [color]=\"options.buttonIcon.color!\" [svgIcon]=\"options.buttonIcon.svgIcon!\" [inline]=\"options.fab && options.buttonIcon.inline!\">\n      {{ options.buttonIcon.fontSet ? '' : options.buttonIcon.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 }]
@@ -210,6 +214,7 @@ var DbxButtonDisplayType;
     DbxButtonDisplayType[DbxButtonDisplayType["RAISED"] = 0] = "RAISED";
     DbxButtonDisplayType[DbxButtonDisplayType["STROKED"] = 1] = "STROKED";
     DbxButtonDisplayType[DbxButtonDisplayType["FLAT"] = 2] = "FLAT";
+    DbxButtonDisplayType[DbxButtonDisplayType["ICON_ONLY"] = 3] = "ICON_ONLY";
 })(DbxButtonDisplayType || (DbxButtonDisplayType = {}));
 /**
  * Complex button that supports loading states.
@@ -243,6 +248,14 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
             this.type = DbxButtonDisplayType.FLAT;
         }
     }
+    get iconOnly() {
+        return this.type === DbxButtonDisplayType.ICON_ONLY;
+    }
+    set iconOnly(iconOnly) {
+        if (iconOnly) {
+            this.type = DbxButtonDisplayType.ICON_ONLY;
+        }
+    }
     get btnOptions() {
         const buttonIcon = this.icon
             ? {
@@ -271,6 +284,7 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
             raised: this.raised,
             stroked: this.stroked,
             flat: this.flat,
+            iconOnly: this.iconOnly,
             mode: 'indeterminate',
             spinnerColor: this.color === 'primary' ? 'accent' : 'primary',
             customSpinnerColor,
@@ -279,7 +293,7 @@ class DbxButtonComponent extends AbstractDbxButtonDirective {
     }
 }
 DbxButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DbxButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxButtonComponent, selector: "dbx-button", inputs: { type: "type", raised: "raised", stroked: "stroked", flat: "flat", color: "color", customButtonColor: "customButtonColor", customTextColor: "customTextColor", customSpinnerColor: "customSpinnerColor" }, providers: provideDbxButton(DbxButtonComponent), usesInheritance: true, ngImport: i0, template: `
+DbxButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxButtonComponent, selector: "dbx-button", inputs: { type: "type", raised: "raised", stroked: "stroked", flat: "flat", iconOnly: "iconOnly", color: "color", customButtonColor: "customButtonColor", customTextColor: "customTextColor", customSpinnerColor: "customSpinnerColor" }, providers: provideDbxButton(DbxButtonComponent), usesInheritance: true, ngImport: i0, template: `
     <dbx-spinner-button class="page-button" (btnClick)="clickButton()" [options]="btnOptions">
       <ng-content></ng-content>
     </dbx-spinner-button>
@@ -303,6 +317,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Input
             }], flat: [{
                 type: Input
+            }], iconOnly: [{
+                type: Input
             }], color: [{
                 type: Input
             }], customButtonColor: [{
@@ -404,7 +420,7 @@ class DbxActionSnackbarComponent extends AbstractSubscriptionDirective {
     }
 }
 DbxActionSnackbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxActionSnackbarComponent, deps: [{ token: i1$1.MatSnackBarRef }, { token: MAT_SNACK_BAR_DATA }], target: i0.ɵɵFactoryTarget.Component });
-DbxActionSnackbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", 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", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: DbxSpacerDirective, selector: "dbx-spacer, [dbxSpacer]" }, { kind: "directive", type: i1$2.DbxActionDirective, selector: "dbx-action,[dbxAction],dbx-action-context,[dbxActionContext]", exportAs: ["action", "dbxAction"] }, { kind: "directive", type: i1$2.DbxActionSourceDirective, selector: "[dbxActionSource]", inputs: ["dbxActionSource"] }, { kind: "directive", type: i1$2.dbxActionValueStreamDirective, selector: "[dbxActionValueStream]", inputs: ["dbxActionValueStream", "dbxActionValueStreamIsNotEmpty", "dbxActionValueStreamModified"] }, { kind: "directive", type: i1$2.DbxActionSuccessHandlerDirective, selector: "[dbxActionSuccessHandler]", inputs: ["dbxActionSuccessHandler"] }, { kind: "directive", type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+DbxActionSnackbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", 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", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: DbxSpacerDirective, selector: "dbx-spacer, [dbxSpacer]" }, { kind: "directive", type: i1$2.DbxActionDirective, selector: "dbx-action,[dbxAction],dbx-action-context,[dbxActionContext]", exportAs: ["action", "dbxAction"] }, { kind: "directive", type: i1$2.DbxActionSourceDirective, selector: "[dbxActionSource]", inputs: ["dbxActionSource"] }, { kind: "directive", type: i1$2.dbxActionValueStreamDirective, selector: "[dbxActionValueStream]", inputs: ["dbxActionValueStream", "dbxActionValueStreamIsNotEmpty", "dbxActionValueStreamModified"] }, { kind: "directive", type: i1$2.DbxActionSuccessHandlerDirective, selector: "[dbxActionSuccessHandler]", inputs: ["dbxActionSuccessHandler"] }, { kind: "directive", type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "iconOnly", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", 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\" [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" }]
@@ -2032,7 +2048,7 @@ class DbxFilterWrapperComponent extends AbstractDbxActionHandlerDirective {
     }
 }
 DbxFilterWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxFilterWrapperComponent, deps: [{ token: i1$2.DbxActionContextStoreSourceInstance }, { token: i1$2.FilterSourceDirective }], target: i0.ɵɵFactoryTarget.Component });
-DbxFilterWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxFilterWrapperComponent, selector: "dbx-filter-wrapper", inputs: { applyRaised: "applyRaised", applyIcon: "applyIcon", applyText: "applyText" }, providers: [provideActionStoreSource(null)], usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-filter-wrapper\">\n  <div class=\"dbx-filter-wrapper-content\">\n    <ng-content></ng-content>\n  </div>\n  <div fxLayout=\"row\">\n    <dbx-button dbxActionButton [raised]=\"applyRaised\" [text]=\"applyText\" [icon]=\"applyIcon\"></dbx-button>\n    <div class=\"spacer\"></div>\n    <button mat-icon-button (click)=\"resetFilter()\">\n      <mat-icon>clear</mat-icon>\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.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"] }] });
+DbxFilterWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DbxFilterWrapperComponent, selector: "dbx-filter-wrapper", inputs: { applyRaised: "applyRaised", applyIcon: "applyIcon", applyText: "applyText" }, providers: [provideActionStoreSource(null)], usesInheritance: true, ngImport: i0, template: "<div class=\"dbx-filter-wrapper\">\n  <div class=\"dbx-filter-wrapper-content\">\n    <ng-content></ng-content>\n  </div>\n  <div fxLayout=\"row\">\n    <dbx-button dbxActionButton [raised]=\"applyRaised\" [text]=\"applyText\" [icon]=\"applyIcon\"></dbx-button>\n    <div class=\"spacer\"></div>\n    <button mat-icon-button (click)=\"resetFilter()\">\n      <mat-icon>clear</mat-icon>\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "iconOnly", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2.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"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxFilterWrapperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'dbx-filter-wrapper', providers: [provideActionStoreSource(null)], template: "<div class=\"dbx-filter-wrapper\">\n  <div class=\"dbx-filter-wrapper-content\">\n    <ng-content></ng-content>\n  </div>\n  <div fxLayout=\"row\">\n    <dbx-button dbxActionButton [raised]=\"applyRaised\" [text]=\"applyText\" [icon]=\"applyIcon\"></dbx-button>\n    <div class=\"spacer\"></div>\n    <button mat-icon-button (click)=\"resetFilter()\">\n      <mat-icon>clear</mat-icon>\n    </button>\n  </div>\n</div>\n" }]
@@ -2061,10 +2077,10 @@ class AbstractDbxPresetFilterMenuComponent {
                     this.selectPreset(x);
                 }
             }));
-        }), shareReplay$1(1));
+        }), shareReplay(1));
         this.selectedPreset$ = combineLatest([this._presets, this.selectedPresetString$]).pipe(map(([presets, selectedPresetString]) => {
             return selectedPresetString != null ? presets.find((x) => x.preset === selectedPresetString) : undefined;
-        }), shareReplay$1(1));
+        }), shareReplay(1));
     }
     get presets() {
         return this._presets.value;
@@ -2344,7 +2360,7 @@ class DbxPresetFilterMenuComponent extends AbstractDbxPresetFilterMenuComponent
         this.buttonText$ = combineLatest([this._config, this.selectedPreset$]).pipe(map(([config, preset]) => {
             const buttonText = preset?.title ?? config.unknownSelectionText ?? 'Filter';
             return buttonText;
-        }), distinctUntilChanged(), shareReplay$1(1));
+        }), distinctUntilChanged(), shareReplay(1));
         this.buttonIcon$ = this._config.pipe(switchMap((config) => {
             const filterIcon = config.filterIcon === false ? '' : config.filterIcon || 'arrow_drop_down';
             return this.selectedPreset$.pipe(map((preset) => {
@@ -2362,7 +2378,7 @@ class DbxPresetFilterMenuComponent extends AbstractDbxPresetFilterMenuComponent
                 }
                 return icon;
             }));
-        }), distinctUntilChanged(), shareReplay$1(1));
+        }), distinctUntilChanged(), shareReplay(1));
     }
     get config() {
         return this._config.value;
@@ -4092,7 +4108,7 @@ class DbxTwoColumnSrefShowRightDirective extends AbstractSubscriptionDirective {
         this._dbxRouterService = _dbxRouterService;
         this.showRight$ = this._twoColumnsContextStore.backRef$.pipe(
         // Only show right when the backRef is not exactly active
-        isSegueRefActive({ dbxRouterService: this._dbxRouterService, activeExactly: true }), isNot(), distinctUntilChanged(), shareReplay$1(1));
+        isSegueRefActive({ dbxRouterService: this._dbxRouterService, activeExactly: true }), isNot(), distinctUntilChanged(), shareReplay(1));
     }
     ngOnInit() {
         this.sub = this._twoColumnsContextStore.setShowRight(this.showRight$);
@@ -7151,7 +7167,7 @@ DbxPopupControlButtonsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
     </ng-container>
     <dbx-button-spacer></dbx-button-spacer>
     <dbx-button [flat]="true" icon="close" color="warn" (buttonClick)="closeClicked()"></dbx-button>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "iconOnly", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxPopupControlButtonsComponent, decorators: [{
             type: Component,
             args: [{
@@ -7693,7 +7709,7 @@ DbxActionUIRouterTransitionSafetyDialogComponent.ɵcmp = i0.ɵɵngDeclareCompone
         <dbx-button-spacer></dbx-button-spacer>
       </ng-container>
     </dbx-prompt-confirm>
-  `, isInline: true, dependencies: [{ kind: "component", type: DbxPromptConfirmComponent, selector: "dbx-prompt-confirm", inputs: ["config"], outputs: ["confirm", "cancel"] }, { kind: "directive", type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "component", type: DbxReadableErrorComponent, selector: "dbx-error", inputs: ["error"] }, { kind: "directive", type: DbxActionErrorDirective, selector: "[dbxActionError]" }] });
+  `, isInline: true, dependencies: [{ kind: "component", type: DbxPromptConfirmComponent, selector: "dbx-prompt-confirm", inputs: ["config"], outputs: ["confirm", "cancel"] }, { kind: "directive", type: i1$2.DbxActionButtonDirective, selector: "[dbxActionButton]" }, { kind: "component", type: DbxButtonComponent, selector: "dbx-button", inputs: ["type", "raised", "stroked", "flat", "iconOnly", "color", "customButtonColor", "customTextColor", "customSpinnerColor"] }, { kind: "directive", type: DbxButtonSpacerDirective, selector: "dbx-button-spacer,[dbxButtonSpacer]" }, { kind: "component", type: DbxReadableErrorComponent, selector: "dbx-error", inputs: ["error"] }, { kind: "directive", type: DbxActionErrorDirective, selector: "[dbxActionError]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DbxActionUIRouterTransitionSafetyDialogComponent, decorators: [{
             type: Component,
             args: [{
@@ -7918,7 +7934,7 @@ class DbxModelViewTrackerStorage {
     }
     addTrackerEvent(event) {
         const storageKey = this.getStorageKeyForFolder(event.folder);
-        return this._getEventSetForStorageKey(storageKey).pipe(mergeMap$1((set) => {
+        return this._getEventSetForStorageKey(storageKey).pipe(mergeMap((set) => {
             const nextEvent = {
                 d: event.d ?? unixTimeNumberForNow(),
                 c: event.c,
@@ -7934,16 +7950,16 @@ class DbxModelViewTrackerStorage {
         }));
     }
     getAllEvents(folder) {
-        return this.getEventSet(folder).pipe(map$1((x) => x.e));
+        return this.getEventSet(folder).pipe(map((x) => x.e));
     }
     getEventSet(folder) {
         const storageKey = this.getStorageKeyForFolder(folder);
         return this._getEventSetForStorageKey(storageKey);
     }
     _getEventSetForStorageKey(storageKey) {
-        return this.storageAccessor.get(storageKey).pipe(catchError$1((e) => {
+        return this.storageAccessor.get(storageKey).pipe(catchError((e) => {
             return of(undefined);
-        }), map$1((result) => result ?? { e: [], l: 0 }));
+        }), map((result) => result ?? { e: [], l: 0 }));
     }
     getStorageKeyForFolder(folder) {
         const storageKey = `${this.storageKey}_${folder ?? 'default'}`;
@@ -8015,10 +8031,10 @@ class DbxModelTrackerEffects {
     constructor(actions$, dbxModelTrackerService) {
         this.actions$ = actions$;
         this.dbxModelTrackerService = dbxModelTrackerService;
-        this.trackModelViewed$ = createEffect(() => this.actions$.pipe(ofType(emitObjectViewEvent), distinctUntilChanged$1((a, b) => a?.modelKeyTypeNamePair.key === b?.modelKeyTypeNamePair.key && a?.type === b?.type && a?.context === b?.context), tap$1((x) => {
+        this.trackModelViewed$ = createEffect(() => this.actions$.pipe(ofType(emitObjectViewEvent), distinctUntilChanged((a, b) => a?.modelKeyTypeNamePair.key === b?.modelKeyTypeNamePair.key && a?.type === b?.type && a?.context === b?.context), tap((x) => {
             this.dbxModelTrackerService.trackViewedObject(x.modelKeyTypeNamePair, x.context);
         })), { dispatch: false });
-        this.changeTrackerFolderToMatchAuth$ = createEffect(() => this.actions$.pipe(ofType(onDbxAppAuth.DbxAppAuthUserActions.setUserIdentifier), map$1((x) => x.id), filter$1((x) => Boolean(x)), distinctUntilChanged$1(), tap$1((accountId) => {
+        this.changeTrackerFolderToMatchAuth$ = createEffect(() => this.actions$.pipe(ofType(onDbxAppAuth.DbxAppAuthUserActions.setUserIdentifier), map((x) => x.id), filter((x) => Boolean(x)), distinctUntilChanged(), tap((accountId) => {
             this.dbxModelTrackerService.defaultFolder = accountId;
         })), { dispatch: false });
     }
@@ -8114,7 +8130,7 @@ class DbxModelTypesService {
         this.injector = injector;
         this._configs = new BehaviorSubject({});
         // MARK: Accessors
-        this.typesMap$ = this._configs.pipe(map$1((types) => {
+        this.typesMap$ = this._configs.pipe(map((types) => {
             const typesMap = {};
             Object.keys(types).forEach((type) => {
                 const config = types[type];
@@ -8131,14 +8147,14 @@ class DbxModelTypesService {
                 };
             });
             return typesMap;
-        }), shareReplay$1(1));
-        this.iconMap$ = this.typesMap$.pipe(map$1((types) => {
+        }), shareReplay(1));
+        this.iconMap$ = this.typesMap$.pipe(map((types) => {
             const iconsMap = {};
             Object.keys(types).forEach((type) => {
                 iconsMap[type] = types[type].icon;
             });
             return iconsMap;
-        }), shareReplay$1(1));
+        }), shareReplay(1));
     }
     // MARK: Configuration
     addTypeConfigs(configs) {
@@ -8158,7 +8174,7 @@ class DbxModelTypesService {
         this._configs.next(newConfig);
     }
     iconForType(type) {
-        return this.iconMap$.pipe(map$1((x) => x[type]));
+        return this.iconMap$.pipe(map((x) => x[type]));
     }
 }
 DbxModelTypesService.DEFAULT_ICON = 'help_outline';