@elderbyte/ngx-starter 19.9.0 → 19.11.0

package/fesm2022/elderbyte-ngx-starter.mjs

@@ -81,7 +81,7 @@ import { MatTab } from '@angular/material/tabs';
 import { fetchEventSource, EventStreamContentType } from '@microsoft/fetch-event-source';
 
 class BytesFormat {
-    static { this.units = ['bytes', 'KB', 'MB', 'GB', 'TB', 'PB']; }
+    static { this.units = ['bytes', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB']; }
     static format(bytes, precision = 2) {
         if (isNaN(parseFloat(String(bytes))) || !isFinite(bytes)) {
             return '?';
@@ -884,6 +884,9 @@ class DurationFormat {
         else if (milliseconds <= 999) {
             return this.formatNumber(milliseconds, 0) + ' ms';
         }
+        else {
+            return undefined; // TODO: Maybe add way to format 1000+ milliseconds also
+        }
     }
     formatNumber(value, precision) {
         return +value.toFixed(precision);
@@ -1839,13 +1842,11 @@ class Objects {
             return src;
         }
         try {
-            const json = JSON.stringify(src);
-            return JSON.parse(json);
+            return JSON.parse(JSON.stringify(src));
         }
         catch (err) {
-            if (err instanceof Error) {
-                throw new Error('Failed to clone object! ' + err.message);
-            }
+            const errorMessage = err instanceof Error ? err.message : 'unknown error';
+            throw new Error(`Failed to clone object: ${errorMessage}`);
         }
     }
     /**
@@ -2071,7 +2072,7 @@ function coerceInterval(value) {
             return Interval.parse(value);
         }
         else {
-            this.logger.warn('Unsupported value that cant be converted to Interval: "' + value + '"');
+            LoggerFactory.getLogger('static: coerceInterval').warn(`Unsupported value that cant be converted to Interval: "${value}"`);
         }
     }
     return undefined;
@@ -2085,7 +2086,7 @@ function coerceIntervalIsoStr(value) {
             return coerceInterval(value)?.toInstantString();
         }
         else {
-            this.logger.warn('Unsupported value that cant be converted to Iso Interval Str: "' + value + '"');
+            LoggerFactory.getLogger('static: coerceIntervalIsoStr').warn(`Unsupported value that cant be converted to Iso Interval Str: "${value}"`);
         }
     }
     return undefined;
@@ -3560,7 +3561,7 @@ class IndexedEntities {
         updated.forEach((update) => {
             const id = this.getItemId(update);
             const index = this.indexById(id);
-            if (index != -1) {
+            if (index !== -1) {
                 newData[index] = update;
                 anyUpdated = true;
             }
@@ -3611,9 +3612,10 @@ class IndexedEntities {
     getById(id) {
         const entities = this.entitiesSnapshot;
         const index = this.indexById(id);
-        if (index != -1) {
+        if (index !== -1) {
             return entities[index];
         }
+        return undefined;
     }
     notify() {
         this._entities$.next(this._entities$.getValue());
@@ -5919,6 +5921,7 @@ class DataSourceAdapter {
                 .findAllContinuable(TokenChunkRequest.first(filters, sorts, limit))
                 .pipe(map((page) => page.content));
         }
+        throw new Error('Unsupported data source type');
     }
 }
 
@@ -8379,6 +8382,7 @@ class DataTransferBase {
             if (state.hasFailed) {
                 throw state.error ? state.error : 'Completion Failed due unknown error!';
             }
+            return false; // Default return for unexpected state
         }), first());
     }
     /**
@@ -9516,7 +9520,7 @@ class ElderThemeService {
     activateTheme(themeId) {
         const theme = this.findTheme(themeId);
         if (theme) {
-            this.logger.info('Activating theme ' + themeId);
+            this.logger.debug('Activating theme ' + themeId);
             this._activeTheme$.next(theme);
         }
         else {
@@ -9724,7 +9728,7 @@ class ElderThemeToggleComponent {
         this.activeToggleTheme$ = combineLatest([
             this.themeService.defaultTheme$,
             this.themeService.activeTheme$,
-        ]).pipe(map(([defaultTheme, activeTheme]) => this.decideToggleTheme(defaultTheme, activeTheme)), tap((tt) => this.logger.info('Active toggle theme: ' + tt)));
+        ]).pipe(map(([defaultTheme, activeTheme]) => this.decideToggleTheme(defaultTheme, activeTheme)), tap((tt) => this.logger.debug('Active toggle theme: ' + tt)));
     }
     /***************************************************************************
      *                                                                         *
@@ -10451,7 +10455,7 @@ class FileSystemApi {
      *                                                                         *
      **************************************************************************/
     static isGetAsFileSystemHandleSupported(transferItem) {
-        // @ts-ignore
+        // @ts-expect-error - getAsFileSystemHandle is not yet in TypeScript's lib.dom.d.ts
         return transferItem.getAsFileSystemHandle !== undefined;
     }
     /**
@@ -10459,7 +10463,7 @@ class FileSystemApi {
      * or `drop` event. Otherwise, it will return null!
      */
     static getAsFileSystemHandle(transferItem) {
-        // @ts-ignore
+        // @ts-expect-error - getAsFileSystemHandle is not yet in TypeScript's lib.dom.d.ts
         return from(transferItem.getAsFileSystemHandle());
     }
     /***************************************************************************
@@ -10471,14 +10475,16 @@ class FileSystemApi {
         return 'showOpenFilePicker' in window;
     }
     static openFilePicker(pickerOpts) {
+        if (!FileSystemApi.isFileSystemSupported()) {
+            return throwError(() => new Error('File System API is not supported in this browser'));
+        }
         try {
-            // @ts-ignore
+            // @ts-expect-error - showOpenFilePicker is not yet in TypeScript's lib.dom.d.ts
             return from(window.showOpenFilePicker(pickerOpts));
         }
         catch (e) {
-            if (e instanceof Error) {
-                return throwError(() => e);
-            }
+            const errorMessage = e instanceof Error ? e.message : 'unknown error';
+            return throwError(() => new Error(`Error occurred while opening file picker: ${errorMessage}`));
         }
     }
     /***************************************************************************
@@ -10491,13 +10497,12 @@ class FileSystemApi {
     }
     static openDirectoryPicker(pickerOpts) {
         try {
-            // @ts-ignore
+            // @ts-expect-error - showDirectoryPicker is not yet in TypeScript's lib.dom.d.ts
             return from(window.showDirectoryPicker(pickerOpts));
         }
         catch (e) {
-            if (e instanceof Error) {
-                return throwError(() => e);
-            }
+            const errorMessage = e instanceof Error ? e.message : 'unknown error';
+            return throwError(() => new Error(`Error occurred while opening directory picker: ${errorMessage}`));
         }
     }
     /***************************************************************************
@@ -10525,7 +10530,7 @@ class FileSystemApi {
     }
     static async getHandlesFromDirectoryAsync(dirHandle) {
         const handles = [];
-        // @ts-ignore
+        // @ts-expect-error - values() is not yet in TypeScript's lib.dom.d.ts
         for await (const handle of dirHandle.values()) {
             handles.push(handle);
         }
@@ -15440,12 +15445,14 @@ class ElderChipLabelDirective {
         this.themeColor = input(undefined, {
             alias: 'color',
         });
+        this.chipSize = input('medium');
         this.cssClasses = computed(() => this.buildClassesString({
             themeColor: this.themeColor(),
             stateColor: this.stateColor(),
             levelColor: this.levelColor(),
             namedColor: this.namedColor(),
         }));
+        this.sizeClass = computed(() => this.chipSize() === 'small' ? 'elder-chip-small' : '');
     }
     /***************************************************************************
      *                                                                         *
@@ -15453,9 +15460,10 @@ class ElderChipLabelDirective {
      *                                                                         *
      **************************************************************************/
     buildClassesString(colorSpec) {
-        return this.buildClasses(colorSpec)
+        const colorClasses = this.buildClasses(colorSpec)
             .filter((cls) => !!cls)
             .join(' ');
+        return (colorClasses + ' ' + this.sizeClass()).trim();
     }
     buildClasses(colorSpec) {
         return [this.baseClass, this.resolveColorClass(colorSpec) ?? 'none'];
@@ -15512,7 +15520,7 @@ class ElderChipLabelDirective {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderChipLabelDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.7", type: ElderChipLabelDirective, isStandalone: true, selector: "[elderChipLabel]", inputs: { stateColor: { classPropertyName: "stateColor", publicName: "stateColor", isSignal: true, isRequired: false, transformFunction: null }, levelColor: { classPropertyName: "levelColor", publicName: "levelColor", isSignal: true, isRequired: false, transformFunction: null }, namedColor: { classPropertyName: "namedColor", publicName: "namedColor", isSignal: true, isRequired: false, transformFunction: null }, themeColor: { classPropertyName: "themeColor", publicName: "color", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cssClasses()" } }, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.7", type: ElderChipLabelDirective, isStandalone: true, selector: "[elderChipLabel]", inputs: { stateColor: { classPropertyName: "stateColor", publicName: "stateColor", isSignal: true, isRequired: false, transformFunction: null }, levelColor: { classPropertyName: "levelColor", publicName: "levelColor", isSignal: true, isRequired: false, transformFunction: null }, namedColor: { classPropertyName: "namedColor", publicName: "namedColor", isSignal: true, isRequired: false, transformFunction: null }, themeColor: { classPropertyName: "themeColor", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, chipSize: { classPropertyName: "chipSize", publicName: "chipSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cssClasses()" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderChipLabelDirective, decorators: [{
             type: Directive,
@@ -15640,7 +15648,7 @@ class ElderBadgeComponent {
         return this.chipAvatarTemplate$.getValue();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.7", type: ElderBadgeComponent, isStandalone: true, selector: "elder-badge", inputs: { appearance: "appearance", value: "value", colorSpec: "colorSpec", badgeColor: "badgeColor", avatarSpec: "avatarSpec", setCssClass: ["cssClass", "setCssClass"], chipTemplate: "chipTemplate", chipAvatarTemplate: "chipAvatarTemplate" }, queries: [{ propertyName: "chipTemplateQuery", first: true, predicate: ElderBadgeChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderBadgeChipAvatarDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"templates$ | async as templates\">\n  <ng-container *ngIf=\"badgeModel$ | async as badgeModel\">\n    <mat-chip\n      elderChipLabel\n      highlighted\n      [color]=\"badgeModel.colorSpec?.theme\"\n      [stateColor]=\"badgeModel.colorSpec?.state\"\n      [levelColor]=\"badgeModel.colorSpec?.level\"\n      [class]=\"'elder-badge fill ' + elementClass\"\n    >\n      <mat-chip-avatar clasS=\"elder-badge-avatar\" *ngIf=\"templates.avatar || badgeModel.showAvatar\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            templates.avatar || simpleAvatarTemplate;\n            context: { $implicit: badgeModel }\n          \"\n        >\n        </ng-container>\n      </mat-chip-avatar>\n\n      <ng-container\n        *ngTemplateOutlet=\"templates.chip || simpleChipTemplate; context: { $implicit: badgeModel }\"\n      >\n      </ng-container>\n\n      <ng-content></ng-content>\n    </mat-chip>\n  </ng-container>\n</ng-container>\n\n<ng-template #simpleChipTemplate let-badgeModel>\n  <!--\n  <span class=\"elder-chip-text\">{{badgeModel.value | elderTruncate:20}}</span>\n  -->\n  {{ badgeModel.value | elderTruncate: 20 }}\n</ng-template>\n\n<ng-template #simpleAvatarTemplate let-badgeModel>\n  <mat-icon>{{ badgeModel.avatarSpec?.icon }}</mat-icon>\n</ng-template>\n", styles: [".elder-badge{position:absolute!important;width:unset!important;max-width:unset!important;--mdc-chip-container-shape-radius: 10px}.elder-badge.mat-mdc-standard-chip{height:auto}.elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__text-label{font-size:var(--mat-badge-text-size, 12px);font-weight:var(--mat-badge-text-weight, 600)}.elder-badge .mdc-evolution-chip,.elder-badge .mdc-evolution-chip__cell,.elder-badge .mdc-evolution-chip__action{justify-content:center}.elder-badge.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:0;padding-right:0}.mat-badge-small .elder-badge.mat-badge-content{border-radius:16px;min-width:16px}.mat-badge-small.mat-badge-above .elder-badge.mat-badge-content{top:-7px!important}.mat-badge-small.mat-badge-overlap.mat-badge-after .elder-badge.mat-badge-content{right:-5px;transform:translate(100%)!important}.mat-badge-small.mat-badge-overlap.mat-badge-before .elder-badge.mat-badge-content{left:-5px;transform:translate(-100%)!important}.mat-badge-small .elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__action--primary{padding:0 3px!important}.mat-badge-small .elder-badge.mat-badge-content{line-height:14px!important}.mat-badge-medium .elder-badge.mat-badge-content{border-radius:22px;min-width:22px}.mat-badge-medium.mat-badge-overlap.mat-badge-after .elder-badge.mat-badge-content{right:-5px;transform:translate(100%)!important}.mat-badge-medium.mat-badge-overlap.mat-badge-before .elder-badge.mat-badge-content{left:-5px;transform:translate(-100%)!important}.mat-badge-medium .elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__action--primary{padding:0 6px!important}.mat-badge-medium .elder-badge.mat-badge-content{line-height:20px!important}.mat-badge-large .elder-badge.mat-badge-content{border-radius:28px;min-width:28px}.mat-badge-large.mat-badge-overlap.mat-badge-after .elder-badge.mat-badge-content{right:-5px;transform:translate(100%)!important}.mat-badge-large.mat-badge-overlap.mat-badge-before .elder-badge.mat-badge-content{left:-5px;transform:translate(-100%)!important}.mat-badge-large .elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__action--primary{padding:0 6px!important}.mat-badge-large .elder-badge.mat-badge-content{line-height:26px!important}.elder-badge.mat-badge-content{transform:unset!important}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["stateColor", "levelColor", "namedColor", "color"] }, { kind: "directive", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.7", type: ElderBadgeComponent, isStandalone: true, selector: "elder-badge", inputs: { appearance: "appearance", value: "value", colorSpec: "colorSpec", badgeColor: "badgeColor", avatarSpec: "avatarSpec", setCssClass: ["cssClass", "setCssClass"], chipTemplate: "chipTemplate", chipAvatarTemplate: "chipAvatarTemplate" }, queries: [{ propertyName: "chipTemplateQuery", first: true, predicate: ElderBadgeChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderBadgeChipAvatarDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"templates$ | async as templates\">\n  <ng-container *ngIf=\"badgeModel$ | async as badgeModel\">\n    <mat-chip\n      elderChipLabel\n      highlighted\n      [color]=\"badgeModel.colorSpec?.theme\"\n      [stateColor]=\"badgeModel.colorSpec?.state\"\n      [levelColor]=\"badgeModel.colorSpec?.level\"\n      [class]=\"'elder-badge fill ' + elementClass\"\n    >\n      <mat-chip-avatar clasS=\"elder-badge-avatar\" *ngIf=\"templates.avatar || badgeModel.showAvatar\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            templates.avatar || simpleAvatarTemplate;\n            context: { $implicit: badgeModel }\n          \"\n        >\n        </ng-container>\n      </mat-chip-avatar>\n\n      <ng-container\n        *ngTemplateOutlet=\"templates.chip || simpleChipTemplate; context: { $implicit: badgeModel }\"\n      >\n      </ng-container>\n\n      <ng-content></ng-content>\n    </mat-chip>\n  </ng-container>\n</ng-container>\n\n<ng-template #simpleChipTemplate let-badgeModel>\n  <!--\n  <span class=\"elder-chip-text\">{{badgeModel.value | elderTruncate:20}}</span>\n  -->\n  {{ badgeModel.value | elderTruncate: 20 }}\n</ng-template>\n\n<ng-template #simpleAvatarTemplate let-badgeModel>\n  <mat-icon>{{ badgeModel.avatarSpec?.icon }}</mat-icon>\n</ng-template>\n", styles: [".elder-badge{position:absolute!important;width:unset!important;max-width:unset!important;--mdc-chip-container-shape-radius: 10px}.elder-badge.mat-mdc-standard-chip{height:auto}.elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__text-label{font-size:var(--mat-badge-text-size, 12px);font-weight:var(--mat-badge-text-weight, 600)}.elder-badge .mdc-evolution-chip,.elder-badge .mdc-evolution-chip__cell,.elder-badge .mdc-evolution-chip__action{justify-content:center}.elder-badge.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:0;padding-right:0}.mat-badge-small .elder-badge.mat-badge-content{border-radius:16px;min-width:16px}.mat-badge-small.mat-badge-above .elder-badge.mat-badge-content{top:-7px!important}.mat-badge-small.mat-badge-overlap.mat-badge-after .elder-badge.mat-badge-content{right:-5px;transform:translate(100%)!important}.mat-badge-small.mat-badge-overlap.mat-badge-before .elder-badge.mat-badge-content{left:-5px;transform:translate(-100%)!important}.mat-badge-small .elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__action--primary{padding:0 3px!important}.mat-badge-small .elder-badge.mat-badge-content{line-height:14px!important}.mat-badge-medium .elder-badge.mat-badge-content{border-radius:22px;min-width:22px}.mat-badge-medium.mat-badge-overlap.mat-badge-after .elder-badge.mat-badge-content{right:-5px;transform:translate(100%)!important}.mat-badge-medium.mat-badge-overlap.mat-badge-before .elder-badge.mat-badge-content{left:-5px;transform:translate(-100%)!important}.mat-badge-medium .elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__action--primary{padding:0 6px!important}.mat-badge-medium .elder-badge.mat-badge-content{line-height:20px!important}.mat-badge-large .elder-badge.mat-badge-content{border-radius:28px;min-width:28px}.mat-badge-large.mat-badge-overlap.mat-badge-after .elder-badge.mat-badge-content{right:-5px;transform:translate(100%)!important}.mat-badge-large.mat-badge-overlap.mat-badge-before .elder-badge.mat-badge-content{left:-5px;transform:translate(-100%)!important}.mat-badge-large .elder-badge.mat-mdc-standard-chip .mdc-evolution-chip__action--primary{padding:0 6px!important}.mat-badge-large .elder-badge.mat-badge-content{line-height:26px!important}.elder-badge.mat-badge-content{transform:unset!important}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["stateColor", "levelColor", "namedColor", "color", "chipSize"] }, { kind: "directive", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderBadgeComponent, decorators: [{
             type: Component,
@@ -18663,12 +18671,7 @@ class ElderTabFocusTrapDirective {
         return Array.from(elements);
     }
     isFocusableByTab(element) {
-        if (this.isFocusable(element)) {
-            if (element.tabIndex === -1) {
-                return false;
-            }
-            return true;
-        }
+        return this.isFocusable(element) && element.tabIndex !== -1;
     }
     isFocusable(element) {
         if (element) {
@@ -19275,7 +19278,7 @@ class ElderTableSortDirective {
         this.logger.warn('[elderTableSort] directive is no longer required. Use matSort on ElderTableComponent directly.');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderTableSortDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.7", type: ElderTableSortDirective, isStandalone: true, selector: "[elderTableSort]", ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.7", type: ElderTableSortDirective, isStandalone: true, selector: "[elderTableSort]", inputs: { elderTableSort: "elderTableSort" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderTableSortDirective, decorators: [{
             type: Directive,
@@ -19283,7 +19286,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
                     selector: '[elderTableSort]',
                     standalone: true,
                 }]
-        }], ctorParameters: () => [] });
+        }], ctorParameters: () => [], propDecorators: { elderTableSort: [{
+                type: Input
+            }] } });
 
 /**
  * This directive is meant to be placed on table cells containing numbers.
@@ -19906,6 +19911,7 @@ class ElderTileComponent {
         if (currentSelection && currentSelection.length > 0) {
             return true;
         }
+        return false;
     }
     bringToView() {
         const element = this.elderTileRef().nativeElement;
@@ -20298,7 +20304,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImpor
                         ElderCompositeSortComponent,
                         ElderCompositeSortDcDirective,
                         ElderTileComponent,
-                        NgClass,
                         ElderContinuatorComponent,
                         ResizeObserverDirective,
                     ], template: "<!-- eslint-disable @angular-eslint/template/interactive-supports-focus -->\n<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\n<div class=\"full elder-grid-component\">\n  @if (dc(); as dc) {\n    <!-- Grid Browser -->\n    <div\n      class=\"layout-col full elder-grid-container\"\n      [elderDataContextSelection]=\"dc\"\n      #dataSelection=\"elderDataContextSelection\"\n      [elderDataContextSelectionModel]=\"selectionModel\"\n    >\n      <!-- Toolbar Row -->\n      @if (toolbarVisible()) {\n        <div class=\"layout-row place-start-center flex-none elder-grid-toolbar\">\n          @if (selectionVisible) {\n            <div class=\"layout-col flex-none px-sm\">\n              <elder-selection-master-checkbox class=\"flex-none\"></elder-selection-master-checkbox>\n            </div>\n          }\n\n          <!-- Toolbar -->\n          @if (toolbarTemplate) {\n            <ng-template\n              *ngTemplateOutlet=\"toolbarTemplate; context: { $implicit: this }\"\n            ></ng-template>\n          }\n\n          @if (availableCompositeSorts && availableCompositeSorts.length > 0) {\n            <elder-composite-sort\n              class=\"flex-none\"\n              [availableSorts]=\"availableCompositeSorts\"\n              [translationPrefix]=\"sortTranslationPrefix\"\n              [elderCompositeSortDc]=\"dc\"\n            >\n            </elder-composite-sort>\n          }\n        </div>\n\n        <mat-divider></mat-divider>\n      }\n\n      <elder-data-context-state-indicator class=\"flex-none\" [dataContext]=\"dc\">\n      </elder-data-context-state-indicator>\n\n      <!-- [cdkDropListSortingDisabled]=\"true\" -->\n      <!-- cdkDropList -->\n      <cdk-virtual-scroll-viewport\n        class=\"layout-col flex elder-grid-browser\"\n        id=\"{{ scrollContainerId }}\"\n        [itemSize]=\"itemHeight()\"\n        [minBufferPx]=\"itemHeight() * 2\"\n        [maxBufferPx]=\"itemHeight() * 3\"\n        #virtualScrollViewPort\n        elderInfiniteScroll\n        [eventThrottle]=\"200\"\n        [offsetFactor]=\"2\"\n        [ignoreScrollEvent]=\"dcStatus()?.loading\"\n        [containerId]=\"scrollContainerId\"\n        [listenToHost]=\"false\"\n        (closeToEnd)=\"requestMoreDataZoned($event)\"\n        (elderResizeObserver)=\"containerDimensions$.next($event)\"\n      >\n        <!-- (scrolling)=\"onScrolling($event)\" -->\n\n        <div\n          *cdkVirtualFor=\"\n            let gridRow of dataRows$;\n            trackBy: TrackGridRowByIdFn;\n            templateCacheSize: 50\n          \"\n          class=\"elder-grid-tile-row\"\n          [style.height]=\"itemHeight() + 'px'\"\n          [style.--elder-grid-column-count]=\"activeColumnCount()\"\n        >\n          @for (tile of gridRow.cells; track trackCellId($index, tile)) {\n            <!-- Tile Cell -->\n            @if (isTileVisible(tile)) {\n              <elder-tile\n                class=\"elder-grid-tile\"\n                [value]=\"tile\"\n                [selectionEnabled]=\"selectionVisible\"\n                [selectionModel]=\"selectionModel\"\n                [outlined]=\"tileOutlined()\"\n                (click)=\"onItemClick(tile)\"\n                (dblclick)=\"onItemDoubleClick(tile)\"\n              >\n                <ng-container\n                  *ngTemplateOutlet=\"\n                    tileTemplate || simpleTileTemplate;\n                    context: { $implicit: tile }\n                  \"\n                ></ng-container>\n              </elder-tile>\n            } @else {\n              <div class=\"elder-grid-tile-hidden\"></div>\n            }\n          }\n        </div>\n      </cdk-virtual-scroll-viewport>\n\n      <mat-progress-bar\n        class=\"flex-none\"\n        [mode]=\"dcStatus()?.loading ? 'indeterminate' : 'determinate'\"\n        [color]=\"dcStatus()?.hasError ? 'warn' : 'primary'\"\n      >\n      </mat-progress-bar>\n\n      <!-- Footer -->\n      @if (footerVisible()) {\n        <div class=\"layout-row place-end-center gap-md flex-none elder-grid-footer\">\n          <!-- Continuable -->\n          @if (isContinuable) {\n            <elder-continuator\n              [loadedCount]=\"viewData()?.length\"\n              [total]=\"total()\"\n              [canLoadMore]=\"canLoadMore()\"\n              [chunkSizeOptions]=\"pageSizeOptions()\"\n              [chunkSize]=\"currentChunkSize()\"\n              (loadMoreRequested)=\"dataSnapshot.loadMore()\"\n            ></elder-continuator>\n          } @else if (isActivePaged) {\n            @if (currentPage(); as page) {\n              <mat-paginator\n                class=\"flex-none\"\n                [length]=\"total()\"\n                [pageIndex]=\"page?.index\"\n                [pageSize]=\"page?.size\"\n                [pageSizeOptions]=\"pageSizeOptions()\"\n              >\n              </mat-paginator>\n            }\n          } @else {\n            <span class=\"mat-caption noselect pr-md\" style=\"color: var(--md-sys-color-outline)\">\n              {{ viewData()?.length }}\n            </span>\n          }\n        </div>\n      }\n    </div>\n  }\n</div>\n\n<ng-template #simpleTileTemplate let-tile>\n  @if (tile) {\n    <div class=\"layout-col place-center-center flex\" style=\"background-color: lightblue\">\n      <p class=\"noselect\">Tile: {{ tile }}</p>\n    </div>\n  }\n</ng-template>\n", styles: [".elder-grid-tile{width:100%;height:100%;cursor:pointer;overflow:hidden}.elder-grid-tile-row{display:grid;align-items:start;justify-items:start;overflow:hidden;--elder-grid-column-count: 1;padding:8px 16px;grid-template-columns:repeat(var(--elder-grid-column-count),minmax(0,1fr));column-gap:16px}.elder-grid-tile-row:first-child{padding-top:16px}.elder-grid-tile-hidden{flex:0 1 100%;margin:8px;width:100%;height:100%}.elder-grid-container{background-color:var(--elder-grid-background-color)}.elder-grid-flat{border:var(--elder-border-light)}.elder-grid-toolbar{min-height:44px}.elder-grid-footer{min-height:var(--elder-data-element-footer-height)}\n"] }]
@@ -22787,10 +22792,8 @@ class ElderSelectBase extends ElderFormFieldControlBase {
             return this.dataSourceOrThrow().getId(entity);
         }
         catch (e) {
-            if (e instanceof Error) {
-                throw new Error('Failed to extract id from entity since no dataSource is available! Caused by ' +
-                    e?.message);
-            }
+            const errorMessage = e instanceof Error ? e.message : 'unknown';
+            throw new Error(`Failed to extract id from entity since no dataSource is available! Caused by ${errorMessage}`);
         }
     }
     /***************************************************************************
@@ -25666,7 +25669,7 @@ class ElderMultiSelectChipsComponent extends ElderMultiSelectBase {
                 provide: ELDER_SELECT_BASE,
                 useExisting: forwardRef(() => ElderMultiSelectChipsComponent),
             },
-        ], queries: [{ propertyName: "_customChipInput", first: true, predicate: MatFormFieldControl, descendants: true }, { propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }, { propertyName: "customInputTemplateQuery", first: true, predicate: ElderSelectCustomInputDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_chipInput", first: true, predicate: ElderSelectComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"elder-flex-control\" [matTooltip]=\"state()?.error\">\n  <mat-chip-set\n    #chips\n    [class.mat-mdc-chip-set-stacked]=\"stacked\"\n    cdkDropList\n    [cdkDropListOrientation]=\"stacked ? 'vertical' : 'horizontal'\"\n    (cdkDropListDropped)=\"drop($event)\"\n    [cdkDropListDisabled]=\"!allowSorting\"\n  >\n    @if (icon) {\n      <div class=\"elder-input-prefix-icon-container flex-none\">\n        <mat-icon\n          disabled\n          class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n          [class.loading]=\"state()?.loading\"\n        >\n          {{ icon }}\n        </mat-icon>\n      </div>\n    }\n\n    @for (chipModel of selectChips(); track chipModel.id) {\n      <mat-chip-row\n        elderChipLabel\n        highlighted\n        class=\"noselect clickable-chip\"\n        [value]=\"resolveChipValue(chipModel.value)\"\n        [color]=\"chipModel.colorSpec?.themeColor\"\n        [levelColor]=\"chipModel.colorSpec?.levelColor\"\n        [stateColor]=\"chipModel.colorSpec?.stateColor\"\n        [namedColor]=\"chipModel.colorSpec?.namedColor\"\n        [removable]=\"chipModel.removable\"\n        (keydown)=\"onChipKeyDown($event, chipModel.value)\"\n        (click)=\"onCurrentClicked(chipModel.value)\"\n        cdkDrag\n        [cdkDragData]=\"chipModel.value\"\n        [cdkDragDisabled]=\"!allowSorting\"\n      >\n        @if (templates()?.avatar && !chipModel.avatarSpec?.hide) {\n          <mat-chip-avatar [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\">\n            <ng-container *ngTemplateOutlet=\"templates().avatar; context: { $implicit: chipModel }\">\n            </ng-container>\n          </mat-chip-avatar>\n        }\n\n        <ng-container\n          *ngTemplateOutlet=\"\n            templates()?.chip || simpleChipTemplate;\n            context: { $implicit: chipModel }\n          \"\n        >\n        </ng-container>\n\n        @if (chipModel.trailingSpec?.icon; as trailingIcon) {\n          <mat-icon\n            matChipTrailingIcon\n            class=\"elder-trailing-icon\"\n            [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n            >{{ trailingIcon }}</mat-icon\n          >\n        }\n\n        @if (chipModel.removable) {\n          <mat-icon matChipRemove (click)=\"onClickRemoveChip($event, chipModel.value)\">\n            cancel\n          </mat-icon>\n        }\n      </mat-chip-row>\n    }\n\n    <div class=\"layout-row place-start-center elder-chip-input\">\n      <!-- [matChipInputFor]=\"chips\" -->\n      <ng-container *ngTemplateOutlet=\"templates()?.input || selectInput\"> </ng-container>\n\n      @if (selectionPopup) {\n        <button\n          mat-icon-button\n          type=\"button\"\n          class=\"elder-control-icon-button elder-browse-icon\"\n          [disabled]=\"isLocked\"\n          (click)=\"openSelectionPopup($event)\"\n          aria-label=\"Search\"\n          elderStopEventPropagation\n          tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      }\n    </div>\n  </mat-chip-set>\n</div>\n\n<ng-template #selectInput>\n  <!-- mat-mdc-chip-input -->\n  <elder-select\n    autocomplete\n    elderClearSelect\n    class=\"elder-chip-input-select flex\"\n    [data]=\"dataContextS()\"\n    [disabled]=\"!!disabled\"\n    [required]=\"!!required\"\n    [readonly]=\"!!readonly\"\n    [placeholder]=\"placeholderS()\"\n    (entityUpdated)=\"appendEntity($event)\"\n    [displayPropertyResolver]=\"displayPropertyResolverS()\"\n    [valueTemplate]=\"valueTemplate\"\n    [queryFilter]=\"queryFilter\"\n    [filters]=\"filters\"\n    [sorts]=\"sorts\"\n    [isOptionDisabledFn]=\"isOptionDisabledInternalFn\"\n    [isOptionHiddenFn]=\"isOptionHiddenInternalFn\"\n  ></elder-select>\n</ng-template>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{ chipModel.displayText | elderTruncate: 20 }}</span>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["stateColor", "levelColor", "namedColor", "color"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "directive", type: MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "component", type: ElderSelectComponent, selector: "elder-select", inputs: ["nullDisplay", "autocomplete", "allowNull", "entity", "entityId"], outputs: ["entityIdChange", "entityIdUpdated", "entityChange", "entityUpdated", "entity"] }, { kind: "directive", type: ElderClearSelectDirective, selector: "[elderClearSelect]" }, { kind: "pipe", type: ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "_customChipInput", first: true, predicate: MatFormFieldControl, descendants: true }, { propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }, { propertyName: "customInputTemplateQuery", first: true, predicate: ElderSelectCustomInputDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_chipInput", first: true, predicate: ElderSelectComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"elder-flex-control\" [matTooltip]=\"state()?.error\">\n  <mat-chip-set\n    #chips\n    [class.mat-mdc-chip-set-stacked]=\"stacked\"\n    cdkDropList\n    [cdkDropListOrientation]=\"stacked ? 'vertical' : 'horizontal'\"\n    (cdkDropListDropped)=\"drop($event)\"\n    [cdkDropListDisabled]=\"!allowSorting\"\n  >\n    @if (icon) {\n      <div class=\"elder-input-prefix-icon-container flex-none\">\n        <mat-icon\n          disabled\n          class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n          [class.loading]=\"state()?.loading\"\n        >\n          {{ icon }}\n        </mat-icon>\n      </div>\n    }\n\n    @for (chipModel of selectChips(); track chipModel.id) {\n      <mat-chip-row\n        elderChipLabel\n        highlighted\n        class=\"noselect clickable-chip\"\n        [value]=\"resolveChipValue(chipModel.value)\"\n        [color]=\"chipModel.colorSpec?.themeColor\"\n        [levelColor]=\"chipModel.colorSpec?.levelColor\"\n        [stateColor]=\"chipModel.colorSpec?.stateColor\"\n        [namedColor]=\"chipModel.colorSpec?.namedColor\"\n        [removable]=\"chipModel.removable\"\n        (keydown)=\"onChipKeyDown($event, chipModel.value)\"\n        (click)=\"onCurrentClicked(chipModel.value)\"\n        cdkDrag\n        [cdkDragData]=\"chipModel.value\"\n        [cdkDragDisabled]=\"!allowSorting\"\n      >\n        @if (templates()?.avatar && !chipModel.avatarSpec?.hide) {\n          <mat-chip-avatar [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\">\n            <ng-container *ngTemplateOutlet=\"templates().avatar; context: { $implicit: chipModel }\">\n            </ng-container>\n          </mat-chip-avatar>\n        }\n\n        <ng-container\n          *ngTemplateOutlet=\"\n            templates()?.chip || simpleChipTemplate;\n            context: { $implicit: chipModel }\n          \"\n        >\n        </ng-container>\n\n        @if (chipModel.trailingSpec?.icon; as trailingIcon) {\n          <mat-icon\n            matChipTrailingIcon\n            class=\"elder-trailing-icon\"\n            [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n            >{{ trailingIcon }}</mat-icon\n          >\n        }\n\n        @if (chipModel.removable) {\n          <mat-icon matChipRemove (click)=\"onClickRemoveChip($event, chipModel.value)\">\n            cancel\n          </mat-icon>\n        }\n      </mat-chip-row>\n    }\n\n    <div class=\"layout-row place-start-center elder-chip-input\">\n      <!-- [matChipInputFor]=\"chips\" -->\n      <ng-container *ngTemplateOutlet=\"templates()?.input || selectInput\"> </ng-container>\n\n      @if (selectionPopup) {\n        <button\n          mat-icon-button\n          type=\"button\"\n          class=\"elder-control-icon-button elder-browse-icon\"\n          [disabled]=\"isLocked\"\n          (click)=\"openSelectionPopup($event)\"\n          aria-label=\"Search\"\n          elderStopEventPropagation\n          tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      }\n    </div>\n  </mat-chip-set>\n</div>\n\n<ng-template #selectInput>\n  <!-- mat-mdc-chip-input -->\n  <elder-select\n    autocomplete\n    elderClearSelect\n    class=\"elder-chip-input-select flex\"\n    [data]=\"dataContextS()\"\n    [disabled]=\"!!disabled\"\n    [required]=\"!!required\"\n    [readonly]=\"!!readonly\"\n    [placeholder]=\"placeholderS()\"\n    (entityUpdated)=\"appendEntity($event)\"\n    [displayPropertyResolver]=\"displayPropertyResolverS()\"\n    [valueTemplate]=\"valueTemplate\"\n    [queryFilter]=\"queryFilter\"\n    [filters]=\"filters\"\n    [sorts]=\"sorts\"\n    [isOptionDisabledFn]=\"isOptionDisabledInternalFn\"\n    [isOptionHiddenFn]=\"isOptionHiddenInternalFn\"\n  ></elder-select>\n</ng-template>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{ chipModel.displayText | elderTruncate: 20 }}</span>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["stateColor", "levelColor", "namedColor", "color", "chipSize"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "directive", type: MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "component", type: ElderSelectComponent, selector: "elder-select", inputs: ["nullDisplay", "autocomplete", "allowNull", "entity", "entityId"], outputs: ["entityIdChange", "entityIdUpdated", "entityChange", "entityUpdated", "entity"] }, { kind: "directive", type: ElderClearSelectDirective, selector: "[elderClearSelect]" }, { kind: "pipe", type: ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderMultiSelectChipsComponent, decorators: [{
             type: Component,
@@ -26250,7 +26253,7 @@ class ElderMultiSelectChipOptionsComponent extends ElderMultiSelectBase {
                 provide: ELDER_SELECT_BASE,
                 useExisting: forwardRef(() => ElderMultiSelectChipOptionsComponent),
             },
-        ], queries: [{ propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_listBox", first: true, predicate: MatChipListbox, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"elder-flex-control\" [matTooltip]=\"state()?.error\">\n  <mat-chip-listbox #chips [class.mat-mdc-chip-set-stacked]=\"stacked\" [multiple]=\"multiple\">\n    @if (state(); as state) {\n      @if (icon) {\n        <div class=\"elder-input-prefix-icon-container flex-none\">\n          <mat-icon\n            disabled\n            class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n            [class.loading]=\"state.loading\"\n          >\n            {{ icon }}\n          </mat-icon>\n        </div>\n      }\n    }\n\n    <ng-content></ng-content>\n\n    @for (chipModel of selectChips(); track chipModel.id) {\n      <mat-chip-option\n        class=\"noselect\"\n        [value]=\"resolveChipValue(chipModel.value)\"\n        elderChipLabel\n        [levelColor]=\"chipModel.colorSpec?.levelColor\"\n        [stateColor]=\"chipModel.colorSpec?.stateColor\"\n        [namedColor]=\"chipModel.colorSpec?.namedColor\"\n        [color]=\"chipModel.colorSpec?.themeColor\"\n        [selectable]=\"!chipModel.locked\"\n        [disabled]=\"chipModel.locked\"\n        [selected]=\"chipModel.selected\"\n        (selectionChange)=\"selectionChanged($event, chipModel.value)\"\n      >\n        @if (templates()?.avatar && !chipModel.avatarSpec?.hide) {\n          <mat-chip-avatar [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\">\n            <ng-container *ngTemplateOutlet=\"templates().avatar; context: { $implicit: chipModel }\">\n            </ng-container>\n          </mat-chip-avatar>\n        }\n\n        <ng-container\n          *ngTemplateOutlet=\"\n            templates()?.chip || simpleChipTemplate;\n            context: { $implicit: chipModel }\n          \"\n        >\n        </ng-container>\n\n        @if (chipModel.trailingSpec?.icon) {\n          <mat-icon\n            matChipTrailingIcon\n            class=\"elder-trailing-icon\"\n            [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n            >{{ chipModel.trailingSpec?.icon }}\n          </mat-icon>\n        }\n      </mat-chip-option>\n    }\n\n    <div class=\"layout-row place-start-center elder-chip-input\">\n      @if (selectionPopup) {\n        <button\n          mat-icon-button\n          type=\"button\"\n          class=\"elder-control-icon-button elder-browse-icon\"\n          [disabled]=\"isLocked\"\n          (click)=\"openSelectionPopup($event)\"\n          aria-label=\"Search\"\n          elderStopEventPropagation\n          tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      }\n    </div>\n  </mat-chip-listbox>\n</div>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{ chipModel.displayText | elderTruncate: 20 }}</span>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["stateColor", "levelColor", "namedColor", "color"] }, { kind: "directive", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "pipe", type: ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "chipTemplateQuery", first: true, predicate: ElderSelectChipDirective, descendants: true, read: TemplateRef }, { propertyName: "chipAvatarTemplateQuery", first: true, predicate: ElderSelectChipAvatarDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "_listBox", first: true, predicate: MatChipListbox, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"elder-flex-control\" [matTooltip]=\"state()?.error\">\n  <mat-chip-listbox #chips [class.mat-mdc-chip-set-stacked]=\"stacked\" [multiple]=\"multiple\">\n    @if (state(); as state) {\n      @if (icon) {\n        <div class=\"elder-input-prefix-icon-container flex-none\">\n          <mat-icon\n            disabled\n            class=\"elder-prefix-icon elder-mdc-control-icon elder-icon-small noselect\"\n            [class.loading]=\"state.loading\"\n          >\n            {{ icon }}\n          </mat-icon>\n        </div>\n      }\n    }\n\n    <ng-content></ng-content>\n\n    @for (chipModel of selectChips(); track chipModel.id) {\n      <mat-chip-option\n        class=\"noselect\"\n        [value]=\"resolveChipValue(chipModel.value)\"\n        elderChipLabel\n        [levelColor]=\"chipModel.colorSpec?.levelColor\"\n        [stateColor]=\"chipModel.colorSpec?.stateColor\"\n        [namedColor]=\"chipModel.colorSpec?.namedColor\"\n        [color]=\"chipModel.colorSpec?.themeColor\"\n        [selectable]=\"!chipModel.locked\"\n        [disabled]=\"chipModel.locked\"\n        [selected]=\"chipModel.selected\"\n        (selectionChange)=\"selectionChanged($event, chipModel.value)\"\n      >\n        @if (templates()?.avatar && !chipModel.avatarSpec?.hide) {\n          <mat-chip-avatar [class.chip-avatar-xl]=\"chipModel.avatarSpec?.large\">\n            <ng-container *ngTemplateOutlet=\"templates().avatar; context: { $implicit: chipModel }\">\n            </ng-container>\n          </mat-chip-avatar>\n        }\n\n        <ng-container\n          *ngTemplateOutlet=\"\n            templates()?.chip || simpleChipTemplate;\n            context: { $implicit: chipModel }\n          \"\n        >\n        </ng-container>\n\n        @if (chipModel.trailingSpec?.icon) {\n          <mat-icon\n            matChipTrailingIcon\n            class=\"elder-trailing-icon\"\n            [fontSet]=\"chipModel.trailingSpec?.iconFontSet\"\n            >{{ chipModel.trailingSpec?.icon }}\n          </mat-icon>\n        }\n      </mat-chip-option>\n    }\n\n    <div class=\"layout-row place-start-center elder-chip-input\">\n      @if (selectionPopup) {\n        <button\n          mat-icon-button\n          type=\"button\"\n          class=\"elder-control-icon-button elder-browse-icon\"\n          [disabled]=\"isLocked\"\n          (click)=\"openSelectionPopup($event)\"\n          aria-label=\"Search\"\n          elderStopEventPropagation\n          tabIndex=\"-1\"\n        >\n          <mat-icon class=\"elder-mdc-control-icon\">search</mat-icon>\n        </button>\n      }\n    </div>\n  </mat-chip-listbox>\n</div>\n\n<ng-template #simpleChipTemplate let-chipModel>\n  <span class=\"elder-chip-text\">{{ chipModel.displayText | elderTruncate: 20 }}</span>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "directive", type: ElderChipLabelDirective, selector: "[elderChipLabel]", inputs: ["stateColor", "levelColor", "namedColor", "color", "chipSize"] }, { kind: "directive", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]" }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "pipe", type: ElderTruncatePipe, name: "elderTruncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.7", ngImport: i0, type: ElderMultiSelectChipOptionsComponent, decorators: [{
             type: Component,
@@ -29676,6 +29679,7 @@ class ElderLocalDateInputComponent extends ElderFormFieldControlBase {
         }
         catch (err) {
             this.logger.warn('Failed to apply value to dateValue: ' + value, err);
+            return undefined;
         }
     }
     mapIgnoreErrorObservable(date, conversionFn) {
@@ -31622,6 +31626,7 @@ class ElderOverlayComponent {
         if (!this.attached) {
             return this.attachOverlay();
         }
+        return undefined;
     }
     /**
      * Hide this overlay
@@ -37620,7 +37625,7 @@ class ReactiveFetchEventSource {
      */
     streamEventsOfType(eventTypeRaw) {
         const eventType = this.eventTypeOrDefault(eventTypeRaw);
-        return this.streamEvents().pipe(filter((e) => e.event == eventType));
+        return this.streamEvents().pipe(filter((e) => e.event === eventType));
     }
     /**
      * Get an event stream for all events no matter their type.
@@ -37699,7 +37704,6 @@ class ReactiveFetchEventSource {
                 ', state: ' +
                 response.status, response);
             this.updateState(ReactiveEventSourceState.OPEN);
-            return; // everything's good
         }
         else if (response.status >= 400 && response.status < 500 && response.status !== 429) {
             // client-side errors are usually non-retriable:
@@ -37711,6 +37715,7 @@ class ReactiveFetchEventSource {
             this.updateState(ReactiveEventSourceState.ERROR);
             this.tryReconnect();
         }
+        return undefined; // TODO: Return a promise?
     }
     handleOnError(err) {
         this.updateState(ReactiveEventSourceState.ERROR);