@elderbyte/ngx-starter 15.2.3 → 15.3.0

package/esm2020/lib/components/input/autocomplete/elder-autocomplete-many.directive.mjs

@@ -170,9 +170,9 @@ export class ElderAutocompleteManyDirective {
         this.cursorPosition = wordAtCursor.start + autocompletedPhrase.length;
     }
 }
-ElderAutocompleteManyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteManyDirective, deps: [{ token: i1.MatAutocompleteTrigger }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-ElderAutocompleteManyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: ElderAutocompleteManyDirective, selector: "[elderAutocompleteMany]", inputs: { queryFilter: "queryFilter", filters: "filters", sorts: "sorts", textProperty: "textProperty", textPropertyResolverFn: "textPropertyResolverFn", autocomplete: ["elderAutocompleteMany", "autocomplete"] }, host: { listeners: { "keyup": "onKeyUp($event)" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteManyDirective, decorators: [{
+ElderAutocompleteManyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteManyDirective, deps: [{ token: i1.MatAutocompleteTrigger }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ElderAutocompleteManyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.2", type: ElderAutocompleteManyDirective, selector: "[elderAutocompleteMany]", inputs: { queryFilter: "queryFilter", filters: "filters", sorts: "sorts", textProperty: "textProperty", textPropertyResolverFn: "textPropertyResolverFn", autocomplete: ["elderAutocompleteMany", "autocomplete"] }, host: { listeners: { "keyup": "onKeyUp($event)" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteManyDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderAutocompleteMany]'

package/esm2020/lib/components/input/autocomplete/elder-autocomplete.directive.mjs

@@ -91,9 +91,9 @@ export class ElderAutocompleteDirective {
         }
     }
 }
-ElderAutocompleteDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteDirective, deps: [{ token: i1.MatAutocompleteTrigger }], target: i0.ɵɵFactoryTarget.Directive });
-ElderAutocompleteDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: ElderAutocompleteDirective, selector: "[elderAutocomplete]", inputs: { queryFilter: "queryFilter", filters: "filters", sorts: "sorts", autocomplete: ["elderAutocomplete", "autocomplete"] }, host: { listeners: { "keyup": "onKeyUp($event)" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteDirective, decorators: [{
+ElderAutocompleteDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteDirective, deps: [{ token: i1.MatAutocompleteTrigger }], target: i0.ɵɵFactoryTarget.Directive });
+ElderAutocompleteDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.2", type: ElderAutocompleteDirective, selector: "[elderAutocomplete]", inputs: { queryFilter: "queryFilter", filters: "filters", sorts: "sorts", autocomplete: ["elderAutocomplete", "autocomplete"] }, host: { listeners: { "keyup": "onKeyUp($event)" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderAutocomplete]'

package/esm2020/lib/components/input/autocomplete/elder-autocomplete.module.mjs

@@ -15,8 +15,8 @@ export { ElderAutocompleteManyDirective } from './elder-autocomplete-many.direct
 export { ElderAutocompleteDirective } from './elder-autocomplete.directive';
 export class ElderAutocompleteModule {
 }
-ElderAutocompleteModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ElderAutocompleteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteModule, declarations: [ElderAutocompleteComponent,
+ElderAutocompleteModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElderAutocompleteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteModule, declarations: [ElderAutocompleteComponent,
         ElderAutocompleteDirective,
         ElderAutocompleteManyDirective], imports: [CommonModule, ReactiveFormsModule,
         MatInputModule,
@@ -26,13 +26,13 @@ ElderAutocompleteModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
         MatProgressBarModule], exports: [ElderAutocompleteComponent,
         ElderAutocompleteDirective,
         ElderAutocompleteManyDirective] });
-ElderAutocompleteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteModule, imports: [CommonModule, ReactiveFormsModule,
+ElderAutocompleteModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteModule, imports: [CommonModule, ReactiveFormsModule,
         MatInputModule,
         MatAutocompleteModule,
         ElderInfiniteScrollModule,
         MatIconModule,
         MatProgressBarModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderAutocompleteModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderAutocompleteModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [

package/esm2020/lib/components/labels/elder-labels.module.mjs

@@ -11,12 +11,12 @@ import * as i0 from "@angular/core";
 export { ElderLabelInputComponent } from './labels-input/labels-input.component';
 export class ElderLabelsModule {
 }
-ElderLabelsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderLabelsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ElderLabelsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderLabelsModule, declarations: [ElderLabelInputComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule,
+ElderLabelsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderLabelsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElderLabelsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderLabelsModule, declarations: [ElderLabelInputComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule,
         MatIconModule, MatInputModule, MatChipsModule, MatAutocompleteModule, TranslateModule], exports: [ElderLabelInputComponent] });
-ElderLabelsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderLabelsModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
+ElderLabelsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderLabelsModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
         MatIconModule, MatInputModule, MatChipsModule, MatAutocompleteModule, TranslateModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderLabelsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderLabelsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2020/lib/components/labels/labels-input/labels-input.component.mjs

@@ -193,9 +193,9 @@ export class ElderLabelInputComponent extends FormFieldBaseComponent {
         return this._compareWith ? this._compareWith(a, b) : a === b;
     }
 }
-ElderLabelInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderLabelInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ElderLabelInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ElderLabelInputComponent, selector: "elder-label-input", inputs: { labels: "labels", suggestionLoader: "suggestionLoader", allowNew: "allowNew", compareWith: "compareWith", colorResolver: "colorResolver", nameResolver: "nameResolver", labelBuilder: "labelBuilder" }, outputs: { labelsChanged: "labelsChanged" }, providers: buildFormIntegrationProviders(ElderLabelInputComponent), viewQueries: [{ propertyName: "inputControl", first: true, predicate: ["labelInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field\n  [floatLabel]=\"floatLabel\"\n  class=\"full-width\"\n  [appearance]=\"appearance\"\n  [color]=\"color\"\n>\n  <mat-label *ngIf=\"label\">{{label | translate}}</mat-label>\n\n  <mat-chip-grid #chips>\n    <mat-chip-row *ngFor=\"let label of currentLabels$ | async\"\n              class=\"noselect\"\n              [color]=\"labelColor(label)\" [disabled]=\"disabled\"\n              [removable]=\"removable\"\n              (removed)=\"removeLabel(label)\"\n    >\n      {{labelName(label)}}\n      <mat-icon matChipRemove *ngIf=\"!readonly && removable\">cancel</mat-icon>\n    </mat-chip-row>\n\n    <input matInput type=\"text\"\n           [matChipInputFor]=\"chips\"\n           [matAutocomplete]=\"labelAutoComplete\"\n           [formControl]=\"labelInputControl\"\n           (matChipInputTokenEnd)=\"createNewLabels($event)\"\n           [name]=\"name\"\n           [disabled]=\"disabled\"\n           [readonly]=\"readonly\"\n           [required]=\"required\"\n           [placeholder]=\"placeholder\"\n           autocomplete=\"off\"\n           #labelInput>\n  </mat-chip-grid>\n\n  <mat-autocomplete\n      #labelAutoComplete=\"matAutocomplete\"\n      panelWidth=\"auto\"\n      (optionSelected)=\"labelSelected($event)\">\n    <mat-option *ngFor=\"let suggestion of availableSuggestions$ | async\" [value]=\"suggestion\">\n      {{labelName(suggestion)}}\n    </mat-option>\n  </mat-autocomplete>\n\n</mat-form-field>\n\n", styles: [".full-width{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "component", type: i6.MatChipGrid, selector: "mat-chip-grid", inputs: ["tabIndex", "disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i6.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i6.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i6.MatChipRow, selector: "mat-chip-row, mat-basic-chip-row", inputs: ["color", "disabled", "disableRipple", "tabIndex", "editable"], outputs: ["edited"] }, { kind: "component", type: i7.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i7.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderLabelInputComponent, decorators: [{
+ElderLabelInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderLabelInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ElderLabelInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ElderLabelInputComponent, selector: "elder-label-input", inputs: { labels: "labels", suggestionLoader: "suggestionLoader", allowNew: "allowNew", compareWith: "compareWith", colorResolver: "colorResolver", nameResolver: "nameResolver", labelBuilder: "labelBuilder" }, outputs: { labelsChanged: "labelsChanged" }, providers: buildFormIntegrationProviders(ElderLabelInputComponent), viewQueries: [{ propertyName: "inputControl", first: true, predicate: ["labelInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<mat-form-field\n  [floatLabel]=\"floatLabel\"\n  class=\"full-width\"\n  [appearance]=\"appearance\"\n  [color]=\"color\"\n>\n  <mat-label *ngIf=\"label\">{{label | translate}}</mat-label>\n\n  <mat-chip-grid #chips>\n    <mat-chip-row *ngFor=\"let label of currentLabels$ | async\"\n              class=\"noselect\"\n              [color]=\"labelColor(label)\" [disabled]=\"disabled\"\n              [removable]=\"removable\"\n              (removed)=\"removeLabel(label)\"\n    >\n      {{labelName(label)}}\n      <mat-icon matChipRemove *ngIf=\"!readonly && removable\">cancel</mat-icon>\n    </mat-chip-row>\n\n    <input matInput type=\"text\"\n           [matChipInputFor]=\"chips\"\n           [matAutocomplete]=\"labelAutoComplete\"\n           [formControl]=\"labelInputControl\"\n           (matChipInputTokenEnd)=\"createNewLabels($event)\"\n           [name]=\"name\"\n           [disabled]=\"disabled\"\n           [readonly]=\"readonly\"\n           [required]=\"required\"\n           [placeholder]=\"placeholder\"\n           autocomplete=\"off\"\n           #labelInput>\n  </mat-chip-grid>\n\n  <mat-autocomplete\n      #labelAutoComplete=\"matAutocomplete\"\n      panelWidth=\"auto\"\n      (optionSelected)=\"labelSelected($event)\">\n    <mat-option *ngFor=\"let suggestion of availableSuggestions$ | async\" [value]=\"suggestion\">\n      {{labelName(suggestion)}}\n    </mat-option>\n  </mat-autocomplete>\n\n</mat-form-field>\n\n", styles: [".full-width{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "component", type: i6.MatChipGrid, selector: "mat-chip-grid", inputs: ["tabIndex", "disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i6.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i6.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i6.MatChipRow, selector: "mat-chip-row, mat-basic-chip-row", inputs: ["color", "disabled", "disableRipple", "tabIndex", "editable"], outputs: ["edited"] }, { kind: "component", type: i7.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i7.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderLabelInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-label-input', providers: buildFormIntegrationProviders(ElderLabelInputComponent), changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field\n  [floatLabel]=\"floatLabel\"\n  class=\"full-width\"\n  [appearance]=\"appearance\"\n  [color]=\"color\"\n>\n  <mat-label *ngIf=\"label\">{{label | translate}}</mat-label>\n\n  <mat-chip-grid #chips>\n    <mat-chip-row *ngFor=\"let label of currentLabels$ | async\"\n              class=\"noselect\"\n              [color]=\"labelColor(label)\" [disabled]=\"disabled\"\n              [removable]=\"removable\"\n              (removed)=\"removeLabel(label)\"\n    >\n      {{labelName(label)}}\n      <mat-icon matChipRemove *ngIf=\"!readonly && removable\">cancel</mat-icon>\n    </mat-chip-row>\n\n    <input matInput type=\"text\"\n           [matChipInputFor]=\"chips\"\n           [matAutocomplete]=\"labelAutoComplete\"\n           [formControl]=\"labelInputControl\"\n           (matChipInputTokenEnd)=\"createNewLabels($event)\"\n           [name]=\"name\"\n           [disabled]=\"disabled\"\n           [readonly]=\"readonly\"\n           [required]=\"required\"\n           [placeholder]=\"placeholder\"\n           autocomplete=\"off\"\n           #labelInput>\n  </mat-chip-grid>\n\n  <mat-autocomplete\n      #labelAutoComplete=\"matAutocomplete\"\n      panelWidth=\"auto\"\n      (optionSelected)=\"labelSelected($event)\">\n    <mat-option *ngFor=\"let suggestion of availableSuggestions$ | async\" [value]=\"suggestion\">\n      {{labelName(suggestion)}}\n    </mat-option>\n  </mat-autocomplete>\n\n</mat-form-field>\n\n", styles: [".full-width{width:100%}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { inputControl: [{

package/esm2020/lib/components/measures/dimensions/dimensions-input/elder-dimensions-input.component.mjs

@@ -218,11 +218,11 @@ export class ElderDimensionsInputComponent extends ElderFormFieldControlBase {
         return Dimensions.from(this.unit, this.lengthValue, this.widthValue, value);
     }
 }
-ElderDimensionsInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderDimensionsInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-ElderDimensionsInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ElderDimensionsInputComponent, selector: "elder-dimensions-input", inputs: { name: "name", appearance: "appearance", color: "color", placeholderLength: "placeholderLength", placeholderWidth: "placeholderWidth", placeholderHeight: "placeholderHeight", displayFormat: "displayFormat", mode: "mode", requiredLength: "requiredLength", requiredWidth: "requiredWidth", requiredHeight: "requiredHeight", unit: "unit", lengthValue: "lengthValue", widthValue: "widthValue", heightValue: "heightValue" }, outputs: { unitChange: "unitChange", lengthValueChange: "lengthValueChange", widthValueChange: "widthValueChange", heightValueChange: "heightValueChange" }, providers: [
+ElderDimensionsInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderDimensionsInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+ElderDimensionsInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ElderDimensionsInputComponent, selector: "elder-dimensions-input", inputs: { name: "name", appearance: "appearance", color: "color", placeholderLength: "placeholderLength", placeholderWidth: "placeholderWidth", placeholderHeight: "placeholderHeight", displayFormat: "displayFormat", mode: "mode", requiredLength: "requiredLength", requiredWidth: "requiredWidth", requiredHeight: "requiredHeight", unit: "unit", lengthValue: "lengthValue", widthValue: "widthValue", heightValue: "heightValue" }, outputs: { unitChange: "unitChange", lengthValueChange: "lengthValueChange", widthValueChange: "widthValueChange", heightValueChange: "heightValueChange" }, providers: [
         { provide: MatFormFieldControl, useExisting: ElderDimensionsInputComponent },
     ], usesInheritance: true, ngImport: i0, template: "<div role=\"group\" class=\"layout-row place-start-baseline g-md full\"\n     *ngIf=\"context$ | async as context\">\n\n  <!-- elder-form-field-small -->\n  <elder-quantity-input *ngIf=\"context.lengthActive\"\n    [quantityValue]=\"lengthValue\"\n    (quantityValueChange)=\"onLengthValueChanged($event)\"\n    [unit]=\"unit\"\n    [placeholder]=\"(placeholderLength ? placeholderLength : 'dimensions.length') | translate\"\n    [displayFormat]=\"displayFormat\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n    [hideUnit]=\"!context.isLengthLast\"\n  >\n  </elder-quantity-input>\n\n  <span class=\"noselect\" *ngIf=\"context.lengthActive && context.widthActive\">&times;</span>\n\n  <elder-quantity-input *ngIf=\"context.widthActive\"\n    [quantityValue]=\"widthValue\"\n    (quantityValueChange)=\"onWidthValueChanged($event)\"\n    [unit]=\"unit\"\n    [displayFormat]=\"displayFormat\"\n    [placeholder]=\"(placeholderWidth ? placeholderWidth : 'dimensions.width') | translate\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n    [hideUnit]=\"!context.isWidthLast\"\n  >\n  </elder-quantity-input>\n\n  <span class=\"noselect\" *ngIf=\"context.widthActive && context.heightActive\">&times;</span>\n\n  <elder-quantity-input *ngIf=\"context.heightActive\"\n    [quantityValue]=\"heightValue\"\n    (quantityValueChange)=\"onHeightValueChanged($event)\"\n    [unit]=\"unit\"\n    [displayFormat]=\"displayFormat\"\n    [placeholder]=\"(placeholderHeight ? placeholderHeight : 'dimensions.height') | translate\"\n    [readonly]=\"readonly\"\n    [disabled]=\"disabled\"\n  >\n  </elder-quantity-input>\n\n  <!--\n[requiredIgnoreZero]=\"requiredIgnoreZero\"\n                      [elderMultipleOf]=\"multipleOf\" ngModel\n                      [min]=\"min\"\n                      [max]=\"max\"\n                      [required]=\"requiredLength\"\n                      -->\n</div>\n\n\n", styles: [""], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.ElderQuantityInputControlComponent, selector: "elder-quantity-input", inputs: ["displayFormat", "quantityValue", "unit", "hideUnit"], outputs: ["quantityValueChange", "unitChange"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderDimensionsInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderDimensionsInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-dimensions-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: ElderDimensionsInputComponent },

package/esm2020/lib/components/measures/dimensions/validation/elder-required-dimensions.validator.mjs

@@ -70,11 +70,11 @@ export class ElderRequiredDimensionsValidator {
         return false;
     }
 }
-ElderRequiredDimensionsValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderRequiredDimensionsValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-ElderRequiredDimensionsValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: ElderRequiredDimensionsValidator, selector: "elder-dimensions-input[required][formControl],elder-dimensions-input[required][formControlName],elder-dimensions-input[required][ngModel]", inputs: { requiredIgnoreZero: "requiredIgnoreZero", required: "required" }, providers: [
+ElderRequiredDimensionsValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderRequiredDimensionsValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+ElderRequiredDimensionsValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.2", type: ElderRequiredDimensionsValidator, selector: "elder-dimensions-input[required][formControl],elder-dimensions-input[required][formControlName],elder-dimensions-input[required][ngModel]", inputs: { requiredIgnoreZero: "requiredIgnoreZero", required: "required" }, providers: [
         { provide: NG_VALIDATORS, useExisting: ElderRequiredDimensionsValidator, multi: true }
     ], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderRequiredDimensionsValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderRequiredDimensionsValidator, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector

package/esm2020/lib/components/measures/directives/elder-unit-select.directive.mjs

@@ -49,9 +49,9 @@ export class ElderUnitSelectDirective {
         this.select.filters = [];
     }
 }
-ElderUnitSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderUnitSelectDirective, deps: [{ token: i1.ElderSelectComponent }, { token: i2.ElderUnitService }], target: i0.ɵɵFactoryTarget.Directive });
-ElderUnitSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: ElderUnitSelectDirective, selector: "[elderUnitSelect]", inputs: { unitDimension: "unitDimension", baseUnit: "baseUnit" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderUnitSelectDirective, decorators: [{
+ElderUnitSelectDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderUnitSelectDirective, deps: [{ token: i1.ElderSelectComponent }, { token: i2.ElderUnitService }], target: i0.ɵɵFactoryTarget.Directive });
+ElderUnitSelectDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.2", type: ElderUnitSelectDirective, selector: "[elderUnitSelect]", inputs: { unitDimension: "unitDimension", baseUnit: "baseUnit" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderUnitSelectDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[elderUnitSelect]'

package/esm2020/lib/components/measures/elder-measures.module.mjs

@@ -28,8 +28,8 @@ export * from './dimensions/dimensions-input/elder-dimensions-input.component';
 export * from './dimensions/validation/elder-required-dimensions.validator';
 export class ElderMeasuresModule {
 }
-ElderMeasuresModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderMeasuresModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ElderMeasuresModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderMeasuresModule, declarations: [ElderQuantityFormFieldComponent,
+ElderMeasuresModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderMeasuresModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElderMeasuresModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderMeasuresModule, declarations: [ElderQuantityFormFieldComponent,
         ElderQuantityPipe,
         ElderQuantityTransformPipe,
         ElderUnitSelectDirective,
@@ -57,7 +57,7 @@ ElderMeasuresModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ver
         ElderRequiredQuantityValidator,
         ElderQuantityRangeValidator,
         ElderRequiredDimensionsValidator] });
-ElderMeasuresModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderMeasuresModule, providers: [
+ElderMeasuresModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderMeasuresModule, providers: [
         DecimalPipe,
         ElderQuantityPipe,
         ElderQuantityTransformPipe
@@ -73,7 +73,7 @@ ElderMeasuresModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", ver
         MatInputModule,
         // ElderByte
         ElderFormsDirectivesModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderMeasuresModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderMeasuresModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -123,10 +123,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
  */
 export class ElderQuantityModule {
 }
-ElderQuantityModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ElderQuantityModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityModule, imports: [ElderMeasuresModule], exports: [ElderMeasuresModule] });
-ElderQuantityModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityModule, imports: [ElderMeasuresModule, ElderMeasuresModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityModule, decorators: [{
+ElderQuantityModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElderQuantityModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityModule, imports: [ElderMeasuresModule], exports: [ElderMeasuresModule] });
+ElderQuantityModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityModule, imports: [ElderMeasuresModule, ElderMeasuresModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2020/lib/components/measures/elder-quantity-transform.pipe.mjs

@@ -30,9 +30,9 @@ export class ElderQuantityTransformPipe {
         }
     }
 }
-ElderQuantityTransformPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityTransformPipe, deps: [{ token: i1.ElderQuantityService }], target: i0.ɵɵFactoryTarget.Pipe });
-ElderQuantityTransformPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityTransformPipe, name: "elderQuantityTransform" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityTransformPipe, decorators: [{
+ElderQuantityTransformPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityTransformPipe, deps: [{ token: i1.ElderQuantityService }], target: i0.ɵɵFactoryTarget.Pipe });
+ElderQuantityTransformPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityTransformPipe, name: "elderQuantityTransform" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityTransformPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'elderQuantityTransform'

package/esm2020/lib/components/measures/elder-quantity.pipe.mjs

@@ -62,9 +62,9 @@ export class ElderQuantityPipe {
 ElderQuantityPipe.EMPTY_STRING = '';
 ElderQuantityPipe.SPACE_STRING = ' ';
 ElderQuantityPipe.DEFAULT_DIGITS = '1.0-1';
-ElderQuantityPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityPipe, deps: [{ token: i1.ElderUnitService }, { token: i2.ElderQuantityTransformPipe }, { token: i3.DecimalPipe }], target: i0.ɵɵFactoryTarget.Pipe });
-ElderQuantityPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityPipe, name: "elderQuantity" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityPipe, decorators: [{
+ElderQuantityPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityPipe, deps: [{ token: i1.ElderUnitService }, { token: i2.ElderQuantityTransformPipe }, { token: i3.DecimalPipe }], target: i0.ɵɵFactoryTarget.Pipe });
+ElderQuantityPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityPipe, name: "elderQuantity" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'elderQuantity'

package/esm2020/lib/components/measures/elder-unit.service.mjs

@@ -104,9 +104,9 @@ export class ElderUnitService {
         return infos;
     }
 }
-ElderUnitService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderUnitService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ElderUnitService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderUnitService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderUnitService, decorators: [{
+ElderUnitService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderUnitService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ElderUnitService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderUnitService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderUnitService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'

package/esm2020/lib/components/measures/quantity-input/quantity-form-field/elder-quantity-form-field.component.mjs

@@ -24,9 +24,9 @@ export class ElderQuantityFormFieldComponent extends ElderFromFieldCustomizableB
         this.floatLabel = 'auto';
     }
 }
-ElderQuantityFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ElderQuantityFormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ElderQuantityFormFieldComponent, selector: "elder-quantity-form-field", usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\"\n                [appearance]=\"appearance\"\n                [color]=\"color\"\n>\n\n  <mat-label *ngIf=\"label\">{{label | translate}}</mat-label>\n\n  <span matIconPrefix *ngIf=\"showIcon && icon\">\n      <mat-icon [inline]=\"true\">{{icon}}</mat-icon>\n  </span>\n\n  <ng-content></ng-content>\n\n  <mat-hint *ngIf=\"showHint\" align=\"end\">\n    <span *ngIf=\"hint\">{{hint}}</span>\n  </mat-hint>\n\n  <mat-error elderValidationError></mat-error>\n\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.ElderValidationErrorDirective, selector: "mat-error[elderValidationError]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityFormFieldComponent, decorators: [{
+ElderQuantityFormFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ElderQuantityFormFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ElderQuantityFormFieldComponent, selector: "elder-quantity-form-field", usesInheritance: true, ngImport: i0, template: "<mat-form-field [floatLabel]=\"floatLabel\"\n                [appearance]=\"appearance\"\n                [color]=\"color\"\n>\n\n  <mat-label *ngIf=\"label\">{{label | translate}}</mat-label>\n\n  <span matIconPrefix *ngIf=\"showIcon && icon\">\n      <mat-icon [inline]=\"true\">{{icon}}</mat-icon>\n  </span>\n\n  <ng-content></ng-content>\n\n  <mat-hint *ngIf=\"showHint\" align=\"end\">\n    <span *ngIf=\"hint\">{{hint}}</span>\n  </mat-hint>\n\n  <mat-error elderValidationError></mat-error>\n\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.ElderValidationErrorDirective, selector: "mat-error[elderValidationError]" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityFormFieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-quantity-form-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field [floatLabel]=\"floatLabel\"\n                [appearance]=\"appearance\"\n                [color]=\"color\"\n>\n\n  <mat-label *ngIf=\"label\">{{label | translate}}</mat-label>\n\n  <span matIconPrefix *ngIf=\"showIcon && icon\">\n      <mat-icon [inline]=\"true\">{{icon}}</mat-icon>\n  </span>\n\n  <ng-content></ng-content>\n\n  <mat-hint *ngIf=\"showHint\" align=\"end\">\n    <span *ngIf=\"hint\">{{hint}}</span>\n  </mat-hint>\n\n  <mat-error elderValidationError></mat-error>\n\n</mat-form-field>\n" }]
         }], ctorParameters: function () { return []; } });

package/esm2020/lib/components/measures/quantity-input/quantity-input-control/elder-quantity-input-control.component.mjs

@@ -141,11 +141,11 @@ export class ElderQuantityInputControlComponent extends ElderFormFieldControlBas
             && a?.unit === b?.unit;
     }
 }
-ElderQuantityInputControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityInputControlComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.NgControl, optional: true, self: true }, { token: i4.ElderUnitService }, { token: i5.DecimalPipe }], target: i0.ɵɵFactoryTarget.Component });
-ElderQuantityInputControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ElderQuantityInputControlComponent, selector: "elder-quantity-input", inputs: { displayFormat: "displayFormat", quantityValue: "quantityValue", unit: "unit", hideUnit: "hideUnit" }, outputs: { quantityValueChange: "quantityValueChange", unitChange: "unitChange" }, providers: [
+ElderQuantityInputControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityInputControlComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: i2.TranslateService }, { token: i3.NgControl, optional: true, self: true }, { token: i4.ElderUnitService }, { token: i5.DecimalPipe }], target: i0.ɵɵFactoryTarget.Component });
+ElderQuantityInputControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ElderQuantityInputControlComponent, selector: "elder-quantity-input", inputs: { displayFormat: "displayFormat", quantityValue: "quantityValue", unit: "unit", hideUnit: "hideUnit" }, outputs: { quantityValueChange: "quantityValueChange", unitChange: "unitChange" }, providers: [
         { provide: MatFormFieldControl, useExisting: ElderQuantityInputControlComponent },
     ], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["input"], descendants: true }, { propertyName: "quantityInput", first: true, predicate: ["quantityMatInput"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div\n  class=\"layout-row place-start-baseline elder-flex-control\"\n>\n  <input #input\n         matInput type=\"number\" elderNoSpinner\n         #quantityMatInput=\"matInput\"\n         class=\"flex-grow elder-quantity-input mdc-text-field__input\"\n         [disabled]=\"!!disabled\"\n         [readonly]=\"readonly\"\n         [name]=\"ngControl?.name + '-inner-input'\"\n         [placeholder]=\"placeholder | translate\"\n         [ngModel]=\"formattedValue$ | async\" [ngModelOptions]=\"{standalone: true, updateOn: 'change'}\"\n         (ngModelChange)=\"onQuantityValueChanged($event)\"\n  >\n  <span *ngIf=\"!hideUnit\" class=\"mat-small elder-quantity-unit\">{{unitSymbol$ | async}}</span>\n</div>\n", styles: [".elder-quantity-input{text-align:right}.elder-quantity-unit{margin-left:4px}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { 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: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: i7.ElderFormFieldNoSpinnerDirective, selector: "input[elderNoSpinner]", inputs: ["elderNoSpinner"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityInputControlComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityInputControlComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-quantity-input', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: MatFormFieldControl, useExisting: ElderQuantityInputControlComponent },

package/esm2020/lib/components/measures/quantity-input/validation/elder-quantity-range.validator.mjs

@@ -65,11 +65,11 @@ export class ElderQuantityRangeValidator {
         return quantity?.value <= maxValue;
     }
 }
-ElderQuantityRangeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityRangeValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-ElderQuantityRangeValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: ElderQuantityRangeValidator, selector: "elder-quantity-input[min][formControl],elder-quantity-input[min][formControlName],elder-quantity-input[min][ngModel],elder-quantity-input[max][formControl],elder-quantity-input[max][formControlName],elder-quantity-input[max][ngModel]", inputs: { min: "min", max: "max" }, providers: [
+ElderQuantityRangeValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityRangeValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+ElderQuantityRangeValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.2", type: ElderQuantityRangeValidator, selector: "elder-quantity-input[min][formControl],elder-quantity-input[min][formControlName],elder-quantity-input[min][ngModel],elder-quantity-input[max][formControl],elder-quantity-input[max][formControlName],elder-quantity-input[max][ngModel]", inputs: { min: "min", max: "max" }, providers: [
         { provide: NG_VALIDATORS, useExisting: ElderQuantityRangeValidator, multi: true }
     ], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityRangeValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityRangeValidator, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector

package/esm2020/lib/components/measures/quantity-input/validation/elder-required-quantity.validator.mjs

@@ -55,11 +55,11 @@ export class ElderRequiredQuantityValidator {
         return false;
     }
 }
-ElderRequiredQuantityValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderRequiredQuantityValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-ElderRequiredQuantityValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: ElderRequiredQuantityValidator, selector: "elder-quantity-input[required][formControl],elder-quantity-input[required][formControlName],elder-quantity-input[required][ngModel]", inputs: { requiredIgnoreZero: "requiredIgnoreZero", required: "required" }, providers: [
+ElderRequiredQuantityValidator.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderRequiredQuantityValidator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+ElderRequiredQuantityValidator.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.2", type: ElderRequiredQuantityValidator, selector: "elder-quantity-input[required][formControl],elder-quantity-input[required][formControlName],elder-quantity-input[required][ngModel]", inputs: { requiredIgnoreZero: "requiredIgnoreZero", required: "required" }, providers: [
         { provide: NG_VALIDATORS, useExisting: ElderRequiredQuantityValidator, multi: true }
     ], ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderRequiredQuantityValidator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderRequiredQuantityValidator, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector

package/esm2020/lib/components/measures/util/elder-quantity.service.mjs

@@ -226,9 +226,9 @@ export class ElderQuantityService {
         return quantity.value + '-' + quantity.unit;
     }
 }
