@elderbyte/ngx-starter 17.7.2 → 17.8.0

package/fesm2022/elderbyte-ngx-starter.mjs

@@ -1,5 +1,5 @@
 import * as i2$1 from '@angular/common';
-import { DatePipe, CommonModule, NgIf, AsyncPipe, NgFor, NgClass, NgTemplateOutlet, NgStyle, DecimalPipe, NgSwitch, NgSwitchCase, registerLocaleData, CurrencyPipe } from '@angular/common';
+import { DatePipe, CommonModule, NgIf, AsyncPipe, NgFor, NgClass, NgTemplateOutlet, NgStyle, DecimalPipe, registerLocaleData, CurrencyPipe } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Pipe, Injectable, LOCALE_ID, Inject, NgModule, Optional, SkipSelf, Directive, Output, Input, forwardRef, ViewChild, HostBinding, ViewChildren, ContentChild, Component, ChangeDetectionStrategy, Host, APP_INITIALIZER, TemplateRef, HostListener, EventEmitter, ViewEncapsulation, InjectionToken, ContentChildren, Self } from '@angular/core';
 import * as i1 from '@angular/platform-browser';
@@ -1382,15 +1382,15 @@ class Interval {
         if (parts.length !== 2) {
             throw new Error('The given string is not a valid iso interval: ' + iso);
         }
-        const start = Instant.parse(parts[0]);
+        const start = parts[0] ? Instant.parse(parts[0]) : null;
         const endStr = parts[1];
         // The 'end' part can either be an instant or a duration in iso format
-        if (endStr.startsWith('P') || endStr.startsWith('-P')) {
+        if (start && endStr && endStr.startsWith('P') || endStr.startsWith('-P')) {
             const duration = Duration.parse(endStr);
             return Interval.ofStartAndOffset(start, duration);
         }
         else {
-            return Interval.of(start, Instant.parse(endStr));
+            return Interval.of(start, endStr ? Instant.parse(endStr) : null);
         }
     }
     static yesterday(zoneId) {
@@ -1491,11 +1491,11 @@ class Interval {
         return this.toDurationString();
     }
     toInstantString() {
-        let instantString = "";
+        let instantString = '';
         if (this.start) {
             instantString = instantString + this.start.toString();
         }
-        instantString = instantString + "/";
+        instantString = instantString + '/';
         if (this.end) {
             instantString = instantString + this.end.toString();
         }
@@ -2085,7 +2085,7 @@ class Arrays {
             return false;
         }
         // Comparing each element of your array
-        for (var i = 0; i < arrayA.length; i++) {
+        for (let i = 0; i < arrayA.length; i++) {
             if (!equalsFn(arrayA[i], arrayB[i])) {
                 return false;
             }
@@ -3067,7 +3067,7 @@ class HttpParamsBuilder {
                 .forEach(v => this.append(key, v));
         }
         else {
-            this.append(key, "");
+            this.append(key, '');
         }
     }
     appendFilter(...filters) {
@@ -3740,7 +3740,7 @@ class DataContextBase extends DataSource {
      *                                                                         *
      **************************************************************************/
     reloadNow(request) {
-        this.baselog.debug(this.id + ": reloadNow triggered. Request #" + request.number + ' ' + request.reason, {
+        this.baselog.debug(this.id + ': reloadNow triggered. Request #' + request.number + ' ' + request.reason, {
             filter: this._filter.filtersSnapshot,
             sort: this._sort.sortsSnapshot,
             dataSource: this.dataSource,
@@ -4574,7 +4574,7 @@ class RequiredFilterEvaluator {
     constructor(filterContext, requiredFilters) {
         this._requiredFilters = new BehaviorSubject([]);
         if (filterContext == null) {
-            throw new Error("filterContext must not be null!");
+            throw new Error('filterContext must not be null!');
         }
         this._filterContext = filterContext;
         if (requiredFilters) {
@@ -4907,8 +4907,8 @@ class LocalListDataSource extends DataSourceBase {
     }
     deleteAllById(idsToDelete) {
         if (idsToDelete?.length > 0) {
-            let existing = this.data;
-            let idsToDeleteSet = new Set(idsToDelete);
+            const existing = this.data;
+            const idsToDeleteSet = new Set(idsToDelete);
             this.silentReplaceData(existing.filter(e => !idsToDeleteSet.has(this.getId(e))));
             this.publishChangeEvent(DataSourceChangeEvent.deleted(idsToDelete));
         }
@@ -4918,7 +4918,7 @@ class LocalListDataSource extends DataSourceBase {
     }
     save(entity) {
         const id = this.getId(entity);
-        let newData = [...this.data];
+        const newData = [...this.data];
         const existingIndex = newData.findIndex(entity => this.getId(entity) === id);
         let created = false;
         if (existingIndex == -1) {
@@ -5774,7 +5774,7 @@ class RestClient extends DataSourceBase {
      */
     save(entity, params) {
         const id = this.getId(entity);
-        return ((!!id) ? this.update(entity, params) : this.create(entity, params));
+        return ((id) ? this.update(entity, params) : this.create(entity, params));
     }
     create(newEntity, params) {
         return this.http.post(this.restEndpoint, newEntity, {
@@ -6322,8 +6322,7 @@ class TemplateCompositeControl extends ValueAccessorBase {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TemplateCompositeControl, decorators: [{
             type: Directive
         }], propDecorators: { disabled: [{
-                type: Input,
-                args: ['disabled']
+                type: Input
             }], ngForm: [{
                 type: ViewChild,
                 args: ['form']
@@ -8380,7 +8379,7 @@ class ElderEnumTranslationService {
             });
         }), map((data) => {
             return sort ?
-                data.sort(ComparatorBuilder.fieldSort(asc ? "displayValue" : "-displayValue")) :
+                data.sort(ComparatorBuilder.fieldSort(asc ? 'displayValue' : '-displayValue')) :
                 data;
         }));
     }
@@ -8392,11 +8391,11 @@ class ElderEnumTranslationService {
      * @param enumKey key of the translation to load
      */
     translateOne(translationPrefix, enumKey) {
-        return this.translateService.get(translationPrefix + "." + enumKey)
+        return this.translateService.get(translationPrefix + '.' + enumKey)
             .pipe(map(translatedValue => new TranslatedEnumValue(enumKey, this.addPrefixIfNotNull(enumKey, translatedValue))));
     }
     addPrefixIfNotNull(enumKey, translatedValue) {
-        return enumKey ? translatedValue : "";
+        return enumKey ? translatedValue : '';
     }
     /**
      * Creates a data source of translations of the given enum class.
@@ -8407,15 +8406,15 @@ class ElderEnumTranslationService {
      * @param asc if true, data will be sorted in ascending order
      */
     enumDateSource(enumClass, translationPrefix, sort = true, asc = true) {
-        return DelegateListDataSource.listFetcher(() => this.translate(enumClass, translationPrefix, sort, asc), "value", (id) => this.translateOne(translationPrefix, id));
+        return DelegateListDataSource.listFetcher(() => this.translate(enumClass, translationPrefix, sort, asc), 'value', (id) => this.translateOne(translationPrefix, id));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderEnumTranslationService, deps: [{ token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderEnumTranslationService, providedIn: "root" }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderEnumTranslationService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderEnumTranslationService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: "root"
+                    providedIn: 'root'
                 }]
         }], ctorParameters: () => [{ type: i2.TranslateService }] });
 
@@ -9104,7 +9103,7 @@ class ElderThemePreferenceService {
          *                                                                         *
          **************************************************************************/
         this.THEME_PREFERENCE_KEY = 'theme.preference';
-        let preferenceThemeId = localStorage.getItem(this.THEME_PREFERENCE_KEY);
+        const preferenceThemeId = localStorage.getItem(this.THEME_PREFERENCE_KEY);
         if (preferenceThemeId) {
             this.activateThemeAndSave(preferenceThemeId);
         }
@@ -9140,7 +9139,7 @@ class ElderThemePreferenceService {
      **************************************************************************/
     themeByBrowserPreference() {
         let initialTheme;
-        if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
+        if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
             initialTheme = this.themeService.themesSnapshot
                 .find(t => t.dark);
         }
@@ -9626,29 +9625,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
                 type: ViewChild,
                 args: ['labelInput', { static: true }]
             }], labels: [{
-                type: Input,
-                args: ['labels']
+                type: Input
             }], suggestionLoader: [{
-                type: Input,
-                args: ['suggestionLoader']
+                type: Input
             }], allowNew: [{
-                type: Input,
-                args: ['allowNew']
+                type: Input
             }], labelsChanged: [{
-                type: Output,
-                args: ['labelsChanged']
+                type: Output
             }], compareWith: [{
-                type: Input,
-                args: ['compareWith']
+                type: Input
             }], colorResolver: [{
-                type: Input,
-                args: ['colorResolver']
+                type: Input
             }], nameResolver: [{
-                type: Input,
-                args: ['nameResolver']
+                type: Input
             }], labelBuilder: [{
-                type: Input,
-                args: ['labelBuilder']
+                type: Input
             }] } });
 
 class ElderLabelsModule {
@@ -9911,7 +9902,7 @@ class FileEntry {
         let relativeParent = null;
         if (file.webkitRelativePath) {
             if (file.webkitRelativePath.endsWith(file.name)) {
-                var nameStart = file.webkitRelativePath.length - file.name.length;
+                const nameStart = file.webkitRelativePath.length - file.name.length;
                 relativeParent = file.webkitRelativePath.substring(0, nameStart);
             }
             else {
@@ -11397,7 +11388,7 @@ class ElderPaddingDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderPaddingDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: `elder-padding, [elder-padding], [elderPadding]`,
+                    selector: 'elder-padding, [elder-padding], [elderPadding]',
                     standalone: true
                 }]
         }], propDecorators: { padding: [{
@@ -11421,7 +11412,7 @@ class ElderCardTitleDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderCardTitleDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: `elder-card-title, [elder-card-title], [elderCardTitle]`,
+                    selector: 'elder-card-title, [elder-card-title], [elderCardTitle]',
                     standalone: true
                 }]
         }], propDecorators: { classTitle: [{
@@ -11445,7 +11436,7 @@ class ElderCardContentDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderCardContentDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: `elder-card-content, [elder-card-content], [elderCardContent]`,
+                    selector: 'elder-card-content, [elder-card-content], [elderCardContent]',
                     standalone: true
                 }]
         }], propDecorators: { classCardContent: [{
@@ -11470,7 +11461,7 @@ class ElderCardHeaderActionsDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderCardHeaderActionsDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: `elder-card-header-actions, [elder-card-header-actions], [elderCardHeaderActions]`,
+                    selector: 'elder-card-header-actions, [elder-card-header-actions], [elderCardHeaderActions]',
                     standalone: true
                 }]
         }], propDecorators: { classHeaderActions: [{
@@ -11491,7 +11482,7 @@ class ElderCardSubtitleDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderCardSubtitleDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: `elder-card-subtitle, [elder-card-subtitle], [elderCardSubtitle]`,
+                    selector: 'elder-card-subtitle, [elder-card-subtitle], [elderCardSubtitle]',
                     standalone: true
                 }]
         }], propDecorators: { classSubtitle: [{
@@ -11718,17 +11709,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
             }], removeConfirmation: [{
                 type: Input
             }], requestNewCard: [{
-                type: Output,
-                args: ['requestNewCard']
+                type: Output
             }], requestRemoveCard: [{
-                type: Output,
-                args: ['requestRemoveCard']
+                type: Output
             }], cardClick: [{
-                type: Output,
-                args: ['cardClick']
+                type: Output
             }], cardDropped: [{
-                type: Output,
-                args: ['cardDropped']
+                type: Output
             }], canEnterPredicate: [{
                 type: Input
             }], connectedTo: [{
@@ -11841,17 +11828,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
             }], canEnterPredicate: [{
                 type: Input
             }], requestNewCard: [{
-                type: Output,
-                args: ['requestNewCard']
+                type: Output
             }], requestRemoveCard: [{
-                type: Output,
-                args: ['requestRemoveCard']
+                type: Output
             }], cardClick: [{
-                type: Output,
-                args: ['cardClick']
+                type: Output
             }], cardDropped: [{
-                type: Output,
-                args: ['cardDropped']
+                type: Output
             }], stackCardTemplate: [{
                 type: ContentChild,
                 args: [ElderStackCardDirective, { read: TemplateRef }]
@@ -18629,13 +18612,13 @@ class ElderMasterDetailComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderMasterDetailComponent, deps: [{ token: ElderMasterDetailService }, { token: i1$6.MatDialog }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: ElderMasterDetailComponent, isStandalone: true, selector: "elder-master-detail", inputs: { mode: "mode" }, providers: [
             ElderMasterDetailProvider.ExistingOrNewMasterDetailService
-        ], queries: [{ propertyName: "master", first: true, predicate: ElderMasterDirective, descendants: true, read: TemplateRef }, { propertyName: "detail", first: true, predicate: ElderDetailDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "\n<div class=\"layout-row full\" *ngIf=\"mode$ | async as mode\">\n\n  <div class=\"layout-row full\" *ngIf=\"mode == 'DIALOG'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n  </div>\n\n  <div class=\"layout-row full gap-md\" *ngIf=\"mode == 'EMBEDDED'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n    <ng-container *ngIf=\"currentActive$ | async as currentActive\">\n      <ng-container *ngTemplateOutlet=\"detail; context: {$implicit: currentActive}\"></ng-container>\n    </ng-container>\n  </div>\n\n</div>\n\n\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "master", first: true, predicate: ElderMasterDirective, descendants: true, read: TemplateRef }, { propertyName: "detail", first: true, predicate: ElderDetailDirective, descendants: true, read: TemplateRef }], ngImport: i0, template: "\n<div class=\"layout-row full\" *ngIf=\"mode$ | async as mode\">\n\n  <div class=\"layout-row full\" *ngIf=\"mode === 'DIALOG'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n  </div>\n\n  <div class=\"layout-row full gap-md\" *ngIf=\"mode === 'EMBEDDED'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n    <ng-container *ngIf=\"currentActive$ | async as currentActive\">\n      <ng-container *ngTemplateOutlet=\"detail; context: {$implicit: currentActive}\"></ng-container>\n    </ng-container>\n  </div>\n\n</div>\n\n\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderMasterDetailComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-master-detail', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         ElderMasterDetailProvider.ExistingOrNewMasterDetailService
-                    ], standalone: true, imports: [NgIf, NgTemplateOutlet, AsyncPipe], template: "\n<div class=\"layout-row full\" *ngIf=\"mode$ | async as mode\">\n\n  <div class=\"layout-row full\" *ngIf=\"mode == 'DIALOG'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n  </div>\n\n  <div class=\"layout-row full gap-md\" *ngIf=\"mode == 'EMBEDDED'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n    <ng-container *ngIf=\"currentActive$ | async as currentActive\">\n      <ng-container *ngTemplateOutlet=\"detail; context: {$implicit: currentActive}\"></ng-container>\n    </ng-container>\n  </div>\n\n</div>\n\n\n" }]
+                    ], standalone: true, imports: [NgIf, NgTemplateOutlet, AsyncPipe], template: "\n<div class=\"layout-row full\" *ngIf=\"mode$ | async as mode\">\n\n  <div class=\"layout-row full\" *ngIf=\"mode === 'DIALOG'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n  </div>\n\n  <div class=\"layout-row full gap-md\" *ngIf=\"mode === 'EMBEDDED'\">\n    <ng-container *ngTemplateOutlet=\"master\"></ng-container>\n    <ng-container *ngIf=\"currentActive$ | async as currentActive\">\n      <ng-container *ngTemplateOutlet=\"detail; context: {$implicit: currentActive}\"></ng-container>\n    </ng-container>\n  </div>\n\n</div>\n\n\n" }]
         }], ctorParameters: () => [{ type: ElderMasterDetailService }, { type: i1$6.MatDialog }, { type: i0.ViewContainerRef }], propDecorators: { master: [{
                 type: ContentChild,
                 args: [ElderMasterDirective, { read: TemplateRef, static: false }]
@@ -18679,7 +18662,7 @@ class ElderMasterActivationDirective {
                 this.log.debug('Table-Activation changed, notifying master-detail', event);
                 this.masterDetailService.onItemActivated(event.item, { source: event.source });
             },
-            error: err => this.toastService.error("Failed to set active item", err)
+            error: err => this.toastService.error('Failed to set active item', err)
         });
         this.masterDetailService.itemActivationRequested.pipe(takeUntil(this.destroy$)).subscribe({
             next: item => {
@@ -19099,7 +19082,7 @@ class ElderQuantityTransformPipe {
         if (normalize) {
             return this.quantityService.normalize(quantity);
         }
-        else if (!!targetUnit) {
+        else if (targetUnit) {
             return this.quantityService.convertToUnit(quantity, targetUnit);
         }
         else {
@@ -19348,8 +19331,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
                     standalone: true
                 }]
         }], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }, { type: i1$6.MatDialog }, { type: ElderDataViewOptionsProvider }, { type: SelectionModel }, { type: i0.ChangeDetectorRef }], propDecorators: { elderSelectionModelPopupTransform: [{
-                type: Input,
-                args: ['elderSelectionModelPopupTransform']
+                type: Input
             }] } });
 
 class ElderSelectOptionComponent {
@@ -19360,7 +19342,7 @@ class ElderSelectOptionComponent {
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderSelectOptionComponent, decorators: [{
             type: Component,
-            args: [{ selector: "elder-select-option", changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "" }]
+            args: [{ selector: 'elder-select-option', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "" }]
         }], ctorParameters: () => [], propDecorators: { value: [{
                 type: Input
             }], label: [{
@@ -22603,7 +22585,7 @@ class ChipOptionsProvider {
         options.context.displayPropertyResolver = x => x.id;
         return this.buildChipBySpec({ id: entityId }, options, {
             colorSpec: {
-                themeColor: "warn"
+                themeColor: 'warn'
             },
             avatarSpec: {
                 hide: false,
@@ -22633,7 +22615,7 @@ class ChipOptionsProvider {
             locked = chipSpec.locked;
         }
         return new ChipOptionModel(e, this.resolveDisplayText(e, options), {
-            themeColor: selected ? "accent" : undefined
+            themeColor: selected ? 'accent' : undefined
         }, locked, chipSpec.avatarSpec, chipSpec.trailingSpec, selected);
     }
     getEntityId(e) {
@@ -22652,7 +22634,7 @@ class ElderMultiSelectChipOptionsComponent extends ElderMultiSelectBase {
      *                                                                         *
      **************************************************************************/
     constructor(hostRef, zone, focusMonitor, translateService, dialogService, destroyRef, ngControl) {
-        super(zone, hostRef, "multi-select-chip-options", focusMonitor, translateService, dialogService, ngControl);
+        super(zone, hostRef, 'multi-select-chip-options', focusMonitor, translateService, dialogService, ngControl);
         this.destroyRef = destroyRef;
         /***************************************************************************
          *                                                                         *
@@ -22754,7 +22736,7 @@ class ElderMultiSelectChipOptionsComponent extends ElderMultiSelectBase {
      **************************************************************************/
     selectionChanged(changeEvent, entity) {
         /**/
-        this.log.debug("selectionChanged", {
+        this.log.debug('selectionChanged', {
             changeEvent: changeEvent,
             entity: entity
         });
@@ -22776,7 +22758,7 @@ class ElderMultiSelectChipOptionsComponent extends ElderMultiSelectBase {
         }
     }
     blur() {
-        this.log.warn("blur() not yet supported!");
+        this.log.warn('blur() not yet supported!');
     }
     /***************************************************************************
      *                                                                         *
@@ -22847,7 +22829,7 @@ class ElderMultiSelectChipOptionsComponent extends ElderMultiSelectBase {
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderMultiSelectChipOptionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: "elder-multi-select-chip-options", changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+            args: [{ selector: 'elder-multi-select-chip-options', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: ElderMultiSelectChipOptionsComponent },
                         {
                             provide: ELDER_SELECT_BASE,
@@ -22903,7 +22885,7 @@ class ElderMultiSelectAllInitialDirective {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderMultiSelectAllInitialDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: "[elderMultiSelectAllInitial]",
+                    selector: '[elderMultiSelectAllInitial]',
                     standalone: true
                 }]
         }], ctorParameters: () => [{ type: ElderMultiSelectChipOptionsComponent, decorators: [{
@@ -24825,10 +24807,10 @@ class LocaleDateFormats {
      **************************************************************************/
     static { this.fallbackDateFormats = ['MM/dd/yyyy', 'MM/dd/yy']; }
     static { this.dateFormats = new Map([
-        ["de-CH", ['dd.MM.yyyy', 'dd.MM.yy']],
-        ["de-DE", ['dd.MM.yyyy', 'dd.MM.yy']],
-        ["en-UK", ['dd/MM/yyyy', 'dd/MM/yy']],
-        ["en-US", this.fallbackDateFormats]
+        ['de-CH', ['dd.MM.yyyy', 'dd.MM.yy']],
+        ['de-DE', ['dd.MM.yyyy', 'dd.MM.yy']],
+        ['en-UK', ['dd/MM/yyyy', 'dd/MM/yy']],
+        ['en-US', this.fallbackDateFormats]
     ]); }
     /***************************************************************************
      *                                                                         *
@@ -25450,7 +25432,7 @@ class ElderDateTimeInputComponent extends ElderFormFieldControlBase {
         this.inputRef?.nativeElement?.blur();
     }
     onDateTimeChanged(eventDate) {
-        const newDate = !!eventDate ? new Date(eventDate) : null;
+        const newDate = eventDate ? new Date(eventDate) : null;
         if (newDate) {
             this.updateValue(TimeUtil.instant(newDate));
         }
@@ -25512,9 +25494,10 @@ class ElderIntervalInputComponent extends ElderFormFieldControlBase {
         this._mode = 'date-time-range';
         this.zone = ZoneId.systemDefault();
         this.controlType = this._mode;
-        this.endTime$ = this.value$.pipe(map(interval => interval?.end ? LocalTime.from(interval.end.atZone(this.zone)) : null));
-        this.startLocalDate$ = this.value$.pipe(map(interval => interval?.start ? LocalDate.from(interval.start.atZone(this.zone)) : null));
-        this.endLocalDate$ = this.value$.pipe(map(interval => interval?.end ? LocalDate.from(interval.end.atZone(this.zone)) : null));
+        this.interval$ = this.value$.pipe(map(value => this.coerceInterval(value)));
+        this.endTime$ = this.interval$.pipe(map(interval => interval?.end ? LocalTime.from(interval.end.atZone(this.zone)) : null));
+        this.startLocalDate$ = this.interval$.pipe(map(interval => interval?.start ? LocalDate.from(interval.start.atZone(this.zone)) : null));
+        this.endLocalDate$ = this.interval$.pipe(map(interval => interval?.end ? LocalDate.from(interval.end.atZone(this.zone)) : null));
         this.startDate$ = this.mapIgnoreErrorObservable(this.startLocalDate$, (d) => TimeUtil.localDateToDate(d));
         this.endDate$ = this.mapIgnoreErrorObservable(this.endLocalDate$, (d) => TimeUtil.localDateToDate(d));
         this.dateformat = LocaleDateFormats.getFormatsOfLocale(matDateLocale)[0].toLowerCase();
@@ -25524,6 +25507,12 @@ class ElderIntervalInputComponent extends ElderFormFieldControlBase {
      * Properties                                                              *
      *                                                                         *
      **************************************************************************/
+    set valueAsIsoStr(enabled) {
+        this._valueAsIsoStr = coerceBooleanProperty(enabled);
+    }
+    get valueAsIsoStr() {
+        return this._valueAsIsoStr;
+    }
     set mode(mode) {
         this._mode = mode;
         this.controlType = mode;
@@ -25532,14 +25521,17 @@ class ElderIntervalInputComponent extends ElderFormFieldControlBase {
         return this._mode;
     }
     get isoValueChange() {
-        return this.valueChange.pipe(map(interval => interval ? interval.toInstantString() : null));
+        return this.valueChange.pipe(map(value => this.coerceIsoStr(value)));
     }
     set isoValue(value) {
-        this.value = value ? Interval.parse(value) : null;
+        this.value = value ? this.coerceValue(value) : null;
     }
     get shouldLabelFloat() {
         return true;
     }
+    get interval() {
+        return this.coerceInterval(this.value);
+    }
     /***************************************************************************
      *                                                                         *
      * Public API                                                              *
@@ -25554,35 +25546,38 @@ class ElderIntervalInputComponent extends ElderFormFieldControlBase {
         // this.inputRef?.nativeElement?.blur();
     }
     onDayTimeStartChanged(start) {
-        this.updateValue(Interval.of(start, this.instantAtEndOfDay(start)));
+        this.updateCoercedValue(Interval.of(start, this.instantAtEndOfDay(start)));
     }
     onDayTimeEndTimeChanged(endTime) {
-        const start = this.value.start;
+        const start = this.interval.start;
         const end = this.instantWithTime(start, endTime);
-        this.updateValue(Interval.of(start, !end.isAfter(start) ? this.instantAtEndOfDay(start) : end));
+        this.updateCoercedValue(Interval.of(start, !end.isAfter(start) ? this.instantAtEndOfDay(start) : end));
     }
     onStartChanged(start) {
-        this.updateValue(Interval.of(start, this.value.end));
+        this.updateCoercedValue(Interval.of(start, this.interval.end));
     }
     onEndChanged(end) {
-        this.updateValue(Interval.of(this.value.start, end));
+        this.updateCoercedValue(Interval.of(this.interval.start, end));
     }
     onStartDateChanged(value) {
         const date = this.toLocalDate(value);
-        this.updateValue(Interval.of(this.localDateToInstant(date), this.value?.end));
+        this.updateCoercedValue(Interval.of(this.localDateToInstant(date), this.interval?.end));
     }
     onEndDateChanged(value) {
         const date = this.toLocalDate(value);
-        this.updateValue(Interval.of(this.value?.start, this.localDateToInstant(date)));
+        this.updateCoercedValue(Interval.of(this.interval?.start, this.localDateToInstant(date)));
     }
     onSingleDayDateChanged(date) {
-        this.updateValue(Interval.ofDay(date, this.zone));
+        this.updateCoercedValue(Interval.ofDay(date, this.zone));
     }
     /***************************************************************************
      *                                                                         *
      * Private methods                                                         *
      *                                                                         *
      **************************************************************************/
+    updateCoercedValue(value) {
+        this.updateValue(this.coerceValue(value));
+    }
     instantAtStartOfDayNow() {
         return LocalDate.now().atStartOfDay().atZone(this.zone).toInstant();
     }
@@ -25598,9 +25593,11 @@ class ElderIntervalInputComponent extends ElderFormFieldControlBase {
         }
     }
     valuesEquals(a, b) {
-        return (a && b)
-            ? a.equals(b)
-            : a === b;
+        const aInterval = this.coerceInterval(a);
+        const bInterval = this.coerceInterval(b);
+        return (aInterval && bInterval)
+            ? aInterval.equals(bInterval)
+            : aInterval === bInterval;
     }
     instantWithTime(instant, time) {
         return instant
@@ -25624,16 +25621,50 @@ class ElderIntervalInputComponent extends ElderFormFieldControlBase {
             return of(null);
         }));
     }
+    coerceValue(value) {
+        if (this.valueAsIsoStr) {
+            return this.coerceIsoStr(value);
+        }
+        else {
+            return this.coerceInterval(value);
+        }
+    }
+    coerceInterval(value) {
+        if (value instanceof Interval) {
+            return value;
+        }
+        else if ((typeof value) === 'string') {
+            return Interval.parse(value);
+        }
+        else {
+            return undefined;
+        }
+    }
+    coerceIsoStr(value) {
+        if (value instanceof Interval) {
+            return value.toInstantString();
+        }
+        else if ((typeof value) === 'string') {
+            return value;
+        }
+        else {
+            return undefined;
+        }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderIntervalInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1$1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.NgControl, optional: true, self: true }, { token: i4.DateAdapter }, { token: MAT_DATE_LOCALE }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: ElderIntervalInputComponent, isStandalone: true, selector: "elder-interval-input", inputs: { zone: "zone", mode: "mode", isoValue: "isoValue" }, outputs: { isoValueChange: "isoValueChange" }, providers: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: ElderIntervalInputComponent, isStandalone: true, selector: "elder-interval-input", inputs: { zone: "zone", valueAsIsoStr: "valueAsIsoStr", mode: "mode", isoValue: "isoValue" }, outputs: { isoValueChange: "isoValueChange" }, providers: [
             { provide: MatFormFieldControl, useExisting: ElderIntervalInputComponent },
-        ], usesInheritance: true, ngImport: i0, template: "<ng-container [ngSwitch]=\"mode\">\n\n  <!-- DATE_TIME_RANGE -->\n  <div *ngSwitchCase=\"'date-time-range'\"\n       class=\"layout-row\">\n    <elder-date-time-input class=\"flex\" center\n      [value]=\"(value$ | async)?.start\"\n      (valueUpdated)=\"onStartChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n    ></elder-date-time-input>\n    <span class=\"mat-date-range-input-separator flex-none\">\u2013</span>\n    <elder-date-time-input class=\"flex\" center\n      [value]=\"(value$ | async)?.end\"\n      (valueUpdated)=\"onEndChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n    ></elder-date-time-input>\n  </div>\n\n  <!-- DAY_TIME_RANGE -->\n  <div *ngSwitchCase=\"'day-time-range'\"\n       class=\"layout-row gap-xs elder-flex-interval-control\">\n\n    <!--  [name]=\"name + '-day-start'\" -->\n    <elder-date-time-input\n      [value]=\"(value$ | async)?.start\"\n      (valueUpdated)=\"onDayTimeStartChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n    ></elder-date-time-input>\n\n    <!-- [name]=\"name + '-day-end'\" -->\n    <elder-local-time-input\n      [value]=\"endTime$ | async\"\n      (valueUpdated)=\"onDayTimeEndTimeChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n    ></elder-local-time-input>\n  </div>\n\n  <!-- DATE_RANGE -->\n  <div *ngSwitchCase=\"'date-range'\"\n       class=\"layout-row gap-xs elder-flex-interval-control\">\n\n    <mat-date-range-input\n      class=\"mdc-text-field__input\"\n      [rangePicker]=\"picker\"\n      [disabled]=\"!!disabled\"\n    >\n      <input matStartDate\n             [placeholder]=\"dateformat\"\n             [ngModel]=\"startDate$ | async\" name=\"date-range.start\"\n             [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n             (ngModelChange)=\"onStartDateChanged($event)\"\n             [readonly]=\"readonly\"\n             [disabled]=\"!!disabled\"\n      >\n      <input matEndDate\n             [placeholder]=\"dateformat\"\n             [ngModel]=\"endDate$ | async\" name=\"date-range.end\"\n             [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n             (ngModelChange)=\"onEndDateChanged($event)\"\n             [readonly]=\"readonly\"\n             [disabled]=\"!!disabled\"\n      >\n    </mat-date-range-input>\n    <mat-datepicker-toggle class=\"elder-control-icon-button\"\n                           [disabled]=\"isLocked\"\n                           [for]=\"picker\">\n      <mat-icon matDatepickerToggleIcon>calendar_month</mat-icon>\n    </mat-datepicker-toggle>\n    <mat-date-range-picker #picker></mat-date-range-picker>\n  </div>\n\n  <!-- SINGLE_DAY -->\n  <div *ngSwitchCase=\"'single-day'\"\n       class=\"layout-row elder-flex-control\">\n\n    <!-- [name]=\"name\" -->\n    <elder-local-date-input class=\"flex\" center\n      [value]=\"startLocalDate$ | async\"\n      (valueUpdated)=\"onSingleDayDateChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '')\"\n    ></elder-local-date-input>\n  </div>\n\n</ng-container>\n\n\n\n", styles: [".elder-flex-interval-control{flex:1 1 auto;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: ElderDateTimeInputComponent, selector: "elder-date-time-input", inputs: ["center", "isoValue"], outputs: ["isoValueChange"] }, { kind: "component", type: ElderLocalTimeInputComponent, selector: "elder-local-time-input", inputs: ["isoValue"], outputs: ["isoValueChange"] }, { kind: "component", type: MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: ElderLocalDateInputComponent, selector: "elder-local-date-input", inputs: ["zone", "autoDatePicker", "arrows", "today", "center", "datePickerTouchUi", "allowNull", "datePickerEnabled", "isoValue", "dateValue", "isoDateValue"], outputs: ["blurred", "valueUpdatedBlur", "isoValueChange", "dateValueChange", "isoDateValueChange"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "@switch (mode) {\n\n  @case ('date-time-range') {\n    <div class=\"layout-row\">\n      <elder-date-time-input class=\"flex\" center\n                             [value]=\"(interval$ | async)?.start\"\n                             (valueUpdated)=\"onStartChanged($event)\"\n                             [required]=\"required\"\n                             [readonly]=\"readonly\"\n                             [disabled]=\"disabled\"\n                             [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n      ></elder-date-time-input>\n      <span class=\"mat-date-range-input-separator flex-none\">\u2013</span>\n      <elder-date-time-input class=\"flex\" center\n                             [value]=\"(interval$ | async)?.end\"\n                             (valueUpdated)=\"onEndChanged($event)\"\n                             [required]=\"required\"\n                             [readonly]=\"readonly\"\n                             [disabled]=\"disabled\"\n                             [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n      ></elder-date-time-input>\n    </div>\n  }\n  @case ('day-time-range') {\n    <div class=\"layout-row gap-xs elder-flex-interval-control\">\n\n      <!--  [name]=\"name + '-day-start'\" -->\n      <elder-date-time-input\n        [value]=\"(interval$ | async)?.start\"\n        (valueUpdated)=\"onDayTimeStartChanged($event)\"\n        [required]=\"required\"\n        [readonly]=\"readonly\"\n        [disabled]=\"disabled\"\n        [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n      ></elder-date-time-input>\n\n      <!-- [name]=\"name + '-day-end'\" -->\n      <elder-local-time-input\n        [value]=\"endTime$ | async\"\n        (valueUpdated)=\"onDayTimeEndTimeChanged($event)\"\n        [required]=\"required\"\n        [readonly]=\"readonly\"\n        [disabled]=\"disabled\"\n        [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n      ></elder-local-time-input>\n    </div>\n  }\n\n  @case ('date-range') {\n    <div class=\"layout-row gap-xs elder-flex-interval-control\">\n\n      <mat-date-range-input\n        class=\"mdc-text-field__input\"\n        [rangePicker]=\"picker\"\n        [disabled]=\"!!disabled\"\n      >\n        <input matStartDate\n               [placeholder]=\"dateformat\"\n               [ngModel]=\"startDate$ | async\" name=\"date-range.start\"\n               [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n               (ngModelChange)=\"onStartDateChanged($event)\"\n               [readonly]=\"readonly\"\n               [disabled]=\"!!disabled\"\n        >\n        <input matEndDate\n               [placeholder]=\"dateformat\"\n               [ngModel]=\"endDate$ | async\" name=\"date-range.end\"\n               [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n               (ngModelChange)=\"onEndDateChanged($event)\"\n               [readonly]=\"readonly\"\n               [disabled]=\"!!disabled\"\n        >\n      </mat-date-range-input>\n      <mat-datepicker-toggle class=\"elder-control-icon-button\"\n                             [disabled]=\"isLocked\"\n                             [for]=\"picker\">\n        <mat-icon matDatepickerToggleIcon>calendar_month</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-date-range-picker #picker></mat-date-range-picker>\n    </div>\n  }\n\n  @case ('single-day') {\n    <div class=\"layout-row elder-flex-control\">\n\n      <!-- [name]=\"name\" -->\n      <elder-local-date-input class=\"flex\" center\n                              [value]=\"startLocalDate$ | async\"\n                              (valueUpdated)=\"onSingleDayDateChanged($event)\"\n                              [required]=\"required\"\n                              [readonly]=\"readonly\"\n                              [disabled]=\"disabled\"\n                              [placeholder]=\"(placeholder || '')\"\n      ></elder-local-date-input>\n    </div>\n  }\n}\n\n\n\n\n\n\n", styles: [".elder-flex-interval-control{flex:1 1 auto;overflow:hidden}\n"], dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ElderDateTimeInputComponent, selector: "elder-date-time-input", inputs: ["center", "isoValue"], outputs: ["isoValueChange"] }, { kind: "component", type: ElderLocalTimeInputComponent, selector: "elder-local-time-input", inputs: ["isoValue"], outputs: ["isoValueChange"] }, { kind: "component", type: MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "component", type: ElderLocalDateInputComponent, selector: "elder-local-date-input", inputs: ["zone", "autoDatePicker", "arrows", "today", "center", "datePickerTouchUi", "allowNull", "datePickerEnabled", "isoValue", "dateValue", "isoDateValue"], outputs: ["blurred", "valueUpdatedBlur", "isoValueChange", "dateValueChange", "isoDateValueChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: ElderIntervalInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-interval-input', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: ElderIntervalInputComponent },
-                    ], standalone: true, imports: [NgSwitch, NgSwitchCase, ElderDateTimeInputComponent, ElderLocalTimeInputComponent, MatDateRangeInput, MatStartDate, FormsModule, MatEndDate, MatDatepickerToggle, MatIcon, MatDatepickerToggleIcon, MatDateRangePicker, ElderLocalDateInputComponent, AsyncPipe, TranslateModule], template: "<ng-container [ngSwitch]=\"mode\">\n\n  <!-- DATE_TIME_RANGE -->\n  <div *ngSwitchCase=\"'date-time-range'\"\n       class=\"layout-row\">\n    <elder-date-time-input class=\"flex\" center\n      [value]=\"(value$ | async)?.start\"\n      (valueUpdated)=\"onStartChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n    ></elder-date-time-input>\n    <span class=\"mat-date-range-input-separator flex-none\">\u2013</span>\n    <elder-date-time-input class=\"flex\" center\n      [value]=\"(value$ | async)?.end\"\n      (valueUpdated)=\"onEndChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n    ></elder-date-time-input>\n  </div>\n\n  <!-- DAY_TIME_RANGE -->\n  <div *ngSwitchCase=\"'day-time-range'\"\n       class=\"layout-row gap-xs elder-flex-interval-control\">\n\n    <!--  [name]=\"name + '-day-start'\" -->\n    <elder-date-time-input\n      [value]=\"(value$ | async)?.start\"\n      (valueUpdated)=\"onDayTimeStartChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n    ></elder-date-time-input>\n\n    <!-- [name]=\"name + '-day-end'\" -->\n    <elder-local-time-input\n      [value]=\"endTime$ | async\"\n      (valueUpdated)=\"onDayTimeEndTimeChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n    ></elder-local-time-input>\n  </div>\n\n  <!-- DATE_RANGE -->\n  <div *ngSwitchCase=\"'date-range'\"\n       class=\"layout-row gap-xs elder-flex-interval-control\">\n\n    <mat-date-range-input\n      class=\"mdc-text-field__input\"\n      [rangePicker]=\"picker\"\n      [disabled]=\"!!disabled\"\n    >\n      <input matStartDate\n             [placeholder]=\"dateformat\"\n             [ngModel]=\"startDate$ | async\" name=\"date-range.start\"\n             [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n             (ngModelChange)=\"onStartDateChanged($event)\"\n             [readonly]=\"readonly\"\n             [disabled]=\"!!disabled\"\n      >\n      <input matEndDate\n             [placeholder]=\"dateformat\"\n             [ngModel]=\"endDate$ | async\" name=\"date-range.end\"\n             [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n             (ngModelChange)=\"onEndDateChanged($event)\"\n             [readonly]=\"readonly\"\n             [disabled]=\"!!disabled\"\n      >\n    </mat-date-range-input>\n    <mat-datepicker-toggle class=\"elder-control-icon-button\"\n                           [disabled]=\"isLocked\"\n                           [for]=\"picker\">\n      <mat-icon matDatepickerToggleIcon>calendar_month</mat-icon>\n    </mat-datepicker-toggle>\n    <mat-date-range-picker #picker></mat-date-range-picker>\n  </div>\n\n  <!-- SINGLE_DAY -->\n  <div *ngSwitchCase=\"'single-day'\"\n       class=\"layout-row elder-flex-control\">\n\n    <!-- [name]=\"name\" -->\n    <elder-local-date-input class=\"flex\" center\n      [value]=\"startLocalDate$ | async\"\n      (valueUpdated)=\"onSingleDayDateChanged($event)\"\n      [required]=\"required\"\n      [readonly]=\"readonly\"\n      [disabled]=\"disabled\"\n      [placeholder]=\"(placeholder || '')\"\n    ></elder-local-date-input>\n  </div>\n\n</ng-container>\n\n\n\n", styles: [".elder-flex-interval-control{flex:1 1 auto;overflow:hidden}\n"] }]
+                    ], standalone: true, imports: [AsyncPipe, TranslateModule, FormsModule,
+                        ElderDateTimeInputComponent, ElderLocalTimeInputComponent,
+                        MatDateRangeInput, MatStartDate,
+                        MatEndDate, MatDatepickerToggle, MatIcon, MatDatepickerToggleIcon, MatDateRangePicker,
+                        ElderLocalDateInputComponent], template: "@switch (mode) {\n\n  @case ('date-time-range') {\n    <div class=\"layout-row\">\n      <elder-date-time-input class=\"flex\" center\n                             [value]=\"(interval$ | async)?.start\"\n                             (valueUpdated)=\"onStartChanged($event)\"\n                             [required]=\"required\"\n                             [readonly]=\"readonly\"\n                             [disabled]=\"disabled\"\n                             [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n      ></elder-date-time-input>\n      <span class=\"mat-date-range-input-separator flex-none\">\u2013</span>\n      <elder-date-time-input class=\"flex\" center\n                             [value]=\"(interval$ | async)?.end\"\n                             (valueUpdated)=\"onEndChanged($event)\"\n                             [required]=\"required\"\n                             [readonly]=\"readonly\"\n                             [disabled]=\"disabled\"\n                             [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n      ></elder-date-time-input>\n    </div>\n  }\n  @case ('day-time-range') {\n    <div class=\"layout-row gap-xs elder-flex-interval-control\">\n\n      <!--  [name]=\"name + '-day-start'\" -->\n      <elder-date-time-input\n        [value]=\"(interval$ | async)?.start\"\n        (valueUpdated)=\"onDayTimeStartChanged($event)\"\n        [required]=\"required\"\n        [readonly]=\"readonly\"\n        [disabled]=\"disabled\"\n        [placeholder]=\"(placeholder || '') + ' ' + ('interval.from' | translate)\"\n      ></elder-date-time-input>\n\n      <!-- [name]=\"name + '-day-end'\" -->\n      <elder-local-time-input\n        [value]=\"endTime$ | async\"\n        (valueUpdated)=\"onDayTimeEndTimeChanged($event)\"\n        [required]=\"required\"\n        [readonly]=\"readonly\"\n        [disabled]=\"disabled\"\n        [placeholder]=\"(placeholder || '') + ' ' + ('interval.to' | translate)\"\n      ></elder-local-time-input>\n    </div>\n  }\n\n  @case ('date-range') {\n    <div class=\"layout-row gap-xs elder-flex-interval-control\">\n\n      <mat-date-range-input\n        class=\"mdc-text-field__input\"\n        [rangePicker]=\"picker\"\n        [disabled]=\"!!disabled\"\n      >\n        <input matStartDate\n               [placeholder]=\"dateformat\"\n               [ngModel]=\"startDate$ | async\" name=\"date-range.start\"\n               [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n               (ngModelChange)=\"onStartDateChanged($event)\"\n               [readonly]=\"readonly\"\n               [disabled]=\"!!disabled\"\n        >\n        <input matEndDate\n               [placeholder]=\"dateformat\"\n               [ngModel]=\"endDate$ | async\" name=\"date-range.end\"\n               [ngModelOptions]=\"{ standalone: true, updateOn: 'blur'}\"\n               (ngModelChange)=\"onEndDateChanged($event)\"\n               [readonly]=\"readonly\"\n               [disabled]=\"!!disabled\"\n        >\n      </mat-date-range-input>\n      <mat-datepicker-toggle class=\"elder-control-icon-button\"\n                             [disabled]=\"isLocked\"\n                             [for]=\"picker\">\n        <mat-icon matDatepickerToggleIcon>calendar_month</mat-icon>\n      </mat-datepicker-toggle>\n      <mat-date-range-picker #picker></mat-date-range-picker>\n    </div>\n  }\n\n  @case ('single-day') {\n    <div class=\"layout-row elder-flex-control\">\n\n      <!-- [name]=\"name\" -->\n      <elder-local-date-input class=\"flex\" center\n                              [value]=\"startLocalDate$ | async\"\n                              (valueUpdated)=\"onSingleDayDateChanged($event)\"\n                              [required]=\"required\"\n                              [readonly]=\"readonly\"\n                              [disabled]=\"disabled\"\n                              [placeholder]=\"(placeholder || '')\"\n      ></elder-local-date-input>\n    </div>\n  }\n}\n\n\n\n\n\n\n", styles: [".elder-flex-interval-control{flex:1 1 auto;overflow:hidden}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i1$1.FocusMonitor }, { type: i2.TranslateService }, { type: i3.NgControl, decorators: [{
                     type: Optional
                 }, {
@@ -25643,6 +25674,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
                     args: [MAT_DATE_LOCALE]
                 }] }], propDecorators: { zone: [{
                 type: Input
+            }], valueAsIsoStr: [{
+                type: Input
             }], mode: [{
                 type: Input
             }], isoValueChange: [{
@@ -27151,14 +27184,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImpor
                 type: Input,
                 args: ['elderSearchInput']
             }], dataSource: [{
-                type: Input,
-                args: ['dataSource']
+                type: Input
             }], fallbackValue: [{
                 type: Input,
                 args: ['elderSearchInputFallback']
             }], valueAsId: [{
-                type: Input,
-                args: ['valueAsId']
+                type: Input
             }] } });
 
 class ElderSearchPanelComponent {
@@ -27805,7 +27836,7 @@ class ElderSearchUrlService {
     }
     collectRouteQueryParams(root) {
         let params = {};
-        let stack = [root];
+        const stack = [root];
         while (stack.length > 0) {
             const route = stack.pop();
             params = { ...params, ...route.queryParams };
@@ -29603,7 +29634,7 @@ class ElderUrlFragmentSwitcherComponent {
         /*
         Window which will open the created url
          */
-        this.windowOpenIn = "_self";
+        this.windowOpenIn = '_self';
         this.activeUrlFragment$ = new BehaviorSubject(new ElderUrlFragment('No match', ''));
     }
     /***************************************************************************
@@ -29613,7 +29644,7 @@ class ElderUrlFragmentSwitcherComponent {
      **************************************************************************/
     ngOnInit() {
         if (!this.disable) {
-            let urlFragment = this.urlFragments.find(c => {
+            const urlFragment = this.urlFragments.find(c => {
                 try {
                     return c.fragment === this.urlRegex.exec(window.location.href)[this.regexArrayIndex];
                 }
@@ -30175,7 +30206,7 @@ class DataViewSelection {
         this.selection = selection;
     }
 }
-const DataViewMessageTypeValues = ["SELECTION_INIT", "SELECTION_SELECTED"];
+const DataViewMessageTypeValues = ['SELECTION_INIT', 'SELECTION_SELECTED'];
 const isDataViewMessageType = (x) => DataViewMessageTypeValues.includes(x);
 class DataViewMessage extends TypedEventMessage {
     static initialSelection(init) {
@@ -30285,7 +30316,7 @@ class IframeHostComponent {
     }
     sendMessageToChild(msg) {
         this.log.debug('Sending message to iframe child:', msg);
-        this.iframe.nativeElement.contentWindow.postMessage(msg, "*");
+        this.iframe.nativeElement.contentWindow.postMessage(msg, '*');
     }
     doClose(event) {
         this.close.emit();
@@ -30591,7 +30622,7 @@ class DataViewIframeComponent {
         }
     }
     sendMessageToChild(message) {
-        this.log.debug("Sending message to iframe child:", message);
+        this.log.debug('Sending message to iframe child:', message);
         this.iframeHost.sendMessageToChild(message);
     }
     /***************************************************************************
@@ -31552,12 +31583,18 @@ var ReactiveEventSourceState;
     ReactiveEventSourceState["ERROR"] = "ERROR";
 })(ReactiveEventSourceState || (ReactiveEventSourceState = {}));
 class ReactiveSSeMessage {
-    constructor(id, event, data, retry) {
+    constructor(id, event, dataRaw, retry) {
         this.id = id;
         this.event = event;
-        this.data = data;
+        this.dataRaw = dataRaw;
         this.retry = retry;
     }
+    json() {
+        return JSON.parse(this.dataRaw);
+    }
+    jsonAs() {
+        return this.json();
+    }
 }
 class ReactiveFetchEventSource {
     /***************************************************************************
@@ -31586,10 +31623,12 @@ class ReactiveFetchEventSource {
          * Fields                                                                  *
          *                                                                         *
          **************************************************************************/
+        this.EVENT_TYPE_DEFAULT = 'message';
+        this.RECONNECT_DELAY_MS = 3000;
         this.log = LoggerFactory.getLogger(this.constructor.name);
         this.abortController = null;
         this.state$ = new BehaviorSubject(ReactiveEventSourceState.IDLE);
-        this.eventTopics = new Map();
+        this.eventRelay = new Subject();
         if (!requestInitProvider) {
             throw new Error('You must provide a event source url provider!');
         }
@@ -31623,22 +31662,15 @@ class ReactiveFetchEventSource {
      * Get an event stream for the given event type.
      * @param eventTypeRaw The event type. Defaults to 'message'.
      */
-    events(eventTypeRaw) {
+    streamEventsOfType(eventTypeRaw) {
         const eventType = this.eventTypeOrDefault(eventTypeRaw);
-        if (!this.eventTopics.has(eventType)) {
-            this.eventTopics.set(eventType, new Subject());
-        }
-        const eventSubj = this.eventTopics.get(eventType);
-        return eventSubj.asObservable();
+        return this.streamEvents().pipe(filter(e => e.event == eventType));
     }
     /**
-     * Get an event stream of messages parsed from json.
-     * (event.data must be in json format)
-     *
-     * @param eventType The event type. Defaults to 'message'.
+     * Get an event stream for all events no matter their type.
      */
-    eventsJson(eventType) {
-        return this.events(eventType).pipe(map(event => JSON.parse(event.data)));
+    streamEvents() {
+        return this.eventRelay.asObservable();
     }
     /**
      * Close this event source. It won't reconnect.
@@ -31721,7 +31753,7 @@ class ReactiveFetchEventSource {
         else {
             this.log.error('Failed to open Event Source due to Error ' + response.status, response);
             this.updateState(ReactiveEventSourceState.ERROR);
-            this.tryReconnect(); // TODO Necessary if keep alive = true?
+            this.tryReconnect();
         }
     }
     handleOnError(err) {
@@ -31730,7 +31762,7 @@ class ReactiveFetchEventSource {
         if (!this.closed) {
             // There was an error - try reconnecting
             this.log.debug('Attempting to reconnect event-source ...');
-            this.tryReconnect(); // TODO Necessary if keep alive = true?
+            this.tryReconnect();
         }
         else {
             this.log.debug('There was an error in the sse connection (closed).', err);
@@ -31738,15 +31770,12 @@ class ReactiveFetchEventSource {
     }
     tryReconnect() {
         if (!this._closed) {
-            setTimeout(() => this.reconnect(), 3000); // Delay the reconnect
+            setTimeout(() => this.reconnect(), this.RECONNECT_DELAY_MS); // Delay the reconnect
         }
     }
     handleOnMessage(msg) {
         const eventType = this.eventTypeOrDefault(msg.event);
-        const topic = this.eventTopics.get(eventType);
-        if (topic) {
-            topic.next(new ReactiveSSeMessage(msg.id, eventType, msg.data, msg.retry));
-        }
+        this.eventRelay.next(new ReactiveSSeMessage(msg.id, eventType, msg.data, msg.retry));
     }
     handleOnClose() {
         this.log.debug('EventSource has closed.');
@@ -31756,7 +31785,7 @@ class ReactiveFetchEventSource {
         this.state$.next(state);
     }
     eventTypeOrDefault(type) {
-        return type ?? 'message';
+        return type ?? this.EVENT_TYPE_DEFAULT;
     }
 }