-ElderQuantityService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityService, deps: [{ token: i1.ElderUnitService }], target: i0.ɵɵFactoryTarget.Injectable });
-ElderQuantityService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderQuantityService, decorators: [{
+ElderQuantityService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityService, deps: [{ token: i1.ElderUnitService }], target: i0.ɵɵFactoryTarget.Injectable });
+ElderQuantityService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderQuantityService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'

package/esm2020/lib/components/navigation/bread-crumbs/bread-crumbs/elder-bread-crumbs.component.mjs

@@ -138,9 +138,9 @@ export class ElderBreadCrumbsComponent {
         return nodes;
     }
 }
-ElderBreadCrumbsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderBreadCrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ElderBreadCrumbsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ElderBreadCrumbsComponent, selector: "elder-bread-crumbs", inputs: { root: "root", rootTranslation: "rootTranslation", rootIcon: "rootIcon", backgroundColor: "backgroundColor", editModeEnabled: "editModeEnabled", path: "path" }, outputs: { pathChange: "pathChange" }, viewQueries: [{ propertyName: "trigger", first: true, predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<!-- main container-->\n<div class=\"layout-row place-start-center full breadcrumb-bar\"\n     [style.background-color]=\"backgroundColor\"\n     *ngIf=\"{enabled: editMode$ | async} as editMode\"\n>\n\n  <!-- path container -->\n  <form #breadCrumbForm=\"ngForm\"\n       class=\"layout-row place-start-center flex breadcrumb-path\"\n       (click)=\"enableEditMode()\"\n  >\n      <!-- path edit control (if editMode:enabled) -->\n      <mat-form-field class=\"flex\" *ngIf=\"editMode.enabled\" elderDense >\n        {{ pathInput.focus() }}\n        <input matInput type=\"text\" name=\"pathInput\" #pathInput\n               [ngModel]=\"path\" (ngModelChange)=\"onPathInputChange($event)\"\n               (blur)=\"onPathEditBlur($event)\"\n               elderKeyEvent [elderKeyEventFilter]=\"'Enter'\" (onElderKeyEvent)=\"onEnter()\">\n      </mat-form-field>\n\n      <!-- navigation control (if editMode:disabled) -->\n      <ng-container *ngIf=\"!editMode.enabled\">\n        <div class=\"layout-row place-center-center flex-none\"\n             *ngFor=\"let node of nodes$ | async;let isFirst = first;let isLast = last\">\n\n          <!-- arrow right icon as path element delimiter -->\n          <mat-icon *ngIf=\"!isFirst\" class=\"noselect breadcrumb-arrow\">keyboard_arrow_right</mat-icon>\n\n          <!-- root element (case root icon) -->\n          <a *ngIf=\"isFirst && rootIcon\"\n             mat-icon-button class=\"breadcrumb\"\n             (click)=\"goToPath(node)\" elderStopEventPropagation\n          >\n            <mat-icon>{{rootIcon}}</mat-icon>\n          </a>\n\n          <!-- intermediate elements (not last and (not first or root icon)) -->\n          <a *ngIf=\"!isLast && (!isFirst || !rootIcon)\"\n             mat-button class=\"breadcrumb\"\n             (click)=\"goToPath(node)\" elderStopEventPropagation\n          >\n            <span>{{node.name}}</span>\n          </a>\n\n          <!-- last element (is last and (not first or root icon)) -->\n          <a mat-button class=\"breadcrumb\" *ngIf=\"isLast && (!isFirst || !rootIcon)\"\n             (click)=\"null\" elderStopEventPropagation\n          >\n            {{node.name}}\n            <mat-icon>arrow_drop_down</mat-icon>\n          </a>\n\n        </div>\n      </ng-container>\n\n  </form>\n\n  <!-- bread crumb action menu button -->\n  <button mat-icon-button type=\"button\" [matMenuTriggerFor]=\"menu\">\n\n    <mat-icon style=\"font-size: 22px\">arrow_drop_down</mat-icon>\n\n    <mat-menu #menu=\"matMenu\">\n\n      <button mat-menu-item type=\"button\" [elderClipboardPut]=\"path\">\n        <mat-icon>content_copy</mat-icon>\n        <span>{{'Pfad kopieren'}}</span>\n      </button>\n\n      <button mat-menu-item type=\"button\" (click)=\"onMenuEditPathClick($event)\" elderStopEventPropagation>\n        <mat-icon *ngIf=\"!editMode.enabled\">edit</mat-icon>\n        <mat-icon *ngIf=\"editMode.enabled\">done</mat-icon>\n        <span *ngIf=\"!editMode.enabled\">{{'Pfad editieren'}}</span>\n        <span *ngIf=\"editMode.enabled\">{{'Pfad best\u00E4tigen'}}</span>\n      </button>\n\n    </mat-menu>\n\n  </button>\n</div>\n\n\n", styles: [".breadcrumb-path{padding:0 8px}.breadcrumb{padding-left:4px;padding-right:4px;font-size:18px;font-weight:400}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i5.MatIconAnchor, selector: "a[mat-icon-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i8.ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "directive", type: i9.ElderKeyEventDirective, selector: "[elderKeyEvent]", inputs: ["elderKeyEventFilter", "elderKeyEventDown", "elderKeyEventChildren", "elderKeyEventCallback"], outputs: ["onElderKeyEvent"] }, { kind: "directive", type: i10.ElderClipboardPutDirective, selector: "[elderClipboardPut]", inputs: ["elderClipboardPut"], outputs: ["clipboardCopied"] }, { kind: "directive", type: i11.ElderFormFieldDenseDirective, selector: "mat-form-field[elderDense]", inputs: ["elderDense"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderBreadCrumbsComponent, decorators: [{
+ElderBreadCrumbsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderBreadCrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ElderBreadCrumbsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ElderBreadCrumbsComponent, selector: "elder-bread-crumbs", inputs: { root: "root", rootTranslation: "rootTranslation", rootIcon: "rootIcon", backgroundColor: "backgroundColor", editModeEnabled: "editModeEnabled", path: "path" }, outputs: { pathChange: "pathChange" }, viewQueries: [{ propertyName: "trigger", first: true, predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<!-- main container-->\n<div class=\"layout-row place-start-center full breadcrumb-bar\"\n     [style.background-color]=\"backgroundColor\"\n     *ngIf=\"{enabled: editMode$ | async} as editMode\"\n>\n\n  <!-- path container -->\n  <form #breadCrumbForm=\"ngForm\"\n       class=\"layout-row place-start-center flex breadcrumb-path\"\n       (click)=\"enableEditMode()\"\n  >\n      <!-- path edit control (if editMode:enabled) -->\n      <mat-form-field class=\"flex\" *ngIf=\"editMode.enabled\" elderDense >\n        {{ pathInput.focus() }}\n        <input matInput type=\"text\" name=\"pathInput\" #pathInput\n               [ngModel]=\"path\" (ngModelChange)=\"onPathInputChange($event)\"\n               (blur)=\"onPathEditBlur($event)\"\n               elderKeyEvent [elderKeyEventFilter]=\"'Enter'\" (onElderKeyEvent)=\"onEnter()\">\n      </mat-form-field>\n\n      <!-- navigation control (if editMode:disabled) -->\n      <ng-container *ngIf=\"!editMode.enabled\">\n        <div class=\"layout-row place-center-center flex-none\"\n             *ngFor=\"let node of nodes$ | async;let isFirst = first;let isLast = last\">\n\n          <!-- arrow right icon as path element delimiter -->\n          <mat-icon *ngIf=\"!isFirst\" class=\"noselect breadcrumb-arrow\">keyboard_arrow_right</mat-icon>\n\n          <!-- root element (case root icon) -->\n          <a *ngIf=\"isFirst && rootIcon\"\n             mat-icon-button class=\"breadcrumb\"\n             (click)=\"goToPath(node)\" elderStopEventPropagation\n          >\n            <mat-icon>{{rootIcon}}</mat-icon>\n          </a>\n\n          <!-- intermediate elements (not last and (not first or root icon)) -->\n          <a *ngIf=\"!isLast && (!isFirst || !rootIcon)\"\n             mat-button class=\"breadcrumb\"\n             (click)=\"goToPath(node)\" elderStopEventPropagation\n          >\n            <span>{{node.name}}</span>\n          </a>\n\n          <!-- last element (is last and (not first or root icon)) -->\n          <a mat-button class=\"breadcrumb\" *ngIf=\"isLast && (!isFirst || !rootIcon)\"\n             (click)=\"null\" elderStopEventPropagation\n          >\n            {{node.name}}\n            <mat-icon>arrow_drop_down</mat-icon>\n          </a>\n\n        </div>\n      </ng-container>\n\n  </form>\n\n  <!-- bread crumb action menu button -->\n  <button mat-icon-button type=\"button\" [matMenuTriggerFor]=\"menu\">\n\n    <mat-icon style=\"font-size: 22px\">arrow_drop_down</mat-icon>\n\n    <mat-menu #menu=\"matMenu\">\n\n      <button mat-menu-item type=\"button\" [elderClipboardPut]=\"path\">\n        <mat-icon>content_copy</mat-icon>\n        <span>{{'Pfad kopieren'}}</span>\n      </button>\n\n      <button mat-menu-item type=\"button\" (click)=\"onMenuEditPathClick($event)\" elderStopEventPropagation>\n        <mat-icon *ngIf=\"!editMode.enabled\">edit</mat-icon>\n        <mat-icon *ngIf=\"editMode.enabled\">done</mat-icon>\n        <span *ngIf=\"!editMode.enabled\">{{'Pfad editieren'}}</span>\n        <span *ngIf=\"editMode.enabled\">{{'Pfad best\u00E4tigen'}}</span>\n      </button>\n\n    </mat-menu>\n\n  </button>\n</div>\n\n\n", styles: [".breadcrumb-path{padding:0 8px}.breadcrumb{padding-left:4px;padding-right:4px;font-size:18px;font-weight:400}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i5.MatIconAnchor, selector: "a[mat-icon-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i7.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i7.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i7.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i8.ElderStopEventPropagationDirective, selector: "[elderStopEventPropagation]" }, { kind: "directive", type: i9.ElderKeyEventDirective, selector: "[elderKeyEvent]", inputs: ["elderKeyEventFilter", "elderKeyEventDown", "elderKeyEventChildren", "elderKeyEventCallback"], outputs: ["onElderKeyEvent"] }, { kind: "directive", type: i10.ElderClipboardPutDirective, selector: "[elderClipboardPut]", inputs: ["elderClipboardPut"], outputs: ["clipboardCopied"] }, { kind: "directive", type: i11.ElderFormFieldDenseDirective, selector: "mat-form-field[elderDense]", inputs: ["elderDense"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderBreadCrumbsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-bread-crumbs', changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- main container-->\n<div class=\"layout-row place-start-center full breadcrumb-bar\"\n     [style.background-color]=\"backgroundColor\"\n     *ngIf=\"{enabled: editMode$ | async} as editMode\"\n>\n\n  <!-- path container -->\n  <form #breadCrumbForm=\"ngForm\"\n       class=\"layout-row place-start-center flex breadcrumb-path\"\n       (click)=\"enableEditMode()\"\n  >\n      <!-- path edit control (if editMode:enabled) -->\n      <mat-form-field class=\"flex\" *ngIf=\"editMode.enabled\" elderDense >\n        {{ pathInput.focus() }}\n        <input matInput type=\"text\" name=\"pathInput\" #pathInput\n               [ngModel]=\"path\" (ngModelChange)=\"onPathInputChange($event)\"\n               (blur)=\"onPathEditBlur($event)\"\n               elderKeyEvent [elderKeyEventFilter]=\"'Enter'\" (onElderKeyEvent)=\"onEnter()\">\n      </mat-form-field>\n\n      <!-- navigation control (if editMode:disabled) -->\n      <ng-container *ngIf=\"!editMode.enabled\">\n        <div class=\"layout-row place-center-center flex-none\"\n             *ngFor=\"let node of nodes$ | async;let isFirst = first;let isLast = last\">\n\n          <!-- arrow right icon as path element delimiter -->\n          <mat-icon *ngIf=\"!isFirst\" class=\"noselect breadcrumb-arrow\">keyboard_arrow_right</mat-icon>\n\n          <!-- root element (case root icon) -->\n          <a *ngIf=\"isFirst && rootIcon\"\n             mat-icon-button class=\"breadcrumb\"\n             (click)=\"goToPath(node)\" elderStopEventPropagation\n          >\n            <mat-icon>{{rootIcon}}</mat-icon>\n          </a>\n\n          <!-- intermediate elements (not last and (not first or root icon)) -->\n          <a *ngIf=\"!isLast && (!isFirst || !rootIcon)\"\n             mat-button class=\"breadcrumb\"\n             (click)=\"goToPath(node)\" elderStopEventPropagation\n          >\n            <span>{{node.name}}</span>\n          </a>\n\n          <!-- last element (is last and (not first or root icon)) -->\n          <a mat-button class=\"breadcrumb\" *ngIf=\"isLast && (!isFirst || !rootIcon)\"\n             (click)=\"null\" elderStopEventPropagation\n          >\n            {{node.name}}\n            <mat-icon>arrow_drop_down</mat-icon>\n          </a>\n\n        </div>\n      </ng-container>\n\n  </form>\n\n  <!-- bread crumb action menu button -->\n  <button mat-icon-button type=\"button\" [matMenuTriggerFor]=\"menu\">\n\n    <mat-icon style=\"font-size: 22px\">arrow_drop_down</mat-icon>\n\n    <mat-menu #menu=\"matMenu\">\n\n      <button mat-menu-item type=\"button\" [elderClipboardPut]=\"path\">\n        <mat-icon>content_copy</mat-icon>\n        <span>{{'Pfad kopieren'}}</span>\n      </button>\n\n      <button mat-menu-item type=\"button\" (click)=\"onMenuEditPathClick($event)\" elderStopEventPropagation>\n        <mat-icon *ngIf=\"!editMode.enabled\">edit</mat-icon>\n        <mat-icon *ngIf=\"editMode.enabled\">done</mat-icon>\n        <span *ngIf=\"!editMode.enabled\">{{'Pfad editieren'}}</span>\n        <span *ngIf=\"editMode.enabled\">{{'Pfad best\u00E4tigen'}}</span>\n      </button>\n\n    </mat-menu>\n\n  </button>\n</div>\n\n\n", styles: [".breadcrumb-path{padding:0 8px}.breadcrumb{padding-left:4px;padding-right:4px;font-size:18px;font-weight:400}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { pathChange: [{

package/esm2020/lib/components/navigation/bread-crumbs/elder-bread-crumbs.module.mjs

@@ -14,8 +14,8 @@ export * from './bread-crumbs/elder-bread-crumbs.component';
 export * from './path/path';
 export class ElderBreadCrumbsModule {
 }
-ElderBreadCrumbsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderBreadCrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ElderBreadCrumbsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderBreadCrumbsModule, declarations: [ElderBreadCrumbsComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule,
+ElderBreadCrumbsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderBreadCrumbsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElderBreadCrumbsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderBreadCrumbsModule, declarations: [ElderBreadCrumbsComponent], imports: [CommonModule, FormsModule, ReactiveFormsModule,
         TranslateModule,
         MatFormFieldModule,
         MatIconModule,
@@ -23,7 +23,7 @@ ElderBreadCrumbsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0",
         MatInputModule,
         MatMenuModule,
         ElderFormsDirectivesModule], exports: [ElderBreadCrumbsComponent] });
-ElderBreadCrumbsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderBreadCrumbsModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
+ElderBreadCrumbsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderBreadCrumbsModule, imports: [CommonModule, FormsModule, ReactiveFormsModule,
         TranslateModule,
         MatFormFieldModule,
         MatIconModule,
@@ -31,7 +31,7 @@ ElderBreadCrumbsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0",
         MatInputModule,
         MatMenuModule,
         ElderFormsDirectivesModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderBreadCrumbsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderBreadCrumbsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2020/lib/components/navigation/nav/elder-nav.module.mjs

@@ -16,8 +16,8 @@ export { ElderNavLinkComponent } from './nav-link/elder-nav-link.component';
 export { ElderNavGroupComponent } from './nav-group/elder-nav-group.component';
 export class ElderNavModule {
 }
-ElderNavModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderNavModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ElderNavModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: ElderNavModule, declarations: [ElderNavListComponent,
+ElderNavModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderNavModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+ElderNavModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.2", ngImport: i0, type: ElderNavModule, declarations: [ElderNavListComponent,
         ElderNavLinkComponent,
         ElderNavGroupComponent], imports: [CommonModule, RouterModule,
         MatIconModule, MatButtonModule,
@@ -25,11 +25,11 @@ ElderNavModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
         TranslateModule, MatListModule, MatRippleModule], exports: [ElderNavListComponent,
         ElderNavLinkComponent,
         ElderNavGroupComponent] });
-ElderNavModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderNavModule, imports: [CommonModule, RouterModule,
+ElderNavModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderNavModule, imports: [CommonModule, RouterModule,
         MatIconModule, MatButtonModule,
         A11yModule,
         TranslateModule, MatListModule, MatRippleModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderNavModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderNavModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [

package/esm2020/lib/components/navigation/nav/nav-group/elder-nav-group.component.mjs

@@ -75,8 +75,8 @@ export class ElderNavGroupComponent {
         return this.navList.isActive(this.value);
     }
 }
-ElderNavGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderNavGroupComponent, deps: [{ token: i1.ElderNavListComponent }], target: i0.ɵɵFactoryTarget.Component });
-ElderNavGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: ElderNavGroupComponent, selector: "elder-nav-group", inputs: { value: "value" }, outputs: { clicked: "clicked" }, queries: [{ propertyName: "children", predicate: ElderNavLinkComponent }], ngImport: i0, template: "\n<ng-container *ngIf=\"(state$ | async) as state\">\n  <div class=\"layout-col nav-group\">\n    <a matRipple\n       class=\"layout-row place-start-center nav-group-button mat-button-fill\n              mdc-list-item\n              mdc-list-item--with-one-line\"\n       [class.nav-group-button-open]=\"state.isOpen\"\n       [class.nav-group-button-closed]=\"!state.isOpen\"\n       [class.nav-group-button-active]=\"active$ | async\"\n       (click)=\"itemClick($event)\"\n    >\n\n      <div class=\"layout-row place-start-center gap-lg full noselect mdc-list-item__primary-text\">\n        <ng-content></ng-content>\n        <span class=\"flex\"></span>\n        <mat-icon>{{state.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}}</mat-icon>\n      </div>\n    </a>\n\n    <!-- Nested Items projection -->\n    <div class=\"layout-col nav-group-items-container p-sm gap-sm\"\n         [@openClose]=\"state.isOpen ? 'open' : 'closed'\">\n      <ng-content select=\"elder-nav-link\"></ng-content>\n    </div>\n\n  </div>\n</ng-container>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:48px}.nav-group-button{padding-right:16px;min-height:48px;font-size:16px;font-weight:400;border-radius:4px;cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], animations: [
+ElderNavGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderNavGroupComponent, deps: [{ token: i1.ElderNavListComponent }], target: i0.ɵɵFactoryTarget.Component });
+ElderNavGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.2", type: ElderNavGroupComponent, selector: "elder-nav-group", inputs: { value: "value" }, outputs: { clicked: "clicked" }, queries: [{ propertyName: "children", predicate: ElderNavLinkComponent }], ngImport: i0, template: "\n<ng-container *ngIf=\"(state$ | async) as state\">\n  <div class=\"layout-col nav-group\">\n    <a matRipple\n       class=\"layout-row place-start-center nav-group-button mat-button-fill\n              mdc-list-item\n              mdc-list-item--with-one-line\"\n       [class.nav-group-button-open]=\"state.isOpen\"\n       [class.nav-group-button-closed]=\"!state.isOpen\"\n       [class.nav-group-button-active]=\"active$ | async\"\n       (click)=\"itemClick($event)\"\n    >\n\n      <div class=\"layout-row place-start-center gap-lg full noselect mdc-list-item__primary-text\">\n        <ng-content></ng-content>\n        <span class=\"flex\"></span>\n        <mat-icon>{{state.isOpen ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}}</mat-icon>\n      </div>\n    </a>\n\n    <!-- Nested Items projection -->\n    <div class=\"layout-col nav-group-items-container p-sm gap-sm\"\n         [@openClose]=\"state.isOpen ? 'open' : 'closed'\">\n      <ng-content select=\"elder-nav-link\"></ng-content>\n    </div>\n\n  </div>\n</ng-container>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:48px}.nav-group-button{padding-right:16px;min-height:48px;font-size:16px;font-weight:400;border-radius:4px;cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], animations: [
         trigger('openClose', [
             state('open', style({
                 height: '*',
@@ -95,7 +95,7 @@ ElderNavGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
             ]),
         ])
     ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: ElderNavGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.2", ngImport: i0, type: ElderNavGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'elder-nav-group', animations: [
                         trigger('openClose', [